Back-end of new RecentChanges page, refactoring
[lhc/web/wiklou.git] / resources / src / mediawiki.rcfilters / dm / mw.rcfilters.dm.FiltersViewModel.js
index 13f7d31..3bb7716 100644 (file)
@@ -15,6 +15,7 @@
                this.groups = {};
                this.defaultParams = {};
                this.defaultFiltersEmpty = null;
+               this.highlightEnabled = false;
 
                // Events
                this.aggregate( { update: 'filterItemUpdate' } );
         * Filter item has changed
         */
 
+       /**
+        * @event highlightChange
+        * @param {boolean} Highlight feature is enabled
+        *
+        * Highlight feature has been toggled enabled or disabled
+        */
+
        /* Methods */
 
        /**
                                        // For example, see two groups with conflicts:
                                        // userExpLevel: [
                                        //   {
-                                       //      name: 'experienced',
-                                       //      conflicts: [ 'unregistered' ]
+                                       //     name: 'experienced',
+                                       //     conflicts: [ 'unregistered' ]
                                        //   }
                                        // ],
                                        // registration: [
                                        //   {
-                                       //      name: 'registered',
+                                       //     name: 'registered',
                                        //   },
                                        //   {
-                                       //      name: 'unregistered',
+                                       //     name: 'unregistered',
                                        //   }
                                        // ]
                                        // If we select 'experienced', then 'unregistered' is in conflict (and vice versa),
         * Set filters and preserve a group relationship based on
         * the definition given by an object
         *
-        * @param {Object} filters Filter group definition
+        * @param {Array} filters Filter group definition
         */
        mw.rcfilters.dm.FiltersViewModel.prototype.initializeFilters = function ( filters ) {
                var i, filterItem, selectedFilterNames,
                this.clearItems();
                this.groups = {};
 
-               $.each( filters, function ( group, data ) {
+               filters.forEach( function ( data ) {
+                       var group = data.name;
+
                        if ( !model.groups[ group ] ) {
                                model.groups[ group ] = new mw.rcfilters.dm.FilterGroup( group, {
                                        type: data.type,
-                                       title: data.title,
+                                       title: mw.msg( data.title ),
                                        separator: data.separator,
                                        fullCoverage: !!data.fullCoverage
                                } );
 
                        selectedFilterNames = [];
                        for ( i = 0; i < data.filters.length; i++ ) {
+                               data.filters[ i ].subset = data.filters[ i ].subset || [];
+                               data.filters[ i ].subset = data.filters[ i ].subset.map( function ( el ) {
+                                       return el.filter;
+                               } );
+
                                filterItem = new mw.rcfilters.dm.FilterItem( data.filters[ i ].name, model.groups[ group ], {
                                        group: group,
-                                       label: data.filters[ i ].label,
-                                       description: data.filters[ i ].description,
-                                       subset: data.filters[ i ].subset
+                                       label: mw.msg( data.filters[ i ].label ),
+                                       description: mw.msg( data.filters[ i ].description ),
+                                       subset: data.filters[ i ].subset,
+                                       cssClass: data.filters[ i ].cssClass
                                } );
 
                                // For convenience, we should store each filter's "supersets" -- these are
        mw.rcfilters.dm.FiltersViewModel.prototype.setFiltersToDefaults = function () {
                var defaultFilterStates = this.getFiltersFromParameters( this.getDefaultParams() );
 
-               this.updateFilters( defaultFilterStates );
+               this.toggleFiltersSelected( defaultFilterStates );
        };
 
        /**
                                        }
                                }
 
-                               if ( values.length === 0 || values.length === filterItems.length ) {
+                               if ( values.length === filterItems.length ) {
                                        result[ group ] = 'all';
                                } else {
                                        result[ group ] = values.join( model.getSeparator() );
                return result;
        };
 
+       /**
+        * Get the highlight parameters based on current filter configuration
+        *
+        * @return {object} Object where keys are "<filter name>_color" and values
+        *                  are the selected highlight colors.
+        */
+       mw.rcfilters.dm.FiltersViewModel.prototype.getHighlightParameters = function () {
+               var result = { highlight: Number( this.isHighlightEnabled() ) };
+
+               this.getItems().forEach( function ( filterItem ) {
+                       result[ filterItem.getName() + '_color' ] = filterItem.getHighlightColor();
+               } );
+               return result;
+       };
+
        /**
         * Sanitize value group of a string_option groups type
         * Remove duplicates and make sure to only use valid
         * @return {boolean} Current filters are all empty
         */
        mw.rcfilters.dm.FiltersViewModel.prototype.areCurrentFiltersEmpty = function () {
-               var currFilters = this.getSelectedState();
-
-               return Object.keys( currFilters ).every( function ( filterName ) {
-                       return !currFilters[ filterName ];
+               // Check if there are either any selected items or any items
+               // that have highlight enabled
+               return !this.getItems().some( function ( filterItem ) {
+                       return filterItem.isSelected() || filterItem.isHighlighted();
                } );
        };
 
         * This is equivalent to display all.
         */
        mw.rcfilters.dm.FiltersViewModel.prototype.emptyAllFilters = function () {
-               var filters = {};
-
                this.getItems().forEach( function ( filterItem ) {
-                       filters[ filterItem.getName() ] = false;
-               } );
+                       this.toggleFilterSelected( filterItem.getName(), false );
+               }.bind( this ) );
+       };
 
-               // Update filters
-               this.updateFilters( filters );
+       /**
+        * Toggle selected state of one item
+        *
+        * @param {string} name Name of the filter item
+        * @param {boolean} [isSelected] Filter selected state
+        */
+       mw.rcfilters.dm.FiltersViewModel.prototype.toggleFilterSelected = function ( name, isSelected ) {
+               this.getItemByName( name ).toggleSelected( isSelected );
        };
 
        /**
         *
         * @param {Object} filterDef Filter definitions
         */
-       mw.rcfilters.dm.FiltersViewModel.prototype.updateFilters = function ( filterDef ) {
-               var name, filterItem;
-
-               for ( name in filterDef ) {
-                       filterItem = this.getItemByName( name );
-                       filterItem.toggleSelected( filterDef[ name ] );
-               }
+       mw.rcfilters.dm.FiltersViewModel.prototype.toggleFiltersSelected = function ( filterDef ) {
+               Object.keys( filterDef ).forEach( function ( name ) {
+                       this.toggleFilterSelected( name, filterDef[ name ] );
+               }.bind( this ) );
        };
 
        /**
                return result;
        };
 
+       /**
+        * Get items that are highlighted
+        *
+        * @return {mw.rcfilters.dm.FilterItem[]} Highlighted items
+        */
+       mw.rcfilters.dm.FiltersViewModel.prototype.getHighlightedItems = function () {
+               return this.getItems().filter( function ( filterItem ) {
+                       return filterItem.isHighlightSupported() &&
+                               filterItem.getHighlightColor();
+               } );
+       };
+
+       /**
+        * Toggle the highlight feature on and off.
+        * Propagate the change to filter items.
+        *
+        * @param {boolean} enable Highlight should be enabled
+        * @fires highlightChange
+        */
+       mw.rcfilters.dm.FiltersViewModel.prototype.toggleHighlight = function ( enable ) {
+               enable = enable === undefined ? !this.highlightEnabled : enable;
+
+               if ( this.highlightEnabled !== enable ) {
+                       this.highlightEnabled = enable;
+
+                       this.getItems().forEach( function ( filterItem ) {
+                               filterItem.toggleHighlight( this.highlightEnabled );
+                       }.bind( this ) );
+
+                       this.emit( 'highlightChange', this.highlightEnabled );
+               }
+       };
+
+       /**
+        * Check if the highlight feature is enabled
+        * @return {boolean}
+        */
+       mw.rcfilters.dm.FiltersViewModel.prototype.isHighlightEnabled = function () {
+               return !!this.highlightEnabled;
+       };
+
+       /**
+        * Set highlight color for a specific filter item
+        *
+        * @param {string} filterName Name of the filter item
+        * @param {string} color Selected color
+        */
+       mw.rcfilters.dm.FiltersViewModel.prototype.setHighlightColor = function ( filterName, color ) {
+               this.getItemByName( filterName ).setHighlightColor( color );
+       };
+
+       /**
+        * Clear highlight for a specific filter item
+        *
+        * @param {string} filterName Name of the filter item
+        */
+       mw.rcfilters.dm.FiltersViewModel.prototype.clearHighlightColor = function ( filterName ) {
+               this.getItemByName( filterName ).clearHighlightColor();
+       };
+
+       /**
+        * Clear highlight for all filter items
+        */
+       mw.rcfilters.dm.FiltersViewModel.prototype.clearAllHighlightColors = function () {
+               this.getItems().forEach( function ( filterItem ) {
+                       filterItem.clearHighlightColor();
+               } );
+       };
 }( mediaWiki, jQuery ) );