Bug 972069 - show progressbar when installing app. r=jryans

This commit is contained in:
Paul Rouget 2014-06-30 14:46:25 +02:00
parent 8ac74f4d41
commit 88416bf91e
4 changed files with 71 additions and 18 deletions

View File

@ -138,6 +138,8 @@ let UI = {
this.updateProjectButton();
this.updateProjectEditorHeader();
break;
case "install-progress":
this.updateProgress(Math.round(100 * details.bytesSent / details.totalBytes));
};
},
@ -169,34 +171,71 @@ let UI = {
}
},
/********** BUSY UI **********/
_busyTimeout: null,
_busyOperationDescription: null,
_busyPromise: null,
updateProgress: function(percent) {
let progress = document.querySelector("#action-busy-determined");
progress.mode = "determined";
progress.value = percent;
this.setupBusyTimeout();
},
busy: function() {
this.hidePanels();
document.querySelector("window").classList.add("busy")
let win = document.querySelector("window");
win.classList.add("busy")
win.classList.add("busy-undetermined");
this.updateCommands();
},
unbusy: function() {
document.querySelector("window").classList.remove("busy")
let win = document.querySelector("window");
win.classList.remove("busy")
win.classList.remove("busy-determined");
win.classList.remove("busy-undetermined");
this.updateCommands();
this._busyPromise = null;
},
setupBusyTimeout: function() {
this.cancelBusyTimeout();
this._busyTimeout = setTimeout(() => {
this.unbusy();
UI.reportError("error_operationTimeout", this._busyOperationDescription);
this._busyPromise.reject("promise timeout: " + this._busyOperationDescription);
}, 30000);
},
cancelBusyTimeout: function() {
clearTimeout(this._busyTimeout);
},
busyWithProgressUntil: function(promise, operationDescription) {
this.busyUntil(promise, operationDescription);
let win = document.querySelector("window");
let progress = document.querySelector("#action-busy-determined");
progress.mode = "undetermined";
win.classList.add("busy-determined");
win.classList.remove("busy-undetermined");
},
busyUntil: function(promise, operationDescription) {
// Freeze the UI until the promise is resolved. A 30s timeout
// will unfreeze the UI, just in case the promise never gets
// resolved.
this._busyPromise = promise;
let timeout = setTimeout(() => {
this.unbusy();
UI.reportError("error_operationTimeout", operationDescription);
promise.reject("promise timeout: " + operationDescription);
}, 30000);
this._busyOperationDescription = operationDescription;
this.setupBusyTimeout();
this.busy();
promise.then(() => {
clearTimeout(timeout);
this.cancelBusyTimeout();
this.unbusy();
}, (e) => {
clearTimeout(timeout);
this.cancelBusyTimeout();
UI.reportError("error_operationFail", operationDescription);
console.error(e);
this.unbusy();
@ -396,6 +435,12 @@ let UI = {
return;
}
// Save last project location
if (project.location) {
Services.prefs.setCharPref("devtools.webide.lastprojectlocation", project.location);
}
// Make sure the directory exist before we show Project Editor
let forceDetailsOnly = false;
@ -420,10 +465,6 @@ let UI = {
this.getProjectEditor().then(() => {
this.updateProjectEditorHeader();
}, console.error);
if (project.location) {
Services.prefs.setCharPref("devtools.webide.lastprojectlocation", project.location);
}
},
/********** DECK **********/
@ -823,12 +864,11 @@ let Cmds = {
play: function() {
switch(AppManager.selectedProject.type) {
case "packaged":
return UI.busyWithProgressUntil(AppManager.installAndRunProject(), "installing and running app");
case "hosted":
return UI.busyUntil(AppManager.installAndRunProject(), "installing and running app");
break;
case "runtimeApp":
return UI.busyUntil(AppManager.runRuntimeApp(), "running app");
break;
}
return promise.reject();
},

View File

@ -102,7 +102,10 @@
<toolbarbutton id="action-button-play" class="action-button" command="cmd_play" tooltiptext="&projectMenu_play_label;"/>
<toolbarbutton id="action-button-stop" class="action-button" command="cmd_stop" tooltiptext="&projectMenu_stop_label;"/>
<toolbarbutton id="action-button-debug" class="action-button" command="cmd_toggleToolbox" tooltiptext="&projectMenu_debug_label;"/>
<html:img id="action-busy" src="chrome://webide/skin/throbber.svg"/>
<hbox id="action-busy" align="center">
<html:img id="action-busy-undetermined" src="chrome://webide/skin/throbber.svg"/>
<progressmeter id="action-busy-determined"/>
</hbox>
</hbox>
<hbox id="panel-buttons-container">

View File

@ -59,11 +59,15 @@ exports.AppManager = AppManager = {
this.trackWiFiRuntimes();
this.trackSimulatorRuntimes();
this.onInstallProgress = this.onInstallProgress.bind(this);
AppActorFront.on("install-progress", this.onInstallProgress);
this.observe = this.observe.bind(this);
Services.prefs.addObserver(WIFI_SCANNING_PREF, this, false);
},
uninit: function() {
AppActorFront.off("install-progress", this.onInstallProgress);
this._unlistenToApps();
this.selectedProject = null;
this.selectedRuntime = null;
@ -134,6 +138,10 @@ exports.AppManager = AppManager = {
this.update("connection");
},
onInstallProgress: function(event, details) {
this.update("install-progress", details);
},
onWebAppsStoreready: function() {
this.update("runtime-apps-found");
},

View File

@ -21,13 +21,15 @@
pointer-events: auto;
}
#action-busy {
#action-busy-undetermined {
height: 24px;
width: 24px;
}
window.busy .action-button,
window:not(.busy) #action-busy {
window:not(.busy) #action-busy,
window.busy-undetermined #action-busy-determined,
window.busy-determined #action-busy-undetermined {
display: none;
}