Merge "selenium: invoke jobs to enforce eventual consistency"
[lhc/web/wiklou.git] / resources / src / mediawiki.rcfilters / ui / mw.rcfilters.ui.HighlightColorPickerWidget.js
index ad3b304..a55246f 100644 (file)
@@ -1,4 +1,4 @@
-( function ( mw, $ ) {
+( function () {
        /**
         * A widget representing a filter item highlight color picker
         *
@@ -7,10 +7,9 @@
         *
         * @constructor
         * @param {mw.rcfilters.Controller} controller RCFilters controller
-        * @param {mw.rcfilters.dm.FilterItem} model Filter item model
         * @param {Object} [config] Configuration object
         */
-       mw.rcfilters.ui.HighlightColorPickerWidget = function MwRcfiltersUiHighlightColorPickerWidget( controller, model, config ) {
+       mw.rcfilters.ui.HighlightColorPickerWidget = function MwRcfiltersUiHighlightColorPickerWidget( controller, config ) {
                var colors = [ 'none' ].concat( mw.rcfilters.HighlightColors );
                config = config || {};
 
@@ -22,7 +21,6 @@
                } ) );
 
                this.controller = controller;
-               this.model = model;
 
                this.currentSelection = 'none';
                this.buttonSelect = new OO.ui.ButtonSelectWidget( {
                } );
 
                // Event
-               this.model.connect( this, { update: 'updateUiBasedOnModel' } );
                this.buttonSelect.connect( this, { choose: 'onChooseColor' } );
 
-               this.updateUiBasedOnModel();
-
                this.$element
                        .addClass( 'mw-rcfilters-ui-highlightColorPickerWidget' )
                        .append(
 
        /* Methods */
 
+       /**
+        * Bind the color picker to an item
+        * @param {mw.rcfilters.dm.FilterItem} filterItem
+        */
+       mw.rcfilters.ui.HighlightColorPickerWidget.prototype.setFilterItem = function ( filterItem ) {
+               if ( this.filterItem ) {
+                       this.filterItem.disconnect( this );
+               }
+
+               this.filterItem = filterItem;
+               this.filterItem.connect( this, { update: 'updateUiBasedOnModel' } );
+               this.updateUiBasedOnModel();
+       };
+
        /**
         * Respond to item model update event
         */
        mw.rcfilters.ui.HighlightColorPickerWidget.prototype.updateUiBasedOnModel = function () {
-               this.selectColor( this.model.getHighlightColor() || 'none' );
+               this.selectColor( this.filterItem.getHighlightColor() || 'none' );
        };
 
        /**
@@ -84,8 +93,8 @@
         * @param {string} color Selected color
         */
        mw.rcfilters.ui.HighlightColorPickerWidget.prototype.selectColor = function ( color ) {
-               var previousItem = this.buttonSelect.getItemFromData( this.currentSelection ),
-                       selectedItem = this.buttonSelect.getItemFromData( color );
+               var previousItem = this.buttonSelect.findItemFromData( this.currentSelection ),
+                       selectedItem = this.buttonSelect.findItemFromData( color );
 
                if ( this.currentSelection !== color ) {
                        this.currentSelection = color;
        mw.rcfilters.ui.HighlightColorPickerWidget.prototype.onChooseColor = function ( button ) {
                var color = button.data;
                if ( color === 'none' ) {
-                       this.controller.clearHighlightColor( this.model.getName() );
+                       this.controller.clearHighlightColor( this.filterItem.getName() );
                } else {
-                       this.controller.setHighlightColor( this.model.getName(), color );
+                       this.controller.setHighlightColor( this.filterItem.getName(), color );
                }
                this.emit( 'chooseColor', color );
        };
-}( mediaWiki, jQuery ) );
+}() );