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

   1 ( function () {
   2         var ValuePickerWidget = require( './ValuePickerWidget.js' ),
   3                 ChangesLimitPopupWidget;
   4
   5         /**
   6          * Widget defining the popup to choose number of results
   7          *
   8          * @class mw.rcfilters.ui.ChangesLimitPopupWidget
   9          * @extends OO.ui.Widget
  10          *
  11          * @constructor
  12          * @param {mw.rcfilters.dm.FilterGroup} limitModel Group model for 'limit'
  13          * @param {mw.rcfilters.dm.FilterItem} groupByPageItemModel Group model for 'limit'
  14          * @param {Object} [config] Configuration object
  15          */
  16         ChangesLimitPopupWidget = function MwRcfiltersUiChangesLimitPopupWidget( limitModel, groupByPageItemModel, config ) {
  17                 config = config || {};
  18
  19                 // Parent
  20                 ChangesLimitPopupWidget.parent.call( this, config );
  21
  22                 this.limitModel = limitModel;
  23                 this.groupByPageItemModel = groupByPageItemModel;
  24
  25                 this.valuePicker = new ValuePickerWidget(
  26                         this.limitModel,
  27                         {
  28                                 label: mw.msg( 'rcfilters-limit-title' )
  29                         }
  30                 );
  31
  32                 this.groupByPageCheckbox = new OO.ui.CheckboxInputWidget( {
  33                         selected: this.groupByPageItemModel.isSelected()
  34                 } );
  35
  36                 // Events
  37                 this.valuePicker.connect( this, { choose: [ 'emit', 'limit' ] } );
  38                 this.groupByPageCheckbox.connect( this, { change: [ 'emit', 'groupByPage' ] } );
  39                 this.groupByPageItemModel.connect( this, { update: 'onGroupByPageModelUpdate' } );
  40
  41                 // Initialize
  42                 this.$element
  43                         .addClass( 'mw-rcfilters-ui-changesLimitPopupWidget' )
  44                         .append(
  45                                 this.valuePicker.$element,
  46                                 new OO.ui.FieldLayout(
  47                                         this.groupByPageCheckbox,
  48                                         {
  49                                                 align: 'inline',
  50                                                 label: mw.msg( 'rcfilters-group-results-by-page' )
  51                                         }
  52                                 ).$element
  53                         );
  54         };
  55
  56         /* Initialization */
  57
  58         OO.inheritClass( ChangesLimitPopupWidget, OO.ui.Widget );
  59
  60         /* Events */
  61
  62         /**
  63          * @event limit
  64          * @param {string} name Item name
  65          *
  66          * A limit item was chosen
  67          */
  68
  69         /**
  70          * @event groupByPage
  71          * @param {boolean} isGrouped The results are grouped by page
  72          *
  73          * Results are grouped by page
  74          */
  75
  76         /**
  77          * Respond to group by page model update
  78          */
  79         ChangesLimitPopupWidget.prototype.onGroupByPageModelUpdate = function () {
  80                 this.groupByPageCheckbox.setSelected( this.groupByPageItemModel.isSelected() );
  81         };
  82
  83         module.exports = ChangesLimitPopupWidget;
  84 }() );