RCFilters: Add marker between old and new changes in enhanced mode
For both "Live Update" and "View newest changes", add a marker between old and new groups when changes are grouped by page. Bug: T163426 Change-Id: I00947d05e9b6022604a2a6b94eec94f6ed747c96
This commit is contained in:
parent
24ebca2251
commit
d65f49aa78
3 changed files with 60 additions and 38 deletions
|
|
@ -341,6 +341,7 @@ class EnhancedChangesList extends ChangesList {
|
|||
'rev-deleted-event' => $revDeletedMsg,
|
||||
'tableClasses' => $tableClasses,
|
||||
'timestamp' => $block[0]->timestamp,
|
||||
'fullTimestamp' => $block[0]->getAttribute( 'rc_timestamp' ),
|
||||
'users' => $usersList,
|
||||
];
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<table class="{{# tableClasses }}{{ . }} {{/ tableClasses }}">
|
||||
<table class="{{# tableClasses }}{{ . }} {{/ tableClasses }}" data-mw-ts="{{{ fullTimestamp }}}">
|
||||
<tr>
|
||||
<td>
|
||||
<span class="mw-collapsible-toggle mw-collapsible-arrow mw-enhancedchanges-arrow mw-enhancedchanges-arrow-space"></span>
|
||||
|
|
|
|||
|
|
@ -101,9 +101,6 @@
|
|||
$message = $( '<div>' )
|
||||
.addClass( 'mw-rcfilters-ui-changesListWrapperWidget-results' ),
|
||||
isEmpty = $changesListContent === 'NO_RESULTS',
|
||||
$lastSeen,
|
||||
$indicator,
|
||||
$newChanges = $( [] ),
|
||||
// For enhanced mode, we have to load these modules, which are
|
||||
// not loaded for the 'regular' mode in the backend
|
||||
loaderPromise = mw.user.options.get( 'usenewrc' ) ?
|
||||
|
|
@ -142,34 +139,7 @@
|
|||
this.$element.empty().append( $changesListContent );
|
||||
|
||||
if ( from ) {
|
||||
$lastSeen = null;
|
||||
this.$element.find( 'li[data-mw-ts]' ).each( function () {
|
||||
var $li = $( this ),
|
||||
ts = $li.data( 'mw-ts' );
|
||||
|
||||
if ( ts >= from ) {
|
||||
$newChanges = $newChanges.add( $li );
|
||||
} else if ( $lastSeen === null ) {
|
||||
$lastSeen = $li;
|
||||
return false;
|
||||
}
|
||||
} );
|
||||
|
||||
if ( $lastSeen ) {
|
||||
$indicator = $( '<div>' )
|
||||
.addClass( 'mw-rcfilters-ui-changesListWrapperWidget-previousChangesIndicator' )
|
||||
.text( mw.message( 'rcfilters-previous-changes-label' ).text() );
|
||||
|
||||
$indicator.on( 'click', function () {
|
||||
$indicator.detach();
|
||||
} );
|
||||
|
||||
$lastSeen.before( $indicator );
|
||||
}
|
||||
|
||||
$newChanges
|
||||
.hide()
|
||||
.fadeIn( 1000 );
|
||||
this.emphasizeNewChanges( from );
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -192,6 +162,52 @@
|
|||
} );
|
||||
};
|
||||
|
||||
/**
|
||||
* Emphasize the elements (or groups) newer than the 'from' parameter
|
||||
* @param {string} from Anything newer than this is considered 'new'
|
||||
*/
|
||||
mw.rcfilters.ui.ChangesListWrapperWidget.prototype.emphasizeNewChanges = function ( from ) {
|
||||
var $lastSeen,
|
||||
$indicator,
|
||||
$newChanges = $( [] ),
|
||||
selector = this.inEnhancedMode() ?
|
||||
'table.mw-enhanced-rc[data-mw-ts]' :
|
||||
'li[data-mw-ts]',
|
||||
set = this.$element.find( selector ),
|
||||
length = set.length;
|
||||
|
||||
set.each( function ( index ) {
|
||||
var $this = $( this ),
|
||||
ts = $this.data( 'mw-ts' );
|
||||
|
||||
if ( ts >= from ) {
|
||||
$newChanges = $newChanges.add( $this );
|
||||
$lastSeen = $this;
|
||||
|
||||
// guards against putting the marker after the last element
|
||||
if ( index === ( length - 1 ) ) {
|
||||
$lastSeen = null;
|
||||
}
|
||||
}
|
||||
} );
|
||||
|
||||
if ( $lastSeen ) {
|
||||
$indicator = $( '<div>' )
|
||||
.addClass( 'mw-rcfilters-ui-changesListWrapperWidget-previousChangesIndicator' )
|
||||
.text( mw.message( 'rcfilters-previous-changes-label' ).text() );
|
||||
|
||||
$indicator.on( 'click', function () {
|
||||
$indicator.detach();
|
||||
} );
|
||||
|
||||
$lastSeen.after( $indicator );
|
||||
}
|
||||
|
||||
$newChanges
|
||||
.hide()
|
||||
.fadeIn( 1000 );
|
||||
};
|
||||
|
||||
/**
|
||||
* Respond to changes list model newChangesExist
|
||||
*
|
||||
|
|
@ -235,8 +251,7 @@
|
|||
* @param {jQuery|string} $content The content of the updated changes list
|
||||
*/
|
||||
mw.rcfilters.ui.ChangesListWrapperWidget.prototype.setupHighlightContainers = function ( $content ) {
|
||||
var uri = new mw.Uri(),
|
||||
highlightClass = 'mw-rcfilters-ui-changesListWrapperWidget-highlights',
|
||||
var highlightClass = 'mw-rcfilters-ui-changesListWrapperWidget-highlights',
|
||||
$highlights = $( '<div>' )
|
||||
.addClass( highlightClass )
|
||||
.append(
|
||||
|
|
@ -258,10 +273,7 @@
|
|||
);
|
||||
} );
|
||||
|
||||
if (
|
||||
( uri.query.enhanced !== undefined && Number( uri.query.enhanced ) ) ||
|
||||
( uri.query.enhanced === undefined && Number( mw.user.options.get( 'usenewrc' ) ) )
|
||||
) {
|
||||
if ( this.inEnhancedMode() ) {
|
||||
// Enhanced RC
|
||||
$content.find( 'td.mw-enhanced-rc' )
|
||||
.parent()
|
||||
|
|
@ -276,6 +288,15 @@
|
|||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @return {boolean} Whether the changes are grouped by page
|
||||
*/
|
||||
mw.rcfilters.ui.ChangesListWrapperWidget.prototype.inEnhancedMode = function () {
|
||||
var uri = new mw.Uri();
|
||||
return ( uri.query.enhanced !== undefined && Number( uri.query.enhanced ) ) ||
|
||||
( uri.query.enhanced === undefined && Number( mw.user.options.get( 'usenewrc' ) ) );
|
||||
};
|
||||
|
||||
/**
|
||||
* Apply color classes based on filters highlight configuration
|
||||
*/
|
||||
|
|
|
|||
Loading…
Reference in a new issue