X-Git-Url: https://git.heureux-cyclage.org/?a=blobdiff_plain;f=resources%2Fsrc%2Fmediawiki.rcfilters%2Fui%2Fmw.rcfilters.ui.ChangesListWrapperWidget.js;h=84248e1c85b4458ca853f6962e9a86d84553adb0;hb=e50bbe8e8e569750f622d7c3c221def17cffa0db;hp=f929eb265346076b0c872dd1d7df5ce0b5d90129;hpb=4b77a6463a7eecd9d53de10558a1dfc663dca87f;p=lhc%2Fweb%2Fwiklou.git diff --git a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.ChangesListWrapperWidget.js b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.ChangesListWrapperWidget.js index f929eb2653..84248e1c85 100644 --- a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.ChangesListWrapperWidget.js +++ b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.ChangesListWrapperWidget.js @@ -6,27 +6,43 @@ * @mixins OO.ui.mixin.PendingElement * * @constructor - * @param {mw.rcfilters.dm.ChangesListViewModel} model View model + * @param {mw.rcfilters.dm.FiltersViewModel} filtersViewModel View model + * @param {mw.rcfilters.dm.ChangesListViewModel} changesListViewModel View model * @param {jQuery} $changesListRoot Root element of the changes list to attach to * @param {Object} config Configuration object */ - mw.rcfilters.ui.ChangesListWrapperWidget = function MwRcfiltersUiChangesListWrapperWidget( model, $changesListRoot, config ) { - config = config || {}; + mw.rcfilters.ui.ChangesListWrapperWidget = function MwRcfiltersUiChangesListWrapperWidget( + filtersViewModel, + changesListViewModel, + $changesListRoot, + config + ) { + config = $.extend( {}, config, { + $element: $changesListRoot + } ); // Parent - mw.rcfilters.ui.ChangesListWrapperWidget.parent.call( this, $.extend( {}, config, { - $element: $changesListRoot - } ) ); + mw.rcfilters.ui.ChangesListWrapperWidget.parent.call( this, config ); // Mixin constructors OO.ui.mixin.PendingElement.call( this, config ); - this.model = model; + this.filtersViewModel = filtersViewModel; + this.changesListViewModel = changesListViewModel; // Events - this.model.connect( this, { + this.filtersViewModel.connect( this, { + itemUpdate: 'onItemUpdate', + highlightChange: 'onHighlightChange' + } ); + this.changesListViewModel.connect( this, { invalidate: 'onModelInvalidate', update: 'onModelUpdate' } ); + + this.$element.addClass( 'mw-rcfilters-ui-changesListWrapperWidget' ); + + // Set up highlight containers + this.setupHighlightContainers( this.$element ); }; /* Initialization */ @@ -35,26 +51,130 @@ OO.mixinClass( mw.rcfilters.ui.ChangesListWrapperWidget, OO.ui.mixin.PendingElement ); /** - * Respond to model invalidate + * Respond to the highlight feature being toggled on and off + * + * @param {boolean} highlightEnabled + */ + mw.rcfilters.ui.ChangesListWrapperWidget.prototype.onHighlightChange = function ( highlightEnabled ) { + if ( highlightEnabled ) { + this.applyHighlight(); + } else { + this.clearHighlight(); + } + }; + + /** + * Respond to a filter item model update + */ + mw.rcfilters.ui.ChangesListWrapperWidget.prototype.onItemUpdate = function () { + if ( this.filtersViewModel.isHighlightEnabled() ) { + this.clearHighlight(); + this.applyHighlight(); + } + }; + + /** + * Respond to changes list model invalidate */ mw.rcfilters.ui.ChangesListWrapperWidget.prototype.onModelInvalidate = function () { this.pushPending(); }; /** - * Respond to model update + * Respond to changes list model update * - * @param {jQuery|string} changesListContent The content of the updated changes list + * @param {jQuery|string} $changesListContent The content of the updated changes list */ - mw.rcfilters.ui.ChangesListWrapperWidget.prototype.onModelUpdate = function ( changesListContent ) { - var isEmpty = changesListContent === 'NO_RESULTS'; + mw.rcfilters.ui.ChangesListWrapperWidget.prototype.onModelUpdate = function ( $changesListContent ) { + var isEmpty = $changesListContent === 'NO_RESULTS'; + this.$element.toggleClass( 'mw-changeslist', !isEmpty ); this.$element.toggleClass( 'mw-changeslist-empty', isEmpty ); - this.$element.empty().append( - isEmpty ? - document.createTextNode( mw.message( 'recentchanges-noresult' ).text() ) : - changesListContent - ); + if ( isEmpty ) { + this.$changesListContent = null; + this.$element.empty().append( + document.createTextNode( mw.message( 'recentchanges-noresult' ).text() ) + ); + } else { + this.$changesListContent = $changesListContent; + this.$element.empty().append( this.$changesListContent ); + // Set up highlight containers + this.setupHighlightContainers( this.$element ); + + // Apply highlight + this.applyHighlight(); + + // Make sure enhanced RC re-initializes correctly + mw.hook( 'wikipage.content' ).fire( this.$element ); + } this.popPending(); }; + + /** + * Set up the highlight containers with all color circle indicators. + * + * @param {jQuery|string} $content The content of the updated changes list + */ + mw.rcfilters.ui.ChangesListWrapperWidget.prototype.setupHighlightContainers = function ( $content ) { + var $highlights = $( '