1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
|
var
mobile = mw.mobileFrontend.require( 'mobile.startup' ),
View = mobile.View,
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,
$.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 );
}
}
OO.inheritClass( NotificationBadge, View );
NotificationBadge.prototype.template = mw.template.get( 'ext.echo.mobile', 'NotificationBadge.mustache' );
/**
* Update the notification count
*
* @memberof NotificationBadge
* @instance
* @param {number} count
*/
NotificationBadge.prototype.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
*/
NotificationBadge.prototype.markAsSeen = function () {
this.options.hasUnseenNotifications = false;
this.render();
};
module.exports = NotificationBadge;
|
GitWeb