Rearranging Files

* Seperating standalone jQuery ULS plugin and extension related code
* lib/jquery.uls can be submodule, but not now.

Change-Id: I7d9cb47daa88dd1a27ceda602a08cab0073caf33

lib/jquery.uls/README.md

@@ -0,0 +1,4 @@
+jQuery Universal Language Selector
+=================================
+Universal  Language Selector
+

lib/jquery.uls/css/jquery.uls.css

@@ -0,0 +1,180 @@
+.uls-trigger {
+	/* @embed */
+	background: url('../images/icon-language.png') no-repeat scroll left center transparent;
+	padding-left: 30px;
+}
+.uls-menu {
+	position: fixed;
+	z-index: 1000;
+	display: none;
+	min-width: 715px;
+	margin-top: 1px;
+	width: 45%;
+	/* Styling */
+	background-color: #ffffff;
+	border: 1px solid #ccc;
+	border: 1px solid rgba(0, 0, 0, 0.2);
+	*border-right-width: 2px;
+	*border-bottom-width: 2px;
+	-webkit-border-radius: 5px;
+	-moz-border-radius: 5px;
+	border-radius: 5px;
+	-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;
+}
+.uls-menu a {
+	color: #0088CC;
+}
+.uls-menu h1 {
+	font-weight: normal;
+	padding-top: 1.25em;
+	border: none;
+	padding-bottom: 3px;
+	font-size: 18pt;
+	line-height: 1.25em;
+	padding-left: 15px;
+	color: #777;
+}
+.uls-menu h2 {
+	font-size: 16pt;
+	line-height: 1.5em;
+	padding-left: 6px;
+	margin-top: 0px;
+	margin-bottom: 15px;
+	border-bottom: none;
+	color: #777;
+}
+.uls-menu h3 {
+	font-size: 14pt;
+	line-height: 1.5em;
+	padding-left: 0px;
+	margin-top: 0px;
+	margin-bottom: 10px;
+	border-bottom: none;
+}
+.uls-worldmap {
+	/* @embed */
+	background: url('../images/world_map.png') no-repeat scroll right top transparent;
+	background-size: 100%;
+}
+.uls-region {
+	/* The map doesn't flip */
+	/* @noflip */
+	float: left;
+	cursor: pointer;
+	padding: 0px;
+	margin: 0px;
+	height: 125px;
+	border-bottom-color: #777;
+	border-bottom-style: solid;
+	border-bottom-width: 3px;
+}
+.uls-region a {
+	bottom: 2px;
+	position: absolute;
+	font-size: 13px;
+}
+.uls-region:hover {
+	/*Cross-browser background transparency*/
+	background: #3366bb;
+	background: rgba(51, 102, 187, 0.1);
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#253366bb, endColorstr=#253366bb);
+	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#253366bb, endColorstr=#253366bb)";
+	border-bottom-color: #3366bb;
+	border-bottom-style: solid;
+}
+.regionselector.active {
+	/*Cross-browser background transparency*/
+	background: #3366bb;
+	background: rgba(51, 102, 187, 0.2);
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#253366bb, endColorstr=#253366bb);
+	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#253366bb, endColorstr=#253366bb)";
+	border-bottom-color: #3366bb;
+	border-bottom-style: solid;
+}
+#map-block {
+	top: 1px;
+	margin-right: 0;
+	padding-right: 0px;
+	float: right;
+	overflow: hidden;
+}
+#map-block a {
+	color: #444;
+}
+#map-block .active a {
+	font-weight: bold;
+}
+.icon-close {
+	/* @embed */
+	background: url('../images/close.png') no-repeat scroll center center transparent;
+	float: right;
+	padding: 15px;
+	cursor: pointer;
+}
+input#languagefilter {
+	border: 1px solid #c9c9c9;
+	-moz-transition: all 0.15s linear 0s;
+	border-radius: 2px 2px 2px 2px;
+	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
+	color: #333;
+	display: block;
+	background-color: transparent;
+}
+input:focus#languagefilter {
+	border: 1px solid #08C;
+}
+
+#search {
+	background-color: #f8f8f8;
+	border-top-color: #777;
+	border-top-style: solid;
+	border-top-width: 1px;
+	padding: 0.8em 0;
+}
+.search-label {
+	/* @embed */
+	background: url('../images/search.png') no-repeat scroll right center transparent;
+	background-size: 30px;
+	height: 32px;
+	width: 32px;
+	display: inline-block;
+	float: right;
+}
+span#languagefilter-clear {
+	/* @embed */
+	background: url('../images/clear.png') no-repeat scroll left center transparent;
+	cursor: pointer;
+	height: 32px;
+	position: absolute;
+	width: 32px;
+	margin-left: -32px;
+}
+
+.filterinput {
+	position: absolute;
+	top: 0px;
+	left: 0px;
+	font-size: 14px;
+	height: 32px;
+	padding: 6px;
+	width: 100%;
+	text-align: left;
+}
+
+#filtersuggestion {
+	background-color: white;
+	color: #888;
+	border: 1px transparent;
+	border-radius: 2px 2px 2px 2px;
+	box-shadow: 0 1px 2px transparent inset;
+	left: 1px;
+}
+
+#search-input-block {
+	position: relative;
+}

lib/jquery.uls/css/jquery.uls.grid.css

