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

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