jenkins-bot has submitted this change and it was merged.
Change subject: Add MobileNotificationsWrapper for Mobile display
......................................................................
Add MobileNotificationsWrapper for Mobile display
This is to wrap the mobile notifications in MobileFrontend with
a pendingElement and organize the API calls specifically for the
mixed popup in mobile.
Also added a specific 'ext.echo.ui.mobile' module so we don't
load unnecessary files for mobile.
Bug: T124188
Change-Id: I4a8be19a79b9e38c21907bb9d4123540a648c535
---
M Resources.php
M modules/ext.echo.init.js
A modules/ooui/mobile/mw.echo.ui.MobileNotificationsWrapper.js
M modules/viewmodel/mw.echo.dm.NotificationsModel.js
4 files changed, 140 insertions(+), 23 deletions(-)
Approvals:
Catrope: Looks good to me, approved
jenkins-bot: Verified
diff --git a/Resources.php b/Resources.php
index 10889ca..400c151 100644
--- a/Resources.php
+++ b/Resources.php
@@ -30,6 +30,40 @@
);
$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 @@
'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 @@
'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',
@@ -227,7 +254,7 @@
'dependencies' => array(
'mediawiki.ui.button',
'mediawiki.api',
- 'ext.echo.ui',
+ 'ext.echo.ui.desktop',
),
'messages' => array(
'echo-load-more-error',
diff --git a/modules/ext.echo.init.js b/modules/ext.echo.init.js
index 95b94f8..b2b664c 100644
--- a/modules/ext.echo.init.js
+++ b/modules/ext.echo.init.js
@@ -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();
diff --git a/modules/ooui/mobile/mw.echo.ui.MobileNotificationsWrapper.js
b/modules/ooui/mobile/mw.echo.ui.MobileNotificationsWrapper.js
new file mode 100644
index 0000000..28cb1ee
--- /dev/null
+++ b/modules/ooui/mobile/mw.echo.ui.MobileNotificationsWrapper.js
@@ -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 );
diff --git a/modules/viewmodel/mw.echo.dm.NotificationsModel.js
b/modules/viewmodel/mw.echo.dm.NotificationsModel.js
index 9feea72..bceda94 100644
--- a/modules/viewmodel/mw.echo.dm.NotificationsModel.js
+++ b/modules/viewmodel/mw.echo.dm.NotificationsModel.js
@@ -296,11 +296,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
@@ -315,23 +318,30 @@
* @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++ ) {
@@ -341,13 +351,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 ) );
};
/**
--
To view, visit https://gerrit.wikimedia.org/r/251561
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I4a8be19a79b9e38c21907bb9d4123540a648c535
Gerrit-PatchSet: 14
Gerrit-Project: mediawiki/extensions/Echo
Gerrit-Branch: master
Gerrit-Owner: Mooeypoo <[email protected]>
Gerrit-Reviewer: Catrope <[email protected]>
Gerrit-Reviewer: Jdlrobson <[email protected]>
Gerrit-Reviewer: Mattflaschen <[email protected]>
Gerrit-Reviewer: Mooeypoo <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
