Update the notification bubble.

chrome/browser/resources/ntp4/apps_page.js

 // Copyright (c) 2011 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 cr.define('ntp4', function() {
   'use strict';
 
   var localStrings = new LocalStrings;
 
   var APP_LAUNCH = {
@@ skipping 278 matching lines @@
      */
     loadIcon: function() {
       if (this.appImgSrc_) {
         this.appImg_.src = this.appImgSrc_;
         this.appImg_.classList.remove('invisible');
         this.appImgSrc_ = null;
       }
       this.classList.remove('icon-loading');
     },
 
-    // Shows a notification text below the app icon and stuffs the attributes
-    // necessary to show the bubble when the user clicks on the notification
-    // text.
-    setupNotification_: function(notification) {
-      // Remove the old notification from this node (if any).
-      if (this.appNotification_)
-        this.appNotification_.parentNode.removeChild(this.appNotification_);
+    /**
+     * Creates a bubble node.
+     * @param {Object} notification The notification to show in the bubble.
+     * @param {boolean} full Whether we want the headline or just the content.
+     * @private
+     */
+    createBubbleNode_: function(notification, full) {
+      if (!full) {
+        var titleItem = this.ownerDocument.createElement('span');
+        titleItem.textContent = notification['title'];
+        return titleItem;
+      } else {
+        var container = this.ownerDocument.createElement('div');
 
-      if (notification) {
-        // Add a new notification to this node.
-        var appNotification = this.ownerDocument.createElement('span');
-        appNotification.className = 'app-notification';
-        appNotification.textContent = notification['title'];
-        appNotification.addEventListener('click',
-                                         this.onNotificationClick_.bind(this));
-        appNotification.notificationTitle = notification['title'];
-        appNotification.notificationMessage = notification['body'];
-        if (typeof notification['linkUrl'] != 'undefined' &&
-            typeof notification['linkText'] != 'undefined') {
-          appNotification.notificationLink = notification['linkUrl'];
-          appNotification.notificationLinkText = notification['linkText'];
+        var messageItem = this.ownerDocument.createElement('div');
+        messageItem.textContent = notification['body'];
+        container.appendChild(messageItem);
+
+        if (notification['linkUrl'] && notification['linkText']) {
+          var anchor = this.ownerDocument.createElement('a');
+          anchor.href = notification['linkUrl'];
+          anchor.textContent = notification['linkText'];
+          container.appendChild(anchor);
         }
-        this.appNotification_ = appNotification;
-        this.appendChild(appNotification);
+
+        return container;
       }
     },
 
+    /**
+     * Sets up a notification for the app icon.
+     * @param {Object} notification The notification to show in the bubble.
+     * @private
+     */
+    setupNotification_: function(notification) {
+      if (notification) {
+        var infoBubble;
+        if (!this.currentBubbleShowing_) {
+          // Create a new bubble.
+          infoBubble = new cr.ui.ExpandableBubble;
+          infoBubble.anchorNode = this;
+        } else {
+          // Reuse the old bubble instead of popping up a new bubble over
+          // the old one.
+          infoBubble = this.currentBubbleShowing_;
+          infoBubble.collapseBubble_();
+        }
+        infoBubble.contentTitle = this.createBubbleNode_(notification, false);
+        infoBubble.content = this.createBubbleNode_(notification, true);
+        infoBubble.show();
+
+        this.currentBubbleShowing_ = infoBubble;
+      }
+    },
+
     /**
      * Creates the apps-promo section of the app (should only be called for the
      * webstore app).
      * @private
      */
     createAppsPromoExtras_: function() {
       this.classList.add('webstore');
 
       this.appsPromoExtras_ = $('apps-promo-extras-template').cloneNode(true);
       this.appsPromoExtras_.id = '';
@@ skipping 68 matching lines @@
     onClick_: function(e) {
       chrome.send('launchApp',
                   [this.appId, APP_LAUNCH.NTP_APPS_MAXIMIZED,
                    e.altKey, e.ctrlKey, e.metaKey, e.shiftKey, e.button]);
 
       // Don't allow the click to trigger a link or anything
       e.preventDefault();
     },
 
     /**
+<<<<<<< .mine

[arv (Not doing code reviews), 2011/10/18 16:50:30]

Please resolve

+=======
      * Invoked when the user presses a key while the app is focused.
      * @param {Event} e The key event.
      * @private
      */
     onKeydown_: function(e) {
       if (e.keyIdentifier == 'Enter') {
         chrome.send('launchApp',
                     [this.appId, APP_LAUNCH.NTP_APPS_MAXIMIZED,
                      e.altKey, e.ctrlKey, e.metaKey, e.shiftKey, 0]);
         e.preventDefault();
@@ skipping 30 matching lines @@
         container.appendChild(anchor);
       }
 
       var infoBubble = new cr.ui.Bubble;
       infoBubble.anchorNode = e.target;
       infoBubble.content = container;
       infoBubble.show();
     },
 
     /**
+>>>>>>> .r105287
      * Adds a node to the list of targets that will launch the app. This list
      * is also used in onMousedown to determine whether the app contents should
      * be shown as active (if we don't do this, then clicking anywhere in
      * appContents, even a part that is outside the ideally clickable region,
      * will cause the app icon to look active).
      * @param {HTMLElement} node The node that should be clickable.
      */
     addLaunchClickTarget_: function(node) {
       node.classList.add('launch-click-target');
       node.addEventListener('click', this.onClick_.bind(this));
@@ skipping 74 matching lines @@
     },
 
     /**
      * Uninstalls the app after it's been dropped on the trash.
      */
     removeFromChrome: function() {
       chrome.send('uninstallApp', [this.appData_.id, true]);
 
       this.tile.tilePage.cleanupDrag();
       this.tile.parentNode.removeChild(this.tile);
+
+      if (this.currentBubbleShowing_)
+        currentBubbleShowing_.hide();
     },
 
     /**
      * Called when a drag is starting on the tile. Updates dataTransfer with
      * data for this tile.
      */
     setDragData: function(dataTransfer) {
       dataTransfer.setData('Text', this.appData_.title);
       dataTransfer.setData('URL', this.appData_.url);
     },
@@ skipping 225 matching lines @@
     appNotificationChanged: appNotificationChanged,
     AppsPage: AppsPage,
     launchAppAfterEnable: launchAppAfterEnable,
   };
 });
 
 // TODO(estade): update the content handlers to use ntp namespace instead of
 // making these global.
 var appNotificationChanged = ntp4.appNotificationChanged;
 var launchAppAfterEnable = ntp4.launchAppAfterEnable;