Back out f83003b34fbe and af72df54ccf1 (Bug 598331) because they broke pinch zoom.

mobile/chrome/content/browser-ui.js

@@ -697,8 +697,7 @@ var BrowserUI = {
     let tab = null;
     let ss = Cc["@mozilla.org/browser/sessionstore;1"].getService(Ci.nsISessionStore);
     if (ss.getClosedTabCount(window) > (aIndex || 0)) {
-      let chromeTab = ss.undoCloseTab(window, aIndex || 0);
+      tab = ss.undoCloseTab(window, aIndex || 0);
-      tab = Browser.getTabFromChrome(chromeTab);
     }
     return tab;
   },
@@ -1122,16 +1121,11 @@ var BrowserUI = {
 
 var TapHighlightHelper = {
   get _overlay() {
-    if (Browser.selectedTab)
+    delete this._overlay;
-      return Browser.selectedTab.overlay;
+    return this._overlay = document.getElementById("content-overlay");
-    return null;
   },
 
   show: function show(aRects) {
-    let overlay = this._overlay;
-    if (!overlay)
-      return;
-
     let browser = getBrowser();
     let scroll = browser.getPosition();
 
@@ -1140,6 +1134,7 @@ var TapHighlightHelper = {
     }, new Rect(0, 0, 0, 0)).map(function(val) val * browser.scale)
                             .translate(-scroll.x, -scroll.y);
 
+    let overlay = this._overlay;
     overlay.setAttribute("width", canvasArea.width);
     overlay.setAttribute("height", canvasArea.height);
 
@@ -1150,7 +1145,6 @@ var TapHighlightHelper = {
 
     overlay.setAttribute("left", canvasArea.left);
     overlay.setAttribute("top", canvasArea.top);
-    ctx.clearRect(0, 0, canvasArea.width, canvasArea.height);
     ctx.fillStyle = "rgba(0, 145, 255, .5)";
     for (let i = aRects.length - 1; i >= 0; i--) {
       let rect = aRects[i];
@@ -1168,7 +1162,7 @@ var TapHighlightHelper = {
    * highlight should be shown before it disappears.
    */
   hide: function hide(aGuaranteeShowMsecs) {
-    if (!this._overlay || this._overlay.style.display == "none")
+    if (this._overlay.style.display == "none")
       return;
 
     this._guaranteeShow = Math.max(0, aGuaranteeShowMsecs);

mobile/chrome/content/browser.css

@@ -46,8 +46,7 @@ setting[type="string"] {
   -moz-binding: url("chrome://browser/content/bindings/setting.xml#setting-string");
 }
 
-#browsers > notificationbox {
+notificationbox {
-  -moz-binding: url("chrome://browser/content/notification.xml#stacked-notificationbox");
   overflow: -moz-hidden-unscrollable;
 }
 

mobile/chrome/content/browser.js

@@ -141,7 +141,7 @@ function onDebugKeyPress(ev) {
       let e = document.createEvent("SimpleGestureEvent");
       e.initSimpleGestureEvent("MozMagnifyGesture"+aName, true, true, window, null,
                                0, 0, 0, 0, false, false, false, false, 0, null, 0, aDelta);
-      Browser.selectedTab.inputHandler.dispatchEvent(e);
+      document.getElementById("inputhandler-overlay").dispatchEvent(e);
     }
     dispatchMagnifyEvent("Start", 0);
 
@@ -193,12 +193,13 @@ var Browser = {
     // XXX change
 
     /* handles dispatching clicks on browser into clicks in content or zooms */
-    Elements.browsers.customDragger = new Browser.MainDragger();
+    let inputHandlerOverlay = document.getElementById("inputhandler-overlay");
+    inputHandlerOverlay.customDragger = new Browser.MainDragger();
 
-    let keySender = new ContentCustomKeySender(Elements.browsers);
+    let keySender = new ContentCustomKeySender(inputHandlerOverlay);
     let mouseModule = new MouseModule();
     let gestureModule = new GestureModule();
-    let scrollWheelModule = new ScrollwheelModule(Elements.browsers);
+    let scrollWheelModule = new ScrollwheelModule(inputHandlerOverlay);
 
     ContentTouchHandler.init();
 
@@ -719,7 +720,7 @@ var Browser = {
     if (this._selectedTab == tab) {
       // Deck does not update its selectedIndex when children
       // are removed. See bug 602708
-      Elements.browsers.selectedPanel = tab.notification;
+      Elements.browsers.selectedPanel = tab.browser;
       return;
     }
 
@@ -744,11 +745,18 @@ var Browser = {
     if (this._selectedTab.isLoading())
       BrowserUI.lockToolbar();
 
-    if (lastTab)
+    if (oldBrowser) {
-      lastTab.active = false;
+      oldBrowser.setAttribute("type", "content");
+      oldBrowser.messageManager.sendAsyncMessage("Browser:Blur", {});
+    }
 
-    if (tab)
+    if (browser) {
-      tab.active = true;
+      browser.setAttribute("type", "content-primary");
+      Elements.browsers.selectedPanel = browser;
+      browser.messageManager.sendAsyncMessage("Browser:Focus", {});
+    }
+
+    document.getElementById("tabs").selectedTab = tab.chromeTab;
 
     if (!isFirstTab) {
       // Update all of our UI to reflect the new tab's location
@@ -795,8 +803,22 @@ var Browser = {
   },
 
   getNotificationBox: function getNotificationBox(aBrowser) {
-    let browser = aBrowser || this.selectedBrowser;
+    return document.getElementById("notifications");
-    return browser.parentNode;
+  },
+
+  removeTransientNotificationsForTab: function removeTransientNotificationsForTab(aTab) {
+    let notificationBox = this.getNotificationBox();
+    let notifications = notificationBox.allNotifications;
+    for (let n = notifications.length - 1; n >= 0; n--) {
+      let notification = notifications[n];
+      if (notification._chromeTab != aTab.chromeTab)
+        continue;
+
+      if (notification.persistence)
+        notification.persistence--;
+      else if (Date.now() > notification.timeout)
+        notificationBox.removeNotification(notification);
+    }
   },
 
   /**
@@ -1494,7 +1516,7 @@ const ContentTouchHandler = {
    */
   _targetIsContent: function _targetIsContent(aEvent) {
     let target = aEvent.target;
-    return target && target.classList.contains("inputHandler");
+    return target && target.id == "inputhandler-overlay";
   },
 
   _dispatchMouseEvent: function _dispatchMouseEvent(aName, aX, aY, aModifiers) {
@@ -2307,7 +2329,7 @@ ProgressController.prototype = {
       TapHighlightHelper.hide();
 
       this.browser.lastLocation = location;
-      Browser.getNotificationBox(this.browser).removeTransientNotifications();
+      Browser.removeTransientNotificationsForTab(this._tab);
       this._tab.resetZoomLevel();
 
       if (this._tab == Browser.selectedTab) {
@@ -2466,7 +2488,6 @@ var OfflineApps = {
 function Tab(aURI, aParams) {
   this._id = null;
   this._browser = null;
-  this._notification = null;
   this._state = null;
   this._listener = null;
   this._loading = false;
@@ -2488,10 +2509,6 @@ Tab.prototype = {
     return this._browser;
   },
 
-  get notification() {
-    return this._notification;
-  },
-
   get chromeTab() {
     return this._chromeTab;
   },
@@ -2500,18 +2517,6 @@ Tab.prototype = {
     return this._metadata || kDefaultMetadata;
   },
 
-  get inputHandler() {
-    if (!this._notification)
-      return null;
-    return this._notification.inputHandler;
-  },
-  
-  get overlay() {
-    if (!this._notification)
-      return null;
-    return this._notification.overlay;    
-  },
-
   /** Update browser styles when the viewport metadata changes. */
   updateViewportMetadata: function updateViewportMetadata(aMetadata) {
     this._metadata = aMetadata;
@@ -2629,10 +2634,6 @@ Tab.prototype = {
     if (this._browser)
       throw "Browser already exists";
 
-    // Create a notification box around the browser
-    let notification = this._notification = document.createElement("notificationbox");
-    notification.classList.add("inputHandler");
-
     // Create the browser using the current width the dynamically size the height
     let browser = this._browser = document.createElement("browser");
     browser.setAttribute("class", "window-width window-height");
@@ -2645,8 +2646,7 @@ Tab.prototype = {
     browser.setAttribute("remote", (!useLocal && useRemote) ? "true" : "false");
 
     // Append the browser to the document, which should start the page load
-    notification.appendChild(browser);
+    Elements.browsers.insertBefore(browser, aInsertBefore);
-    Elements.browsers.insertBefore(notification, aInsertBefore);
 
     // stop about:blank from loading
     browser.stop();
@@ -2669,17 +2669,15 @@ Tab.prototype = {
 
   _destroyBrowser: function _destroyBrowser() {
     if (this._browser) {
-      let notification = this._notification;
       let browser = this._browser;
       browser.removeProgressListener(this._listener);
       browser.messageManager.sendAsyncMessage("Browser:Blur", {});
 
-      this._notification = null;
       this._browser = null;
       this._listener = null;
       this._loading = false;
 
-      Elements.browsers.removeChild(notification);
+      Elements.browsers.removeChild(browser);
     }
   },
 
@@ -2768,31 +2766,6 @@ Tab.prototype = {
     this._chromeTab.updateThumbnail(browser, browser.contentWindowWidth, browser.contentWindowHeight);
   },
 
-  set active(aActive) {
-    if (!this._browser)
-      return;
-
-    let notification = this._notification;
-    let browser = this._browser;
-
-    if (aActive) {
-      browser.setAttribute("type", "content-primary");
-      Elements.browsers.selectedPanel = notification;
-      browser.messageManager.sendAsyncMessage("Browser:Focus", {});
-      document.getElementById("tabs").selectedTab = this._chromeTab;
-    }
-    else {
-      browser.setAttribute("type", "content");
-      browser.messageManager.sendAsyncMessage("Browser:Blur", {});
-    }
-  },
-
-  get active() {
-    if (!this._browser)
-      return false;
-    return this._browser.getAttribute("type") == "content-primary";
-  },
-
   toString: function() {
     return "[Tab " + (this._browser ? this._browser.currentURI.spec : "(no browser)") + "]";
   }

mobile/chrome/content/browser.xul

@@ -277,8 +277,12 @@
 
             <!-- Content viewport -->
             <vbox id="content-viewport" class="window-width window-height">
+              <stack id="content-stack" flex="1">
               <!-- Content viewport -->
                 <deck id="browsers" flex="1"/>
+                <html:canvas id="content-overlay" style="display: none; z-index: 1000;" left="0" top="0"/>
+                <html:div id="inputhandler-overlay" style="z-index: 1001" tabindex="-1"/>
+              </stack>
               <box id="content-navigator-spacer" hidden="true"/>
             </vbox>
           </vbox>

mobile/chrome/content/input.js

@@ -525,9 +525,6 @@ var ScrollUtils = {
           scrollbox = elem;
           qinterface = elem.scrollBoxObject;
           break;
-        } else if (elem.customDragger) {
-          scrollbox = elem;
-          break;
         } else if (elem.boxObject) {
           let qi = (elem._cachedSBO) ? elem._cachedSBO
                                      : elem.boxObject.QueryInterface(Ci.nsIScrollBoxObject);
@@ -536,6 +533,9 @@ var ScrollUtils = {
             scrollbox._cachedSBO = qinterface = qi;
             break;
           }
+        } else if (elem.customDragger) {
+          scrollbox = elem;
+          break;
         }
       } catch (e) { /* we aren't here to deal with your exceptions, we'll just keep
                        traversing until we find something more well-behaved, as we
@@ -1072,7 +1072,8 @@ GestureModule.prototype = {
     event.initEvent("CancelTouchSequence", true, true);
     let success = aEvent.target.dispatchEvent(event);
 
-    if (!success || (aEvent.target instanceof XULElement) || !Browser.selectedTab.allowZoom)
+    if (!success || (aEvent.target instanceof XULElement) ||
+        !Browser.selectedTab.allowZoom)
       return;
 
     // create the AnimatedZoom object for fast arbitrary zooming

mobile/chrome/content/notification.xml

@@ -8,41 +8,7 @@
 <bindings
     xmlns="http://www.mozilla.org/xbl"
     xmlns:xbl="http://www.mozilla.org/xbl"
-    xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+    xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
-    xmlns:html="http://www.w3.org/1999/xhtml">
-
-  <binding id="stacked-notificationbox" extends="chrome://global/content/bindings/notification.xml#notificationbox">
-    <content>
-      <xul:stack xbl:inherits="hidden=notificationshidden">
-        <xul:spacer/>
-        <children includes="notification"/>
-      </xul:stack>
-      <xul:stack flex="1">
-        <children/>
-        <html:canvas anonid="content-overlay"/>
-        <html:div flex="1" class="input-overlay" anonid="input-overlay"/>
-      </xul:stack>
-    </content>
-    <implementation>
-      <property name="inputHandler">
-        <getter>
-          return document.getAnonymousElementByAttribute(this, "anonid", "input-overlay");
-        </getter>
-      </property>
-
-      <property name="overlay">
-        <getter>
-          return document.getAnonymousElementByAttribute(this, "anonid", "content-overlay");
-        </getter>
-      </property>
-
-      <property name="customDragger">
-        <getter>
-          return this.parentNode.customDragger;
-        </getter>
-      </property>
-    </implementation>
-  </binding>
 
   <binding id="notification" extends="chrome://global/content/bindings/notification.xml#notification">
     <resources>
@@ -68,14 +34,27 @@
     </content>
 
     <implementation implements="nsIDOMEventListener">
+      <constructor>
+        <![CDATA[
+          this._chromeTab = Browser.selectedTab.chromeTab;
+          document.addEventListener("TabSelect", this, true);
+          document.addEventListener("TabClose", this, true);
+        ]]>
+      </constructor>
+
       // We need to override the close method here, otherwise the destructor
       // is not called on removeChild (see bug 230086)
       <method name="close">
         <body>
           <![CDATA[
             var control = this.control;
-            if (control)
+            if (control) {
+              document.removeEventListener("TabClose", this, true);
+              document.removeEventListener("TabSelect", this, true);
               control.removeNotification(this);
+            } else {
+              this.hidden = true;
+            }
             
             // Fire an event when closing a notification
             let event = document.createEvent("Events");
@@ -84,10 +63,32 @@
           ]]>
         </body>
       </method>
+
+      <method name="handleEvent">
+        <parameter name="aEvent"/>
+        <body>
+          <![CDATA[
+            switch(aEvent.type) {
+              case "TabSelect":
+                if (this._chromeTab == aEvent.target)
+                  this.hidden = false;
+                else
+                  this.hidden = true;
+                break;
+
+              case "TabClose":
+                if (this._chromeTab == aEvent.target)
+                  this.close();
+                break;
+            }
+          ]]>
+        </body>
+      </method>      
     </implementation>
   </binding>
 
   <binding id="geo-notification" extends="chrome://browser/content/notification.xml#notification">
+
     <resources>
       <stylesheet src="chrome://browser/skin/notification.css"/>
     </resources>

mobile/chrome/tests/browser_tabs.js

@@ -41,22 +41,22 @@ function load_tabs() {
 function tab_switch_01() {
   BrowserUI.selectTab(new_tab_01);
   is(Browser.selectedTab.browser.currentURI.spec, testURL_01, "Tab Switch 01 URL Matches");
-  is(Browser.selectedTab.notification, Elements.browsers.selectedPanel, "Deck has correct browser");
+  is(Browser.selectedTab.browser, Elements.browsers.selectedPanel, "Deck has correct browser");
 
   //Add new tab
   new_tab_02 =  Browser.addTab(testURL_02,false);
   new_tab_02.browser.addEventListener("load", tab_switch_02, true);
-  is(Browser.selectedTab.notification, Elements.browsers.selectedPanel, "Deck has correct browser");
+  is(Browser.selectedTab.browser, Elements.browsers.selectedPanel, "Deck has correct browser");
 }
 
 function tab_switch_02() {
   BrowserUI.selectTab(new_tab_02);
   is(Browser.selectedTab.browser.currentURI.spec, testURL_02, "Tab Switch 02 URL Matches");
-  is(Browser.selectedTab.notification, Elements.browsers.selectedPanel, "Deck has correct browser");
+  is(Browser.selectedTab.browser, Elements.browsers.selectedPanel, "Deck has correct browser");
 
   BrowserUI.selectTab(new_tab_01);
   is(Browser.selectedTab.browser.currentURI.spec, testURL_01, "Tab Switch 01 URL Matches");
-  is(Browser.selectedTab.notification, Elements.browsers.selectedPanel, "Deck has correct browser");
+  is(Browser.selectedTab.browser, Elements.browsers.selectedPanel, "Deck has correct browser");
 
   //Add new tab
   new_tab_03 =  Browser.addTab(testURL_03, true, new_tab_01);
@@ -66,11 +66,11 @@ function tab_switch_02() {
 function tab_switch_03() {
   is(Browser.selectedTab.browser.currentURI.spec, testURL_03, "Tab Switch 03 URL Matches"); 
   is(new_tab_03.owner, new_tab_01, "Tab 03 owned by tab 01");
-  is(Browser.selectedTab.notification, Elements.browsers.selectedPanel, "Deck has correct browser");
+  is(Browser.selectedTab.browser, Elements.browsers.selectedPanel, "Deck has correct browser");
 
   Browser.closeTab(new_tab_03);
   is(Browser.selectedTab, new_tab_01, "Closing tab 03 returns to owner");
-  is(Browser.selectedTab.notification, Elements.browsers.selectedPanel, "Deck has correct browser");
+  is(Browser.selectedTab.browser, Elements.browsers.selectedPanel, "Deck has correct browser");
 
   new_tab_03 =  Browser.addTab(testURL_03, true, new_tab_01);
   new_tab_03.browser.addEventListener("load", tab_switch_04, true);
@@ -79,12 +79,12 @@ function tab_switch_03() {
 function tab_switch_04() {
   is(Browser.selectedTab.browser.currentURI.spec, testURL_03, "Tab Switch 03 URL Matches"); 
   is(new_tab_03.owner, new_tab_01, "Tab 03 owned by tab 01");
-  is(Browser.selectedTab.notification, Elements.browsers.selectedPanel, "Deck has correct browser");
+  is(Browser.selectedTab.browser, Elements.browsers.selectedPanel, "Deck has correct browser");
 
   Browser.closeTab(new_tab_01);
   is(Browser.selectedTab, new_tab_03, "Closing tab 01 keeps selectedTab");
   is(new_tab_03.owner, null, "Closing tab 01 nulls tab3 owner");
-  is(Browser.selectedTab.notification, Elements.browsers.selectedPanel, "Deck has correct browser");
+  is(Browser.selectedTab.browser, Elements.browsers.selectedPanel, "Deck has correct browser");
 
   done();
 }