From d141e924f6d086f6aed3609099a8087858b5b181 Mon Sep 17 00:00:00 2001
From: Moriel Schottlender <moriel@gmail.com>
Date: Thu, 29 Jan 2015 11:56:52 -0800
Subject: [PATCH] Use ActionFieldLayout for language and auto-choose new lang
 on add

Change the current hacky layout to the proper ActionFieldLayout,
and also make sure that when the user adds a language, the new
language is selected.

Change-Id: I737a1dcfc08bd47829661daf3c08e2e480670842
---
 .../ext.templateDataGenerator.ui.tdDialog.js  | 52 ++++++++++---------
 1 file changed, 28 insertions(+), 24 deletions(-)

diff --git a/modules/ext.templateDataGenerator.ui.tdDialog.js b/modules/ext.templateDataGenerator.ui.tdDialog.js
index 00e8363d..1f75e46f 100644
--- a/modules/ext.templateDataGenerator.ui.tdDialog.js
+++ b/modules/ext.templateDataGenerator.ui.tdDialog.js
@@ -60,8 +60,7 @@
 	 * @inheritDoc
 	 */
 	TemplateDataDialog.prototype.initialize = function () {
-		var templateParamsFieldset, languageFieldset,
-			addParamFieldlayout, languageFieldLayout,
+		var templateParamsFieldset, addParamFieldlayout, languageActionFieldLayout,
 			paramOrderFieldset;
 
 		// Parent method
@@ -115,15 +114,15 @@
 			$: this.$,
 			label: mw.msg( 'templatedata-modal-button-add-language' )
 		} );
-		languageFieldLayout = new OO.ui.FieldLayout( this.languageDropdownWidget, {
-			$: this.$,
-			align: 'left',
-			label: mw.msg( 'templatedata-modal-title-language' )
-		} );
-		languageFieldset = new OO.ui.FieldsetLayout( {
-			$: this.$,
-			items: [ languageFieldLayout, this.languagePanelButton ]
-		} );
+		languageActionFieldLayout = new OO.ui.ActionFieldLayout(
+			this.languageDropdownWidget,
+			this.languagePanelButton,
+			{
+				$: this.$,
+				align: 'left',
+				label: mw.msg( 'templatedata-modal-title-language' )
+			}
+		);
 
 		// ParamOrder
 		this.paramOrderWidget = new TemplateDataDragDropWidget( {
@@ -163,7 +162,7 @@
 			.addClass( 'tdg-templateDataDialog-listParamsPanel' )
 			.append(
 				this.paramListNoticeLabel.$element,
-				languageFieldset.$element,
+				languageActionFieldLayout.$element,
 				this.templateDescriptionFieldset.$element,
 				paramOrderFieldset.$element,
 				templateParamsFieldset.$element
@@ -326,19 +325,24 @@
 		var languageButton,
 			newLanguage = data.code;
 
-		if (
-			newLanguage &&
-			$.inArray( newLanguage, this.availableLanguages ) === -1
-		) {
-			// Add new language
-			this.availableLanguages.push( newLanguage );
-			languageButton = new OO.ui.OptionWidget( {
-				data: newLanguage,
-				$: this.$,
-				label: $.uls.data.getAutonym( newLanguage )
-			} );
-			this.languageDropdownWidget.getMenu().addItems( [ languageButton ] );
+		if ( newLanguage ) {
+			if ( $.inArray( newLanguage, this.availableLanguages ) === -1 ) {
+				// Add new language
+				this.availableLanguages.push( newLanguage );
+				languageButton = new OO.ui.OptionWidget( {
+					data: newLanguage,
+					$: this.$,
+					label: $.uls.data.getAutonym( newLanguage )
+				} );
+				this.languageDropdownWidget.getMenu().addItems( [ languageButton ] );
+			}
+
+			// Select the new item
+			this.languageDropdownWidget.getMenu().chooseItem(
+				this.languageDropdownWidget.getMenu().getItemFromData( newLanguage )
+			);
 		}
+
 		// Go to the main panel
 		this.switchPanels( 'listParams' );
 	};