@@ -0,0 +1,320 @@
+/* Generated using Foundation http://foundation.zurb.com/docs/grid.php */
+/* Global Reset & Standards ---------------------- */
+.uls-menu * {
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+/* Misc ---------------------- */
+.left {
+	float: left;
+}
+
+.right {
+	float: right;
+}
+
+.text-left {
+	text-align: left;
+}
+
+.text-right {
+	text-align: right;
+}
+
+.text-center {
+	text-align: center;
+}
+
+.hide {
+	display: none;
+}
+
+.highlight {
+	background: #ffff99;
+}
+
+/* The Grid ---------------------- */
+.row {
+	width: 100%;
+	max-width: none;
+	min-width: 600px;
+	margin: 0 auto;
+}
+.row .row {
+	width: auto;
+	max-width: none;
+	min-width: 0;
+	margin: 0 -5px;
+}
+.row.collapse .column, .row.collapse .columns {
+	padding: 0;
+}
+.row .row {
+	width: auto;
+	max-width: none;
+	min-width: 0;
+	margin: 0 -5px;
+}
+.row .row.collapse {
+	margin: 0;
+}
+
+.column, .columns {
+	float: left;
+	min-height: 1px;
+	padding: 0 5px;
+	position: relative;
+}
+.column.centered, .columns.centered {
+	float: none;
+	margin: 0 auto;
+}
+
+.row .one {
+	width: 8.333%;
+}
+
+.row .two {
+	width: 16.667%;
+}
+
+.row .three {
+	width: 25%;
+}
+
+.row .four {
+	width: 33.333%;
+}
+
+.row .five {
+	width: 41.667%;
+}
+
+.row .six {
+	width: 50%;
+}
+
+.row .seven {
+	width: 58.333%;
+}
+
+.row .eight {
+	width: 66.667%;
+}
+
+.row .nine {
+	width: 75%;
+}
+
+.row .ten {
+	width: 83.333%;
+}
+
+.row .eleven {
+	width: 91.667%;
+}
+
+.row .twelve {
+	width: 100%;
+}
+
+.row .offset-by-one {
+	margin-left: 8.333%;
+}
+
+.row .offset-by-two {
+	margin-left: 16.667%;
+}
+
+.row .offset-by-three {
+	margin-left: 25%;
+}
+
+.row .offset-by-four {
+	margin-left: 33.333%;
+}
+
+.row .offset-by-five {
+	margin-left: 41.667%;
+}
+
+.row .offset-by-six {
+	margin-left: 50%;
+}
+
+.row .offset-by-seven {
+	margin-left: 58.333%;
+}
+
+.row .offset-by-eight {
+	margin-left: 66.667%;
+}
+
+.row .offset-by-nine {
+	margin-left: 75%;
+}
+
+.row .offset-by-ten {
+	margin-left: 83.333%;
+}
+
+.push-two {
+	left: 16.667%;
+}
+
+.pull-two {
+	right: 16.667%;
+}
+
+.push-three {
+	left: 25%;
+}
+
+.pull-three {
+	right: 25%;
+}
+
+.push-four {
+	left: 33.333%;
+}
+
+.pull-four {
+	right: 33.333%;
+}
+
+.push-five {
+	left: 41.667%;
+}
+
+.pull-five {
+	right: 41.667%;
+}
+
+.push-six {
+	left: 50%;
+}
+
+.pull-six {
+	right: 50%;
+}
+
+.push-seven {
+	left: 58.333%;
+}
+
+.pull-seven {
+	right: 58.333%;
+}
+
+.push-eight {
+	left: 66.667%;
+}
+
+.pull-eight {
+	right: 66.667%;
+}
+
+.push-nine {
+	left: 75%;
+}
+
+.pull-nine {
+	right: 75%;
+}
+
+.push-ten {
+	left: 83.333%;
+}
+
+.pull-ten {
+	right: 83.333%;
+}
+
+img, object, embed {
+	max-width: 100%;
+	height: auto;
+}
+
+img {
+	-ms-interpolation-mode: bicubic;
+}
+
+#map_canvas img, .map_canvas img {
+	max-width: none !important;
+}
+
+/* Nicolas Gallagher's micro clearfix */
+.row {
+	*zoom: 1;
+}
+.row:before, .row:after {
+	content: "";
+	display: table;
+}
+.row:after {
+	clear: both;
+}
+
+/* Block Grids ---------------------- */
+/* These are 2-up, 3-up, 4-up and 5-up ULs, suited
+ for repeating blocks of content. Add 'mobile' to
+ them to switch them just like the layout grid
+ (one item per line) on phones
+
+ For IE7/8 compatibility block-grid items need to be
+ the same height. You can optionally uncomment the
+ lines below to support arbitrary height, but know
+ that IE7/8 do not support :nth-child.
+ -------------------------------------------------- */
+.block-grid {
+	display: block;
+	overflow: hidden;
+	padding: 0;
+}
+.block-grid > li {
+	display: block;
+	height: auto;
+	float: left;
+}
+
+.block-grid.two-up {
+	margin: 0 -15px;
+}
+
+.block-grid.two-up > li {
+	width: 50%;
+	padding: 0 15px 15px;
+}
+
+/*  .block-grid.two-up>li:nth-child(2n+1) {clear: left;} */
+.block-grid.three-up {
+	margin: 0 -12px;
+}
+
+.block-grid.three-up > li {
+	width: 33.33%;
+	padding: 0 12px 12px;
+}
+
+/*  .block-grid.three-up>li:nth-child(3n+1) {clear: left;} */
+.block-grid.four-up {
+	margin: 0 -10px;
+}
+
+.block-grid.four-up > li {
+	width: 25%;
+	padding: 0 10px 10px;
+}
+
+/*  .block-grid.four-up>li:nth-child(4n+1) {clear: left;} */
+.block-grid.five-up {
+	margin: 0 -8px;
+}
+
+.block-grid.five-up > li {
+	width: 20%;
+	padding: 0 8px 8px;
+}
+

lib/jquery.uls/css/jquery.uls.lcd.css

