bryce/jquery.uls
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of github.com:wikimedia/jquery.uls

Browse Source
This commit is contained in:
Santhosh Thottingal
2013-05-24 17:16:40 +05:30
parent dceb664b04 96c3a1f797
commit 9a98249d2e
23 changed files with 224 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/jquery.uls.core.js
View File

@@ -21,9 +21,11 @@
( function ( $ ) {
'use strict';
var template, ULS;
// Region numbers in id attributes also appear in the langdb.
/*jshint multistr:true */
var template = '\
template = '\
<div class="grid uls-menu uls-wide"> \
<div class="row"> \
<span id="uls-close" class="icon-close"></span> \
@@ -80,7 +82,7 @@
/**
* ULS Public class definition
*/
var ULS = function ( element, options ) {
ULS = function ( element, options ) {
this.$element = $( element );
this.options = $.extend( {}, $.fn.uls.defaults, options );
this.$menu = $( template );
@@ -112,12 +114,33 @@
ULS.prototype = {
constructor: ULS,
/**
* A "hook" that runs after the ULS constructor.
* At this point it is not guaranteed that the ULS has its dimensions
* and that the languages lists are initialized.
*
* To use it, pass a function as the onReady parameter
* in the options when initializing ULS.
*/
ready: function () {
if ( this.options.onReady ) {
this.options.onReady.call( this );
}
},
/**
* A "hook" that runs after the ULS panel becomes visible
* by using the show method.
*
* To use it, pass a function as the onVisible parameter
* in the options when initializing ULS.
*/
visible: function () {
if ( this.options.onVisible ) {
this.options.onVisible.call( this );
}
},
/**
* Calculate the position of ULS
* Returns an object with top and left properties.
@@ -137,11 +160,7 @@
* Show the ULS window
*/
show: function () {
var pos = this.position();
this.$menu.css( {
top: pos.top,
left: '25%'
} );
this.$menu.css( this.position() );
if ( this.options.compact ) {
this.$menu.addClass( 'uls-compact' );
@@ -150,13 +169,15 @@
if ( !this.initialized ) {
$( 'body' ).prepend( this.$menu );
this.i18n();
// Initialize with a full search.
// This happens on first time click of uls trigger.
this.defaultSearch();
this.initialized = true;
}
// hide any other ULS visible
// hide any other visible ULS
$( '.uls-menu' ).hide();
this.$menu.show();
@@ -165,6 +186,8 @@
if ( !this.isMobile() ) {
this.$languageFilter.focus();
}
this.visible();
},
i18n: function () {

2
src/jquery.uls.data.js
View File

File diff suppressed because one or more lines are too long

5
src/jquery.uls.data.utils.js
View File

@@ -42,6 +42,11 @@
return $.uls.data.getScript( target );
}
if ( !$.uls.data.languages[language] ) {
// Undetermined
return 'Zyyy';
}
return $.uls.data.languages[language][0];
};

19
src/jquery.uls.languagefilter.js
View File

@@ -25,7 +25,9 @@
(function ( $ ) {
'use strict';
var LanguageFilter = function( element, options ) {
var LanguageFilter, delay;
LanguageFilter = function( element, options ) {
this.$element = $( element );
this.options = $.extend( {}, $.fn.regionselector.defaults, options );
this.$element.addClass( 'languagefilter' );
@@ -37,7 +39,7 @@
this.listen();
};
var delay = ( function() {
delay = ( function() {
var timer = 0;
return function( callback, milliseconds ) {
@@ -63,9 +65,11 @@
},
keyup: function( e ) {
var suggestion, query, languageFilter;
switch( e.keyCode ) {
case 9: // Tab -> Autocomplete
var suggestion = this.$suggestion.val();
suggestion = this.$suggestion.val();
if ( suggestion && suggestion !== this.$element.val() ) {
this.$element.val( suggestion );
@@ -78,7 +82,7 @@
break;
}
var query = $.trim( this.$element.val() ).toLowerCase();
query = $.trim( this.$element.val() ).toLowerCase();
if ( this.selectedLanguage ) {
// this.selectLanguage will be populated from a matching search
@@ -91,7 +95,7 @@
break;
default:
var languageFilter = this;
languageFilter = this;
if ( e.which < 32 &&
e.which !== 8 // Backspace
@@ -155,14 +159,15 @@
},
search: function() {
var query = $.trim( this.$element.val() ),
var languagesInScript,
query = $.trim( this.$element.val() ),
languages = $.uls.data.getLanguagesByScriptGroup( this.options.languages ),
scriptGroup, langNum, langCode;
this.resultCount = 0;
for ( scriptGroup in languages ) {
var languagesInScript = languages[scriptGroup];
languagesInScript = languages[scriptGroup];
languagesInScript.sort( $.uls.data.sortByAutonym );

46
src/jquery.uls.lcd.js
View File

@@ -22,8 +22,10 @@
( function ( $ ) {
'use strict';
var noResultsTemplate, LanguageCategoryDisplay;
/*jshint multistr:true */
var noResultsTemplate = '\
noResultsTemplate = '\
<div class="twelve columns uls-no-results-view">\
<h2 data-i18n="uls-no-results-found" class="eleven columns end offset-by-one uls-no-results-found-title">\
No results found\
@@ -47,7 +49,7 @@
</div>';
/*jshint multistr:false */
var LanguageCategoryDisplay = function ( element, options ) {
LanguageCategoryDisplay = function ( element, options ) {
this.$element = $( element );
this.options = $.extend( {}, $.fn.lcd.defaults, options );
this.$element.addClass( 'lcd' );
@@ -74,7 +76,8 @@
* @param region Optional region
*/
addToRegion: function ( langCode, region ) {
var lcd = this,
var i, regionCode, $li, $column, lastLanguage, lastScriptGroup, currentScriptGroup,
lcd = this,
language = lcd.options.languages[langCode],
langName = $.uls.data.getAutonym( langCode ) || language || langCode,
regions = [];
@@ -90,10 +93,10 @@
regions = [ 'WW' ];
}
for ( var i = 0; i < regions.length; i++ ) {
var regionCode = regions[i];
for ( i = 0; i < regions.length; i++ ) {
regionCode = regions[i];
var $li = $( '<li>' )
$li = $( '<li>' )
.data( 'code', langCode )
.attr( {
lang: langCode,
@@ -104,12 +107,12 @@
);
// Append the element to the column in the list
var $column = lcd.getColumn( regionCode );
var lastLanguage = $column.find( 'li:last' ).data( 'code' );
$column = lcd.getColumn( regionCode );
lastLanguage = $column.find( 'li:last' ).data( 'code' );
if ( lastLanguage ) {
var lastScriptGroup = $.uls.data.getScriptGroupOfLanguage( lastLanguage ),
currentScriptGroup = $.uls.data.getScriptGroupOfLanguage( langCode );
lastScriptGroup = $.uls.data.getScriptGroupOfLanguage( lastLanguage );
currentScriptGroup = $.uls.data.getScriptGroupOfLanguage( langCode );
if ( lastScriptGroup !== currentScriptGroup ) {
if ( $column.find( 'li' ).length > 2 ) {
@@ -172,7 +175,7 @@
PA: 'Pacific'
};
$.each( $.uls.data.regiongroups, function ( regionCode, regionIndex ) {
$.each( $.uls.data.regiongroups, function ( regionCode ) {
$section = $( '<div>' ).addClass( 'twelve columns uls-lcd-region-section' ).prop( 'id', regionCode );
$sectionTitle = $( '<h3 data-i18n="uls-region-' + regionCode + '">' )
@@ -194,6 +197,9 @@
},
quicklist: function () {
var quickList, $quickListSection, $quickListSectionTitle, i,
$column, langCode, language, langName, $li;
if ( $.isFunction( this.options.quickList ) ) {
this.options.quickList = this.options.quickList();
}
@@ -203,24 +209,24 @@
}
// Pick only the first elements, because we don't have room for more
var quickList = this.options.quickList;
quickList = this.options.quickList;
quickList = quickList.slice( 0, 16 );
quickList.sort( $.uls.data.sortByAutonym );
var $quickListSection = $( '<div>' ).addClass( 'twelve columns uls-lcd-region-section' ).prop( 'id', 'uls-lcd-quicklist' );
var $quickListSectionTitle = $( '<h3 data-i18n="uls-common-languages">' )
$quickListSection = $( '<div>' ).addClass( 'twelve columns uls-lcd-region-section' ).prop( 'id', 'uls-lcd-quicklist' );
$quickListSectionTitle = $( '<h3 data-i18n="uls-common-languages">' )
.addClass( 'eleven columns uls-lcd-region-section uls-lcd-region-title offset-by-one' )
.text( 'Common languages' ); // This is placeholder text if jquery.i18n not present
$quickListSection.append( $quickListSectionTitle );
this.$element.prepend( $quickListSection );
this.regionDivs.quick = $quickListSection;
for ( var i = 0; i < quickList.length; i++) {
var $column = this.getColumn( 'quick', i % 4 === 0 );
var langCode = quickList[i];
var language = this.options.languages[langCode];
var langName = $.uls.data.getAutonym( langCode ) || language || langCode;
var $li = $( '<li>' )
for ( i = 0; i < quickList.length; i++) {
$column = this.getColumn( 'quick', i % 4 === 0 );
langCode = quickList[i];
language = this.options.languages[langCode];
langName = $.uls.data.getAutonym( langCode ) || language || langCode;
$li = $( '<li>' )
.data( 'code', langCode )
.attr( {
lang: langCode,

26
src/jquery.uls.regionfilter.js
View File

@@ -22,13 +22,15 @@
/* RegionSelector plugin definition */
var RegionSelector, delay;
/**
* Region selector is a language selector based on regions.
* Usage: $( 'jqueryselector' ).regionselector( options );
* The attached element should have data-regiongroup attribute
* that defines the regiongroup for the selector.
*/
var RegionSelector = function ( element, options ) {
RegionSelector = function ( element, options ) {
this.$element = $( element );
this.options = $.extend( {}, $.fn.regionselector.defaults, options );
this.$element.addClass( 'regionselector' );
@@ -52,10 +54,10 @@
},
test: function ( langCode ) {
var langRegions = $.uls.data.getRegions( langCode ),
region;
var region, i,
langRegions = $.uls.data.getRegions( langCode );
for ( var i = 0; i < this.regions.length; i++ ) {
for ( i = 0; i < this.regions.length; i++ ) {
region = this.regions[i];
if ( $.inArray( region, langRegions ) >= 0 ) {
@@ -68,10 +70,12 @@
},
show: function () {
var result, languagesByScriptGroup, scriptGroup, languages, i;
if ( this.cache ) {
// If the result cache is present, render the results from there.
//noinspection JSUnusedAssignment
var result = null;
result = null;
for ( result in this.cache ) {
this.render( result, this.cache[result] );
@@ -79,13 +83,13 @@
} else {
this.cache = {};
// Get the languages grouped by script group
var languagesByScriptGroup = $.uls.data.getLanguagesByScriptGroup( this.options.languages );
languagesByScriptGroup = $.uls.data.getLanguagesByScriptGroup( this.options.languages );
// Make sure that we go by the original order
// of script groups
for ( var scriptGroup in $.uls.data.scriptgroups ) {
for ( scriptGroup in $.uls.data.scriptgroups ) {
// Get the languages for the script group
var languages = languagesByScriptGroup[scriptGroup];
languages = languagesByScriptGroup[scriptGroup];
// It's possible that some script groups are missing
if ( !languages ) {
@@ -95,7 +99,7 @@
// Sort it based on autonym
languages.sort( $.uls.data.sortByAutonym );
for ( var i = 0; i < languages.length; i++ ) {
for ( i = 0; i < languages.length; i++ ) {
// Check whether it belongs to the region
this.test( languages[i] );
}
@@ -145,7 +149,7 @@
this.options.$target.$element.bind( 'scrollend', $.proxy( this.next, this ) );
},
click: function ( e ) {
click: function () {
// Don't do anything if a region is selected already
if ( this.$element.hasClass( 'active' ) ) {
return;
@@ -191,7 +195,7 @@
$.fn.regionselector.Constructor = RegionSelector;
var delay = ( function () {
delay = ( function () {
var timer = 0;
return function ( callback, milliseconds ) {
clearTimeout( timer );