Bug 1239437 - Delegate to empty, new responsive UI tool if enabled. r=pbrosset
--- a/devtools/client/moz.build
+++ b/devtools/client/moz.build
@@ -18,16 +18,17 @@ DIRS += [
'jsonview',
'locales',
'memory',
'netmonitor',
'performance',
'preferences',
'projecteditor',
'promisedebugger',
+ 'responsive.html',
'responsivedesign',
'scratchpad',
'shadereditor',
'shared',
'shims',
'sourceeditor',
'storage',
'styleeditor',
--- a/devtools/client/preferences/devtools.js
+++ b/devtools/client/preferences/devtools.js
@@ -320,8 +320,12 @@ pref("devtools.fontinspector.enabled", t
pref("devtools.telemetry.tools.opened.version", "{}");
// Enable the JSON View tool (an inspector for application/json documents)
#ifdef MOZ_DEV_EDITION
pref("devtools.jsonview.enabled", true);
#else
pref("devtools.jsonview.enabled", false);
#endif
+
+// Disable the HTML responsive design tool by default. Currently disabled until
+// ready to replace the legacy XUL version.
+pref("devtools.responsive.html.enabled", false);
new file mode 100644
--- /dev/null
+++ b/devtools/client/responsive.html/manager.js
@@ -0,0 +1,115 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const promise = require("promise");
+const EventEmitter = require("devtools/shared/event-emitter");
+
+/**
+ * ResponsiveUIManager is the external API for the browser UI, etc. to use when
+ * opening and closing the responsive UI.
+ *
+ * While the HTML UI is in an experimental stage, the older ResponsiveUIManager
+ * from devtools/client/responsivedesign/responsivedesign.jsm delegates to this
+ * object when the pref "devtools.responsive.html.enabled" is true.
+ */
+exports.ResponsiveUIManager = {
+ activeTabs: new Map(),
+
+ /**
+ * Toggle the responsive UI for a tab.
+ *
+ * @param window
+ * The main browser chrome window.
+ * @param tab
+ * The browser tab.
+ * @return Promise
+ * Resolved when the toggling has completed.
+ */
+ toggle(window, tab) {
+ if (this.isActiveForTab(tab)) {
+ this.activeTabs.get(tab).close();
+ } else {
+ this.runIfNeeded(window, tab);
+ }
+ // TODO: Becomes a more interesting value in a later patch
+ return promise.resolve();
+ },
+
+ /**
+ * Launches the responsive UI.
+ *
+ * @param window
+ * The main browser chrome window.
+ * @param tab
+ * The browser tab.
+ */
+ runIfNeeded(window, tab) {
+ if (!this.isActiveForTab(tab)) {
+ // TODO: Unimplemented
+ }
+ },
+
+ /**
+ * Returns true if responsive UI is active for a given tab.
+ *
+ * @param tab
+ * The browser tab.
+ * @return boolean
+ */
+ isActiveForTab(tab) {
+ return this.activeTabs.has(tab);
+ },
+
+ /**
+ * Return the responsive UI controller for a tab.
+ *
+ * @param tab
+ * The browser tab.
+ * @return TODO: Some object!
+ */
+ getResponsiveUIForTab(tab) {
+ return this.activeTabs.get(tab);
+ },
+
+ /**
+ * Handle GCLI commands.
+ *
+ * @param window
+ * The main browser chrome window.
+ * @param tab
+ * The browser tab.
+ * @param command
+ * The GCLI command name.
+ * @param args
+ * The GCLI command arguments.
+ */
+ handleGcliCommand: function(window, tab, command, args) {
+ switch (command) {
+ case "resize to":
+ this.runIfNeeded(window, tab);
+ // TODO: Probably the wrong API
+ this.activeTabs.get(tab).setSize(args.width, args.height);
+ break;
+ case "resize on":
+ this.runIfNeeded(window, tab);
+ break;
+ case "resize off":
+ if (this.isActiveForTab(tab)) {
+ // TODO: Probably the wrong API
+ this.activeTabs.get(tab).close();
+ }
+ break;
+ case "resize toggle":
+ this.toggle(window, tab);
+ break;
+ default:
+ }
+ }
+};
+
+// GCLI commands in ../responsivedesign/resize-commands.js listen for events
+// from this object to know when the UI for a tab has opened or closed.
+EventEmitter.decorate(exports.ResponsiveUIManager);
new file mode 100644
--- /dev/null
+++ b/devtools/client/responsive.html/moz.build
@@ -0,0 +1,9 @@
+# -*- Mode: python; c-basic-offset: 4; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'manager.js',
+)
--- a/devtools/client/responsivedesign/responsivedesign.jsm
+++ b/devtools/client/responsivedesign/responsivedesign.jsm
@@ -34,17 +34,17 @@ const SLOW_RATIO = 6;
const ROUND_RATIO = 10;
const INPUT_PARSER = /(\d+)[^\d]+(\d+)/;
const SHARED_L10N = new ViewHelpers.L10N("chrome://devtools/locale/shared.properties");
var ActiveTabs = new Map();
-this.ResponsiveUIManager = {
+var Manager = {
/**
* Check if the a tab is in a responsive mode.
* Leave the responsive mode if active,
* active the responsive mode if not active.
*
* @param aWindow the main window.
* @param aTab the tab targeted.
*/
@@ -108,17 +108,28 @@ this.ResponsiveUIManager = {
break;
case "resize toggle":
this.toggle(aWindow, aTab);
default:
}
}
}
-EventEmitter.decorate(ResponsiveUIManager);
+EventEmitter.decorate(Manager);
+
+// If the experimental HTML UI is enabled, delegate the ResponsiveUIManager API
+// over to that tool instead. Performing this delegation here allows us to
+// contain the pref check to a single place.
+if (Services.prefs.getBoolPref("devtools.responsive.html.enabled")) {
+ let { ResponsiveUIManager } =
+ require("devtools/client/responsive.html/manager");
+ this.ResponsiveUIManager = ResponsiveUIManager;
+} else {
+ this.ResponsiveUIManager = Manager;
+}
var presets = [
// Phones
{key: "320x480", width: 320, height: 480}, // iPhone, B2G, with <meta viewport>
{key: "360x640", width: 360, height: 640}, // Android 4, phones, with <meta viewport>
// Tablets
{key: "768x1024", width: 768, height: 1024}, // iPad, with <meta viewport>