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

   1 ( function () {
   2         /**
   3          * Widget to select to view changes that link TO or FROM the target page
   4          * on Special:RecentChangesLinked (AKA Related Changes)
   5          *
   6          * @extends OO.ui.DropdownWidget
   7          *
   8          * @constructor
   9          * @param {mw.rcfilters.Controller} controller
  10          * @param {mw.rcfilters.dm.FilterItem} showLinkedToModel model this widget is bound to
  11          * @param {Object} [config] Configuration object
  12          */
  13         mw.rcfilters.ui.RclToOrFromWidget = function MwRcfiltersUiRclToOrFromWidget(
  14                 controller, showLinkedToModel, config
  15         ) {
  16                 config = config || {};
  17
  18                 this.showLinkedFrom = new OO.ui.MenuOptionWidget( {
  19                         data: 'from', // default (showlinkedto=0)
  20                         label: new OO.ui.HtmlSnippet( mw.msg( 'rcfilters-filter-showlinkedfrom-option-label' ) )
  21                 } );
  22                 this.showLinkedTo = new OO.ui.MenuOptionWidget( {
  23                         data: 'to', // showlinkedto=1
  24                         label: new OO.ui.HtmlSnippet( mw.msg( 'rcfilters-filter-showlinkedto-option-label' ) )
  25                 } );
  26
  27                 // Parent
  28                 mw.rcfilters.ui.RclToOrFromWidget.parent.call( this, $.extend( {
  29                         classes: [ 'mw-rcfilters-ui-rclToOrFromWidget' ],
  30                         menu: { items: [ this.showLinkedFrom, this.showLinkedTo ] }
  31                 }, config ) );
  32
  33                 this.controller = controller;
  34                 this.model = showLinkedToModel;
  35
  36                 this.getMenu().connect( this, { choose: 'onUserChooseItem' } );
  37                 this.model.connect( this, { update: 'onModelUpdate' } );
  38
  39                 // force an initial update of the component based on the state
  40                 this.onModelUpdate();
  41         };
  42
  43         /* Initialization */
  44
  45         OO.inheritClass( mw.rcfilters.ui.RclToOrFromWidget, OO.ui.DropdownWidget );
  46
  47         /* Methods */
  48
  49         /**
  50          * Respond to the user choosing an item in the menu
  51          *
  52          * @param {OO.ui.MenuOptionWidget} chosenItem
  53          */
  54         mw.rcfilters.ui.RclToOrFromWidget.prototype.onUserChooseItem = function ( chosenItem ) {
  55                 this.controller.setShowLinkedTo( chosenItem.getData() === 'to' );
  56         };
  57
  58         /**
  59          * Respond to model update
  60          */
  61         mw.rcfilters.ui.RclToOrFromWidget.prototype.onModelUpdate = function () {
  62                 this.getMenu().selectItem(
  63                         this.model.isSelected() ?
  64                                 this.showLinkedTo :
  65                                 this.showLinkedFrom
  66                 );
  67                 this.setLabel( mw.msg(
  68                         this.model.isSelected() ?
  69                                 'rcfilters-filter-showlinkedto-label' :
  70                                 'rcfilters-filter-showlinkedfrom-label'
  71                 ) );
  72         };
  73 }() );