Bug 923810 - Update the Metro progress bar when switching tabs [r=jimm]
authorMatt Brubeck <mbrubeck@mozilla.com>
Tue, 08 Oct 2013 14:08:42 -0700
changeset 150177 775f94fe7a01
parent 150176 da823cb1e924
child 150178 ce7d9ece6243
push id25425
push usercbook@mozilla.com
push dateWed, 09 Oct 2013 08:16:06 +0000
treeherdermozilla-central@c22969eec61d [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjimm
bugs923810
milestone27.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 923810 - Update the Metro progress bar when switching tabs [r=jimm]
browser/metro/base/content/WebProgress.js
browser/metro/base/content/browser.js
--- a/browser/metro/base/content/WebProgress.js
+++ b/browser/metro/base/content/WebProgress.js
@@ -6,18 +6,16 @@
 const kHeartbeatDuration = 1000;
 // Start and end progress screen css margins as percentages
 const kProgressMarginStart = 30;
 const kProgressMarginEnd = 70;
 
 const WebProgress = {
   get _identityBox() { return document.getElementById("identity-box"); },
 
-  _progressActive: false,
-
   init: function init() {
     messageManager.addMessageListener("Content:StateChange", this);
     messageManager.addMessageListener("Content:LocationChange", this);
     messageManager.addMessageListener("Content:SecurityChange", this);
 
     Elements.progress.addEventListener("transitionend", this, true);
     Elements.tabList.addEventListener("TabSelect", this, true);
 
@@ -42,29 +40,29 @@ const WebProgress = {
 
         if (json.stateFlags & Ci.nsIWebProgressListener.STATE_IS_NETWORK) {
           if (json.stateFlags & Ci.nsIWebProgressListener.STATE_START)
             this._networkStart(json, tab);
           else if (json.stateFlags & Ci.nsIWebProgressListener.STATE_STOP)
             this._networkStop(json, tab);
         }
 
-        this._progressStep();
+        this._progressStep(tab);
         break;
       }
 
       case "Content:LocationChange": {
         this._locationChange(json, tab);
-        this._progressStep();
+        this._progressStep(tab);
         break;
       }
 
       case "Content:SecurityChange": {
         this._securityChange(json, tab);
-        this._progressStep();
+        this._progressStep(tab);
         break;
       }
     }
   },
 
   handleEvent: function handleEvent(aEvent) {
     switch (aEvent.type) {
       case "transitionend":
@@ -148,67 +146,70 @@ const WebProgress = {
 
   _windowStop: function _windowStop(aJson, aTab) {
     this._progressStop(aJson, aTab);
   },
 
   _progressStart: function _progressStart(aJson, aTab) {
     // We will get multiple calls from _windowStart, so
     // only process once.
-    if (this._progressActive)
+    if (aTab._progressActive)
       return;
 
-    this._progressActive = true;
+    aTab._progressActive = true;
 
+    // 'Whoosh' in
+    aTab._progressCount = kProgressMarginStart;
+    this._showProgressBar(aTab);
+  },
+
+  _showProgressBar: function (aTab) {
     // display the track
     Elements.progressContainer.removeAttribute("collapsed");
-
-    // 'Whoosh' in
-    this._progressCount = kProgressMarginStart;
-    Elements.progress.style.width = this._progressCount + "%";
+    Elements.progress.style.width = aTab._progressCount + "%";
     Elements.progress.removeAttribute("fade");
 
     // Create a pulse timer to keep things moving even if we don't
     // collect any state changes.
     setTimeout(function() {
-      WebProgress._progressStepTimer();
+      WebProgress._progressStepTimer(aTab);
     }, kHeartbeatDuration, this);
   },
 
-  _stepProgressCount: function _stepProgressCount() {
+  _stepProgressCount: function _stepProgressCount(aTab) {
     // Step toward the end margin in smaller slices as we get closer
-    let left = kProgressMarginEnd - this._progressCount;
+    let left = kProgressMarginEnd - aTab._progressCount;
     let step = left * .05;
-    this._progressCount += Math.ceil(step);
+    aTab._progressCount += Math.ceil(step);
 
     // Don't go past the 'whoosh out' margin.
-    if (this._progressCount > kProgressMarginEnd) {
-      this._progressCount = kProgressMarginEnd;
+    if (aTab._progressCount > kProgressMarginEnd) {
+      aTab._progressCount = kProgressMarginEnd;
     }
   },
 
-  _progressStep: function _progressStep() {
-    if (!this._progressActive)
+  _progressStep: function _progressStep(aTab) {
+    if (!aTab._progressActive)
       return;
-    this._stepProgressCount();
-    Elements.progress.style.width = this._progressCount + "%";
+    this._stepProgressCount(aTab);
+    Elements.progress.style.width = aTab._progressCount + "%";
   },
 
-  _progressStepTimer: function _progressStepTimer() {
-    if (!this._progressActive)
+  _progressStepTimer: function _progressStepTimer(aTab) {
+    if (!aTab._progressActive)
       return;
-    this._progressStep();
+    this._progressStep(aTab);
 
     setTimeout(function() {
-      WebProgress._progressStepTimer();
+      WebProgress._progressStepTimer(aTab);
     }, kHeartbeatDuration, this);
   },
 
   _progressStop: function _progressStop(aJson, aTab) {
-    this._progressActive = false;
+    aTab._progressActive = false;
     // 'Whoosh out' and fade
     Elements.progress.style.width = "100%";
     Elements.progress.setAttribute("fade", true);
   },
 
   _progressTransEnd: function _progressTransEnd(aEvent) {
     if (!Elements.progress.hasAttribute("fade"))
       return;
@@ -217,14 +218,20 @@ const WebProgress = {
       Elements.progress.style.width = "0px";
       Elements.progressContainer.setAttribute("collapsed", true);
     }
   },
 
   _onTabSelect: function(aEvent) {
     let tab = Browser.getTabFromChrome(aEvent.originalTarget);
     this._identityBox.className = tab._identityState || "";
+    if (tab._progressActive) {
+      this._showProgressBar(tab);
+    } else {
+      Elements.progress.setAttribute("fade", true);
+      Elements.progressContainer.setAttribute("collapsed", true);
+    }
   },
 
   _onUrlBarInput: function(aEvent) {
     Browser.selectedTab._identityState = this._identityBox.className = "";
   },
 };
--- a/browser/metro/base/content/browser.js
+++ b/browser/metro/base/content/browser.js
@@ -1233,16 +1233,18 @@ function showDownloadManager(aWindowCont
   // TODO: Bug 883962: Toggle the downloads infobar as our current "download manager".
 }
 
 function Tab(aURI, aParams, aOwner) {
   this._id = null;
   this._browser = null;
   this._notification = null;
   this._loading = false;
+  this._progressActive = false;
+  this._progressCount = 0;
   this._chromeTab = null;
   this._eventDeferred = null;
   this._updateThumbnailTimeout = null;
 
   this.owner = aOwner || null;
 
   // Set to 0 since new tabs that have not been viewed yet are good tabs to
   // toss if app needs more memory.