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

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