resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterWrapperWidget.js

   1 ( function ( mw ) {
   2         /**
   3          * List displaying all filter groups
   4          *
   5          * @extends OO.ui.Widget
   6          * @mixins OO.ui.mixin.PendingElement
   7          *
   8          * @constructor
   9          * @param {mw.rcfilters.Controller} controller Controller
  10          * @param {mw.rcfilters.dm.FiltersViewModel} model View model
  11          * @param {mw.rcfilters.dm.SavedQueriesModel} savedQueriesModel Saved queries model
  12          * @param {Object} [config] Configuration object
  13          * @cfg {Object} [filters] A definition of the filter groups in this list
  14          * @cfg {jQuery} [$overlay] A jQuery object serving as overlay for popups
  15          */
  16         mw.rcfilters.ui.FilterWrapperWidget = function MwRcfiltersUiFilterWrapperWidget( controller, model, savedQueriesModel, config ) {
  17                 config = config || {};
  18
  19                 // Parent
  20                 mw.rcfilters.ui.FilterWrapperWidget.parent.call( this, config );
  21                 // Mixin constructors
  22                 OO.ui.mixin.PendingElement.call( this, config );
  23
  24                 this.controller = controller;
  25                 this.model = model;
  26                 this.queriesModel = savedQueriesModel;
  27                 this.$overlay = config.$overlay || this.$element;
  28
  29                 this.filterTagWidget = new mw.rcfilters.ui.FilterTagMultiselectWidget(
  30                         this.controller,
  31                         this.model,
  32                         this.queriesModel,
  33                         { $overlay: this.$overlay }
  34                 );
  35
  36                 this.viewToggle = new OO.ui.ButtonSelectWidget( {
  37                         classes: [ 'mw-rcfilters-ui-filterWrapperWidget-viewToggleButtons' ],
  38                         items: [
  39                                 new OO.ui.ButtonOptionWidget( {
  40                                         data: 'namespaces',
  41                                         label: mw.msg( 'namespaces' ),
  42                                         icon: 'article',
  43                                         classes: [ 'mw-rcfilters-ui-filterWrapperWidget-viewToggleButtons-namespaces' ]
  44                                 } ),
  45                                 new OO.ui.ButtonOptionWidget( {
  46                                         data: 'tags',
  47                                         label: mw.msg( 'rcfilters-view-tags' ),
  48                                         icon: 'tag',
  49                                         classes: [ 'mw-rcfilters-ui-filterWrapperWidget-viewToggleButtons-tags' ]
  50                                 } )
  51                         ]
  52                 } );
  53
  54                 // Events
  55                 this.model.connect( this, { update: 'onModelUpdate' } );
  56                 this.viewToggle.connect( this, { select: 'onViewToggleSelect' } );
  57
  58                 // Initialize
  59                 this.$element
  60                         .addClass( 'mw-rcfilters-ui-filterWrapperWidget' );
  61
  62                 if ( mw.config.get( 'wgStructuredChangeFiltersEnableSaving' ) ) {
  63                         this.savedLinksListWidget = new mw.rcfilters.ui.SavedLinksListWidget(
  64                                 this.controller,
  65                                 this.queriesModel,
  66                                 { $overlay: this.$overlay }
  67                         );
  68
  69                         this.$element.append(
  70                                 this.savedLinksListWidget.$element
  71                         );
  72
  73                 }
  74
  75                 this.$element.append(
  76                         this.filterTagWidget.$element,
  77                         this.viewToggle.$element
  78                 );
  79                 this.viewToggle.toggle( !!mw.config.get( 'wgStructuredChangeFiltersEnableExperimentalViews' ) );
  80         };
  81
  82         /* Initialization */
  83
  84         OO.inheritClass( mw.rcfilters.ui.FilterWrapperWidget, OO.ui.Widget );
  85         OO.mixinClass( mw.rcfilters.ui.FilterWrapperWidget, OO.ui.mixin.PendingElement );
  86
  87         /* Methods */
  88
  89         /**
  90          * Respond to model update event
  91          */
  92         mw.rcfilters.ui.FilterWrapperWidget.prototype.onModelUpdate = function () {
  93                 // Synchronize the state of the toggle buttons with the current view
  94                 this.viewToggle.selectItemByData( this.model.getCurrentView() );
  95         };
  96
  97         /**
  98          * Respond to namespace toggle button click
  99          *
 100          * @param {OO.ui.ButtonWidget} buttonWidget The button that was clicked
 101          */
 102         mw.rcfilters.ui.FilterWrapperWidget.prototype.onViewToggleSelect = function ( buttonWidget ) {
 103                 if ( buttonWidget ) {
 104                         this.controller.switchView( buttonWidget.getData() );
 105                         this.filterTagWidget.focus();
 106                 }
 107         };
 108
 109 }( mediaWiki ) );