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

   1 ( function ( mw ) {
   2         /**
   3          * A widget for the footer for the default view, allowing to switch views
   4          *
   5          * @extends OO.ui.Widget
   6          *
   7          * @constructor
   8          * @param {mw.rcfilters.Controller} controller Controller
   9          * @param {mw.rcfilters.dm.FiltersViewModel} model View model
  10          * @param {Object} [config] Configuration object
  11          */
  12         mw.rcfilters.ui.ViewSwitchWidget = function MwRcfiltersUiViewSwitchWidget( controller, model, config ) {
  13                 config = config || {};
  14
  15                 // Parent
  16                 mw.rcfilters.ui.ViewSwitchWidget.parent.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                 // Events
  37                 this.model.connect( this, { update: 'onModelUpdate' } );
  38                 this.buttons.aggregate( { click: 'buttonClick' } );
  39                 this.buttons.connect( this, { buttonClick: 'onButtonClick' } );
  40
  41                 this.$element
  42                         .addClass( 'mw-rcfilters-ui-viewSwitchWidget' )
  43                         .append(
  44                                 new OO.ui.LabelWidget( {
  45                                         label: mw.msg( 'rcfilters-advancedfilters' )
  46                                 } ).$element,
  47                                 $( '<div>' )
  48                                         .addClass( 'mw-rcfilters-ui-viewSwitchWidget-buttons' )
  49                                         .append( this.buttons.$element )
  50                         );
  51         };
  52
  53         /* Initialize */
  54
  55         OO.inheritClass( mw.rcfilters.ui.ViewSwitchWidget, OO.ui.Widget );
  56
  57         /**
  58          * Respond to model update event
  59          */
  60         mw.rcfilters.ui.ViewSwitchWidget.prototype.onModelUpdate = function () {
  61                 var currentView = this.model.getCurrentView();
  62
  63                 this.buttons.getItems().forEach( function ( buttonWidget ) {
  64                         buttonWidget.setActive( buttonWidget.getData() === currentView );
  65                 } );
  66         };
  67
  68         /**
  69          * Respond to button switch click
  70          *
  71          * @param {OO.ui.ButtonWidget} buttonWidget Clicked button
  72          */
  73         mw.rcfilters.ui.ViewSwitchWidget.prototype.onButtonClick = function ( buttonWidget ) {
  74                 this.controller.switchView( buttonWidget.getData() );
  75         };
  76 }( mediaWiki ) );