summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorBrian Evans <grknight@gentoo.org>2020-10-02 13:57:00 -0400
committerBrian Evans <grknight@gentoo.org>2020-10-02 13:57:00 -0400
commitab2071c71446a71888e4c9762cdce102bf9e29a3 (patch)
tree9ce07fbfd979a5898f21239c8f8f5b3d3cbdfc21 /Echo/modules/mobile/overlay.js
parentAdd PluggableAuth extension for OpenID Connect (diff)
downloadextensions-ab2071c71446a71888e4c9762cdce102bf9e29a3.tar.gz
extensions-ab2071c71446a71888e4c9762cdce102bf9e29a3.tar.bz2
extensions-ab2071c71446a71888e4c9762cdce102bf9e29a3.zip
Update Echo to 1.35
Signed-off-by: Brian Evans <grknight@gentoo.org>
Diffstat (limited to 'Echo/modules/mobile/overlay.js')
-rw-r--r--Echo/modules/mobile/overlay.js85
1 files changed, 85 insertions, 0 deletions
diff --git a/Echo/modules/mobile/overlay.js b/Echo/modules/mobile/overlay.js
new file mode 100644
index 00000000..36080900
--- /dev/null
+++ b/Echo/modules/mobile/overlay.js
@@ -0,0 +1,85 @@
+var mobile = mw.mobileFrontend.require( 'mobile.startup' ),
+ Overlay = mobile.Overlay,
+ list = require( './list.js' ),
+ promisedView = mobile.promisedView,
+ View = mobile.View,
+ Anchor = mobile.Anchor;
+
+/**
+ * @param {Overlay} overlay
+ * @param {Function} exit
+ * @return {void}
+ */
+function onBeforeExitAnimation( overlay, exit ) {
+ if ( 'transition' in overlay.$el[ 0 ].style ) {
+ // Manually detach the overlay from DOM once hide animation completes.
+ overlay.$el[ 0 ].addEventListener( 'transitionend', exit, { once: true } );
+
+ // Kick off animation.
+ overlay.$el[ 0 ].classList.remove( 'visible' );
+ } else {
+ exit();
+ }
+}
+
+/**
+ * This callback is displayed as a global member.
+ *
+ * @callback FunctionCountChangeCallback
+ * @param {number} count a capped (0-99 or 99+) count
+ */
+
+/**
+ * Make a notification overlay
+ *
+ * @param {FunctionCountChangeCallback} onCountChange receives one parameter - a capped (0-99 or 99+) count.
+ * @param {Function} onNotificationListRendered a function that is called when the
+ * notifications list has fully rendered (taking no arguments)
+ * @param {Function} onBeforeExit
+ * @return {Overlay}
+ */
+function notificationsOverlay( onCountChange, onNotificationListRendered, onBeforeExit ) {
+ var markAllReadButton, overlay,
+ oouiPromise = mw.loader.using( 'oojs-ui' ).then( function () {
+ markAllReadButton = new OO.ui.ButtonWidget( {
+ icon: 'checkAll',
+ title: mw.msg( 'echo-mark-all-as-read' )
+ } );
+ return View.make(
+ { class: 'notifications-overlay-header-markAllRead' },
+ [ markAllReadButton.$element ]
+ );
+ } ),
+ markAllReadButtonView = promisedView( oouiPromise );
+ // hide the button spinner as it is confusing to see in the top right corner
+ markAllReadButtonView.$el.hide();
+
+ overlay = Overlay.make(
+ {
+ heading: '<strong>' + mw.message( 'notifications' ).escaped() + '</strong>',
+ footerAnchor: new Anchor( {
+ href: mw.util.getUrl( 'Special:Notifications' ),
+ progressive: true,
+ additionalClassNames: 'footer-link notifications-archive-link',
+ label: mw.msg( 'echo-overlay-link' )
+ } ).options,
+ headerActions: [ markAllReadButtonView ],
+ isBorderBox: false,
+ className: 'overlay notifications-overlay navigation-drawer',
+ onBeforeExit: function ( exit ) {
+ onBeforeExit( function () {
+ onBeforeExitAnimation( overlay, exit );
+ } );
+ }
+ },
+ promisedView(
+ oouiPromise.then( function () {
+ return list( mw.echo, markAllReadButton, onCountChange,
+ onNotificationListRendered );
+ } )
+ )
+ );
+ return overlay;
+}
+
+module.exports = notificationsOverlay;