Merge "Switch to using our own badge instead of jQuery.badge"

Echo.i18n.php

@@ -145,8 +145,6 @@ To control which emails we send you, check your preferences:
 
 $1',
 	// Notifications overlay
-	'echo-link-new' => '$1 new {{PLURAL:$1|notification|notifications}}',
-	'echo-link' => 'Notifications',
 	'echo-overlay-link' => 'All notifications',
 	'echo-overlay-title' => '<b>Notifications</b>',
 	'echo-overlay-title-overflow' => '<b>Notifications</b> (showing $1 of $2 unread)',
@@ -485,10 +483,6 @@ The new notification count next to notification link, for example: 99+
 	'echo-email-footer-default' => 'Default footer content for Echo e-mail notifications.  Parameters:
 * $1 is the address of the organization that sent the e-mail
 * $2 is "-------..." ({{msg-mw|echo-email-batch-separator}})',
-	'echo-link-new' => 'Shown in "personal links" when a user has unread notifications.
-* $1 is number of unread notifications',
-	'echo-link' => 'Shown in "personal links" when a user has JS. New notifications are indicated with a badge.
-{{Identical|Notification}}',
 	'echo-overlay-link' => 'Link to "all notifications" at the bottom of the overlay.
 {{Identical|All notifications}}',
 	'echo-overlay-title' => 'Title at the top of the notifications overlay. Should include bold tags.',

Echo.php

@@ -140,12 +140,10 @@ $wgResourceModules += array(
 			'ext.echo.base',
 			'mediawiki.api',
 			'mediawiki.jqueryMsg',
-			'jquery.badge',
 			'mediawiki.ui',
+			'mediawiki.util',
 		),
 		'messages' => array(
-			'echo-link-new',
-			'echo-link',
 			'echo-overlay-title',
 			'echo-overlay-title-overflow',
 			'echo-overlay-link',
@@ -181,6 +179,12 @@ $wgResourceModules += array(
 			'colon-separator',
 		),
 	),
+	'ext.echo.badge' => $echoResourceTemplate + array(
+		'styles' => 'badge/ext.echo.badge.css',
+		'skinStyles' => array(
+			'modern' => 'badge/ext.echo.badge.modern.css',
+		),
+	),
 );
 
 /**
@@ -222,10 +226,6 @@ $wgEchoBackend = null;
 // Whether to turn on email batch function
 $wgEchoEnableEmailBatch = true;
 
-// Show a 'Notifications' link with badge in the user toolbar at the top of the page.
-// Otherwise, only show a badge next to the username.
-$wgEchoShowFullNotificationsLink = false;
-
 // URL for more information about the Echo notification system
 $wgEchoHelpPage = '//www.mediawiki.org/wiki/Special:MyLanguage/Help:Extension:Echo';
 

Hooks.php

@@ -599,6 +599,9 @@ class EchoHooks {
 			global $wgEchoFeedbackPage;
 			// Load the module for the Notifications flyout
 			$out->addModules( array( 'ext.echo.overlay' ) );
+			// Load the styles for the Notifications badge
+			$out->addModuleStyles( 'ext.echo.badge' );
+			// Pass needed global vars to the client
 			$out->addJsConfigVars( array( 'wgEchoFeedbackPage' => $wgEchoFeedbackPage ) );
 		}
 		if ( $wgEchoNewMsgAlert && $user->isLoggedIn() && $user->getOption( 'echo-show-alert' ) ) {
@@ -616,35 +619,29 @@ class EchoHooks {
 	 * @return bool true in all cases
 	 */
 	static function onPersonalUrls( &$personal_urls, &$title ) {
-		global $wgUser, $wgEchoShowFullNotificationsLink;
+		global $wgUser;
 		// Add a "My notifications" item to personal URLs
 		if ( $wgUser->isAnon() || !$wgUser->getOption( 'echo-notify-show-link' ) ) {
 			return true;
 		}
 
 		$notificationCount = EchoNotificationController::getNotificationCount( $wgUser );
-		if ( $wgEchoShowFullNotificationsLink ) {
+		$text = EchoNotificationController::formatNotificationCount( $notificationCount );
-			// Add a "Notifications" item to personal URLs
-			$msg = wfMessage( $notificationCount == 0 ? 'echo-link' : 'echo-link-new' );
-			$text = $msg->params( EchoNotificationController::formatNotificationCount( $notificationCount ) )->text();
-		} else {
-			// Just add a number
-			$text = wfMessage( 'parentheses', EchoNotificationController::formatNotificationCount( $notificationCount ) )->plain();
-		}
 		$url = SpecialPage::getTitleFor( 'Notifications' )->getLocalURL();
-
+		if ( $notificationCount == 0 ) {
+			$linkClasses = array( 'mw-echo-notifications-badge' );
+		} else {
+			$linkClasses = array( 'mw-echo-unread-notifications', 'mw-echo-notifications-badge' );
+		}
 		$notificationsLink = array(
 			'href' => $url,
 			'text' => $text,
 			'active' => ( $url == $title->getLocalUrl() ),
+			'class' => $linkClasses,
 		);
 
 		$insertUrls = array( 'notifications' => $notificationsLink );
-		if ( $wgEchoShowFullNotificationsLink ) {
+		$personal_urls = wfArrayInsertAfter( $personal_urls, $insertUrls, 'userpage' );
-			$personal_urls = wfArrayInsertAfter( $personal_urls, $insertUrls, 'mytalk' );
-		} else {
-			$personal_urls = wfArrayInsertAfter( $personal_urls, $insertUrls, 'userpage' );
-		}
 		return true;
 	}
 
