resources/src/mediawiki.widgets/mw.widgets.NamespacesMultiselectWidget.js

   1 /*!
   2  * MediaWiki Widgets - NamespacesMultiselectWidget class.
   3  *
   4  * @copyright 2011-2015 MediaWiki Widgets Team and others; see AUTHORS.txt
   5  * @license The MIT License (MIT); see LICENSE.txt
   6  */
   7 ( function () {
   8
   9         /**
  10          * Creates an mw.widgets.NamespacesMultiselectWidget object
  11          *
  12          * TODO: A lot of this is duplicated in mw.widgets.UsersMultiselectWidget
  13          * and mw.widgets.TitlesMultiselectWidget. These classes should be
  14          * refactored.
  15          *
  16          * @class
  17          * @extends OO.ui.MenuTagMultiselectWidget
  18          *
  19          * @constructor
  20          * @param {Object} [config] Configuration options
  21          */
  22         mw.widgets.NamespacesMultiselectWidget = function MwWidgetsNamespacesMultiselectWidget( config ) {
  23                 var i, ilen, option,
  24                         namespaces = {},
  25                         options = mw.widgets.NamespaceInputWidget.static.getNamespaceDropdownOptions( {} );
  26
  27                 for ( i = 0, ilen = options.length; i < ilen; i++ ) {
  28                         option = options[ i ];
  29                         namespaces[ option.data ] = option.label;
  30                 }
  31
  32                 config = $.extend( true, {
  33                         options: mw.widgets.NamespaceInputWidget.static.getNamespaceDropdownOptions( {} )
  34                 }, config );
  35
  36                 // Parent constructor
  37                 mw.widgets.NamespacesMultiselectWidget.parent.call( this, $.extend( true,
  38                         {
  39                                 clearInputOnChoose: true,
  40                                 inputPosition: 'inline',
  41                                 allowEditTags: false,
  42                                 menu: {
  43                                         filterMode: 'substring'
  44                                 }
  45                         },
  46                         config,
  47                         {
  48                                 selected: config && config.selected ? config.selected.map( function ( id ) {
  49                                         return {
  50                                                 data: id,
  51                                                 label: namespaces[ id ]
  52                                         };
  53                                 } ) : undefined
  54                         }
  55                 ) );
  56
  57                 // Initialization
  58                 this.$element
  59                         .addClass( 'mw-widgets-namespacesMultiselectWidget' );
  60
  61                 if ( 'name' in config ) {
  62                         // Use this instead of <input type="hidden">, because hidden inputs do not have separate
  63                         // 'value' and 'defaultValue' properties. The script on Special:Preferences
  64                         // (mw.special.preferences.confirmClose) checks this property to see if a field was changed.
  65                         this.hiddenInput = $( '<textarea>' )
  66                                 .addClass( 'oo-ui-element-hidden' )
  67                                 .attr( 'name', config.name )
  68                                 .appendTo( this.$element );
  69                         // Update with preset values
  70                         // Set the default value (it might be different from just being empty)
  71                         this.hiddenInput.prop( 'defaultValue', this.getItems().map( function ( item ) {
  72                                 return item.getData();
  73                         } ).join( '\n' ) );
  74                         this.on( 'change', function ( items ) {
  75                                 this.hiddenInput.val( items.map( function ( item ) {
  76                                         return item.getData();
  77                                 } ).join( '\n' ) );
  78                                 // Trigger a 'change' event as if a user edited the text
  79                                 // (it is not triggered when changing the value from JS code).
  80                                 this.hiddenInput.trigger( 'change' );
  81                         }.bind( this ) );
  82                 }
  83         };
  84
  85         /* Setup */
  86
  87         OO.inheritClass( mw.widgets.NamespacesMultiselectWidget, OO.ui.MenuTagMultiselectWidget );
  88         OO.mixinClass( mw.widgets.NamespacesMultiselectWidget, OO.ui.mixin.PendingElement );
  89
  90         /* Methods */
  91
  92         /**
  93          * @inheritdoc
  94          */
  95         mw.widgets.NamespacesMultiselectWidget.prototype.createMenuOptionWidget = function ( data, label, icon ) {
  96                 return new mw.widgets.NamespacesMenuOptionWidget( {
  97                         data: data,
  98                         label: label || data,
  99                         icon: icon
 100                 } );
 101         };
 102
 103 }() );