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
This commit is contained in:
Moriel Schottlender 2015-01-29 11:56:52 -08:00
parent afeb20a469
commit d141e924f6

View file

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