From e7968109b1623c3105c9d581d19387a8dcb70ba6 Mon Sep 17 00:00:00 2001 From: Paul Rouget Date: Mon, 10 Nov 2014 03:37:03 +0100 Subject: [PATCH] Bug 1091036 - Allow toolbox full screen for remote runtime projects. r=jryans --- browser/devtools/webide/content/webide.js | 17 +++++ browser/devtools/webide/test/chrome.ini | 1 + .../webide/test/test_fullscreenToolbox.html | 74 +++++++++++++++++++ browser/devtools/webide/themes/webide.css | 11 +++ 4 files changed, 103 insertions(+) create mode 100644 browser/devtools/webide/test/test_fullscreenToolbox.html diff --git a/browser/devtools/webide/content/webide.js b/browser/devtools/webide/content/webide.js index 44576be65d7a..fa05719d017f 100644 --- a/browser/devtools/webide/content/webide.js +++ b/browser/devtools/webide/content/webide.js @@ -738,6 +738,7 @@ let UI = { } deck.selectedPanel = panel; this.updateProjectEditorMenusVisibility(); + this.updateToolboxFullscreenState(); }, resetDeck: function() { @@ -896,6 +897,8 @@ let UI = { splitter.removeAttribute("hidden"); let iframe = document.createElement("iframe"); + iframe.id = "toolbox"; + document.querySelector("notificationbox").insertBefore(iframe, splitter.nextSibling); let host = devtools.Toolbox.HostType.CUSTOM; let options = { customIframe: iframe }; @@ -906,9 +909,22 @@ let UI = { document.querySelector("#action-button-debug").setAttribute("active", "true"); + this.updateToolboxFullscreenState(); return gDevTools.showToolbox(target, null, host, options); }, + updateToolboxFullscreenState: function() { + let panel = document.querySelector("#deck").selectedPanel; + let nbox = document.querySelector("#notificationbox"); + if (panel.id == "deck-panel-details" && + AppManager.selectedProject.type != "packaged" && + this.toolboxIframe) { + nbox.setAttribute("toolboxfullscreen", "true"); + } else { + nbox.removeAttribute("toolboxfullscreen"); + } + }, + closeToolboxUI: function() { this.resetFocus(); Services.prefs.setIntPref("devtools.toolbox.footer.height", this.toolboxIframe.height); @@ -921,6 +937,7 @@ let UI = { let splitter = document.querySelector(".devtools-horizontal-splitter"); splitter.setAttribute("hidden", "true"); document.querySelector("#action-button-debug").removeAttribute("active"); + this.updateToolboxFullscreenState(); }, }; diff --git a/browser/devtools/webide/test/chrome.ini b/browser/devtools/webide/test/chrome.ini index e4a6aa6aa299..9cd589fea03f 100644 --- a/browser/devtools/webide/test/chrome.ini +++ b/browser/devtools/webide/test/chrome.ini @@ -39,3 +39,4 @@ support-files = [test_autoconnect_runtime.html] [test_telemetry.html] [test_device_preferences.html] +[test_fullscreenToolbox.html] diff --git a/browser/devtools/webide/test/test_fullscreenToolbox.html b/browser/devtools/webide/test/test_fullscreenToolbox.html new file mode 100644 index 000000000000..8834a41182e1 --- /dev/null +++ b/browser/devtools/webide/test/test_fullscreenToolbox.html @@ -0,0 +1,74 @@ + + + + + + + + + + + + + + + + + + + diff --git a/browser/devtools/webide/themes/webide.css b/browser/devtools/webide/themes/webide.css index 6fd1787db1d8..38d34533e254 100644 --- a/browser/devtools/webide/themes/webide.css +++ b/browser/devtools/webide/themes/webide.css @@ -291,3 +291,14 @@ panel > .panel-arrowcontainer > .panel-arrowcontent { position: relative; border-bottom: 1px solid #aaa; } + +/* Toolbox */ + +#notificationbox[toolboxfullscreen] > .devtools-horizontal-splitter, +#notificationbox[toolboxfullscreen] > #deck { + display: none; +} + +#notificationbox[toolboxfullscreen] > #toolbox { + -moz-box-flex: 1; +}