bryce/mediawiki-extensions-UniversalLanguageSelector
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update jquery.uls to d122f37

Browse Source 
* Do not group search results by region
* Replace ULS trigger icon with monochromatic one
* Custom no-results message support
* Upgrade jquery in the example to 3.2.1
* Use .siblings to locate the suggestions, clear elements for efficiency
* Removing assigned ids to elements that are not guaranteed to be unique
* Use eslint and stylelint, fix all errors

Update the language icon in ext.uls.pt module with new monochromatic one
Also use custom style for monobook skin.

Bug: T182539
Bug: T175769
Change-Id: I7341064cd0de367d933048c4800f951568747d11
This commit is contained in:
Santhosh Thottingal
2018-01-15 09:47:15 +05:30
parent 4489bf100a
commit fd7b9ec652
17 changed files with 421 additions and 349 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
lib/jquery.uls/css/jquery.uls.css
View File

@@ -1,8 +1,8 @@
.uls-trigger {
background: url('../images/icon-language.png') no-repeat left center;
background: url( ../images/language.png ) no-repeat left center;
/* @embed */
background-image: linear-gradient(transparent, transparent), url('../images/icon-language.svg');
padding-left: 30px;
background-image: linear-gradient( transparent, transparent ), url( ../images/language.svg );
padding-left: 24px;
}
.uls-menu {
@@ -12,10 +12,10 @@
margin-top: 1px;
background-color: #fff;
border: 1px solid #ccc;
border-color: rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
border-color: rgba( 0, 0, 0, 0.2 );
-webkit-box-shadow: 0 5px 10px rgba( 0, 0, 0, 0.2 );
-moz-box-shadow: 0 5px 10px rgba( 0, 0, 0, 0.2 );
box-shadow: 0 5px 10px rgba( 0, 0, 0, 0.2 );
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
@@ -65,9 +65,9 @@
}
.uls-search-label {
background: url('../images/search.png') no-repeat center center;
background: url( ../images/search.png ) no-repeat center center;
/* @embed */
background-image: linear-gradient(transparent, transparent), url('../images/search.svg');
background-image: linear-gradient( transparent, transparent ), url( ../images/search.svg );
background-size: 20px;
height: 32px;
width: 44px;
@@ -88,7 +88,7 @@
width: 100%;
/* For the custom clear (X) icon */
padding: 6px 25px 6px 0;
outline: none;
outline: 0;
border: 0;
display: block;
position: absolute;
@@ -110,9 +110,9 @@
}
.uls-languagefilter-clear {
background: url('../images/clear.png') no-repeat left center;
background: url( ../images/clear.png ) no-repeat left center;
/* @embed */
background-image: linear-gradient(transparent, transparent), url('../images/clear.svg');
background-image: linear-gradient( transparent, transparent ), url( ../images/clear.svg );
background-size: 15px;
cursor: pointer;
height: 15px;

40
lib/jquery.uls/css/jquery.uls.grid.css
View File

@@ -32,15 +32,18 @@
}
.grid .highlight {
background: #ffff99;
background: #ff9;
}
/* The Grid ---------------------- */
.grid .row {
width: 100%;
max-width: none;
min-width: 600px;
margin: 0 auto;
/* Nicolas Gallagher's micro clearfix */
*zoom: 1;
}
.grid .row .row {
@@ -50,30 +53,25 @@
margin: 0 -5px;
}
.grid .column,
.grid .columns {
float: left;
min-height: 1px;
padding: 0 5px;
position: relative;
}
.grid .row.collapse .column,
.grid .row.collapse .columns {
padding: 0;
}
.grid .row .row {
width: auto;
max-width: none;
min-width: 0;
margin: 0 -5px;
}
.grid .row .row.collapse {
margin: 0;
}
.grid .column, .grid .columns {
float: left;
min-height: 1px;
padding: 0 5px;
position: relative;
}
.grid .column.centered, .grid .columns.centered {
.grid .column.centered,
.grid .columns.centered {
float: none;
margin: 0 auto;
}
@@ -238,13 +236,9 @@
right: 83.333%;
}
/* Nicolas Gallagher's micro clearfix */
.grid .row {
*zoom: 1;
}
.grid .row:before, .grid .row:after {
content: "";
.grid .row:before,
.grid .row:after {
content: '';
display: table;
}

37
lib/jquery.uls/css/jquery.uls.lcd.css
View File

@@ -17,6 +17,10 @@
padding: 0 16px;
}
.uls-lcd--no-quicklist [data-region="all"] .uls-lcd-region-title {
display: none;
}
.uls-lcd-region-section {
margin-top: 10px;
}
@@ -36,6 +40,16 @@
margin: 0;
}
.uls-language-block > ul {
/*
* We don't want any visible bullets in this list. Not by default anyway.
* Using very unspecific selector here to allow other classes to override.
* Bug because overflow: hidden is incompatible with bullets, also render
* the bullets inside the list in case there should be any.
*/
list-style: none none;
}
/*
* Each block should have 16px padding on both sides. But because we already gave
* 16px for the whole menu, we need to remove it for first and last items the blocks.
@@ -53,17 +67,6 @@
padding-right: 0;
}
.uls-language-block > ul {
/*
* We don't want any visible bullets in this list. Not by default anyway.
* Using very unspecific selector here to allow other classes to override.
* Bug because overflow: hidden is incompatible with bullets, also render
* the bullets inside the list in case there should be any.
*/
list-style: none none;
}
.uls-language-block > ul > li {
cursor: pointer;
margin-left: 20px;
@@ -103,6 +106,18 @@
vertical-align: middle;
}
.uls-no-results-view {
display: none;
}
.uls-lcd.uls-no-results > .uls-lcd-region-section {
display: none;
}
.uls-lcd.uls-no-results > .uls-no-results-view {
display: block;
}
.uls-no-results-found-title {
font-size: 16px;
padding: 0 16px 0 28px;

19
lib/jquery.uls/css/jquery.uls.mobile.css
View File

@@ -1,4 +1,4 @@
@media only screen and (max-width: 767px) {
@media only screen and ( max-width: 767px ) {
.uls-mobile.uls-menu {
width: 95%;
@@ -40,7 +40,7 @@
float: none;
}
.uls-mobile [class*="column"] + [class*="column"]:last-child {
.uls-mobile [ class*='column' ] + [ class*='column' ]:last-child {
float: none;
}
@@ -48,7 +48,7 @@
.uls-mobile .uls-mobile .columns:before,
.uls-mobile .column:after,
.columns:after {
content: "";
content: '';
display: table;
}
@@ -197,11 +197,12 @@
}
/* Very large display targeting */
@media only screen and (min-width: 1441px) {
@media only screen and ( min-width: 1441px ) {
.uls-mobile .hide-for-small,
.uls-mobile .hide-for-medium,
.uls-mobile .hide-for-medium-down,
.hide-for-large, .show-for-large-up,
.hide-for-large,
.show-for-large-up,
.show-for-xlarge {
display: block !important;
}
@@ -217,7 +218,7 @@
}
/* Medium display targeting */
@media only screen and (max-width: 1279px) and (min-width: 768px) {
@media only screen and ( max-width: 1279px ) and ( min-width: 768px ) {
.uls-mobile .hide-for-small,
.uls-mobile .show-for-medium,
.uls-mobile .show-for-medium-down,
@@ -238,7 +239,7 @@
}
/* Small display targeting */
@media only screen and (max-width: 767px) {
@media only screen and ( max-width: 767px ) {
.uls-mobile .show-for-small,
.uls-mobile .hide-for-medium,
.uls-mobile .show-for-medium-down,
@@ -268,7 +269,7 @@
display: none !important;
}
@media screen and (orientation: landscape) {
@media screen and ( orientation: landscape ) {
.uls-mobile .show-for-landscape,
.uls-mobile .hide-for-portrait {
display: block !important;
@@ -279,7 +280,7 @@
}
}
@media screen and (orientation: portrait) {
@media screen and ( orientation: portrait ) {
.uls-mobile .show-for-portrait,
.uls-mobile .hide-for-landscape {
display: block !important;

5
lib/jquery.uls/i18n/cop.json
View File

@@ -7,7 +7,7 @@
},
"uls-region-WW": "ⲧⲏⲣⲙⲁⲓ",
"uls-region-AM": "ⲁⲙⲉⲣⲓⲕⲏ",
"uls-region-AF": "ⲁϥⲣⲓⲕⲏ",
"uls-region-AF": "ⲁⲫⲣⲓⲕⲏ",
"uls-region-EU": "ⲉⲩⲣⲱⲡⲏ",
"uls-region-AS": "ⲁⲥⲓⲁ",
"uls-region-ME": "ⲡⲓⲉⲃⲧ `ⲛⲑⲙⲏϯ",
@@ -15,5 +15,6 @@
"uls-region-all": "ⲁⲥⲡⲓ ⲛⲓⲃⲉⲛ",
"uls-no-results-found": "ⲁⲩϫⲓⲙⲓ ⲁⲛ ⲛⲓⲁⲡⲟⲧⲉⲗⲉⲥⲙⲁ",
"uls-common-languages": "ⲛⲓⲁⲥⲡⲓ ⲁⲩϯⲙⲉⲩⲓ",
"uls-search-help": "ⲧⲉⲧⲉⲛϫⲉⲙϫⲟⲙ ϫⲉⲙⲣⲁⲧ ϩⲉⲛ `ⲫⲣⲁⲛ ⲛⲧⲉ ⲁⲥⲡⲓ, `ⲫⲣⲁⲛ ⲛⲧⲉ ⲓⲟⲡⲓⲥϧⲁⲓ , ISO ⲕⲱⲇⲓⲕⲟⲥ ⲛⲧⲉ ⲁⲥⲡⲓ ⲓⲉ ⲧⲉⲧⲉⲛϫⲉⲙϫⲟⲙ ⲥⲓⲛⲓ ϧⲁⲧⲉⲛⲙⲁⲛⲧⲉϭⲁ."
"uls-search-help": "ⲧⲉⲧⲉⲛϫⲉⲙϫⲟⲙ ϫⲉⲙⲣⲁⲧ ϩⲉⲛ `ⲫⲣⲁⲛ ⲛⲧⲉ ⲁⲥⲡⲓ, `ⲫⲣⲁⲛ ⲛⲧⲉ ⲓⲟⲡⲓⲥϧⲁⲓ , ISO ⲕⲱⲇⲓⲕⲟⲥ ⲛⲧⲉ ⲁⲥⲡⲓ ⲓⲉ ⲧⲉⲧⲉⲛϫⲉⲙϫⲟⲙ ⲥⲓⲛⲓ ϧⲁⲧⲉⲛⲙⲁⲛⲧⲉϭⲁ.",
"uls-search-placeholder": "ϫⲉⲙⲣⲁⲧⲕ `ⲛⲟⲩⲁⲥⲡⲓ"
}

7
lib/jquery.uls/i18n/mwl.json
View File

@@ -1,7 +1,8 @@
{
"@metadata": {
"authors": [
"MokaAkashiyaPT"
"MokaAkashiyaPT",
"Athena in Wonderland"
]
},
"uls-region-WW": "Global",
@@ -12,6 +13,10 @@
"uls-region-AS": "Ásia",
"uls-region-ME": "Médio Ouriente",
"uls-region-PA": "Pacífico",
"uls-region-all": "Todas las lhénguas",
"uls-no-results-found": "Nó fúrun ancontrados resultados",
"uls-common-languages": "Lhénguas sugeridas",
"uls-no-results-suggestion-title": "Puode star antressado an:",
"uls-search-help": "Puode percurar pul nome de la lhéngua, pul tipo de abc, código ISO de la lhéngua, ó puode nabegar por region.",
"uls-search-placeholder": "Percurar por lhéngua"
}

BIN
lib/jquery.uls/images/icon-language.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 802 B

1
lib/jquery.uls/images/icon-language.svg
View File

@@ -1 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" width="27" height="16"><path fill="#D3E3F4" d="M0 0h11.876v16h-11.876v-16z"/><path fill="#E9E9E9" d="M12.819 0v15.969h10.755c1.085-2.578 1.837-4.991 3.062-8.591l-3.062-7.378h-10.755z"/><path fill="#434343" d="M14.828 4.146c.32.023.639.035.951.035.471 0 .922-.016 1.354-.046l.023-.258.034-.367.081-.711.033-.333.873.058c-.073.577-.133 1.091-.179 1.542 1.116-.119 2.233-.331 3.349-.637l.092.809c-1.078.271-2.251.472-3.521.602-.05.463-.082.968-.098 1.514.524-.187 1.14-.313 1.847-.378.064-.207.136-.461.213-.763l.865.201c-.027.123-.088.315-.184.579.814.104 1.461.34 1.938.711.681.542 1.021 1.252 1.021 2.128 0 .963-.406 1.746-1.221 2.351-.635.47-1.505.784-2.609.94l-.505-.779c.968-.104 1.739-.337 2.317-.7.733-.458 1.101-1.066 1.101-1.823 0-.772-.341-1.363-1.021-1.772-.345-.21-.764-.344-1.256-.401-.604 1.422-1.4 2.598-2.387 3.527.035.352.102.715.201 1.09l-.849.314-.126-.773c-.654.462-1.27.693-1.847.693-.696 0-1.044-.407-1.044-1.222 0-1.104.591-2.103 1.771-2.993.227-.165.532-.352.918-.562.012-.524.046-1.128.104-1.812-.585.046-1.143.069-1.675.069l-.493-.011-.071-.822m2.127 3.384c-.268.161-.545.392-.831.694-.612.619-.94 1.226-.986 1.817l-.017.121.017.138c0 .252.112.378.339.378.492 0 1.02-.258 1.582-.773-.057-.613-.092-1.404-.104-2.375m2.455-.884c-.57.08-1.111.226-1.623.436 0 .883.018 1.581.052 2.093.634-.707 1.158-1.55 1.571-2.529"/><path fill="#1A1A1A" d="M8.517 11.735l-.734-2.409h-3.69l-.734 2.409h-2.313l3.573-10.165h2.625l3.587 10.165h-2.314m-1.246-4.21c-.679-2.183-1.062-3.418-1.149-3.704-.083-.286-.143-.512-.18-.678-.153.59-.589 2.051-1.309 4.382h2.638"/><path fill="#BCBCBC" d="M12.817 13.5v2.5h10.757l.98-2.5h-11.737z"/><path fill="#3692D0" d="M.011 13.511h3.569l2.367-3.116 2.367 3.116h3.57v2.484h-11.873v-2.484z"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.8 KiB

BIN
lib/jquery.uls/images/language.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 402 B

1
lib/jquery.uls/images/language.svg Normal file
View File

@@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><title>language</title><path d="M20 18h-1.44a.61.61 0 0 1-.4-.12.81.81 0 0 1-.23-.31L17 15h-5l-1 2.54a.77.77 0 0 1-.22.3.59.59 0 0 1-.4.14H9l4.55-11.47h1.89zm-3.53-4.31L14.89 9.5a11.62 11.62 0 0 1-.39-1.24q-.09.37-.19.69l-.19.56-1.58 4.19zM10.17 12.11a13.43 13.43 0 0 1-2.91-1.41 11.46 11.46 0 0 0 2.81-5.37H12V4H7.31a4 4 0 0 0-.2-.56C6.87 2.79 6.6 2 6.6 2l-1.47.5s.4.89.6 1.5H0v1.33h2.15A11.23 11.23 0 0 0 5 10.7a17.19 17.19 0 0 1-5 2.1q.56.82.87 1.38a23.28 23.28 0 0 0 5.22-2.51 15.64 15.64 0 0 0 3.56 1.77zM3.63 5.33h4.91a8.11 8.11 0 0 1-2.45 4.45 9.11 9.11 0 0 1-2.46-4.45z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 707 B

109
lib/jquery.uls/src/jquery.uls.core.js
View File

@@ -24,17 +24,17 @@
var template, ULS;
// Region numbers in id attributes also appear in the langdb.
/*jshint multistr:true */
// eslint-disable-next-line no-multi-str
template = '<div class="grid uls-menu"> \
<div id="search" class="row uls-search"> \
<div class="uls-search-wrapper"> \
<label class="uls-search-label" for="uls-languagefilter"></label>\
<div class="uls-search-input-wrapper">\
<span id="uls-languagefilter-clear" class="uls-languagefilter-clear"></span>\
<span class="uls-languagefilter-clear"></span>\
<input type="text" class="uls-filterinput uls-filtersuggestion"\
id="uls-filtersuggestion" disabled="true" autocomplete="off">\
disabled="true" autocomplete="off">\
<input type="text" class="uls-filterinput uls-languagefilter"\
id="uls-languagefilter" data-clear="uls-languagefilter-clear"\
data-clear="uls-languagefilter-clear"\
data-suggestion="uls-filtersuggestion"\
placeholder="Search for a language" autocomplete="off">\
</div>\
@@ -43,42 +43,20 @@
<div class="row uls-language-list"></div>\
<div class="row" id="uls-settings-block"></div>\
</div>';
/*jshint multistr:false */
/**
* Count the number of keys in an object.
* Works in a cross-browser way.
* @param {Object} The object.
*/
function objectLength ( obj ) {
var count, key;
// Some old browsers don't support Object.keys
if ( Object.keys ) {
return Object.keys( obj ).length;
}
count = 0;
for ( key in obj ) {
if ( Object.prototype.hasOwnProperty.call( obj, key ) ) {
count++;
}
}
return count;
}
/**
* ULS Public class definition
* @param {Element} element
* @param {Object} options
*/
ULS = function ( element, options ) {
var code;
this.$element = $( element );
this.options = $.extend( {}, $.fn.uls.defaults, options );
this.$menu = $( template );
this.languages = this.options.languages;
for ( var code in this.languages ) {
for ( code in this.languages ) {
if ( $.uls.data.languages[ code ] === undefined ) {
// Language is unknown to ULS.
delete this.languages[ code ];
@@ -90,7 +68,7 @@
this.shown = false;
this.initialized = false;
this.$languageFilter = this.$menu.find( '#uls-languagefilter' );
this.$languageFilter = this.$menu.find( '.uls-languagefilter' );
this.$resultsView = this.$menu.find( '.uls-language-list' );
this.render();
@@ -131,7 +109,7 @@
/**
* Calculate the position of ULS
* Returns an object with top and left properties.
* @returns {Object}
* @return {Object}
*/
position: function () {
var pos,
@@ -142,14 +120,13 @@
pos = $.extend( {}, this.$element.offset(), {
height: this.$element[ 0 ].offsetHeight
} );
top = pos.top + pos.height;
top = pos.top + pos.height;
}
if ( left === undefined ) {
left = $( window ).width() / 2 - this.$menu.outerWidth() / 2;
}
return {
top: top,
left: left
@@ -166,7 +143,7 @@
narrow: 'uls-narrow'
};
this.$menu.addClass( widthClasses[this.getMenuWidth()] );
this.$menu.addClass( widthClasses[ this.getMenuWidth() ] );
if ( !this.initialized ) {
$( 'body' ).prepend( this.$menu );
@@ -213,13 +190,6 @@
// Rendering stuff here
},
/**
* Callback for no results found context.
*/
noresults: function () {
this.$resultsView.lcd( 'noResults' );
},
/**
* Callback for results found context.
*/
@@ -255,26 +225,28 @@
this.$menu.on( 'keydown', $.proxy( this.keypress, this ) );
}
languagesCount = objectLength( this.options.languages );
languagesCount = Object.keys( this.options.languages ).length;
lcd = this.$resultsView.lcd( {
languages: this.languages,
columns: columnsOptions[ this.getMenuWidth() ],
quickList: languagesCount > 12 ? this.options.quickList : [],
clickhandler: $.proxy( this.select, this ),
source: this.$languageFilter,
showRegions: this.options.showRegions,
languageDecorator: this.options.languageDecorator
languageDecorator: this.options.languageDecorator,
noResultsTemplate: this.options.noResultsTemplate,
itemsPerColumn: this.options.itemsPerColumn,
groupByRegion: this.options.groupByRegion
} ).data( 'lcd' );
this.$languageFilter.languagefilter( {
$target: lcd,
lcd: lcd,
languages: this.languages,
searchAPI: this.options.searchAPI,
onSelect: $.proxy( this.select, this )
} );
this.$languageFilter.on( 'noresults.uls', $.proxy( this.noresults, this ) );
this.$languageFilter.on( 'noresults.uls', $.proxy( lcd.noResults, lcd ) );
this.$languageFilter.on( 'resultsfound.uls', $.proxy( this.success, this ) );
$( 'html' ).click( $.proxy( this.cancel, this ) );
@@ -282,7 +254,7 @@
/**
* On select handler for search results
* @param langCode
* @param {string} langCode
*/
select: function ( langCode ) {
this.hide();
@@ -293,9 +265,10 @@
/**
* On cancel handler for the uls menu
* @param {Event} e
*/
cancel: function ( e ) {
if ( e && ( this.$element.is( e.target ) || $.contains( this.$element[0], e.target ) ) ) {
if ( e && ( this.$element.is( e.target ) || $.contains( this.$element[ 0 ], e.target ) ) ) {
return;
}
@@ -347,7 +320,7 @@
/**
* Get the panel menu width parameter
* @return string
* @return {string}
*/
getMenuWidth: function () {
var languagesCount;
@@ -356,7 +329,7 @@
return this.options.menuWidth;
}
languagesCount = objectLength( this.options.languages );
languagesCount = Object.keys( this.options.languages ).length;
if ( languagesCount < 25 ) {
return 'narrow';
@@ -394,15 +367,35 @@
};
$.fn.uls.defaults = {
onSelect: null, // Callback function to be called when a language is selected
searchAPI: null, // Language search API
languages: $.uls.data.getAutonyms(), // Languages to be used for ULS, default is all languages
quickList: [], // Array of language codes or function that returns such
// CSS top position for the dialog
top: undefined,
// CSS left position for the dialog
left: undefined,
// Callback function when user selects a language
onSelect: undefined,
// Callback function when the dialog is closed without selecting a language
onCancel: undefined,
// Callback function when ULS has initialized
onReady: undefined,
// Callback function when ULS dialog is shown
onVisible: undefined,
// Languages to be used for ULS, default is all languages
languages: $.uls.data.getAutonyms(),
// The options are wide (4 columns), medium (2 columns), and narrow (1 column).
// If not specified, it will be set automatically.
menuWidth: null,
showRegions: [ 'WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA' ],
languageDecorator: null // Callback function to be called when a language link is prepared - for custom decoration.
menuWidth: undefined,
// Used by LCD
quickList: [],
// Used by LCD
showRegions: undefined,
// Used by LCD
languageDecorator: undefined,
// Used by LCD
itemsPerColumn: undefined,
// Used by LCD
groupByRegion: undefined,
// Used by LanguageFilter
searchAPI: undefined
};
// Define a dummy i18n function, if jquery.i18n not integrated.

117
lib/jquery.uls/src/jquery.uls.data.utils.js
View File

@@ -22,18 +22,18 @@
/**
* Is this language a redirect to another language?
* @param language string Language code
* @return Target language code if it's a redirect or false if it's not
* @param {string} language Language code
* @return {string|boolean} Target language code if it's a redirect or false if it's not
*/
$.uls.data.isRedirect = function ( language ) {
return ( $.uls.data.languages[language] !== undefined &&
$.uls.data.languages[language].length === 1 ) ? $.uls.data.languages[language][0] : false;
return ( $.uls.data.languages[ language ] !== undefined &&
$.uls.data.languages[ language ].length === 1 ) ? $.uls.data.languages[ language ][ 0 ] : false;
};
/**
* Returns the script of the language.
* @param language string Language code
* @return string
* @param {string} language Language code
* @return {string}
*/
$.uls.data.getScript = function ( language ) {
var target = $.uls.data.isRedirect( language );
@@ -42,18 +42,18 @@
return $.uls.data.getScript( target );
}
if ( !$.uls.data.languages[language] ) {
if ( !$.uls.data.languages[ language ] ) {
// Undetermined
return 'Zyyy';
}
return $.uls.data.languages[language][0];
return $.uls.data.languages[ language ][ 0 ];
};
/**
* Returns the regions in which a language is spoken.
* @param language string Language code
* @return array|string 'UNKNOWN'
* @param {string} language Language code
* @return {string|string[]}
*/
$.uls.data.getRegions = function ( language ) {
var target = $.uls.data.isRedirect( language );
@@ -62,13 +62,13 @@
return $.uls.data.getRegions( target );
}
return ( $.uls.data.languages[language] && $.uls.data.languages[language][1] ) || 'UNKNOWN';
return ( $.uls.data.languages[ language ] && $.uls.data.languages[ language ][ 1 ] ) || 'UNKNOWN';
};
/**
* Returns the autonym of the language.
* @param language string Language code
* @return string
* @param {string} language Language code
* @return {string}
*/
$.uls.data.getAutonym = function ( language ) {
var target = $.uls.data.isRedirect( language );
@@ -77,12 +77,12 @@
return $.uls.data.getAutonym( target );
}
return ( $.uls.data.languages[language] && $.uls.data.languages[language][2] ) || language;
return ( $.uls.data.languages[ language ] && $.uls.data.languages[ language ][ 2 ] ) || language;
};
/**
* Returns all language codes and corresponding autonyms
* @return array
* @return {string[]}
*/
$.uls.data.getAutonyms = function () {
var language,
@@ -93,7 +93,7 @@
continue;
}
autonymsByCode[language] = $.uls.data.getAutonym( language );
autonymsByCode[ language ] = $.uls.data.getAutonym( language );
}
return autonymsByCode;
@@ -101,8 +101,8 @@
/**
* Returns all languages written in script.
* @param script string
* @return array of strings (languages codes)
* @param {string} script string
* @return {string[]} languages codes
*/
$.uls.data.getLanguagesInScript = function ( script ) {
return $.uls.data.getLanguagesInScripts( [ script ] );
@@ -110,8 +110,8 @@
/**
* Returns all languages written in the given scripts.
* @param scripts array of strings
* @return array of strings (languages codes)
* @param {string[]} scripts
* @return {string[]} languages codes
*/
$.uls.data.getLanguagesInScripts = function ( scripts ) {
var language, i,
@@ -123,7 +123,7 @@
}
for ( i = 0; i < scripts.length; i++ ) {
if ( scripts[i] === $.uls.data.getScript( language ) ) {
if ( scripts[ i ] === $.uls.data.getScript( language ) ) {
languagesInScripts.push( language );
break;
}
@@ -136,8 +136,8 @@
/**
* Returns an associative array of languages in a region,
* grouped by script group.
* @param region string Region code
* @return associative array
* @param {string} region Region code
* @return {object}
*/
$.uls.data.getLanguagesByScriptGroupInRegion = function ( region ) {
return $.uls.data.getLanguagesByScriptGroupInRegions( [ region ] );
@@ -145,7 +145,7 @@
/**
* Get the given list of languages grouped by script.
* @param languages Array of language codes
* @param {string} languages Array of language codes
* @return {Object} Array of languages indexed by script codes
*/
$.uls.data.getLanguagesByScriptGroup = function ( languages ) {
@@ -157,11 +157,11 @@
langScriptGroup = $.uls.data.getScriptGroupOfLanguage( resolvedRedirect );
if ( !languagesByScriptGroup[langScriptGroup] ) {
languagesByScriptGroup[langScriptGroup] = [];
if ( !languagesByScriptGroup[ langScriptGroup ] ) {
languagesByScriptGroup[ langScriptGroup ] = [];
}
languagesByScriptGroup[langScriptGroup].push( language );
languagesByScriptGroup[ langScriptGroup ].push( language );
}
return languagesByScriptGroup;
@@ -170,8 +170,8 @@
/**
* Returns an associative array of languages in several regions,
* grouped by script group.
* @param regions array of strings - region codes
* @return associative array
* @param {string[]} regions region codes
* @return {Object}
*/
$.uls.data.getLanguagesByScriptGroupInRegions = function ( regions ) {
var language, i, scriptGroup,
@@ -183,14 +183,14 @@
}
for ( i = 0; i < regions.length; i++ ) {
if ( $.inArray( regions[i], $.uls.data.getRegions( language ) ) !== -1 ) {
if ( $.inArray( regions[ i ], $.uls.data.getRegions( language ) ) !== -1 ) {
scriptGroup = $.uls.data.getScriptGroupOfLanguage( language );
if ( languagesByScriptGroupInRegions[scriptGroup] === undefined ) {
languagesByScriptGroupInRegions[scriptGroup] = [];
if ( languagesByScriptGroupInRegions[ scriptGroup ] === undefined ) {
languagesByScriptGroupInRegions[ scriptGroup ] = [];
}
languagesByScriptGroupInRegions[scriptGroup].push( language );
languagesByScriptGroupInRegions[ scriptGroup ].push( language );
break;
}
}
@@ -202,14 +202,14 @@
/**
* Returns the script group of a script or 'Other' if it doesn't
* belong to any group.
* @param script string Script code
* @return string script group name
* @param {string} script Script code
* @return {string} script group name
*/
$.uls.data.getGroupOfScript = function ( script ) {
var scriptGroup;
for ( scriptGroup in $.uls.data.scriptgroups ) {
if ( $.inArray( script, $.uls.data.scriptgroups[scriptGroup] ) !== -1 ) {
if ( $.inArray( script, $.uls.data.scriptgroups[ scriptGroup ] ) !== -1 ) {
return scriptGroup;
}
}
@@ -219,8 +219,8 @@
/**
* Returns the script group of a language.
* @param language string Language code
* @return string script group name
* @param {string} language Language code
* @return {string} script group name
*/
$.uls.data.getScriptGroupOfLanguage = function ( language ) {
return $.uls.data.getGroupOfScript( $.uls.data.getScript( language ) );
@@ -229,8 +229,9 @@
/**
* A callback for sorting languages by autonym.
* Can be used as an argument to a sort function.
* @param a string Language code
* @param b string Language code
* @param {string} a Language code
* @param {string} b Language code
* @return {number}
*/
$.uls.data.sortByAutonym = function ( a, b ) {
var autonymA = $.uls.data.getAutonym( a ) || a,
@@ -241,8 +242,8 @@
/**
* Check if a language is right-to-left.
* @param language string Language code
* @return boolean
* @param {string} language Language code
* @return {boolean}
*/
$.uls.data.isRtl = function ( language ) {
return $.inArray( $.uls.data.getScript( language ), $.uls.data.rtlscripts ) !== -1;
@@ -250,8 +251,8 @@
/**
* Return the direction of the language
* @param language string Language code
* @return string
* @param {string} language Language code
* @return {string}
*/
$.uls.data.getDir = function ( language ) {
return $.uls.data.isRtl( language ) ? 'rtl' : 'ltr';
@@ -259,11 +260,11 @@
/**
* Returns the languages spoken in a territory.
* @param territory string Territory code
* @return list of language codes
* @param {string} territory Territory code
* @return {string[]} list of language codes
*/
$.uls.data.getLanguagesInTerritory = function ( territory ) {
return $.uls.data.territories[territory];
return $.uls.data.territories[ territory ];
};
/**
@@ -271,30 +272,30 @@
* If the target option is provided, the language is defined as a redirect.
* Other possible options are script, regions and autonym.
*
* @param code string New language code.
* @param options Object Language properties.
* @param {string} code New language code.
* @param {Object} options Language properties.
*/
$.uls.data.addLanguage = function( code, options ) {
$.uls.data.addLanguage = function ( code, options ) {
if ( options.target ) {
$.uls.data.languages[code] = [options.target];
$.uls.data.languages[ code ] = [ options.target ];
} else {
$.uls.data.languages[code] = [options.script, options.regions, options.autonym];
$.uls.data.languages[ code ] = [ options.script, options.regions, options.autonym ];
}
};
/**
* Removes a language from the langdb in run time.
*
* @param code string Language code to delete.
* @return true if the language was removed, false otherwise.
* @param {string} code Language code to delete.
* @return {boolean} true if the language was removed, false otherwise.
*/
$.uls.data.deleteLanguage = function( code ) {
if ( $.uls.data.languages[code] ) {
delete $.uls.data.languages[code];
$.uls.data.deleteLanguage = function ( code ) {
if ( $.uls.data.languages[ code ] ) {
delete $.uls.data.languages[ code ];
return true;
}
return false;
};
} ( jQuery ) );
}( jQuery ) );

147
lib/jquery.uls/src/jquery.uls.languagefilter.js
View File

@@ -19,21 +19,34 @@
/**
* Usage: $( 'inputbox' ).languagefilter();
* The values for autocompletion is from the options.languages.
* The data is in the format of languagecode:languagename.
* The values for autocompletion is from the options.languages or options.searchAPI.
*/
( function ( $ ) {
'use strict';
var LanguageFilter, delay;
/**
* Check if a prefix is visually prefix of a string
*
* @param {string} prefix
* @param {string} string
* @return {boolean}
*/
function isVisualPrefix( prefix, string ) {
// Pre-base vowel signs of Indic languages. A vowel sign is called pre-base if
// consonant + vowel becomes [vowel][consonant] when rendered. Eg: ക + െ => കെ
var prebases = 'െേൈൊോൌெேைொோௌେୈୋୌિਿिিেৈোৌෙේෛොෝෞ';
return prebases.indexOf( string[ prefix.length ] ) <= 0;
}
LanguageFilter = function ( element, options ) {
this.$element = $( element );
this.options = $.extend( {}, $.fn.languagefilter.defaults, options );
this.$element.addClass( 'languagefilter' );
this.resultCount = 0;
this.$suggestion = this.$element.parents().find( '#' + this.$element.data( 'suggestion' ) );
this.$clear = this.$element.parents().find( '#' + this.$element.data( 'clear' ) );
this.$suggestion = this.$element.siblings( '.' + this.$element.data( 'suggestion' ) );
this.$clear = this.$element.siblings( '.' + this.$element.data( 'clear' ) );
this.selectedLanguage = null;
this.init();
this.listen();
@@ -72,58 +85,58 @@
var suggestion, query, languageFilter;
switch ( e.keyCode ) {
case 9: // Tab -> Autocomplete
suggestion = this.$suggestion.val();
case 9: // Tab -> Autocomplete
suggestion = this.$suggestion.val();
if ( suggestion && suggestion !== this.$element.val() ) {
this.$element.val( suggestion );
if ( suggestion && suggestion !== this.$element.val() ) {
this.$element.val( suggestion );
e.preventDefault();
e.stopPropagation();
}
break;
case 13: // Enter
if ( !this.options.onSelect ) {
break;
}
// Avoid bubbling this 'enter' to background page elements
e.preventDefault();
e.stopPropagation();
}
break;
case 13: // Enter
if ( !this.options.onSelect ) {
break;
}
// Avoid bubbling this 'enter' to background page elements
e.preventDefault();
e.stopPropagation();
query = $.trim( this.$element.val() ).toLowerCase();
query = $.trim( this.$element.val() ).toLowerCase();
if ( this.selectedLanguage ) {
if ( this.selectedLanguage ) {
// this.selectLanguage will be populated from a matching search
this.options.onSelect( this.selectedLanguage );
} else if ( this.options.languages[ query ] ) {
this.options.onSelect( this.selectedLanguage );
} else if ( this.options.languages[ query ] ) {
// Search is yet to happen (in timeout delay),
// but we have a matching language code.
this.options.onSelect( query );
}
break;
default:
languageFilter = this;
if ( e.which < 32 &&
e.which !== 8 // Backspace
) {
// ignore any ASCII control characters
break;
}
this.selectedLanguage = null;
delay( function () {
if ( !languageFilter.$element.val() ) {
languageFilter.clear();
} else {
languageFilter.options.$target.empty();
languageFilter.search();
this.options.onSelect( query );
}
}, 300 );
this.toggleClear();
break;
default:
languageFilter = this;
if ( e.which < 32 &&
e.which !== 8 // Backspace
) {
// ignore any ASCII control characters
break;
}
this.selectedLanguage = null;
delay( function () {
if ( !languageFilter.$element.val() ) {
languageFilter.clear();
} else {
languageFilter.options.lcd.empty();
languageFilter.search();
}
}, 300 );
this.toggleClear();
}
},
@@ -172,11 +185,13 @@
query = $.trim( this.$element.val() ).toLowerCase();
if ( query === '' ) {
this.options.lcd.setGroupByRegionOverride( null );
languages.map( this.render.bind( this ) );
this.resultHandler( query, languages );
return;
}
this.options.lcd.setGroupByRegionOverride( false );
// Local search results
results = languages.filter( function ( langCode ) {
return this.filter( langCode, query );
@@ -213,7 +228,7 @@
* Handler method to be called once search is over.
* Based on search result triggers resultsfound or noresults events
* @param {string} query
* @param {number} resultCount
* @param {string[]} results
* @param {string} [autofillLabel]
*/
resultHandler: function ( query, results, autofillLabel ) {
@@ -273,18 +288,11 @@
},
render: function ( langCode ) {
// This is actually instance of LanguageCategoryDisplay and not jQuery!
var $target = this.options.$target;
if ( !$target ) {
return false;
}
return $target.append( langCode );
return this.options.lcd.append( langCode );
},
escapeRegex: function ( value ) {
return value.replace( /[\-\[\]{}()*+?.,\\\^$\|#\s]/g, '\\$&' );
return value.replace( /[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&' );
},
/**
@@ -294,6 +302,9 @@
* b) Language autonym 'starts with' search string.
* c) ISO 639 code match with search string.
* d) ISO 15924 code for the script match the search string.
* @param {string} langCode
* @param {string} searchTerm
* @return {boolean}
*/
filter: function ( langCode, searchTerm ) {
// FIXME script is ISO 15924 code. We might need actual name of script.
@@ -335,24 +346,16 @@
};
$.fn.languagefilter.defaults = {
$target: null, // Where to append the results
searchAPI: null,
languages: null, // Languages as code:name format.
onSelect: null // Language select handler - like enter in filter textbox.
// LanguageCategoryDisplay
lcd: undefined,
// URL to which we append query parameter with the query value
searchAPI: undefined,
// Object of language tags to language names
languages: [],
// Callback function when language is selected
onSelect: undefined
};
$.fn.languagefilter.Constructor = LanguageFilter;
/**
* Check if a prefix is visually prefix of a string
*
* @param {string} prefix
* @param {string} string
*/
function isVisualPrefix( prefix, string ) {
// Pre-base vowel signs of Indic languages. A vowel sign is called pre-base if
// consonant + vowel becomes [vowel][consonant] when rendered. Eg: ക + െ => കെ
var prebases = 'െേൈൊോൌெேைொோௌେୈୋୌિਿिিেৈোৌෙේෛොෝෞ';
return prebases.indexOf( string[ prefix.length ] ) <= 0;
}
}( jQuery ) );

244
lib/jquery.uls/src/jquery.uls.lcd.js
View File

@@ -22,43 +22,48 @@
( function ( $ ) {
'use strict';
var noResultsTemplate, LanguageCategoryDisplay;
// eslint-disable-next-line no-multi-str
var noResultsTemplate = '<div class="uls-no-results-view"> \
<h2 data-i18n="uls-no-results-found" class="uls-no-results-found-title">No results found</h2> \
<div class="uls-no-results-suggestions"></div> \
<div class="uls-no-found-more"> \
<div><p> \
<span data-i18n="uls-search-help">You can search by language name, script name, ISO code of language or you can browse by region.</span>\
</p></div> \
</div></div>';
noResultsTemplate = $( '<div>' ).addClass( 'uls-no-results-view hide' );
noResultsTemplate.append(
$( '<h2>' )
.attr( 'data-i18n', 'uls-no-results-found' )
.addClass( 'uls-no-results-found-title' )
.text( 'No results found' ),
$( '<div>' )
.addClass( 'uls-no-found-more' )
.append(
$( '<div>' )
.addClass( '' )
.append(
$( '<p>' ).append(
$( '<span>' )
.attr( 'data-i18n', 'uls-search-help' )
.text( 'You can search by language name, script name, ISO code of language or you can browse by region.' )
)
)
)
);
LanguageCategoryDisplay = function ( element, options ) {
/**
* Language category display
* @param {Element} element The container element to which the languages to be displayed
* @param {Object} [options] Configuration object
* @cfg {Object} [languages] Selectable languages. Keyed by language code, values are autonyms.
* @cfg {string[]} [showRegions] Array of region codes to show. Default is
* [ 'WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA' ]
* @cfg {number} [itemsPerColumn] Number of languages per column.
* @cfg {number} [columns] Number of columns for languages. Default is 4.
* @cfg {Function} [languageDecorator] Callback function to be called when a language
* link is prepared - for custom decoration.
* @cfg {Function|string[]} [quickList] The languages to display as suggestions for quick selection.
* @cfg {Function} [clickhandler] Callback when language is selected.
* @cfg {jQuery|Function} [noResultsTemplate]
*/
function LanguageCategoryDisplay( element, options ) {
this.$element = $( element );
this.options = $.extend( {}, $.fn.lcd.defaults, options );
// Ensure the internal region 'all' is always present
if ( this.options.showRegions.indexOf( 'all' ) === -1 ) {
this.options.showRegions.push( 'all' );
}
this.$element.addClass( 'uls-lcd' );
this.regionLanguages = {};
this.renderTimeout = null;
this.cachedQuicklist = null;
this.$element.append( noResultsTemplate.clone() );
this.$noResults = this.$element.children( '.uls-no-results-view' );
this.groupByRegionOverride = null;
this.render();
this.listen();
};
}
LanguageCategoryDisplay.prototype = {
constructor: LanguageCategoryDisplay,
@@ -67,24 +72,21 @@
* Adds language to the language list.
* @param {string} langCode
* @param {string} [regionCode]
* @return {boolean} Whether the language was added.
* @return {boolean} Whether the language was known and accepted
*/
append: function ( langCode, regionCode ) {
var lcd = this,
i, regions;
var i, regions;
if ( !$.uls.data.languages[ langCode ] ) {
// Language is unknown or not in the list of languages for this context.
return false;
}
// Show everything in one region when there is only one column
if ( lcd.options.columns === 1 ) {
regions = [ 'WW' ];
if ( !this.isGroupingByRegionEnabled() ) {
regions = [ 'all' ];
// Languages are expected to be repeated in this case,
// and we only want to show them once
if ( $.inArray( langCode, this.regionLanguages.WW ) > -1 ) {
// Make sure we do not get duplicates
if ( this.regionLanguages.all.indexOf( langCode ) > -1 ) {
return true;
}
} else {
@@ -101,21 +103,45 @@
// Work around the bad interface, delay rendering until we have got
// all the languages to speed up performance.
window.clearTimeout( this.renderTimeout );
this.renderTimeout = window.setTimeout( function () {
lcd.renderRegions();
}, 50 );
clearTimeout( this.renderTimeout );
this.renderTimeout = setTimeout( function () {
this.renderRegions();
}.bind( this ), 50 );
return true;
},
/**
* Whether we should render languages grouped to geographic regions.
* @return {boolean}
*/
isGroupingByRegionEnabled: function () {
if ( this.groupByRegionOverride !== null ) {
return this.groupByRegionOverride;
} else if ( this.options.groupByRegion !== 'auto' ) {
return this.options.groupByRegion;
} else {
return this.options.columns > 1;
}
},
/**
* Override the default region grouping setting.
* This is to allow LanguageFilter to disable grouping when displaying search results.
*
* @param {boolean|null} val True to force grouping, false to disable, null to undo override.
*/
setGroupByRegionOverride: function ( val ) {
this.groupByRegionOverride = val;
},
render: function () {
var $section, $quicklist,
lcd = this,
narrowMode = this.options.columns === 1,
var $section,
$quicklist = this.buildQuicklist(),
regions = [],
regionNames = {
// These are fallback text when i18n library not present
all: 'All languages', // Used if there is quicklist and no region grouping
WW: 'Worldwide',
SP: 'Special',
AM: 'America',
@@ -126,42 +152,30 @@
PA: 'Pacific'
};
$quicklist = this.buildQuicklist();
regions.push( $quicklist );
if ( narrowMode && $quicklist.length ) {
regions.push( $( '<h3>' )
.attr( 'data-i18n', 'uls-region-all' )
.addClass( 'uls-lcd-region-title' )
.text( 'All languages' )
);
if ( $quicklist.length ) {
regions.push( $quicklist );
} else {
// We use CSS to hide the header for 'all' when quicklist is NOT present
this.$element.addClass( 'uls-lcd--no-quicklist' );
}
$.each( $.uls.data.regiongroups, function ( regionCode ) {
lcd.regionLanguages[ regionCode ] = [];
// Don't show the region unless it was enabled
if ( $.inArray( regionCode, lcd.options.showRegions ) === -1 ) {
return;
}
this.options.showRegions.forEach( function ( regionCode ) {
this.regionLanguages[ regionCode ] = [];
$section = $( '<div>' )
.addClass( 'uls-lcd-region-section hide' )
.attr( 'id', regionCode );
.attr( 'data-region', regionCode );
// Show a region heading, unless we are using a narrow ULS
if ( !narrowMode ) {
$section.append( $( '<h3>' )
.attr( 'data-i18n', 'uls-region-' + regionCode )
.addClass( 'uls-lcd-region-title' )
.text( regionNames[ regionCode ] )
);
}
$( '<h3>' )
.attr( 'data-i18n', 'uls-region-' + regionCode )
.addClass( 'uls-lcd-region-title' )
.text( regionNames[ regionCode ] )
.appendTo( $section );
regions.push( $section );
} );
}.bind( this ) );
lcd.$element.append( regions );
this.$element.append( regions );
this.i18n();
},
@@ -173,12 +187,12 @@
var languages,
lcd = this;
this.$noResults.addClass( 'hide' );
this.$element.removeClass( 'uls-no-results' );
this.$element.children( '.uls-lcd-region-section' ).each( function () {
var $region = $( this ),
regionCode = $region.attr( 'id' );
regionCode = $region.data( 'region' );
if ( $region.is( '#uls-lcd-quicklist' ) ) {
if ( $region.is( '.uls-lcd-quicklist' ) ) {
return;
}
@@ -241,8 +255,9 @@
nextScript = $.uls.data.getScriptGroupOfLanguage( languages[ i + 1 ] );
lastItem = languagesCount - i === 1;
// Force column break if script changes and column has more than one row already
if ( i === 0 ) {
// Force column break if script changes and column has more than one row already,
// but only if grouping by region
if ( i === 0 || !this.isGroupingByRegionEnabled() ) {
currentScript = $.uls.data.getScriptGroupOfLanguage( languages[ i ] );
} else if ( currentScript !== nextScript && items.length > 1 ) {
force = true;
@@ -287,7 +302,6 @@
a.lang = code;
a.dir = $.uls.data.getDir( code );
li.appendChild( a );
if ( this.options.languageDecorator ) {
this.options.languageDecorator( $( a ), code );
@@ -303,7 +317,7 @@
* Adds quicklist as a region.
*/
quicklist: function () {
this.$element.find( '#uls-lcd-quicklist' ).removeClass( 'hide' );
this.$element.find( '.uls-lcd-quicklist' ).removeClass( 'hide' );
},
buildQuicklist: function () {
@@ -328,8 +342,7 @@
quickList.sort( $.uls.data.sortByAutonym );
$quickListSection = $( '<div>' )
.addClass( 'uls-lcd-region-section' )
.attr( 'id', 'uls-lcd-quicklist' );
.addClass( 'uls-lcd-region-section uls-lcd-quicklist' );
$quickListSectionTitle = $( '<h3>' )
.attr( 'data-i18n', 'uls-common-languages' )
@@ -356,30 +369,41 @@
}
},
/**
* Called when a fresh search is started
*/
empty: function () {
this.$element.find( '#uls-lcd-quicklist' ).addClass( 'hide' );
this.$element.addClass( 'uls-lcd--no-quicklist' );
this.$element.find( '.uls-lcd-quicklist' ).addClass( 'hide' );
},
focus: function () {
this.$element.focus();
},
noResults: function () {
this.$noResults.removeClass( 'hide' );
this.$noResults.siblings( '.uls-lcd-region-section' ).addClass( 'hide' );
/**
* No-results event handler
* @param {Event} event
* @param {string} [currentSearchQuery] Current search query that gave mp results
*/
noResults: function ( event, currentSearchQuery ) {
var $noResults;
// Only build the data once
if ( this.$noResults.find( '.uls-lcd-region-title' ).length ) {
return;
this.$element.addClass( 'uls-no-results' );
this.$element.find( '.uls-no-results-view' ).remove();
if ( typeof this.options.noResultsTemplate === 'function' ) {
$noResults =
this.options.noResultsTemplate.call( this, currentSearchQuery );
} else if ( this.options.noResultsTemplate instanceof jQuery ) {
$noResults = this.options.noResultsTemplate;
} else {
throw new Error( 'noResultsTemplate option must be ' +
'either jQuery or function returning jQuery' );
}
var $suggestions = this.buildQuicklist().clone();
$suggestions.removeClass( 'hide' ).removeAttr( 'id' );
$suggestions.find( 'h3' )
.data( 'i18n', 'uls-no-results-suggestion-title' )
.text( 'You may be interested in:' )
.i18n();
this.$noResults.find( 'h2' ).after( $suggestions );
this.$element.append( $noResults.addClass( 'uls-no-results-view' ) );
},
listen: function () {
@@ -410,15 +434,37 @@
};
$.fn.lcd.defaults = {
languages: null,
// List of languages to show
languages: [],
// List of regions to show
showRegions: [ 'WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA' ],
// Whether to group by region, defaults to true when columns > 1
groupByRegion: 'auto',
// How many items per column until new "row" starts
itemsPerColumn: 8,
// Other supported values are 1 and 2.
// Other values will have rendering issues.
// Number of columns, only 1, 2 and 4 are supported
columns: 4,
languageDecorator: null,
quickList: []
// Callback function for language item styling
languageDecorator: undefined,
// Likely candidates
quickList: [],
// Callback function for language selection
clickhandler: undefined,
// Callback function when no search results
noResultsTemplate: function () {
var $suggestionsContainer, $suggestions,
$noResultsTemplate = $( noResultsTemplate );
$suggestions = this.buildQuicklist().clone();
$suggestions.removeClass( 'hide' )
.find( 'h3' )
.data( 'i18n', 'uls-no-results-suggestion-title' )
.text( 'You may be interested in:' )
.i18n();
$suggestionsContainer = $noResultsTemplate.find( '.uls-no-results-suggestions' );
$suggestionsContainer.append( $suggestions );
return $noResultsTemplate;
}
};
$.fn.lcd.Constructor = LanguageCategoryDisplay;
}( jQuery ) );