Help links for input settings

Bug: 42373
Change-Id: I30c8d6cbe916ac026ad70974755942c5bbea7162

resources/css/ext.uls.inputsettings.css

@@ -67,7 +67,7 @@ div.input-settings-block {
 	height: 14px;
 	position: absolute;
 	right: 0;
-	}
+}
 
 .uls-ime-menu-settings-item > a:hover {
 	background-color: #f0f0f0;
@@ -116,3 +116,7 @@ div.input-settings-block {
 	color: #0645AD;
 	cursor: pointer;
 }
+
+.uls-input-settings .uls-ime-help {
+	margin-left: 10px;
+}

resources/js/ext.uls.inputsettings.js

@@ -169,7 +169,7 @@
 		 * @return {Object} jQuery object corresponding to the input method item.
 		 */
 		renderInputmethodOption: function ( imeId, selected ) {
-			var $imeLabel, name, description, inputmethod, $inputMethodItem;
+			var $imeLabel, name, description, $helplink, inputmethod, $inputMethodItem;
 
 			if ( imeId !== 'system' && !$.ime.sources[imeId] ) {
 				// imeId not known for jquery.ime.
@@ -194,8 +194,14 @@
 			if ( imeId === 'system' ) {
 				name = $.i18n( 'ext-uls-disable-input-method' );
 				description = '';
+				$helplink = '';
 			} else {
 				inputmethod = $.ime.inputmethods[imeId];
+				$helplink = $( '<a>' )
+					.addClass( 'uls-ime-help' )
+					.text( $.i18n( 'ext-uls-ime-help' ) )
+					.attr( 'href', mw.msg( 'uls-ime-helppage' ).replace( '$1', imeId ) )
+					.attr( 'target', '_blank' );
 				if ( !inputmethod ) {
 					// The input method definition(rules) not loaded.
 					// We will show the name from $.ime.sources
@@ -209,7 +215,8 @@
 
 			$imeLabel.append(
 				$( '<strong>' ).text( name ),
-				$( '<span>' ).text( description )
+				$( '<span>' ).text( description ),
+				$helplink
 			);
 
 			return $imeLabel;