resources/src/mediawiki.rcfilters/ui/ViewSwitchWidget.js

   1 /**
   2  * A widget for the footer for the default view, allowing to switch views.
   3  *
   4  * @class mw.rcfilters.ui.ViewSwitchWidget
   5  * @ignore
   6  * @extends OO.ui.Widget
   7  *
   8  * @param {mw.rcfilters.Controller} controller Controller
   9  * @param {mw.rcfilters.dm.FiltersViewModel} model View model
  10  * @param {Object} [config] Configuration object
  11  */
  12 const ViewSwitchWidget = function MwRcfiltersUiViewSwitchWidget( controller, model, config ) {
  13         config = config || {};
  14
  15         // Parent
  16         ViewSwitchWidget.super.call( this, config );
  17
  18         this.controller = controller;
  19         this.model = model;
  20
  21         this.buttons = new OO.ui.ButtonGroupWidget( {
  22                 items: [
  23                         new OO.ui.ButtonWidget( {
  24                                 data: 'namespaces',
  25                                 icon: 'article',
  26                                 label: mw.msg( 'namespaces' )
  27                         } ),
  28                         new OO.ui.ButtonWidget( {
  29                                 data: 'tags',
  30                                 icon: 'tag',
  31                                 label: mw.msg( 'rcfilters-view-tags' )
  32                         } )
  33                 ]
  34         } );
  35
  36         this.buttons.aggregate( { click: 'buttonClick' } );
  37
  38         // Events
  39         this.model.connect( this, { update: 'onModelUpdate' } );
  40         this.buttons.connect( this, { buttonClick: 'onButtonClick' } );
  41
  42         this.$element
  43                 .addClass( 'mw-rcfilters-ui-viewSwitchWidget' )
  44                 .append(
  45                         new OO.ui.LabelWidget( {
  46                                 label: mw.msg( 'rcfilters-advancedfilters' )
  47                         } ).$element,
  48                         $( '<div>' )
  49                                 .addClass( 'mw-rcfilters-ui-viewSwitchWidget-buttons' )
  50                                 .append( this.buttons.$element )
  51                 );
  52 };
  53
  54 /* Initialize */
  55
  56 OO.inheritClass( ViewSwitchWidget, OO.ui.Widget );
  57
  58 /**
  59  * Respond to model update event
  60  */
  61 ViewSwitchWidget.prototype.onModelUpdate = function () {
  62         const currentView = this.model.getCurrentView();
  63
  64         this.buttons.getItems().forEach( ( buttonWidget ) => {
  65                 buttonWidget.setActive( buttonWidget.getData() === currentView );
  66         } );
  67 };
  68
  69 /**
  70  * Respond to button switch click
  71  *
  72  * @param {OO.ui.ButtonWidget} buttonWidget Clicked button
  73  */
  74 ViewSwitchWidget.prototype.onButtonClick = function ( buttonWidget ) {
  75         this.controller.switchView( buttonWidget.getData() );
  76 };
  77
  78 module.exports = ViewSwitchWidget;