RCFilters UI: Select tag when filter item is selected

Retain the selection behavior from previous versions, and synchronize
the selection of the filter item in the menu with the tag items
in the MenuTagMultiselectWidget.

Bug: T163138
Change-Id: I548a1fca65372c697e24b77d928d56b18f4df1c5

diff --git a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterTagItemWidget.js b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterTagItemWidget.js
index cfffc65..f79e013 100644 (file)
--- a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterTagItemWidget.js
+++ b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterTagItemWidget.js
@@ -18,6 +18,7 @@
 
                this.controller = controller;
                this.model = model;
+               this.selected = false;
 
                mw.rcfilters.ui.FilterTagItemWidget.parent.call( this, $.extend( {
                        data: this.model.getName(),
@@ -161,6 +162,15 @@
                }
        };
 
+       /**
+        * Get the selected state of this widget
+        *
+        * @return {boolean} Tag is selected
+        */
+       mw.rcfilters.ui.FilterTagItemWidget.prototype.isSelected = function () {
+               return this.selected;
+       };
+
        /**
         * Get item name
         *

diff --git a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterTagMultiselectWidget.js b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterTagMultiselectWidget.js
index 8e26271..6fd3585 100644 (file)
--- a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterTagMultiselectWidget.js
+++ b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterTagMultiselectWidget.js
@@ -137,6 +137,7 @@
                } else {
                        // Clear selection
                        this.getMenu().selectItem( null );
+                       this.selectTag( null );
                }
        };
 
@@ -207,6 +208,9 @@
        mw.rcfilters.ui.FilterTagMultiselectWidget.prototype.onMenuChoose = function ( item ) {
                this.controller.toggleFilterSelect( item.model.getName() );
 
+               // Select the tag if it exists, or reset selection otherwise
+               this.selectTag( this.getItemFromData( item.model.getName() ) );
+
                this.focus();
        };
 
@@ -248,6 +252,7 @@
                mw.rcfilters.ui.FilterTagMultiselectWidget.parent.prototype.onTagSelect.call( this, tagItem );
 
                this.menu.selectItem( menuOption );
+               this.selectTag( tagItem );
 
                // Scroll to the item
                if ( oldInputValue ) {
@@ -264,6 +269,23 @@
                }
        };
 
+       /**
+        * Select a tag by reference. This is what OO.ui.SelectWidget is doing.
+        * If no items are given, reset selection from all.
+        *
+        * @param {mw.rcfilters.ui.FilterTagItemWidget} [item] Tag to select,
+        *  omit to deselect all
+        */
+       mw.rcfilters.ui.FilterTagMultiselectWidget.prototype.selectTag = function ( item ) {
+               var i, len, selected;
+
+               for ( i = 0, len = this.items.length; i < len; i++ ) {
+                       selected = this.items[ i ] === item;
+                       if ( this.items[ i ].isSelected() !== selected ) {
+                               this.items[ i ].toggleSelected( selected );
+                       }
+               }
+       };
        /**
         * @inheritdoc
         */