@@ -0,0 +1,54 @@
+.uls-lcd-region-section h3 {
+	color: #999999;
+}
+.uls-lcd-region-section ul li:hover {
+	background-color: #eaeff7;
+}
+/* Language list */
+.uls-language-list {
+	height: 21.5em;
+	overflow: auto;
+	margin: 10px;
+	width: auto;
+}
+
+.uls-language-block ul {
+	margin: 0px;
+	margin-bottom: 1.6em;
+}
+.uls-language-list ul li {
+	font-weight: normal;
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
+.uls-language-list strong {
+	text-decoration: underline;
+}
+.uls-language-list a {
+	font-weight: normal;
+	color: #0088CC;
+	font-size: 14px;
+	line-height: 1.6em;
+}
+
+.uls-language-block .three.columns {
+	width: 22%;
+}
+
+.uls-language-block {
+	width: 100%;
+}
+
+.uls-no-results-view {
+	color: #777;
+}
+
+#uls-no-found-more {
+	font-size: 0.9em;
+	background: #F8F8F8;
+	display: inline-block;
+	width: 100%;
+	margin-top: 1.6em;
+	line-height: 1.6em;
+}

lib/jquery.uls/examples/resources/demo.css

@@ -0,0 +1,20 @@
+body {
+	padding-left: 10%;
+	padding-right: 10%;
+	font-family: Arial, Helvetica, sans-serif;
+}
+a {
+	text-decoration: none;
+}
+div.navbar {
+	background-color: #333;
+	color: #FFFFFF;
+	padding: 20px;
+}
+span.uls-trigger {
+	float: right;
+}
+span.uls-trigger a {
+	color: #FFFFFF;
+	font-weight: bold;
+}

lib/jquery.uls/src/jquery.uls.core.js

@@ -0,0 +1,197 @@
+/**
+ * <explain briefly what this file is about>.
+ *
+ * Copyright (C) 2012 Alolita Sharma, Amir Aharoni, Arun Ganesh, Brandon Harris,
+ * Niklas Laxström, Pau Giner, Santhosh Thottingal, Siebrand Mazeland and other
+ * contributors. See CREDITS for a list.
+ *
+ * UniversalLanguageSelector is dual licensed GPLv2 or later and MIT. You don't
+ * have to do anything special to choose one license or the other and you don't
+ * have to notify anyone which license you are using. You are free to use
+ * UniversalLanguageSelector in commercial projects as long as the copyright
+ * header is left intact. See files GPL-LICENSE and MIT-LICENSE for details.
+ *
+ * @file
+ * @ingroup Extensions
+ * @licence GNU General Public Licence 2.0 or later
+ * @licence MIT License
+ */
+
+(function ( $ ) {
+	"use strict";
+
+	var ULS = function( element, options ) {
+		this.$element = $( element );
+		this.options = $.extend( {}, $.fn.uls.defaults, options );
+		this.$menu = $( this.options.menu );
+		this.languages = this.$menu.data( 'languages' );
+		for ( var code in this.languages ) {
+			if ( $.uls.data.languages[code] === undefined ) {
+				window.console && console.log && console.log( "ULS: Unknown language " + code + "." );
+				delete this.languages[code];
+			}
+		}
+		this.shown = false;
+		this.$languageFilter = $( 'input#languagefilter' );
+		this.$noResultsView = $( 'div.uls-no-results-view' );
+		this.$resultsView = $( 'div.uls-language-list' );
+		this.$noResultsView.hide();
+		this.render();
+		this.listen();
+		this.ready();
+	};
+
+	ULS.prototype = {
+		constructor: ULS,
+		ready: function() {
+			// Initialize with a full search.
+			this.$languageFilter.val( "" ).languagefilter( "search" );
+		},
+		show: function() {
+			var pos = $.extend( {}, this.$element.offset(), {
+				height: this.$element[0].offsetHeight
+			} );
+			this.$menu.css( {
+				top: pos.top + pos.height,
+				left: '25%'
+			} );
+
+			this.$menu.show();
+			this.shown = true;
+
+			this.$languageFilter.focus();
+			return this;
+		},
+
+		hide: function() {
+			this.$menu.hide();
+			this.shown = false;
+			return this;
+		},
+
+		render: function() {
+			// Rendering stuff here
+		},
+
+		noresults: function( search ) {
+			this.$noResultsView.show();
+			// FIXME i18n
+			this.$noResultsView.find( 'span#uls-no-found-search-term' ).text( search );
+			this.$resultsView.hide();
+		},
+
+		success: function() {
+			this.$noResultsView.hide();
+			this.$resultsView.show();
+		},
+
+		listen: function() {
+			var that = this, lcd;
+			// Register all event listeners to the ULS here.
+			that.$element.on( 'click', $.proxy( that.click, that ) );
+
+			// Handle click on close button
+			$( ".icon-close" ).on( 'click', $.proxy( that.click, that ) );
+
+			// Handle key press events on the menu
+			that.$menu.on('keypress', $.proxy(this.keypress, this) )
+				.on('keyup', $.proxy(this.keyup, this) );
+			if ( $.browser.webkit || $.browser.msie ) {
+				this.$menu.on( 'keydown', $.proxy( this.keypress, this ) )
+			}
+
+			lcd = that.$resultsView.lcd( {
+				languages: that.languages,
+				clickhandler: function( langCode ) {
+					if ( that.options.onSelect ) {
+						that.options.onSelect.call( this, langCode );
+					}
+				}
+			} ).data( "lcd" );
+
+			that.$languageFilter.languagefilter( {
+				$target: lcd,
+				languages: that.languages,
+				success: $.proxy( that.success, that ),
+				noresults: $.proxy( that.noresults, that ),
+				searchAPI: that.options.searchAPI
+			} );
+
+			// Create region selectors, one per region
+			$( '.uls-region, .uls-region-link' ).regionselector( {
+				$target: lcd,
+				languages: that.languages,
+				success: function() {
+					// clear the search field.
+					that.$languageFilter.languagefilter( 'clear' );
+					that.success();
+				}
+			} );
+
+		},
+
+		keyup: function( e ) {
+			if ( !this.shown ) {
+				return;
+			}
+			switch( e.keyCode ) {
+				case 27: // escape
+					this.hide();
+					e.preventDefault();
+					break;
+			}
+			e.stopPropagation();
+		},
+
+		keypress: function( e ) {
+			if ( !this.shown ) {
+				return;
+			}
+			switch( e.keyCode ) {
+				case 27: // escape
+					this.hide();
+					e.preventDefault();
+					break;
+			}
+			e.stopPropagation();
+		},
+
+		click: function( e ) {
+			e.stopPropagation();
+			e.preventDefault();
+			if ( !this.shown ) {
+				this.show();
+			} else {
+				this.hide();
+			}
+		}
+
+	};
+
+	/* ULS PLUGIN DEFINITION
+	 * =========================== */
+
+	$.fn.uls = function( option ) {
+		return this.each( function() {
+			var $this = $( this ),
+				data = $this.data( 'uls' ),
+				options = typeof option === 'object' && option;
+
+			if ( !data ) {
+				$this.data( 'uls', ( data = new ULS( this, options ) ) );
+			}
+			if ( typeof option === 'string' ) {
+				data[option]();
+			}
+		} );
+	};
+
+	$.fn.uls.defaults = {
+		menu: '.uls-menu',
+		onSelect: null, // Callback function to be called when a language is selected
+		searchAPI: null // Language search API
+	};
+
+	$.fn.uls.Constructor = ULS;
+
+} )( jQuery );

