this.controller = controller;
this.model = model;
- this.checkboxWidget = new OO.ui.CheckboxInputWidget( {
+ this.checkboxWidget = new mw.rcfilters.ui.CheckboxInputWidget( {
value: this.model.getName(),
selected: this.model.isSelected()
} );
);
}
+ this.highlightButton = new mw.rcfilters.ui.FilterItemHighlightButton(
+ this.controller,
+ this.model,
+ {
+ $overlay: config.$overlay || this.$element
+ }
+ );
+ this.highlightButton.toggle( this.model.isHighlightEnabled() );
+
layout = new OO.ui.FieldLayout( this.checkboxWidget, {
label: $label,
align: 'inline'
} );
// Event
- this.checkboxWidget.connect( this, { change: 'onCheckboxChange' } );
+ this.checkboxWidget.connect( this, { userChange: 'onCheckboxChange' } );
this.model.connect( this, { update: 'onModelUpdate' } );
+ this.model.getGroupModel().connect( this, { update: 'onGroupModelUpdate' } );
this.$element
.addClass( 'mw-rcfilters-ui-filterItemWidget' )
.append(
- layout.$element
+ $( '<div>' )
+ .addClass( 'mw-rcfilters-ui-table' )
+ .append(
+ $( '<div>' )
+ .addClass( 'mw-rcfilters-ui-row' )
+ .append(
+ $( '<div>' )
+ .addClass( 'mw-rcfilters-ui-cell mw-rcfilters-ui-filterItemWidget-filterCheckbox' )
+ .append( layout.$element ),
+ $( '<div>' )
+ .addClass( 'mw-rcfilters-ui-cell mw-rcfilters-ui-filterItemWidget-highlightButton' )
+ .append( this.highlightButton.$element )
+ )
+ )
);
};
*/
mw.rcfilters.ui.FilterItemWidget.prototype.onModelUpdate = function () {
this.checkboxWidget.setSelected( this.model.isSelected() );
+
+ this.setCurrentMuteState();
+ };
+
+ /**
+ * Respond to item group model update event
+ */
+ mw.rcfilters.ui.FilterItemWidget.prototype.onGroupModelUpdate = function () {
+ this.setCurrentMuteState();
+ };
+
+ /**
+ * Set the current mute state for this item
+ */
+ mw.rcfilters.ui.FilterItemWidget.prototype.setCurrentMuteState = function () {
+ this.$element.toggleClass(
+ 'mw-rcfilters-ui-filterItemWidget-muted',
+ this.model.isConflicted() ||
+ this.model.isIncluded() ||
+ this.model.isFullyCovered() ||
+ (
+ // Item is also muted when any of the items in its group is active
+ this.model.getGroupModel().isActive() &&
+ // But it isn't selected
+ !this.model.isSelected()
+ )
+ );
+
+ this.highlightButton.toggle( this.model.isHighlightEnabled() );
};
/**
mw.rcfilters.ui.FilterItemWidget.prototype.getName = function () {
return this.model.getName();
};
-
}( mediaWiki, jQuery ) );