@@ -672,7 +669,7 @@ class EchoHooks {
 	 * @return bool true in all cases
 	 */
 	public static function makeGlobalVariablesScript( &$vars, OutputPage $outputPage ) {
-		global $wgEchoShowFullNotificationsLink, $wgEchoHelpPage, $wgEchoMaxNotificationCount;
+		global $wgEchoHelpPage, $wgEchoMaxNotificationCount;
 		$user = $outputPage->getUser();
 
 		// Provide info for the Overlay
@@ -680,8 +677,6 @@ class EchoHooks {
 		$timestamp = new MWTimestamp( wfTimestampNow() );
 		if ( ! $user->isAnon() ) {
 			$vars['wgEchoOverlayConfiguration'] = array(
-				'notifications-link-full' => $wgEchoShowFullNotificationsLink,
-				'timestamp' => $timestamp->getTimestamp( TS_UNIX ),
 				'notification-count' => EchoNotificationController::getFormattedNotificationCount( $user ),
 				'max-notification-count' => $wgEchoMaxNotificationCount,
 			);

controller/NotificationController.php

@@ -23,14 +23,14 @@ class EchoNotificationController {
 		$memcKey = wfMemcKey( 'echo-notification-count', $user->getId(), $wgEchoConfig['version'] );
 
 		if ( $cached && $wgMemc->get( $memcKey ) !== false ) {
-			return $wgMemc->get( $memcKey );
+			return intval( $wgMemc->get( $memcKey ) );
 		}
 
 		$count = $wgEchoBackend->getNotificationCount( $user, $dbSource );
 
 		$wgMemc->set( $memcKey, $count, 86400 );
 
-		return $count;
+		return intval( $count );
 	}
 
 	/**

modules/badge/ext.echo.badge.css

@@ -0,0 +1,22 @@
+/* We have to include the #pt-notifications selector due to monobook */
+#pt-notifications .mw-echo-notifications-badge {
+	min-width: 7px;
+	border-radius: 2px;
+	padding: 0.3em 0.5em 0.25em 0.5em;
+	margin-left: -4px;
+	text-align: center;
+	background-color: #d2d2d2;
+	font-weight: bold;
+	color: white;
+	text-shadow: 0 1px rgba(0, 0, 0, 0.4);
+	cursor: pointer;
+}
+#pt-notifications .mw-echo-notifications-badge:hover {
+	background-color: #c2c2c2;
+}
+#pt-notifications .mw-echo-notifications-badge.mw-echo-unread-notifications {
+	background-color: #cc0000;
+}
+#pt-notifications .mw-echo-notifications-badge.mw-echo-unread-notifications:hover {
+	background-color: #bf0000;
+}