lib/jquery.uls/src/jquery.uls.data.utils.js

@@ -0,0 +1,301 @@
+/**
+ * Utility functions for querying language data.
+ *
+ * Copyright (C) 2012 Alolita Sharma, Amir Aharoni, Arun Ganesh, Brandon Harris,
+ * Niklas Laxström, Pau Giner, Santhosh Thottingal, Siebrand Mazeland and other
+ * contributors. See CREDITS for a list.
+ *
+ * UniversalLanguageSelector is dual licensed GPLv2 or later and MIT. You don't
+ * have to do anything special to choose one license or the other and you don't
+ * have to notify anyone which license you are using. You are free to use
+ * UniversalLanguageSelector in commercial projects as long as the copyright
+ * header is left intact. See files GPL-LICENSE and MIT-LICENSE for details.
+ *
+ * @file
+ * @ingroup Extensions
+ * @licence GNU General Public Licence 2.0 or later
+ * @licence MIT License
+ */
+
+(function ( $ ) {
+	"use strict";
+
+	/**
+	 * Returns the script of the language.
+	 * @param string language code
+	 * @return string
+	 */
+	$.uls.data.script = function( language ) {
+		return $.uls.data.languages[language][0];
+	};
+
+	/**
+	 * Returns the regions in which a language is spoken.
+	 * @param string language code
+	 * @return array of strings
+	 */
+	$.uls.data.regions = function( language ) {
+		return ( $.uls.data.languages[language] && $.uls.data.languages[language][1] ) || 'UNKNOWN';
+	};
+
+	/**
+	 * Returns the autonym of the language.
+	 * @param string language code
+	 * @return string
+	 */
+	$.uls.data.autonym = function( language ) {
+		return $.uls.data.autonyms[language];
+	};
+
+	/**
+	 * Returns an array of all region codes.
+	 * @return array
+	 */
+	$.uls.data.allRegions = function() {
+		var allRegions = [];
+
+		for( var region in $.uls.data.regiongroups ) {
+			allRegions.push( region );
+		}
+
+		return allRegions;
+	};
+
+	/**
+	 * Returns all languages written in script.
+	 * @param script string
+	 * @return array of strings (languages codes)
+	 */
+	$.uls.data.languagesInScript = function( script ) {
+		return $.uls.data.languagesInScripts( [ script ] );
+	};
+
+	/**
+	 * Returns all languages written in the given scripts.
+	 * @param scripts array of strings
+	 * @return array of strings (languages codes)
+	 */
+	$.uls.data.languagesInScripts = function( scripts ) {
+		var languagesInScripts = [];
+
+		for ( var language in $.uls.data.languages ) {
+			for ( var i = 0; i < scripts.length; i++ ) {
+				if ( scripts[i] === $.uls.data.script(language) ) {
+					languagesInScripts.push( language );
+					break;
+				}
+			}
+		}
+
+		return languagesInScripts;
+	};
+
+	/**
+	 * Returns all languages in a given region.
+	 * @param region string
+	 * @return array of strings (languages codes)
+	 */
+	$.uls.data.languagesInRegion = function( region ) {
+		return $.uls.data.languagesInRegions( [ region ] );
+	};
+
+	/**
+	 * Returns all languages in given regions.
+	 * @param region array of strings.
+	 * @return array of strings (languages codes)
+	 */
+	$.uls.data.languagesInRegions = function( regions ) {
+		var languagesInRegions = [];
+
+		for ( var language in $.uls.data.languages ) {
+			for ( var i = 0; i < regions.length; i++ ) {
+				if ( $.inArray( regions[i], $.uls.data.regions( language ) ) !== -1 ) {
+					languagesInRegions.push( language );
+					break;
+				}
+			}
+		}
+
+		return languagesInRegions;
+	};
+
+	/**
+	 * Returns all languages in a region group.
+	 * @param groupNum number.
+	 * @return array of strings (languages codes)
+	 */
+	$.uls.data.languagesInRegionGroup = function( groupNum ) {
+		return $.uls.data.languagesInRegions( $.uls.data.regionsInGroup( groupNum ) );
+	};
+
+	/**
+	 * Returns an associative array of languages in a region,
+	 * grouped by script.
+	 * @param string region code
+	 * @return associative array
+	 */
+	$.uls.data.languagesByScriptInRegion = function( region ) {
+		var languagesByScriptInRegion = {};
+
+		for ( var language in $.uls.data.languages ) {
+			if ( $.inArray( region, $.uls.data.regions( language ) ) !== -1 ) {
+				var script = $.uls.data.script( language );
+				if ( languagesByScriptInRegion[script] === undefined ) {
+					languagesByScriptInRegion[script] = [];
+				}
+				languagesByScriptInRegion[script].push( language );
+			}
+		}
+
+		return languagesByScriptInRegion;
+	};
+
+	/**
+	 * Returns an associative array of languages in a region,
+	 * grouped by script group.
+	 * @param string region code
+	 * @return associative array
+	 */
+	$.uls.data.languagesByScriptGroupInRegion = function( region ) {
+		return $.uls.data.languagesByScriptGroupInRegions( [ region ] );
+	};
+
+	/**
+	 * Returns an associative array of all languages,
+	 * grouped by script group.
+	 * @return associative array
+	 */
+	$.uls.data.allLanguagesByScriptGroup = function() {
+		return $.uls.data.languagesByScriptGroupInRegions( $.uls.data.allRegions() );
+	};
+
+	/**
+	 * Get the given list of languages sorted by script.
+	 * @param languages Array of language codes
+	 * @return {Object} Array of languages indexed by script codes
+	 */
+	$.uls.data.languagesByScriptGroup = function( languages ) {
+		var languagesByScriptGroup = {}, scriptGroup, language, langScriptGroup;
+		for ( scriptGroup in $.uls.data.scriptgroups ) {
+			for ( language in languages ) {
+				langScriptGroup = $.uls.data.scriptGroupOfLanguage( language );
+				if( langScriptGroup !== scriptGroup ){
+					continue;
+				}
+				if ( !languagesByScriptGroup[scriptGroup] ) {
+					languagesByScriptGroup[scriptGroup] = [];
+				}
+				languagesByScriptGroup[scriptGroup].push( language );
+			}
+		}
+		return languagesByScriptGroup;
+	};
+	/**
+	 * Returns an associative array of languages in several regions,
+	 * grouped by script group.
+	 * @param array of strings - region codes
+	 * @return associative array
+	 */
+	$.uls.data.languagesByScriptGroupInRegions = function( regions ) {
+		var languagesByScriptGroupInRegions = {};
+
+		for ( var language in $.uls.data.languages ) {
+			for ( var i = 0; i < regions.length; i++ ) {
+				if ( $.inArray( regions[i], $.uls.data.regions( language ) ) !== -1 ) {
+					var scriptGroup = $.uls.data.scriptGroupOfLanguage( language );
+					if ( languagesByScriptGroupInRegions[scriptGroup] === undefined ) {
+						languagesByScriptGroupInRegions[scriptGroup] = [];
+					}
+					languagesByScriptGroupInRegions[scriptGroup].push( language );
+					break;
+				}
+			}
+		}
+
+		return languagesByScriptGroupInRegions;
+	};
+
+	/**
+	 * Returns an array of languages grouped by region group,
+	 * region, script group and script.
+	 * @return associative array
+	 */
+	$.uls.data.allLanguagesByRegionAndScript = function() {
+		var allLanguagesByRegionAndScript = {},
+			region,
+			regionGroup;
+
+		for ( region in $.uls.data.regiongroups ) {
+			regionGroup = $.uls.data.regiongroups[region];
+			if ( allLanguagesByRegionAndScript[regionGroup] === undefined ) {
+				allLanguagesByRegionAndScript[regionGroup] = {};
+			}
+			allLanguagesByRegionAndScript[regionGroup][region] = {};
+		}
+
+		for ( var language in $.uls.data.languages ) {
+			var script = $.uls.data.script( language );
+			var scriptGroup = $.uls.data.groupOfScript( script );
+			var regions = $.uls.data.regions( language );
+
+			for ( var regionNum = 0; regionNum < regions.length; regionNum++ ) {
+				region = regions[regionNum];
+				regionGroup = $.uls.data.regiongroups[region];
+
+				if ( allLanguagesByRegionAndScript[regionGroup][region][scriptGroup] === undefined ) {
+					allLanguagesByRegionAndScript[regionGroup][region][scriptGroup] = {};
+				}
+
+				if ( allLanguagesByRegionAndScript[regionGroup][region][scriptGroup][script] === undefined ) {
+					allLanguagesByRegionAndScript[regionGroup][region][scriptGroup][script] = [];
+				}
+
+				allLanguagesByRegionAndScript[regionGroup][region][scriptGroup][script].push( language );
+			}
+		}
+
+		return allLanguagesByRegionAndScript;
+	};
+
+	/**
+	 * Returns all regions in a region group.
+	 * @param number groupNum
+	 * @return array of strings
+	 */
+	$.uls.data.regionsInGroup = function( groupNum ) {
+		var regionsInGroup = [];
+
+		for ( var region in $.uls.data.regiongroups ) {
+			if ( $.uls.data.regiongroups[region] === groupNum ) {
+				regionsInGroup.push( region );
+			}
+		}
+
+		return regionsInGroup;
+	};
+
+	/**
+	 * Returns the script group of a script or 'Other' if it doesn't
+	 * belong to any group.
+	 * @param string script code
+	 * @return string script group name
+	 */
+	$.uls.data.groupOfScript = function( script ) {
+		for ( var group in $.uls.data.scriptgroups ) {
+			if ( $.inArray( script, $.uls.data.scriptgroups[group] ) !== -1 ) {
+				return group;
+			}
+		}
+
+		return 'Other';
+	};
+
+	/**
+	 * Returns the script group of a language.
+	 * @param string language code
+	 * @return string script group name
+	 */
+	$.uls.data.scriptGroupOfLanguage = function( language ) {
+		return $.uls.data.groupOfScript( $.uls.data.script( language ) );
+	};
+} )( jQuery );

