Position the language settings

* Expose two options: left and top
* Make the init script pass that.
* Introduce position method in jquery.uls

Change-Id: I21f4d956f1ed2c56528731ab09ecc6a89834f796

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

@@ -50,14 +50,23 @@
 		},
 
 		/**
-		 * Show the ULS window
+		 * Calculate the position of ULS
+		 * Returns an object with top and left properties.
+		 * @returns {Object}
 		 */
-		show: function() {
+		position: function() {
 			var pos = $.extend( {}, this.$element.offset(), {
 				height: this.$element[0].offsetHeight
 			} );
+			return {
+				top:  pos.top + pos.height,
+				left: '25%'
+			};
+		},
+		show: function() {
+			var pos = this.position();
 			this.$menu.css( {
-				top: pos.top + pos.height,
+				top: pos.top,
 				left: '25%'
 			} );
 

resources/js/ext.uls.init.js

@@ -59,7 +59,11 @@
 				var $displaySettings = displaySettings();
 				var that = this;
 				this.$menu.find( "div#settings-block" ).append( $displaySettings );
-				$displaySettings.languagesettings();
+				var position = this.position();
+				$displaySettings.languagesettings( {
+					top: position.top,
+					left: position.left
+				} );
 				$displaySettings.on( 'click', function() {
 					that.hide();
 				} );

resources/js/ext.uls.languagesettings.js

@@ -117,11 +117,13 @@
 				var pos = $.extend( {}, this.$element.offset(), {
 					height: this.$element[0].offsetHeight
 				} );
+				var top = this.options.top || pos.top + pos.height;
+				var left = this.options.left || '25%';
 				// FIXME this is not exactly correct. position may not
 				// be relative to the trigger.
 				this.$window.css( {
-					top: pos.top + pos.height,
-					left: '25%'
+					top: top,
+					left: left
 				} );
 			}
 
@@ -165,7 +167,9 @@
 		settings: {},
 		template: windowTemplate,
 		modules: {},
-		defaultModule: false
+		defaultModule: false,
+		top: null,
+		left: null
 	};
 
 	$.fn.languagesettings.Constructor = LanguageSettings;