Update the notification bubble.

chrome/browser/resources/ntp4/apps_page.js

Index: chrome/browser/resources/ntp4/apps_page.js
===================================================================
--- chrome/browser/resources/ntp4/apps_page.js	(revision 106057)
+++ chrome/browser/resources/ntp4/apps_page.js	(working copy)
@@ -296,30 +296,58 @@
       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.
+    /**
+     * 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');
+
+        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);
+        }
+
+        return container;
+      }
+    },
+
+    /**
+     * Sets up a notification for the app icon.
+     * @param {Object} notification The notification to show in the bubble.
+     * @private
+     */
     setupNotification_: function(notification) {
-      // Remove the old notification from this node (if any).
-      if (this.appNotification_)
-        this.appNotification_.parentNode.removeChild(this.appNotification_);
-
       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 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_();
         }
-        this.appNotification_ = appNotification;
-        this.appendChild(appNotification);
+        infoBubble.contentTitle = this.createBubbleNode_(notification, false);
+        infoBubble.content = this.createBubbleNode_(notification, true);
+        infoBubble.show();
+
+        this.currentBubbleShowing_ = infoBubble;
       }
     },
 
@@ -411,6 +439,8 @@
     },
 
     /**
+<<<<<<< .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
@@ -461,6 +491,7 @@
     },
 
     /**
+>>>>>>> .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
@@ -555,6 +586,9 @@
 
       this.tile.tilePage.cleanupDrag();
       this.tile.parentNode.removeChild(this.tile);
+
+      if (this.currentBubbleShowing_)
+        currentBubbleShowing_.hide();
     },
 
     /**