Mobile - reorganise and clean up p-personal js dropdown

* Reorder ULS and Echo links
* Rename conditional module load hook to be more generic, and add
  ULS module
* Remove .active bolding from dropdown

Change-Id: I7e746e7c5af8ffd7c4ca06742ab1fe6bc94ba531

includes/SkinMonoBook.php

@@ -57,6 +57,10 @@ class SkinMonoBook extends SkinTemplate {
 		if ( ExtensionRegistry::getInstance()->isLoaded( 'Echo' ) && $out->getUser()->isLoggedIn() ) {
 			$out->addModules( [ 'skins.monobook.mobile.echohack' ] );
 		}
+		if ( ExtensionRegistry::getInstance()->isLoaded( 'UniversalLanguageSelector' ) ) {
+			$out->addModules( [ 'skins.monobook.mobile.uls' ] );
+		}
+
 		// TODO: Migrate all of these (get RL support for conditional IE)
 		// Force desktop styles in IE 8-; no support for @media widths
 		$out->addStyle( $this->stylename . '/resources/screen-desktop.css', 'screen', 'lt IE 9' );
@@ -67,11 +71,11 @@ class SkinMonoBook extends SkinTemplate {
 
 	/**
 	 * Handler for ResourceLoaderRegisterModules hook
+	 * Check if extensions are loaded
 	 *
 	 * @param ResourceLoader $resourceLoader
 	 */
-	static function registerEchoHack( ResourceLoader $resourceLoader ) {
+	static function registerMobileExtensionStyles( ResourceLoader $resourceLoader ) {
-		// Check if echo is loaded, and if so duplicate echo load check for hacks
 		if ( ExtensionRegistry::getInstance()->isLoaded( 'Echo' ) ) {
 			$resourceLoader->register( 'skins.monobook.mobile.echohack', [
 				'localBasePath' => __DIR__ . '/..',
@@ -86,5 +90,16 @@ class SkinMonoBook extends SkinTemplate {
 				'messages' => [ 'monobook-notifications-link', 'monobook-notifications-link-none' ]
 			] );
 		}
+
+		if ( ExtensionRegistry::getInstance()->isLoaded( 'UniversalLanguageSelector' ) ) {
+			$resourceLoader->register( 'skins.monobook.mobile.uls', [
+				'localBasePath' => __DIR__ . '/..',
+				'remoteSkinPath' => 'MonoBook/resources',
+
+				'targets' => [ 'desktop', 'mobile' ],
+				'scripts' => [ 'resources/mobile-uls.js' ],
+				'dependencies' => [ 'ext.uls.interface' ],
+			] );
+		}
 	}
 }

resources/mobile-echo.js

@@ -39,8 +39,9 @@
 						'pt-notifications',
 						$( '#pt-notifications-notice' ).attr( 'tooltip' ),
 						null,
-						'#pt-userpage'
+						'#pt-preferences'
 					);
+
 					$( '#p-personal-toggle' ).append( $( '<ul>' ).attr( 'id', 'echo-hack-badges' ) );
 
 					echoHacked = true;

resources/mobile-uls.js

@@ -0,0 +1,22 @@
+$( function () {
+	var mobileCutoffWidth = 850,
+		ULSTrigger = $( '#pt-uls' ),
+		ULSMoved = false;
+
+	function moveULS() {
+		if ( ULSTrigger.length ) {
+			if ( !ULSMoved && $( window ).width() <= mobileCutoffWidth ) {
+				ULSTrigger.insertBefore( $( '#pt-preferences' ) );
+
+				ULSMoved = true;
+			} else if ( ULSMoved && $( window ).width() > mobileCutoffWidth ) {
+				ULSTrigger.prepend( $( '#p-preferences' ) );
+
+				ULSMoved = false;
+			}
+		}
+	}
+
+	$( window ).resize( moveULS );
+	moveULS();
+} );

resources/screen-common.less

@@ -209,10 +209,6 @@ table.rimage {
 /*
 ** the personal toolbar
 */
-#p-personal li.active {
-	font-weight: bold;
-}
-
 /* "Not logged in" text in gray */
 li#pt-anonuserpage {
 	color: @text-grey;

skin.json

@@ -20,7 +20,7 @@
 		"monobook": "Apex"
 	},
 	"Hooks": {
-		"ResourceLoaderRegisterModules": "SkinMonoBook::registerEchoHack"
+		"ResourceLoaderRegisterModules": "SkinMonoBook::registerMobileExtensionStyles"
 	},
 	"MessagesDirs": {
 		"MonoBook": [