Page MenuHomeWickedGov Phorge

ValuePickerWidget.js
No OneTemporary

Size
2 KB
Referenced Files
None
Subscribers
None

ValuePickerWidget.js

/**
* Widget defining the behavior used to choose from a set of values
* in a single_value group.
*
* @class mw.rcfilters.ui.ValuePickerWidget
* @ignore
* @extends OO.ui.Widget
* @mixes OO.ui.mixin.LabelElement
*
* @param {mw.rcfilters.dm.FilterGroup} model Group model
* @param {Object} [config] Configuration object
* @param {Function} [config.itemFilter] A filter function for the items from the
* model. If not given, all items will be included. The function must
* handle item models and return a boolean whether the item is included
* or not. Example: function ( itemModel ) { return itemModel.isSelected(); }
*/
const ValuePickerWidget = function MwRcfiltersUiValuePickerWidget( model, config ) {
config = config || {};
// Parent
ValuePickerWidget.super.call( this, config );
// Mixin constructors
OO.ui.mixin.LabelElement.call( this, config );
this.model = model;
this.itemFilter = config.itemFilter || function () {
return true;
};
// Build the selection from the item models
this.selectWidget = new OO.ui.ButtonSelectWidget();
this.initializeSelectWidget();
// Events
this.model.connect( this, { update: 'onModelUpdate' } );
this.selectWidget.connect( this, { choose: 'onSelectWidgetChoose' } );
// Initialize
this.$element
.addClass( 'mw-rcfilters-ui-valuePickerWidget' )
.append(
this.$label
.addClass( 'mw-rcfilters-ui-valuePickerWidget-title' ),
this.selectWidget.$element
);
};
/* Initialization */
OO.inheritClass( ValuePickerWidget, OO.ui.Widget );
OO.mixinClass( ValuePickerWidget, OO.ui.mixin.LabelElement );
/* Events */
/**
* An item has been chosen.
*
* @event choose
* @param {string} name Item name
* @ignore
*/
/* Methods */
/**
* Respond to model update event
*/
ValuePickerWidget.prototype.onModelUpdate = function () {
this.selectCurrentModelItem();
};
/**
* Respond to select widget choose event
*
* @param {OO.ui.ButtonOptionWidget} chosenItem Chosen item
* @fires choose
*/
ValuePickerWidget.prototype.onSelectWidgetChoose = function ( chosenItem ) {
this.emit( 'choose', chosenItem.getData() );
};
/**
* Initialize the select widget
*/
ValuePickerWidget.prototype.initializeSelectWidget = function () {
const items = this.model.getItems()
.filter( this.itemFilter )
.map( ( filterItem ) => new OO.ui.ButtonOptionWidget( {
data: filterItem.getName(),
label: filterItem.getLabel()
} ) );
this.selectWidget.clearItems();
this.selectWidget.addItems( items );
this.selectCurrentModelItem();
};
/**
* Select the current item that corresponds with the model item
* that is currently selected
*/
ValuePickerWidget.prototype.selectCurrentModelItem = function () {
const selectedItem = this.model.findSelectedItems()[ 0 ];
if ( selectedItem ) {
this.selectWidget.selectItemByData( selectedItem.getName() );
}
};
module.exports = ValuePickerWidget;

File Metadata

Mime Type
text/plain
Expires
Tue, Aug 18, 23:04 (1 d, 8 h)
Storage Engine
local-disk
Storage Format
Raw Data
Storage Handle
74/11/7f56172b5d179e7bcc7de2f7abde
Default Alt Text
ValuePickerWidget.js (2 KB)

Event Timeline