lib/jquery.uls/src/jquery.uls.languagefilter.js

@@ -0,0 +1,338 @@
+/**
+ * jQuery language filter plugin.
+ *
+ * Copyright (C) 2012 Alolita Sharma, Amir Aharoni, Arun Ganesh, Brandon Harris,
+ * Niklas Laxström, Pau Giner, Santhosh Thottingal, Siebrand Mazeland and other
+ * contributors. See CREDITS for a list.
+ *
+ * UniversalLanguageSelector is dual licensed GPLv2 or later and MIT. You don't
+ * have to do anything special to choose one license or the other and you don't
+ * have to notify anyone which license you are using. You are free to use
+ * UniversalLanguageSelector in commercial projects as long as the copyright
+ * header is left intact. See files GPL-LICENSE and MIT-LICENSE for details.
+ *
+ * @file
+ * @ingroup Extensions
+ * @licence GNU General Public Licence 2.0 or later
+ * @licence MIT License
+ */
+
+/**
+ * Usage: $( 'inputbox' ).languagefilter();
+ * The values for autocompletion is from the options.languages.
+ * The data is in the format of languagecode:languagename.
+ */
+
+(function ( $ ) {
+	"use strict";
+
+	var LanguageFilter = function( element, options ) {
+		this.$element = $( element );
+		this.options = $.extend( {}, $.fn.regionselector.defaults, options );
+		this.$element.addClass( 'languagefilter' );
+		this.resultCount = 0;
+		this.$suggestion = $( '#' + this.$element.data( 'suggestion' ) );
+		this.$clear = $( '#'+ this.$element.data( 'clear' ) );
+		this.listen();
+	};
+
+	var delay = function() {
+		var timer = 0;
+		return ( function( callback, milliseconds ) {
+			clearTimeout( timer );
+			timer = setTimeout( callback, milliseconds );
+		} );
+	}();
+
+	LanguageFilter.prototype = {
+
+		listen: function() {
+			this.$element.on( 'keypress', $.proxy( this.keyup, this ) )
+				.on( 'keyup', $.proxy( this.keyup, this ) );
+			if ( $.browser.webkit || $.browser.msie ) {
+				this.$element.on( 'keydown', $.proxy( this.keyup, this ) );
+			}
+			if ( this.$clear.length ) {
+				this.$clear.on( 'click' , $.proxy( this.clear, this ) );
+			}
+			this.toggleClear();
+		},
+
+		keyup: function( e ) {
+			switch( e.keyCode ) {
+				case 9: // Tab -> Autocomplete
+					var suggestion = this.$suggestion.val();
+					if ( suggestion && suggestion !== this.$element.val() ) {
+						this.$element.val( suggestion );
+						e.preventDefault();
+						e.stopPropagation();
+					} else {
+					 	this.options.$target.focus();
+					}
+				default:
+					var that = this;
+					delay( function() {
+						that.options.$target.empty();
+						that.search();
+					}, 500 );
+					this.toggleClear();
+			}
+		},
+
+		clear: function() {
+			this.$element.val( '' );
+			this.$element.focus();
+			this.toggleClear();
+			this.search();
+		},
+
+		toggleClear: function() {
+			if ( !this.$clear.length ) return;
+			if ( this.$element.val() ) {
+				this.$clear.show();
+			} else {
+				this.$clear.hide();
+			}
+		},
+
+		search: function() {
+			var query = $.trim( this.$element.val() ),
+				languages = $.uls.data.languagesByScriptGroup( this.options.languages ),
+				scriptGroup, langNum, langCode;
+			this.resultCount = 0;
+			for ( scriptGroup in languages ) {
+				for ( langNum = 0; langNum < languages[scriptGroup].length; langNum++ ) {
+					langCode = languages[scriptGroup][langNum];
+					if ( query === "" || this.filter( langCode, query ) ) {
+						if ( this.resultCount === 0 ) {
+							// Autofill the first result.
+							this.autofill( langCode );
+						}
+						this.render( langCode );
+						this.resultCount++;
+					}
+				}
+			}
+			// Also do a search by search API
+			if( this.options.searchAPI && query ) {
+				this.searchAPI( query );
+			} else {
+				this.resultHandler( query );
+			}
+		},
+
+		searchAPI: function( query ) {
+			var that = this;
+			$.get( that.options.searchAPI, { search: query }, function( result ) {
+				$.each( result['languagesearch'], function( code, name ) {
+					that.render( code, name );
+					that.resultCount++;
+				} );
+				that.resultHandler( query );
+			} );
+		},
+
+		/**
+		 * Handler method to be called once search is over.
+		 * Based on search result call success or noresults callbacks
+		 * @param String query
+		 */
+		resultHandler: function( query ) {
+			if ( this.resultCount === 0 && this.options.noresults ) {
+				this.options.noresults.call( this, query );
+			} else if ( this.options.success ) {
+				this.options.success( this, query, this.resultCount );
+			}
+		},
+
+		autofill: function( langCode ) {
+			if ( !this.$suggestion.length ) {
+				return;
+			}
+			if ( !this.$element.val() ) {
+				this.$suggestion.val( '' );
+				return;
+			}
+			var autonym,
+				languageName = this.options.languages[langCode],
+				userInput = this.$element.val(),
+				suggestion = userInput + languageName.substring( userInput.length, languageName.length );
+			if ( suggestion !== languageName ) {
+				// see if it was autonym match
+				autonym = $.uls.data.autonym( langCode );
+				suggestion = userInput + autonym.substring( userInput.length, autonym.length );
+				if ( suggestion !== autonym ) {
+					// Give up. It may be iso/script code match.
+					suggestion = "";
+				}
+			}
+			this.$suggestion.val( suggestion );
+		},
+
+		render: function( langCode, languageName ) {
+			var $target = this.options.$target;
+			if ( !$target ) {
+				return;
+			}
+			$target.append( langCode, null, languageName );
+		},
+
+		escapeRegex: function( value ) {
+			// This is a prefix search.
+			return value.replace( /^[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&" );
+		},
+
+		/**
+		 * A search match happens if any of the following passes:
+		 * a) Language name in current user interface language
+		 * 'starts with' search string.
+		 * 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.
+		 */
+		filter: function( langCode, searchTerm ) {
+			// FIXME script is ISO 15924 code. We might need actual name of script.
+			var matcher = new RegExp( this.escapeRegex( searchTerm ), 'i' ),
+				languageName = this.options.languages[langCode];
+			return matcher.test( languageName ) ||
+				matcher.test( $.uls.data.autonym( langCode ) ) ||
+				matcher.test( langCode ) ||
+				matcher.test( $.uls.data.script( langCode ) );
+		}
+
+	};
+
+	$.fn.languagefilter = function( option ) {
+		return this.each( function() {
+			var $this = $( this ),
+				data = $this.data( 'languagefilter' ),
+				options = typeof option === 'object' && option;
+			if ( !data ) {
+				$this.data( 'languagefilter', ( data = new LanguageFilter( this, options ) ) );
+			}
+			if ( typeof option === 'string' ) {
+				data[option]();
+			}
+		} );
+	};
+
+	$.fn.languagefilter.defaults = {
+		$target: null, // Where to append the results
+		searchAPI: null,
+		languages: null, // Languages as code:name format.
+		noresults: null, // callback for no results found case
+		success: null // callback if any results found.
+	};
+
+	$.fn.languagefilter.Constructor = LanguageFilter;
+
+	/* RegionSelector plugin definition */
+
+	/**
+	 * 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 ) {
+		this.$element = $( element );
+		this.options = $.extend( {}, $.fn.regionselector.defaults, options );
+		this.$element.addClass( 'regionselector' );
+		this.regions = [];
+		this.regionGroup = this.$element.data( 'regiongroup' );
+		this.init();
+		this.listen();
+	};
+
+	RegionSelector.prototype = {
+		constructor: RegionSelector,
+
+		init: function() {
+			var region =  this.$element.data( 'region' );
+			this.regions = $.uls.data.regionsInGroup( this.regionGroup );
+			if ( region ) {
+				this.regions.push( region );
+			}
+		},
+
+		test: function( langCode ) {
+			var langRegions = $.uls.data.regions( langCode ),
+				region;
+			for ( var i = 0; i < this.regions.length; i++ ) {
+				region = this.regions[i];
+				if ( $.inArray( region, langRegions ) >= 0 ) {
+					this.render( langCode, region );
+					return;
+				}
+			}
+		},
+
+		show: function() {
+			var i, regions, language, languagesByScriptGroup, scriptGroup, languages;
+			// Make the selected region (and it only) active
+			$( '.regionselector' ).removeClass( 'active' );
+			if( this.regionGroup ) {
+				// if there is a region group, make it active.
+				this.$element.addClass( 'active' );
+			}
+			// Re-populate the list of languages
+			this.options.$target.empty();
+			languagesByScriptGroup = $.uls.data.languagesByScriptGroup( this.options.languages );
+			for ( scriptGroup in languagesByScriptGroup ) {
+				languages = languagesByScriptGroup[scriptGroup];
+				for ( i = 0; i < languages.length; i++) {
+					language = languages[i];
+					this.test( language );
+				}
+			}
+
+			if ( this.options.success ) {
+				this.options.success.call();
+			}
+		},
+
+		render: function( langCode, region ) {
+			var $target = this.options.$target;
+			if ( !$target ) {
+				return;
+			}
+			$target.append( langCode, region );
+		},
+
+		listen: function() {
+			this.$element.on( 'click', $.proxy( this.click, this ) );
+		},
+
+		click: function( e ) {
+			e.stopPropagation();
+			e.preventDefault();
+			this.show();
+		}
+	};
+
+	/* RegionSelector plugin definition */
+
+	$.fn.regionselector = function( option ) {
+		return this.each( function() {
+			var $this = $( this ),
+				data = $this.data( 'regionselector' ),
+				options = typeof option === 'object' && option;
+
+			if ( !data ) {
+				$this.data( 'regionselector', ( data = new RegionSelector( this, options ) ) );
+			}
+			if ( typeof option === 'string' ) {
+				data[option]();
+			}
+		} );
+	};
+
+	$.fn.regionselector.defaults = {
+		$target: null, // Where to render the results
+		success: null, // callback if any results found.
+		languages: null
+	};
+
+	$.fn.regionselector.Constructor = RegionSelector;
+
+} )( jQuery );

lib/jquery.uls/src/jquery.uls.lcd.js

@@ -0,0 +1,172 @@
+/**
+ * <explain briefly what this file is about>.
+ *
+ * Copyright (C) 2012 Alolita Sharma, Amir Aharoni, Arun Ganesh, Brandon Harris,
+ * Niklas Laxström, Pau Giner, Santhosh Thottingal, Siebrand Mazeland and other
+ * contributors. See CREDITS for a list.
+ *
+ * UniversalLanguageSelector is dual licensed GPLv2 or later and MIT. You don't
+ * have to do anything special to choose one license or the other and you don't
+ * have to notify anyone which license you are using. You are free to use
+ * UniversalLanguageSelector in commercial projects as long as the copyright
+ * header is left intact. See files GPL-LICENSE and MIT-LICENSE for details.
+ *
+ * @file
+ * @ingroup Extensions
+ * @licence GNU General Public Licence 2.0 or later
+ * @licence MIT License
+ */
+
+(function( $ ) {
+	"use strict";
+
+	var LanguageCategoryDisplay = function( element, options ) {
+		this.$element = $( element );
+		this.options = $.extend( {}, $.fn.lcd.defaults, options );
+		this.$element.addClass( 'lcd' );
+		this.show();
+		this.listen();
+	};
+
+	LanguageCategoryDisplay.prototype = {
+		constructor: LanguageCategoryDisplay,
+
+		append: function( langCode, regionCode, languageName ) {
+			var that = this;
+			this.addToRegion( langCode, regionCode, languageName );
+		},
+		/**
+		 * Check whether a language code is already displayed or not.
+		 * @param langCode
+		 * @return boolean
+		 */
+		exists: function( langCode ) {
+			return this.$element.find( 'li' ).filter(function() {
+					return $(this).data('code')  === langCode;
+				} ).length > 0;
+		},
+		/**
+		 * Add the language to a region.
+		 * If the region parameter is given , add to that region alone
+		 * Otherwise to all regions that this language belongs.
+		 * @param langCode
+		 * @param region Optional region
+		 * @param languageName Optional languageName
+		 */
+		addToRegion: function( langCode, region, languageName) {
+			var that = this;
+			if ( that.exists( langCode ) ) {
+				return;
+			}
+			var language = $.uls.data.languages[langCode],
+				langName = languageName
+					|| $.uls.data.autonym( langCode )
+					|| that.options.languages[langCode]
+					|| langCode,
+				regions = [];
+			if ( region ) {
+				regions.push( region );
+			} else {
+				regions = $.uls.data.regions( langCode );
+			}
+
+			for ( var i = 0; i < regions.length; i++ ) {
+				var regionCode = regions[i];
+
+				var $li = $( '<li>' )
+					.data( 'code', langCode )
+					.append(
+						$( '<a>' ).prop( 'href', '#' ).prop( 'title', language ).html( langName )
+					);
+
+				// Append the element to the column in the list
+				var column = that.getColumn( regionCode );
+				column.append( $li );
+
+				if ( that.options.clickhandler ) {
+					$li.click( function() {
+						that.options.clickhandler.call( this, langCode );
+					} );
+				}
+			}
+		},
+
+		getColumn: function( regionCode ) {
+			var $divRegionCode = $( 'div#' + regionCode );
+			var $rowDiv = $divRegionCode.find( 'div.row:last' );
+			var $ul = $divRegionCode.find( 'ul:last' );
+			// Each column can have maximum 10 languages.
+			if ( $ul.length === 0 || $ul.find( 'li' ).length >= 10 ) {
+				// Each row can have 4 columns with 10 languages.
+				$ul = $( '<ul>' ).addClass( 'three columns end' );
+				if ( $rowDiv.length === 0 || $rowDiv.find( 'ul' ).length >= 4 ) {
+					$rowDiv = $( '<div>' ).addClass( 'row uls-language-block' );
+					$divRegionCode.append( $rowDiv );
+					$ul.addClass('offset-by-one');
+				}
+				$rowDiv.append( $ul );
+			}
+			$divRegionCode.show();
+			return $ul;
+		},
+
+		show: function() {
+			var that = this;
+			$.each( $.uls.data.regiongroups, function( regionCode, regionIndex ) {
+				var $section = $( '<div>' ).addClass( 'twelve columns uls-lcd-region-section' ).prop( 'id', regionCode );
+				$section.append( $( '<h3>' ).addClass( 'eleven columns uls-lcd-region-section offset-by-one' ).html( regionCode ) );
+				// FIXME this is regioncode(NA, EU etc). Should be proper localized region name.
+				that.$element.append( $section );
+			} );
+		},
+
+		empty: function() {
+			this.$element.find( 'div.row' ).remove();
+			this.$element.find( 'div' ).hide();
+		},
+
+		listen: function() {
+			var that = this;
+			// The region section need to be in sync with the map filter.
+			that.$element.scroll( function () {
+				var inviewRegion = $( 'div.uls-lcd-region-section:first' ).attr( 'id' );
+				var listtop = that.$element.position().top;
+				$( 'div.uls-lcd-region-section' ).each( function () {
+					var offset = $( this ).position().top - listtop;
+					if ( offset < 0 ) {
+						inviewRegion = $( this ).attr( 'id' );
+					} else {
+						return false;
+					}
+				} );
+
+				var inview = $.uls.data.regiongroups[inviewRegion];
+				$( 'div.uls-region' ).removeClass( 'active' );
+				$( 'div#uls-region-' + inview ).addClass( 'active' );
+			} );
+		}
+
+	};
+
+	$.fn.lcd = function( option ) {
+		return this.each( function() {
+			var $this = $( this ),
+				data = $this.data( 'lcd' ),
+				options = typeof option === 'object' && option;
+
+			if ( !data ) {
+				$this.data( 'lcd', ( data = new LanguageCategoryDisplay( this, options ) ) );
+			}
+			if ( typeof option === 'string') {
+				data[option]();
+			}
+		} );
+	};
+
+	$.fn.lcd.defaults = {
+		languages: null
+	};
+
+	$.fn.lcd.Constructor = LanguageCategoryDisplay;
+
+} )( jQuery );