3 * A button to configure highlight for a filter item
5 * @extends OO.ui.PopupButtonWidget
8 * @param {mw.rcfilters.Controller} controller RCFilters controller
9 * @param {mw.rcfilters.dm.FilterItem} model Filter item model
10 * @param {Object} [config] Configuration object
12 mw
.rcfilters
.ui
.FilterItemHighlightButton
= function MwRcfiltersUiFilterItemHighlightButton( controller
, model
, config
) {
13 config
= config
|| {};
15 this.colorPickerWidget
= new mw
.rcfilters
.ui
.HighlightColorPickerWidget( controller
, model
);
18 mw
.rcfilters
.ui
.FilterItemHighlightButton
.parent
.call( this, $.extend( {}, config
, {
25 horizontalPosition
: 'end',
26 $floatableContainer
: this.$element
,
28 $content
: this.colorPickerWidget
.$element
32 this.controller
= controller
;
36 this.model
.connect( this, { update
: 'onModelUpdate' } );
37 this.colorPickerWidget
.connect( this, { chooseColor
: 'onChooseColor' } );
40 .addClass( 'mw-rcfilters-ui-filterItemHighlightButton' );
45 OO
.inheritClass( mw
.rcfilters
.ui
.FilterItemHighlightButton
, OO
.ui
.PopupButtonWidget
);
50 * Respond to item model update event
52 mw
.rcfilters
.ui
.FilterItemHighlightButton
.prototype.onModelUpdate = function () {
53 var currentColor
= this.model
.getHighlightColor(),
56 this.$icon
.toggleClass(
57 'mw-rcfilters-ui-filterItemHighlightButton-circle',
61 mw
.rcfilters
.HighlightColors
.forEach( function ( c
) {
64 'mw-rcfilters-ui-filterItemHighlightButton-circle-color-' + c
,
70 mw
.rcfilters
.ui
.FilterItemHighlightButton
.prototype.onChooseColor = function () {
71 this.popup
.toggle( false );
73 }( mediaWiki
, jQuery
) );