3 * Widget defining the button controlling the popup for the number of results
6 * @extends OO.ui.Widget
9 * @param {mw.rcfilters.Controller} controller Controller
10 * @param {mw.rcfilters.dm.FiltersViewModel} model View model
11 * @param {Object} [config] Configuration object
12 * @cfg {jQuery} [$overlay] A jQuery object serving as overlay for popups
14 mw
.rcfilters
.ui
.ChangesLimitAndDateButtonWidget
= function MwRcfiltersUiChangesLimitWidget( controller
, model
, config
) {
15 config
= config
|| {};
18 mw
.rcfilters
.ui
.ChangesLimitAndDateButtonWidget
.parent
.call( this, config
);
20 this.controller
= controller
;
23 this.$overlay
= config
.$overlay
|| this.$element
;
26 this.limitGroupModel
= null;
27 this.groupByPageItemModel
= null;
28 this.daysGroupModel
= null;
30 this.model
.connect( this, {
31 initialize
: 'onModelInitialize'
35 .addClass( 'mw-rcfilters-ui-changesLimitButtonWidget' );
40 OO
.inheritClass( mw
.rcfilters
.ui
.ChangesLimitAndDateButtonWidget
, OO
.ui
.Widget
);
43 * Respond to model initialize event
45 mw
.rcfilters
.ui
.ChangesLimitAndDateButtonWidget
.prototype.onModelInitialize = function () {
46 var changesLimitPopupWidget
, selectedItem
, currentValue
, datePopupWidget
,
47 displayGroupModel
= this.model
.getGroup( 'display' );
49 this.limitGroupModel
= this.model
.getGroup( 'limit' );
50 this.groupByPageItemModel
= displayGroupModel
.getItemByParamName( 'enhanced' );
51 this.daysGroupModel
= this.model
.getGroup( 'days' );
53 // HACK: We need the model to be ready before we populate the button
54 // and the widget, because we require the filter items for the
55 // limit and their events. This addition is only done after the
56 // model is initialized.
57 // Note: This will be fixed soon!
58 if ( this.limitGroupModel
&& this.daysGroupModel
) {
59 changesLimitPopupWidget
= new mw
.rcfilters
.ui
.ChangesLimitPopupWidget(
61 this.groupByPageItemModel
64 datePopupWidget
= new mw
.rcfilters
.ui
.DatePopupWidget(
67 label
: mw
.msg( 'rcfilters-date-popup-title' )
71 selectedItem
= this.limitGroupModel
.getSelectedItems()[ 0 ];
72 currentValue
= ( selectedItem
&& selectedItem
.getLabel() ) ||
73 mw
.language
.convertNumber( this.limitGroupModel
.getDefaultParamValue() );
75 this.button
= new OO
.ui
.PopupButtonWidget( {
78 label
: mw
.msg( 'rcfilters-limit-and-date-label', currentValue
),
79 $overlay
: this.$overlay
,
85 $autoCloseIgnore
: this.$overlay
,
86 $content
: $( '<div>' ).append(
87 // TODO: Merge ChangesLimitPopupWidget with DatePopupWidget into one common widget
88 changesLimitPopupWidget
.$element
,
89 datePopupWidget
.$element
93 this.updateButtonLabel();
96 this.limitGroupModel
.connect( this, { update
: 'updateButtonLabel' } );
97 this.daysGroupModel
.connect( this, { update
: 'updateButtonLabel' } );
98 changesLimitPopupWidget
.connect( this, {
99 limit
: 'onPopupLimit',
100 groupByPage
: 'onPopupGroupByPage'
102 datePopupWidget
.connect( this, { days
: 'onPopupDays' } );
104 this.$element
.append( this.button
.$element
);
109 * Respond to popup limit change event
111 * @param {string} filterName Chosen filter name
113 mw
.rcfilters
.ui
.ChangesLimitAndDateButtonWidget
.prototype.onPopupLimit = function ( filterName
) {
114 var item
= this.limitGroupModel
.getItemByName( filterName
);
116 this.controller
.toggleFilterSelect( filterName
, true );
117 this.controller
.updateLimitDefault( item
.getParamName() );
118 this.button
.popup
.toggle( false );
122 * Respond to popup limit change event
124 * @param {boolean} isGrouped The result set is grouped by page
126 mw
.rcfilters
.ui
.ChangesLimitAndDateButtonWidget
.prototype.onPopupGroupByPage = function ( isGrouped
) {
127 this.controller
.toggleFilterSelect( this.groupByPageItemModel
.getName(), isGrouped
);
128 this.controller
.updateGroupByPageDefault( Number( isGrouped
) );
129 this.button
.popup
.toggle( false );
133 * Respond to popup limit change event
135 * @param {string} filterName Chosen filter name
137 mw
.rcfilters
.ui
.ChangesLimitAndDateButtonWidget
.prototype.onPopupDays = function ( filterName
) {
138 var item
= this.daysGroupModel
.getItemByName( filterName
);
140 this.controller
.toggleFilterSelect( filterName
, true );
141 this.controller
.updateDaysDefault( item
.getParamName() );
142 this.button
.popup
.toggle( false );
146 * Respond to limit choose event
148 * @param {string} filterName Filter name
150 mw
.rcfilters
.ui
.ChangesLimitAndDateButtonWidget
.prototype.updateButtonLabel = function () {
152 limit
= this.limitGroupModel
.getSelectedItems()[ 0 ],
153 label
= limit
&& limit
.getLabel(),
154 days
= this.daysGroupModel
.getSelectedItems()[ 0 ],
155 daysParamName
= Number( days
.getParamName() ) < 1 ?
156 'rcfilters-days-show-hours' :
157 'rcfilters-days-show-days';
160 if ( label
&& days
) {
161 message
= mw
.msg( 'rcfilters-limit-and-date-label', label
,
162 mw
.msg( daysParamName
, days
.getLabel() )
164 this.button
.setLabel( message
);