mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/Echo
synced 2024-11-24 07:54:13 +00:00
Merge "Add MobileNotificationsWrapper for Mobile display"
This commit is contained in:
jenkins-bot
Gerrit Code Review
commit
39820d8b62
|
|
@ -30,6 +30,40 @@ $echoResourceTemplate = array(
|
|||
);
|
||||
|
||||
$wgResourceModules += array(
|
||||
'ext.echo.ui.desktop' => $echoResourceTemplate + array(
|
||||
'scripts' => array(
|
||||
'ooui/mw.echo.ui.BadgeLinkWidget.js',
|
||||
'ooui/mw.echo.ui.NotificationBadgeWidget.js',
|
||||
),
|
||||
'styles' => array(
|
||||
'ooui/styles/mw.echo.ui.NotificationBadgeWidget.less',
|
||||
),
|
||||
'skinStyles' => array(
|
||||
'monobook' => array(
|
||||
'ooui/styles/mw.echo.ui.NotificationBadgeWidget.monobook.less'
|
||||
),
|
||||
'modern' => array(
|
||||
'ooui/styles/mw.echo.ui.NotificationBadgeWidget.modern.less'
|
||||
),
|
||||
'vector' => array(
|
||||
'ooui/styles/mw.echo.ui.NotificationBadgeWidget.vector.less'
|
||||
),
|
||||
),
|
||||
'dependencies' => array(
|
||||
'ext.echo.ui',
|
||||
'ext.echo.styles.badge',
|
||||
),
|
||||
'targets' => array( 'desktop' ),
|
||||
),
|
||||
'ext.echo.ui.mobile' => $echoResourceTemplate + array(
|
||||
'scripts' => array(
|
||||
'ooui/mobile/mw.echo.ui.MobileNotificationsWrapper.js',
|
||||
),
|
||||
'dependencies' => array(
|
||||
'ext.echo.ui',
|
||||
),
|
||||
'targets' => array( 'mobile', 'desktop' ),
|
||||
),
|
||||
'ext.echo.ui' => $echoResourceTemplate + array(
|
||||
'scripts' => array(
|
||||
'ooui/mw.echo.ui.js',
|
||||
|
|
@ -40,8 +74,6 @@ $wgResourceModules += array(
|
|||
'ooui/mw.echo.ui.BundledNotificationGroupWidget.js',
|
||||
'ooui/mw.echo.ui.ActionMenuPopupWidget.js',
|
||||
'ooui/mw.echo.ui.MenuItemWidget.js',
|
||||
'ooui/mw.echo.ui.BadgeLinkWidget.js',
|
||||
'ooui/mw.echo.ui.NotificationBadgeWidget.js'
|
||||
),
|
||||
'styles' => array(
|
||||
'ooui/styles/mw.echo.ui.overlay.less',
|
||||
|
|
@ -51,24 +83,19 @@ $wgResourceModules += array(
|
|||
'ooui/styles/mw.echo.ui.NotificationGroupItemWidget.less',
|
||||
'ooui/styles/mw.echo.ui.BundledNotificationGroupWidget.less',
|
||||
'ooui/styles/mw.echo.ui.MenuItemWidget.less',
|
||||
'ooui/styles/mw.echo.ui.NotificationBadgeWidget.less'
|
||||
),
|
||||
'skinStyles' => array(
|
||||
'monobook' => array(
|
||||
'ooui/styles/mw.echo.ui.NotificationsWidget.monobook.less',
|
||||
'ooui/styles/mw.echo.ui.NotificationBadgeWidget.monobook.less'
|
||||
),
|
||||
'modern' => array(
|
||||
'ooui/styles/mw.echo.ui.NotificationItemWidget.modern.less',
|
||||
'ooui/styles/mw.echo.ui.NotificationBadgeWidget.modern.less'
|
||||
),
|
||||
'vector' => array(
|
||||
'ooui/styles/mw.echo.ui.overlay.vector.less',
|
||||
'ooui/styles/mw.echo.ui.NotificationBadgeWidget.vector.less'
|
||||
),
|
||||
),
|
||||
'dependencies' => array(
|
||||
'ext.echo.styles.badge',
|
||||
'ext.echo.styles.notifications',
|
||||
'ext.echo.dm',
|
||||
'oojs-ui-core',
|
||||
|
|
@ -229,7 +256,7 @@ $wgResourceModules += array(
|
|||
'dependencies' => array(
|
||||
'mediawiki.ui.button',
|
||||
'mediawiki.api',
|
||||
'ext.echo.ui',
|
||||
'ext.echo.ui.desktop',
|
||||
),
|
||||
'messages' => array(
|
||||
'echo-load-more-error',
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@
|
|||
} );
|
||||
|
||||
// Load the ui
|
||||
mw.loader.using( 'ext.echo.ui', function () {
|
||||
mw.loader.using( 'ext.echo.ui.desktop', function () {
|
||||
var messageNotificationsModel, alertNotificationsModel,
|
||||
momentOrigLocale = moment.locale();
|
||||
|
||||
|
|
|
|||
82
modules/ooui/mobile/mw.echo.ui.MobileNotificationsWrapper.js
Normal file
82
modules/ooui/mobile/mw.echo.ui.MobileNotificationsWrapper.js
Normal file
|
|
@ -0,0 +1,82 @@
|
|||
( function ( mw ) {
|
||||
/**
|
||||
* Mobile wrapper for the notifications widget, for mobile view.
|
||||
*
|
||||
* @class
|
||||
* @extends OO.ui.Widget
|
||||
* @mixins OO.ui.mixin.PendingElement
|
||||
*
|
||||
* @constructor
|
||||
* @param {mw.echo.dm.NotificationsModel} model Notifications view model
|
||||
* @param {Object} [config] Configuration object
|
||||
*/
|
||||
mw.echo.ui.MobileNotificationsWrapper = function MwEchoUiMobileNotificationsWrapper( model, config ) {
|
||||
config = config || {};
|
||||
|
||||
// Parent constructor
|
||||
mw.echo.ui.MobileNotificationsWrapper.parent.call( this, config );
|
||||
|
||||
// Mixin constructor
|
||||
OO.ui.mixin.PendingElement.call( this, config );
|
||||
|
||||
this.model = model;
|
||||
|
||||
this.notificationsWidget = new mw.echo.ui.NotificationsWidget(
|
||||
this.model,
|
||||
{
|
||||
markReadWhenSeen: false,
|
||||
$overlay: config.$overlay,
|
||||
label: mw.msg( 'notifications' ),
|
||||
icon: 'bell'
|
||||
}
|
||||
);
|
||||
|
||||
// Events
|
||||
this.model.connect( this, {
|
||||
unreadChange: [ 'emit', 'unreadChange' ],
|
||||
allRead: [ 'emit', 'unreadChange', 0 ]
|
||||
} );
|
||||
|
||||
// Initialize
|
||||
this.$element
|
||||
.append( this.notificationsWidget.$element );
|
||||
};
|
||||
|
||||
/* Initialization */
|
||||
|
||||
OO.inheritClass( mw.echo.ui.MobileNotificationsWrapper, OO.ui.Widget );
|
||||
OO.mixinClass( mw.echo.ui.MobileNotificationsWrapper, OO.ui.mixin.PendingElement );
|
||||
|
||||
/* Events */
|
||||
|
||||
/**
|
||||
* @event finishLoading
|
||||
* Notifications have successfully finished being processed and are fully loaded
|
||||
*/
|
||||
|
||||
/**
|
||||
* @event unreadChange
|
||||
* @param {number} Number of unread messages
|
||||
* There was a change in the number of unread notifications
|
||||
*/
|
||||
|
||||
/* Methods */
|
||||
|
||||
/**
|
||||
* Populate the notifications panel
|
||||
*
|
||||
* @return {jQuery.Promise} A promise that is resolved when all notifications
|
||||
* were fetched from the API and added to the model and UI.
|
||||
*/
|
||||
mw.echo.ui.MobileNotificationsWrapper.prototype.populate = function () {
|
||||
var widget = this;
|
||||
|
||||
this.pushPending();
|
||||
return this.model.fetchNotifications( true )
|
||||
.always( function () {
|
||||
widget.popPending();
|
||||
widget.emit( 'finishLoading' );
|
||||
widget.promiseRunning = false;
|
||||
} );
|
||||
};
|
||||
} )( mediaWiki );
|
||||
|
|
@ -295,11 +295,14 @@
|
|||
* Set the system seen time - the last time we've marked notification as seen
|
||||
*
|
||||
* @private
|
||||
* @param {string} Mediawiki seen timestamp in Mediawiki timestamp format
|
||||
* @param {string} type Notification type; 'alert', 'message' or 'all'
|
||||
* @param {string} time Mediawiki seen timestamp in Mediawiki timestamp format
|
||||
*/
|
||||
mw.echo.dm.NotificationsModel.prototype.setSeenTime = function ( time ) {
|
||||
var i,
|
||||
type = $.isArray( this.type ) ? this.type : [ this.type ];
|
||||
mw.echo.dm.NotificationsModel.prototype.setSeenTime = function ( type, time ) {
|
||||
var i, types;
|
||||
|
||||
// Normalize if using 'all'
|
||||
types = type === 'all' ? [ 'alert', 'message' ] : [ type ];
|
||||
|
||||
for ( i = 0; i < type.length; i++ ) {
|
||||
// Update all types
|
||||
|
|
@ -314,24 +317,31 @@
|
|||
* @return {string} Mediawiki seen timestamp in Mediawiki timestamp format
|
||||
*/
|
||||
mw.echo.dm.NotificationsModel.prototype.getSeenTime = function ( type ) {
|
||||
type = type || ( $.isArray( this.type ) ? this.type[ 0 ] : this.type );
|
||||
var normalizedType;
|
||||
|
||||
return this.seenTime[ type ];
|
||||
type = type || this.type;
|
||||
|
||||
normalizedType = type === 'all' ?
|
||||
[ 'alert', 'message' ] : [ type ];
|
||||
|
||||
return this.seenTime[ normalizedType[ 0 ] ];
|
||||
};
|
||||
|
||||
/**
|
||||
* Update the seen timestamp
|
||||
*
|
||||
* @param {string|string[]} [type] Notification type
|
||||
* @return {jQuery.Promise} A promise that resolves with the seen timestamp
|
||||
* @fires updateSeenTime
|
||||
*/
|
||||
mw.echo.dm.NotificationsModel.prototype.updateSeenTime = function ( type ) {
|
||||
var i, len, promise,
|
||||
var i, len, types,
|
||||
items = this.unseenNotifications.getItems();
|
||||
|
||||
type = type || this.type;
|
||||
|
||||
// If type is "all" or is not given, update both
|
||||
types = type === 'all' ? [ 'alert', 'message' ] : [ type || this.type ];
|
||||
|
||||
// Update the notifications seen status
|
||||
for ( i = 0, len = items.length; i < len; i++ ) {
|
||||
items[ i ].toggleSeen( true );
|
||||
|
|
@ -340,13 +350,11 @@
|
|||
|
||||
// Only update seenTime in the API locally
|
||||
if ( !this.isForeign() ) {
|
||||
promise = this.api.updateSeenTime( this.getSource(), type );
|
||||
} else {
|
||||
promise = $.Deferred().resolve();
|
||||
for ( i = 0; i < types.length; i++ ) {
|
||||
this.api.updateSeenTime( this.getSource(), types[ i ] )
|
||||
.then( this.setSeenTime.bind( this, types[ i ] ) );
|
||||
}
|
||||
}
|
||||
|
||||
return promise
|
||||
.then( this.setSeenTime.bind( this ) );
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
|
|||
Loading…
Reference in a new issue