Add decorator option for language links
Callback function to be called when a language link is prepared Can be used for custom decoration. Arguments: (a) the $language - the language link jQuery object (b) languageCode The function can do any styling, changing properites etc on the passed link. See examples/decorator.html for example usage. Change-Id: I5a67654440a07cf7dfac683e22dcb5000ded0bfe
This commit is contained in:
@@ -93,6 +93,7 @@ $( '.uls-trigger' ).uls( {
|
|||||||
| onCancel | function to be handled when language selection is not done. ie. language selector is closed without selecting any |
|
| onCancel | function to be handled when language selection is not done. ie. language selector is closed without selecting any |
|
||||||
| showRegions | Regions to be shown in the language selector. Default: ['WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA'] |
|
| showRegions | Regions to be shown in the language selector. Default: ['WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA'] |
|
||||||
| itemsPerColumn | Number of languages per column. Default is 8 |
|
| itemsPerColumn | Number of languages per column. Default is 8 |
|
||||||
|
| languageDecorator | Callback function to be called when a language link is prepared - for custom decoration. Arguments: (a) the $language - the language link jQuery object (b) languageCode. The function can do any styling, changing properites etc on the passed link. See examples/decorator.html for example usage.|
|
||||||
|
|
||||||
|
|
||||||
Features
|
Features
|
||||||
|
|||||||
41
examples/decorator.html
Normal file
41
examples/decorator.html
Normal file
@@ -0,0 +1,41 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en" dir="ltr">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8"/>
|
||||||
|
<title>Universal Language Selector</title>
|
||||||
|
<link href="../css/jquery.uls.css" rel="stylesheet"/>
|
||||||
|
<link href="../css/jquery.uls.grid.css" rel="stylesheet"/>
|
||||||
|
<link href="../css/jquery.uls.lcd.css" rel="stylesheet"/>
|
||||||
|
<!-- demo -->
|
||||||
|
<link href="resources/demo.css" rel="stylesheet"/>
|
||||||
|
<!-- Libs -->
|
||||||
|
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
|
||||||
|
<!-- Source -->
|
||||||
|
<script src="../src/jquery.uls.data.js"></script>
|
||||||
|
<script src="../src/jquery.uls.data.utils.js"></script>
|
||||||
|
<script src="../src/jquery.uls.lcd.js"></script>
|
||||||
|
<script src="../src/jquery.uls.languagefilter.js"></script>
|
||||||
|
<script src="../src/jquery.uls.regionfilter.js"></script>
|
||||||
|
<script src="../src/jquery.uls.core.js"></script>
|
||||||
|
<script>
|
||||||
|
$( document ).ready( function() {
|
||||||
|
$( '.uls-trigger' ).uls( {
|
||||||
|
languageDecorator : function( $language, languageCode ) {
|
||||||
|
$language.prop( 'href', '//'+ languageCode + '.wikipedia.org' );
|
||||||
|
},
|
||||||
|
} );
|
||||||
|
} );
|
||||||
|
</script>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="navbar navbar-fixed-top">
|
||||||
|
<span class="active uls-trigger">Select Language</span>
|
||||||
|
<h1>Universal Language Selector</h1>
|
||||||
|
<p>
|
||||||
|
Demonstration of jQuery plugin
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="container"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -267,7 +267,8 @@
|
|||||||
quickList: this.options.quickList,
|
quickList: this.options.quickList,
|
||||||
clickhandler: $.proxy( this.select, this ),
|
clickhandler: $.proxy( this.select, this ),
|
||||||
source: this.$languageFilter,
|
source: this.$languageFilter,
|
||||||
showRegions: this.options.showRegions
|
showRegions: this.options.showRegions,
|
||||||
|
languageDecorator: this.options.languageDecorator
|
||||||
} ).data( 'lcd' );
|
} ).data( 'lcd' );
|
||||||
|
|
||||||
this.$languageFilter.languagefilter( {
|
this.$languageFilter.languagefilter( {
|
||||||
@@ -400,7 +401,8 @@
|
|||||||
languages: $.uls.data.getAutonyms(), // Languages to be used for ULS, default is all languages
|
languages: $.uls.data.getAutonyms(), // Languages to be used for ULS, default is all languages
|
||||||
quickList: null, // Array of language codes or function that returns such
|
quickList: null, // Array of language codes or function that returns such
|
||||||
compact: false, // Show ULS in compact mode
|
compact: false, // Show ULS in compact mode
|
||||||
showRegions: [ 'WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA' ]
|
showRegions: [ 'WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA' ],
|
||||||
|
languageDecorator: null // Callback function to be called when a language link is prepared - for custom decoration.
|
||||||
};
|
};
|
||||||
|
|
||||||
// Define a dummy i18n function, if jquery.i18n not integrated.
|
// Define a dummy i18n function, if jquery.i18n not integrated.
|
||||||
|
|||||||
@@ -246,7 +246,9 @@
|
|||||||
a.className = 'autonym';
|
a.className = 'autonym';
|
||||||
|
|
||||||
li.appendChild( a );
|
li.appendChild( a );
|
||||||
|
if( this.options.languageDecorator ) {
|
||||||
|
this.options.languageDecorator( $( a ), code );
|
||||||
|
}
|
||||||
return li;
|
return li;
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -386,7 +388,8 @@
|
|||||||
$.fn.lcd.defaults = {
|
$.fn.lcd.defaults = {
|
||||||
languages: null,
|
languages: null,
|
||||||
showRegions: ['WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA'],
|
showRegions: ['WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA'],
|
||||||
itemsPerColumn: 8
|
itemsPerColumn: 8,
|
||||||
|
languageDecorator: null
|
||||||
};
|
};
|
||||||
|
|
||||||
$.fn.lcd.Constructor = LanguageCategoryDisplay;
|
$.fn.lcd.Constructor = LanguageCategoryDisplay;
|
||||||
|
|||||||
Reference in New Issue
Block a user