' );
$container = $( '
' );
addMulti( $oldContainer, $container );
}
$fieldLabel.attr( 'class', 'mw-label' );
$fieldLabelText.text( $oldContainer.find( '.mw-label label' ).text() );
$fieldLabel.append( $fieldLabelText );
$container.prepend( $fieldLabel );
$oldContainer.replaceWith( $container );
return $container;
}
function convertCheckboxesWidgetToTags( fieldLayout ) {
var checkboxesWidget, checkboxesOptions, menuTagOptions, menuTagWidget;
checkboxesWidget = fieldLayout.fieldWidget;
checkboxesOptions = checkboxesWidget.checkboxMultiselectWidget.getItems();
menuTagOptions = checkboxesOptions.map( function ( option ) {
return new OO.ui.MenuOptionWidget( {
data: option.getData(),
label: option.getLabel()
} );
} );
menuTagWidget = new OO.ui.MenuTagMultiselectWidget( {
$overlay: true,
menu: {
items: menuTagOptions
}
} );
menuTagWidget.setValue( checkboxesWidget.getValue() );
// Data from CapsuleMultiselectWidget will not be submitted with the form, so keep the original
// CheckboxMultiselectInputWidget up-to-date.
menuTagWidget.on( 'change', function () {
checkboxesWidget.setValue( menuTagWidget.getValue() );
} );
// Hide original widget and add new one in its place. This is a bit hacky, since the FieldLayout
// still thinks it's connected to the old widget.
checkboxesWidget.toggle( false );
checkboxesWidget.$element.after( menuTagWidget.$element );
}
mw.hook( 'htmlform.enhance' ).add( function ( $root ) {
var $dropdowns = $root.find( '.mw-htmlform-field-HTMLMultiSelectField.mw-htmlform-dropdown' );
if ( $dropdowns.length ) {
$dropdowns.each( function () {
var $el = $( this ),
data, modules, extraModules;
if ( $el.is( '[data-ooui]' ) ) {
// Load 'oojs-ui-widgets' for CapsuleMultiselectWidget
modules = [ 'mediawiki.htmlform.ooui', 'oojs-ui-widgets' ];
data = $el.data( 'mw-modules' );
if ( data ) {
// We can trust this value, 'data-mw-*' attributes are banned from user content in Sanitizer
extraModules = data.split( ',' );
modules.push.apply( modules, extraModules );
}
mw.loader.using( modules, function () {
convertCheckboxesWidgetToTags( OO.ui.FieldLayout.static.infuse( $el ) );
} );
} else {
mw.loader.using( 'jquery.chosen', function () {
var type = $el.is( 'tr' ) ? 'tr' : 'div',
$converted = convertCheckboxesToMulti( $el, type );
$converted.find( '.htmlform-chzn-select' ).chosen( { width: 'auto' } );
} );
}
} );
}
} );
}( mediaWiki, jQuery ) );