mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/MinervaNeue
synced 2024-11-15 02:13:49 +00:00
ef5003f310
The MobileFrontend dependency in Minerva is problematic. Code that Minerva needs should live in core. MobileFrontend should load code on all skins when they operate on a mobile domain. This eslint check reminds developers of this in a hope it encourages more upstreaming to core when possible. Of course disabling is also an option, but this check will at least make us aware of when we are moving further away from the goal. Change-Id: I62183c9aefc81053e4ad81fb746decef2dd24b44
95 lines
2.8 KiB
JavaScript
95 lines
2.8 KiB
JavaScript
( function ( M ) {
|
|
var
|
|
mobile = M.require( 'mobile.startup' ),
|
|
mfExtend = mobile.mfExtend,
|
|
View = mobile.View,
|
|
util = mobile.util,
|
|
Icon = mobile.Icon,
|
|
notificationIcon = new Icon( {
|
|
name: 'bellOutline-base20',
|
|
glyphPrefix: 'wikimedia'
|
|
} );
|
|
|
|
/**
|
|
* A notification button for displaying a notifications overlay
|
|
* @class NotificationButton
|
|
* @extends View
|
|
* @param {Object} options Configuration options
|
|
* @param {string} options.notificationIconClass e.g. mw-ui-icon for icon
|
|
* @param {boolean} options.hasUnseenNotifications whether the user has unseen notifications
|
|
* @param {number} options.notificationCountRaw number of unread notifications
|
|
* @param {string} options.title tooltip for badge
|
|
* @param {string} options.url to see all notifications
|
|
* @param {boolean} options.hasNotifications whether the user has unseen notifications
|
|
* @param {Function} options.onClick handler for when the badge is clicked
|
|
* @memberof NotificationBadge
|
|
* @instance
|
|
*/
|
|
function NotificationBadge( options ) {
|
|
var $el, $notificationAnchor,
|
|
count = options.notificationCountRaw || 0,
|
|
el = options.el;
|
|
|
|
if ( el ) {
|
|
// Learn properties based on current element
|
|
$el = $( el );
|
|
options.hasUnseenNotifications = $el.find( '.notification-unseen' ).length > 0;
|
|
options.hasNotifications = options.hasUnseenNotifications;
|
|
$notificationAnchor = $el.find( 'a' );
|
|
options.title = $notificationAnchor.attr( 'title' );
|
|
options.url = $notificationAnchor.attr( 'href' );
|
|
count = Number( $el.find( 'span' ).data( 'notification-count' ) );
|
|
}
|
|
View.call( this,
|
|
util.extend( {
|
|
notificationIconClass: notificationIcon.getClassName(),
|
|
hasNotifications: false,
|
|
hasUnseenNotifications: false,
|
|
notificationCountRaw: 0
|
|
}, options, {
|
|
isBorderBox: false
|
|
} )
|
|
);
|
|
this.url = options.url;
|
|
this.setCount( count );
|
|
if ( options.onClick ) {
|
|
this.$el.on( 'click', options.onClick );
|
|
}
|
|
}
|
|
|
|
mfExtend( NotificationBadge, View, {
|
|
template: mw.template.get( 'skins.minerva.scripts', 'badge.mustache' ),
|
|
/**
|
|
* Update the notification count
|
|
* @memberof NotificationBadge
|
|
* @instance
|
|
* @param {number} count
|
|
*/
|
|
setCount: function ( count ) {
|
|
if ( count > 100 ) {
|
|
count = 100;
|
|
}
|
|
this.options.notificationCountRaw = count;
|
|
this.options.notificationCountString = mw.message( 'echo-badge-count',
|
|
mw.language.convertNumber( count )
|
|
).text();
|
|
this.options.isNotificationCountZero = count === 0;
|
|
this.render();
|
|
},
|
|
/**
|
|
* Marks all notifications as seen
|
|
*
|
|
* @memberof NotificationBadge
|
|
* @instance
|
|
*/
|
|
markAsSeen: function () {
|
|
this.options.hasUnseenNotifications = false;
|
|
this.render();
|
|
}
|
|
} );
|
|
|
|
module.exports = NotificationBadge;
|
|
|
|
// eslint-disable-next-line no-restricted-properties
|
|
}( mw.mobileFrontend ) );
|