Merge "RCFilters: Init highlight button based on model state"

diff --git a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterItemHighlightButton.js b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterItemHighlightButton.js
index 7426123..c840d7c 100644 (file)
--- a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterItemHighlightButton.js
+++ b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterItemHighlightButton.js
@@ -33,13 +33,15 @@
                this.model = model;
 
                // Event
-               this.model.connect( this, { update: 'onModelUpdate' } );
+               this.model.connect( this, { update: 'updateUiBasedOnModel' } );
                this.colorPickerWidget.connect( this, { chooseColor: 'onChooseColor' } );
                // This lives inside a MenuOptionWidget, which intercepts mousedown
                // to select the item. We want to prevent that when we click the highlight
                // button
                this.$element.on( 'mousedown', function ( e ) { e.stopPropagation(); } );
 
+               this.updateUiBasedOnModel();
+
                this.$element
                        .addClass( 'mw-rcfilters-ui-filterItemHighlightButton' );
        };
@@ -60,7 +62,7 @@
        /**
         * Respond to item model update event
         */
-       mw.rcfilters.ui.FilterItemHighlightButton.prototype.onModelUpdate = function () {
+       mw.rcfilters.ui.FilterItemHighlightButton.prototype.updateUiBasedOnModel = function () {
                var currentColor = this.model.getHighlightColor(),
                        widget = this;
 

diff --git a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.HighlightColorPickerWidget.js b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.HighlightColorPickerWidget.js
index 570647e..ad3b304 100644 (file)
--- a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.HighlightColorPickerWidget.js
+++ b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.HighlightColorPickerWidget.js
@@ -24,7 +24,7 @@
                this.controller = controller;
                this.model = model;
 
-               this.currentSelection = '';
+               this.currentSelection = 'none';
                this.buttonSelect = new OO.ui.ButtonSelectWidget( {
                        items: colors.map( function ( color ) {
                                return new OO.ui.ButtonOptionWidget( {
@@ -39,12 +39,13 @@
                        } ),
                        classes: 'mw-rcfilters-ui-highlightColorPickerWidget-buttonSelect'
                } );
-               this.selectColor( 'none' );
 
                // Event
-               this.model.connect( this, { update: 'onModelUpdate' } );
+               this.model.connect( this, { update: 'updateUiBasedOnModel' } );
                this.buttonSelect.connect( this, { choose: 'onChooseColor' } );
 
+               this.updateUiBasedOnModel();
+
                this.$element
                        .addClass( 'mw-rcfilters-ui-highlightColorPickerWidget' )
                        .append(
@@ -73,7 +74,7 @@
        /**
         * Respond to item model update event
         */
-       mw.rcfilters.ui.HighlightColorPickerWidget.prototype.onModelUpdate = function () {
+       mw.rcfilters.ui.HighlightColorPickerWidget.prototype.updateUiBasedOnModel = function () {
                this.selectColor( this.model.getHighlightColor() || 'none' );
        };