3 * A widget representing a base toggle item
5 * @extends OO.ui.MenuOptionWidget
8 * @param {mw.rcfilters.Controller} controller RCFilters controller
9 * @param {mw.rcfilters.dm.ItemModel} invertModel
10 * @param {mw.rcfilters.dm.ItemModel} model Item model
11 * @param {Object} config Configuration object
13 mw
.rcfilters
.ui
.ItemMenuOptionWidget
= function MwRcfiltersUiItemMenuOptionWidget( controller
, invertModel
, model
, config
) {
17 .addClass( 'mw-rcfilters-ui-itemMenuOptionWidget-label' );
19 config
= config
|| {};
21 this.controller
= controller
;
22 this.invertModel
= invertModel
;
26 mw
.rcfilters
.ui
.ItemMenuOptionWidget
.parent
.call( this, $.extend( {
27 // Override the 'check' icon that OOUI defines
29 data
: this.model
.getName(),
30 label
: this.model
.getLabel()
33 this.checkboxWidget
= new mw
.rcfilters
.ui
.CheckboxInputWidget( {
34 value
: this.model
.getName(),
35 selected
: this.model
.isSelected()
40 .addClass( 'mw-rcfilters-ui-itemMenuOptionWidget-label-title' )
41 .append( this.$label
)
43 if ( this.model
.getDescription() ) {
46 .addClass( 'mw-rcfilters-ui-itemMenuOptionWidget-label-desc' )
47 .text( this.model
.getDescription() )
51 this.highlightButton
= new mw
.rcfilters
.ui
.FilterItemHighlightButton(
55 $overlay
: config
.$overlay
|| this.$element
,
56 title
: mw
.msg( 'rcfilters-highlightmenu-help' )
59 this.highlightButton
.toggle( this.model
.isHighlightEnabled() );
61 this.excludeLabel
= new OO
.ui
.LabelWidget( {
62 label
: mw
.msg( 'rcfilters-filter-excluded' )
64 this.excludeLabel
.toggle( this.model
.isSelected() && this.invertModel
.isSelected() );
66 layout
= new OO
.ui
.FieldLayout( this.checkboxWidget
, {
72 this.invertModel
.connect( this, { update
: 'onModelUpdate' } );
73 this.model
.connect( this, { update
: 'onModelUpdate' } );
74 // HACK: Prevent defaults on 'click' for the label so it
75 // doesn't steal the focus away from the input. This means
76 // we can continue arrow-movement after we click the label
77 // and is consistent with the checkbox *itself* also preventing
78 // defaults on 'click' as well.
79 layout
.$label
.on( 'click', false );
82 .addClass( 'mw-rcfilters-ui-itemMenuOptionWidget' )
83 .addClass( 'mw-rcfilters-ui-itemMenuOptionWidget-view-' + this.model
.getGroupModel().getView() )
86 .addClass( 'mw-rcfilters-ui-table' )
89 .addClass( 'mw-rcfilters-ui-row' )
92 .addClass( 'mw-rcfilters-ui-cell mw-rcfilters-ui-itemMenuOptionWidget-itemCheckbox' )
93 .append( layout
.$element
),
95 .addClass( 'mw-rcfilters-ui-cell mw-rcfilters-ui-itemMenuOptionWidget-excludeLabel' )
96 .append( this.excludeLabel
.$element
),
98 .addClass( 'mw-rcfilters-ui-cell mw-rcfilters-ui-itemMenuOptionWidget-highlightButton' )
99 .append( this.highlightButton
.$element
)
104 if ( this.model
.getIdentifiers() ) {
105 this.model
.getIdentifiers().forEach( function ( ident
) {
106 classes
.push( 'mw-rcfilters-ui-itemMenuOptionWidget-identifier-' + ident
);
109 this.$element
.addClass( classes
.join( ' ' ) );
115 OO
.inheritClass( mw
.rcfilters
.ui
.ItemMenuOptionWidget
, OO
.ui
.MenuOptionWidget
);
117 /* Static properties */
119 // We do our own scrolling to top
120 mw
.rcfilters
.ui
.ItemMenuOptionWidget
.static.scrollIntoViewOnSelect
= false;
125 * Respond to item model update event
127 mw
.rcfilters
.ui
.ItemMenuOptionWidget
.prototype.onModelUpdate = function () {
128 this.checkboxWidget
.setSelected( this.model
.isSelected() );
130 this.highlightButton
.toggle( this.model
.isHighlightEnabled() );
131 this.excludeLabel
.toggle( this.model
.isSelected() && this.invertModel
.isSelected() );
135 * Get the name of this filter
137 * @return {string} Filter name
139 mw
.rcfilters
.ui
.ItemMenuOptionWidget
.prototype.getName = function () {
140 return this.model
.getName();
143 mw
.rcfilters
.ui
.ItemMenuOptionWidget
.prototype.getModel = function () {