mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/Echo
synced 2024-11-24 07:54:13 +00:00
Add 'mark as read' as secondary action to unread notifications
Bug: T121935 Change-Id: I0dda7335ba00492c5dc5a6f0e9f2faea1da612bc
This commit is contained in:
parent
085d6fe3a1
commit
5c67c9110f
|
@ -95,6 +95,7 @@ $wgResourceModules += array(
|
|||
"notification-link-text-expand-alert-count",
|
||||
"notification-link-text-expand-message-count",
|
||||
"notification-link-text-expand-all-count",
|
||||
'echo-notification-markasread',
|
||||
'echo-notification-alert-text-only',
|
||||
'echo-notification-message-text-only',
|
||||
'echo-email-batch-bullet',
|
||||
|
|
|
@ -56,6 +56,7 @@
|
|||
"echo-notification-placeholder": "There are no notifications.",
|
||||
"echo-notification-loginrequired": "You must login to see your notifications.",
|
||||
"echo-notification-popup-loginrequired": "Please log in to view your notifications.",
|
||||
"echo-notification-markasread": "Mark as read",
|
||||
"notification-link-text-expand-all": "Expand all",
|
||||
"notification-link-text-expand-alert-count": "Expand {{PLURAL:$1|$1 alert|$1 alerts}}",
|
||||
"notification-link-text-expand-message-count": "Expand {{PLURAL:$1|$1 message|$1 messages}}",
|
||||
|
|
|
@ -77,6 +77,7 @@
|
|||
"echo-notification-placeholder": "Label for the text that appears if there are no notifications in the Echo popup.",
|
||||
"echo-notification-loginrequired": "Message that displays when an anonymous user attempts to view notifications and gets redirect to the login page.",
|
||||
"echo-notification-popup-loginrequired": "Message that displays when an anonymous user attempts to view notifications in their popup after a session expired.",
|
||||
"echo-notification-markasread": "Label for the button to mark the notification as read.",
|
||||
"notification-link-text-expand-all": "Label for the button that expands a bundled notification.\n{{Identical|Expand}}",
|
||||
"notification-link-text-expand-alert-count": "Label for the button that expands a bundled alert notification.\n\nParameters:\n* $1 - The count of messages that the bundle holds.\n{{Identical|View message}}",
|
||||
"notification-link-text-expand-message-count": "Label for the button that expands a bundled message notification.\n\nParameters:\n* $1 - The count of messages that the bundle holds.\n{{Identical|View message}}",
|
||||
|
|
|
@ -38,18 +38,7 @@
|
|||
classes: [ 'mw-echo-ui-notificationItemWidget-markAsReadButton' ]
|
||||
} );
|
||||
|
||||
this.toggleRead( this.model.isRead() );
|
||||
this.toggleSeen( this.model.isSeen() );
|
||||
|
||||
this.markReadWhenSeen = !!config.markReadWhenSeen;
|
||||
this.markAsReadButton.toggle( !this.markReadWhenSeen && !this.model.isRead() );
|
||||
|
||||
// Events
|
||||
this.markAsReadButton.connect( this, { click: 'onMarkAsReadButtonClick' } );
|
||||
this.model.connect( this, {
|
||||
seen: 'toggleSeen',
|
||||
read: 'toggleRead'
|
||||
} );
|
||||
|
||||
// Icon
|
||||
if ( this.model.getIconURL() ) {
|
||||
|
@ -143,7 +132,16 @@
|
|||
this.menuPopupButtonWidget.getMenu().addItems( [ linkButton ] );
|
||||
}
|
||||
}
|
||||
this.menuPopupButtonWidget.toggle( !this.menuPopupButtonWidget.getMenu().isEmpty() );
|
||||
// Add a "mark as read" secondary action
|
||||
this.markAsReadSecondary = new OO.ui.ButtonOptionWidget( {
|
||||
icon: 'check',
|
||||
framed: false,
|
||||
data: 'markAsRead',
|
||||
label: mw.msg( 'echo-notification-markasread' ),
|
||||
classes: [ 'mw-echo-ui-notificationItemWidget-content-actions-button' ]
|
||||
} );
|
||||
// Toggle 'mark as read' functionality
|
||||
this.toggleMarkAsReadButtons( !this.markReadWhenSeen && !this.model.isRead() );
|
||||
|
||||
if ( this.bundle ) {
|
||||
// In a bundle, we have table layout, so the icon is
|
||||
|
@ -202,6 +200,18 @@
|
|||
);
|
||||
}
|
||||
|
||||
// Events
|
||||
this.markAsReadButton.connect( this, { click: 'onMarkAsReadButtonClick' } );
|
||||
this.menuPopupButtonWidget.getMenu().connect( this, { choose: 'onPopupButtonWidgetChoose' } );
|
||||
this.model.connect( this, {
|
||||
seen: 'toggleSeen',
|
||||
read: 'toggleRead'
|
||||
} );
|
||||
|
||||
// Initialize state
|
||||
this.toggleRead( this.model.isRead() );
|
||||
this.toggleSeen( this.model.isSeen() );
|
||||
|
||||
// HACK: We have to remove the built-in label. When this
|
||||
// widget is switched to a standalone widget rather than
|
||||
// an OptionWidget we can get rid of this
|
||||
|
@ -234,6 +244,37 @@
|
|||
this.model.toggleRead( true );
|
||||
};
|
||||
|
||||
/**
|
||||
* Respond to selecting an item from the popup button widget
|
||||
*/
|
||||
mw.echo.ui.NotificationItemWidget.prototype.onPopupButtonWidgetChoose = function ( item ) {
|
||||
var action = item && item.getData();
|
||||
|
||||
if ( action === 'markAsRead' ) {
|
||||
this.model.toggleRead( true );
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Toggle the visibility of the 'mark as read' buttons and update the visibility
|
||||
* of the secondary menu accordingly.
|
||||
*
|
||||
* @param {boolean} [show] Show the 'mark as read' buttons
|
||||
*/
|
||||
mw.echo.ui.NotificationItemWidget.prototype.toggleMarkAsReadButtons = function ( show ) {
|
||||
show = show !== undefined ? show : !this.model.isRead();
|
||||
|
||||
this.markAsReadButton.toggle( show );
|
||||
this.markAsReadSecondary.toggle( show );
|
||||
|
||||
if ( show ) {
|
||||
this.menuPopupButtonWidget.getMenu().addItems( [ this.markAsReadSecondary ] );
|
||||
} else {
|
||||
this.menuPopupButtonWidget.getMenu().removeItems( [ this.markAsReadSecondary ] );
|
||||
}
|
||||
this.menuPopupButtonWidget.toggle( !this.menuPopupButtonWidget.getMenu().isEmpty() );
|
||||
};
|
||||
|
||||
/**
|
||||
* Reset the status of the notification without touching its user-controlled status.
|
||||
* For one, remove 'initiallyUnseen' which exists only for the animation to work.
|
||||
|
@ -254,7 +295,7 @@
|
|||
this.read = read !== undefined ? read : !this.read;
|
||||
|
||||
this.$element.toggleClass( 'mw-echo-ui-notificationItemWidget-unread', !this.read );
|
||||
this.markAsReadButton.toggle( !this.read );
|
||||
this.toggleMarkAsReadButtons( !this.read );
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
Loading…
Reference in a new issue