modules/badge/ext.echo.badge.modern.css

@@ -0,0 +1,4 @@
+/* No rounded corners for modern skin */
+#pt-notifications  .mw-echo-notifications-badge {
+	border-radius: 0;
+}

modules/overlay/ext.echo.overlay.css

@@ -22,7 +22,7 @@
 	position: absolute;
 	z-index: 101;
 	top: 21px;
-	left: -9px;
+	left: -5px;
 }
 
 #p-personal .mw-echo-overlay {
@@ -136,14 +136,6 @@
 	position: relative;
 }
 
-#pt-notifications .mw-badge {
-	margin-left: 3px;
-}
-
-#pt-notifications a.mw-echo-short-link .mw-badge {
-	margin-left: -5px;
-}
-
 .mw-echo-overlay-none {
 	font-size: 13px;
 	border-bottom: 1px solid #DDDDDD;

modules/overlay/ext.echo.overlay.js

@@ -5,24 +5,15 @@
 	mw.echo.overlay = {
 
 		'updateCount' : function( newCount ) {
-			// Accomodate '10' or '100+'. Numbers need to be
+			var $badge = $( '.mw-echo-notifications-badge' );
-			// passed as numbers for correct behavior of '0'.
+			$badge.text( newCount );
-			if ( !isNaN( newCount ) ) {
+			// newCount could be '99+' or another string.
-				newCount = Number( newCount );
+			// Checking for number as well just to be paranoid.
-			}
+			if ( newCount !== '0' && newCount !== 0 ) {
-
+				$badge.addClass( 'mw-echo-unread-notifications' );
-			if ( mw.echo.overlay.configuration['notifications-link-full'] ) {
-				$( '#pt-notifications > a' )
-					.text( mw.msg( 'echo-link' ) )
-					.badge( newCount, true, true );
 			} else {
-				$( '#pt-notifications > a' )
+				$badge.removeClass( 'mw-echo-unread-notifications' );
-					.addClass( 'mw-echo-short-link' )
-					.text( '' )
-					.badge( newCount, true, true );
 			}
-
-			mw.echo.overlay.notificationCount = newCount;
 		},
 
 		'configuration' : mw.config.get( 'wgEchoOverlayConfiguration' ),
@@ -30,7 +21,6 @@
 		'buildOverlay' : function( callback ) {
 			var notificationLimit,
 				$overlay = $( '<div></div>' ).addClass( 'mw-echo-overlay' ),
-				$link = $( '#pt-notifications a' ),
 				$prefLink = $( '#pt-preferences a' ),
 				count = 0,
 				Api = new mw.Api();
@@ -62,6 +52,9 @@
 						$overlayFooter,
 						$markReadButton;
 
+					if ( unreadTotalCount !== undefined ) {
+						mw.echo.overlay.updateCount( unreadTotalCount );
+					}
 					$ul.css( 'max-height', notificationLimit * 95 + 'px' );
 					$.each( notifications.index, function( index, id ) {
 						var data = notifications.list[id],
@@ -166,9 +159,9 @@
 
 					// add link to notifications archive
 					$overlayFooter.append(
-						$link
+						$( '<a>' )
-							.clone()
 							.attr( 'id', 'mw-echo-overlay-link' )
+							.attr( 'href', mw.util.wikiGetlink( 'Special:Notifications' ) )
 							.text( mw.msg( 'echo-overlay-link' ) )
 					);
 
@@ -202,17 +195,13 @@
 					}
 				},
 				'err' : function() {
-					window.location.href = $link.attr( 'href' );
+					window.location.href = $( '#pt-notifications a' ).attr( 'href' );
 				}
 			} );
 		}
 	};
 
-	mw.echo.overlay.notificationCount = mw.echo.overlay.configuration['notification-count'];
-
 	$( function() {
-		mw.echo.overlay.updateCount( mw.echo.overlay.notificationCount );
-
 		var $link = $( '#pt-notifications a' );
 		if ( ! $link.length ) {
 			return;