From bf59d14a73fe8b2bfc4462a63e7e24648d6bf683 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Wed, 2 Sep 2015 17:59:16 +0200 Subject: [PATCH 01/20] move all debug clients, webide connections and toolboxes tracking in the InspectorService --- lib/inspector-service.js | 67 +++++++++++++++++++++++++++++-- lib/main.js | 5 +-- lib/webide-connections-monitor.js | 34 +++++----------- 3 files changed, 75 insertions(+), 31 deletions(-) diff --git a/lib/inspector-service.js b/lib/inspector-service.js index e0cbf46..fe2079a 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -49,10 +49,10 @@ const InspectorService = initialize: function() { Trace.sysout("InspectorService.initialize;", arguments); - // Transport listeners (key == debugger client instance) - this.listeners = new Map(); - this.onDebuggerClientConnect = this.onDebuggerClientConnect.bind(this); + // keeps track of connections and their relared targets/toolboxes/webide connections + this.clientsMap = new Map(); + this.onDebuggerClientConnect = this.onDebuggerClientConnect.bind(this); on(DebuggerClient, "connect", this.onDebuggerClientConnect); }, @@ -61,27 +61,86 @@ const InspectorService = off(DebuggerClient, "connect", this.onDebuggerClientConnect); + // TODO: cleanup clientsMap + this.unregisterActors(); }, + _setClientInfo(client, moreInfo) { + if (!client) { + return; + } + let clientInfo = this.clientsMap.get(client) || {}; + this.clientsMap.set(client, Object.assign({}, clientInfo, moreInfo)); + }, + // Toolbox Events - onToolboxCreated: function(/*eventId, toolbox*/) { + onToolboxCreated: function(eventId, toolbox) { Trace.sysout("InspectorService.onToolboxCreated;"); + + this._setClientInfo(toolbox.target.client, { toolbox }); }, onToolboxReady: function(eventId, toolbox) { Trace.sysout("InspectorService.onToolboxReady;", toolbox); + + let clientInfo = this.clientsMap.get(toolbox.target.client); + + let inspectorWindowName; + + if (clientInfo && clientInfo.webide) { + inspectorWindowName = `WebIDE: ${clientInfo.webide.selectedRuntime.name}`; + } else if (toolbox.target.isLocalTab) { + inspectorWindowName = `Tab: ${toolbox.target.tab.label}`; + } + + const { ToolboxOverlay } = require("./toolbox-overlay"); + let toolboxOverlay = new ToolboxOverlay({ inspectorWindowName, toolbox }); + + this._setClientInfo(toolbox.target.client, { toolboxOverlay }); + + toolboxOverlay.toggleInspector(); }, onToolboxDestroy: function(/*eventId, toolbox*/) { Trace.sysout("InspectorService.onToolboxDestroy;"); }, + // WebIDE Connections Events + + onWebIDEConnectionCreated: function(/*{ connection }*/) { + Trace.sysout("InspectorService.onWebIDEConnectionCreated"); + }, + + onWebIDEConnectionReady: function({ connection, selectedRuntime }) { + Trace.sysout("InspectorService.onWebIDEConnectionReady"); + + this._setClientInfo(connection.client, { + webide: { selectedRuntime, connection } + }); + }, + // Connection Events onDebuggerClientConnect: function(client) { Trace.sysout("InspectorService.onDebuggerClientConnect;", client); + + client.addOneTimeListener("closed", () => { + this.onDebuggerClientClosed(client); + }); + }, + + onDebuggerClientClosed: function(client) { + Trace.sysout("InspectorService.onDebuggerClientClosed;", client); + + // TODO: any more cleanup tasks needed here? + let clientInfo = this.clientsMap.get(client); + if (clientInfo && clientInfo.toolboxOverlay) { + clientInfo.toolboxOverlay.destroy(); + } + + this.clientsMap.delete(client); }, // Backend Actors diff --git a/lib/main.js b/lib/main.js index f5bdbba..0a6c62b 100644 --- a/lib/main.js +++ b/lib/main.js @@ -10,7 +10,7 @@ const { ToolboxChrome } = require("firebug.sdk/lib/toolbox-chrome.js"); // RDP Inspector require("./start-button.js"); require("./webide-connections-monitor"); -const { ToolboxOverlay } = require("./toolbox-overlay.js"); +// const { ToolboxOverlay } = require("./toolbox-overlay.js"); // Localization files Locale.registerStringBundle("chrome://rdpinspector/locale/toolbox.properties"); @@ -25,14 +25,11 @@ function main(options/*, callbacks*/) { Trace.sysout("main;", options); ToolboxChrome.initialize(options); - ToolboxChrome.registerToolboxOverlay(ToolboxOverlay); } function onUnload(reason) { Trace.sysout("onUnload; " + reason); - ToolboxChrome.unregisterToolboxOverlay(ToolboxOverlay); - ToolboxChrome.shutdown(reason); } diff --git a/lib/webide-connections-monitor.js b/lib/webide-connections-monitor.js index 4ae257e..5bfdaa0 100644 --- a/lib/webide-connections-monitor.js +++ b/lib/webide-connections-monitor.js @@ -8,8 +8,6 @@ module.metadata = { const { prefs } = require("sdk/simple-prefs"); -const { ToolboxOverlay } = require("./toolbox-overlay"); - // Firebug SDK const { Dispatcher } = require("firebug.sdk/lib/dispatcher"); const { Trace/*, TraceError*/ } = require("firebug.sdk/lib/core/trace.js").get(module.id); @@ -24,8 +22,13 @@ const { AppManager } = safeRequire(devtools, "devtools/webide/app-manager", "devtools/client/webide/modules/app-manager"); +/** + * @service This service monitors the connections created by WebIDE and dispatch the + * webide connection lifecycle events, which are used by the InspectorService to keep + * track of the existent debugger clients (and their related toolboxes). + */ const WebIDEConnectionsMonitor = -/** @lends ConnectionsMonitor */ +/** @lends WebIDEConnectionsMonitor */ { // Initialization @@ -35,8 +38,6 @@ const WebIDEConnectionsMonitor = this.onNewConnection = this.onNewConnection.bind(this); this.onDestroyConnection = this.onDestroyConnection.bind(this); - this.toolboxOverlays = new Map(); - ConnectionManager.on("new", this.onNewConnection); ConnectionManager.on("destroy", this.onDestroyConnection); }, @@ -49,21 +50,12 @@ const WebIDEConnectionsMonitor = onNewConnection: function(type, connection) { Trace.sysout("WebIDEConnectionsMonitor.onNewConnection;", arguments); + Dispatcher.emit("onWebIDEConnectionCreated", [{ connection }]); + connection.on(Connection.Events.CONNECTED, () => { if (prefs.webideConnectionsMonitor && AppManager.connection == connection) { - let toolboxOverlay = new ToolboxOverlay({ - inspectorWindowName: AppManager.selectedRuntime.name, - // fake webide toolbox - toolbox: { - target: { - makeRemote: function() {}, - client: connection.client - } - } - }); - this.toolboxOverlays.set(connection, toolboxOverlay); - - toolboxOverlay.toggleInspector(); + + Dispatcher.emit("onWebIDEConnectionReady", [{ connection, selectedRuntime: AppManager.selectedRuntime }]); } }); }, @@ -71,11 +63,7 @@ const WebIDEConnectionsMonitor = onDestroyConnection: function(type, connection) { Trace.sysout("WebIDEConnectionsMonitor.onDestroyConnection;", arguments); - if (this.toolboxOverlays.has(connection)) { - let toolboxOverlay = this.toolboxOverlays.get(connection); - this.toolboxOverlays.delete(connection); - toolboxOverlay.destroy(); - } + Dispatcher.emit("onWebIDEConnectionDestroy", [ { connection } ]); } }; From 7f73cb22f4578e6257955571e6b8fd060bf04610 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Wed, 2 Sep 2015 18:11:50 +0200 Subject: [PATCH 02/20] support multiple concurrently opened InspectorWindow --- lib/inspector-service.js | 2 +- lib/inspector-window.js | 21 +++++++++------------ lib/toolbox-overlay.js | 4 ++-- 3 files changed, 12 insertions(+), 15 deletions(-) diff --git a/lib/inspector-service.js b/lib/inspector-service.js index fe2079a..4ced4b5 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -100,7 +100,7 @@ const InspectorService = this._setClientInfo(toolbox.target.client, { toolboxOverlay }); - toolboxOverlay.toggleInspector(); + toolboxOverlay.openInspectorWindow(); }, onToolboxDestroy: function(/*eventId, toolbox*/) { diff --git a/lib/inspector-window.js b/lib/inspector-window.js index 96bdea8..2e495f7 100644 --- a/lib/inspector-window.js +++ b/lib/inspector-window.js @@ -29,7 +29,6 @@ const { Options } = require("firebug.sdk/lib/core/options.js"); const { InspectorService } = require("./inspector-service.js"); const nsIFilePicker = Ci.nsIFilePicker; -const WINDOW_TYPE = "RDPInspectorConsole"; const INSPECTOR_XUL_URL = "chrome://rdpinspector/content/inspector-window.xul"; /** @@ -71,30 +70,28 @@ const InspectorWindow = Class( } }, - toggle: function() { + open: function() { Trace.sysout("InspectorWindow.toggle;", arguments); - let win = getMostRecentWindow(WINDOW_TYPE); - - // If the Inspector is already opened, just reuse the window. - if (win) { - win.focus(); - return win; + // If the Inspector is already opened, focus and return it. + if (this.win) { + this.win.focus(); + return this.win; } let url = INSPECTOR_XUL_URL; - return this.open("rdp-inspector", url, [{ + return this._open("rdp-inspector", url, [{ inspectorWindowName: this.inspectorWindowName }]); }, - open: function(windowType, url, params) { + _open: function(windowType, url, params) { Trace.sysout("InspectorWindow.open;", arguments); - // Open RDP Inspector console window. The + // Open RDP Inspector console window. this.win = openDialog({ url: url, - name: Locale.$STR("rdpInspector.startButton.title"), + name: this.inspectorWindowName, args: params, features: "chrome,resizable,scrollbars=auto,minimizable,dialog=no" }); diff --git a/lib/toolbox-overlay.js b/lib/toolbox-overlay.js index 72ca561..f2f0afe 100644 --- a/lib/toolbox-overlay.js +++ b/lib/toolbox-overlay.js @@ -190,7 +190,7 @@ const ToolboxOverlay = Class( // Commands - toggleInspector: function() { + openInspectorWindow: function() { Trace.sysout("ToolboxOverlay.toggleInspector;"); if (!this.inspector) { @@ -198,7 +198,7 @@ const ToolboxOverlay = Class( } // Show or hide the popup panel. - this.inspector.toggle(); + this.inspector.open(); return this.inspector; } From bd32e0635c54f9f7e656962b8f540bece44b2892 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Wed, 2 Sep 2015 18:21:26 +0200 Subject: [PATCH 03/20] open / reopen the InspectorWindow on start button clicks --- lib/inspector-service.js | 12 ++++++++++++ lib/start-button.js | 17 +++-------------- 2 files changed, 15 insertions(+), 14 deletions(-) diff --git a/lib/inspector-service.js b/lib/inspector-service.js index 4ced4b5..cb1ae65 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -121,6 +121,18 @@ const InspectorService = }); }, + // Start button events + + onToggleRDPInspector: function({ toolbox }) { + Trace.sysout("InspectorService.onToggleRDPInspector;", toolbox); + + let clientInfo = this.clientsMap.get(toolbox.target.client); + + if (clientInfo && clientInfo.toolboxOverlay) { + clientInfo.toolboxOverlay.openInspectorWindow(); + } + }, + // Connection Events onDebuggerClientConnect: function(client) { diff --git a/lib/start-button.js b/lib/start-button.js index a696146..7495ae6 100644 --- a/lib/start-button.js +++ b/lib/start-button.js @@ -213,20 +213,9 @@ var StartButton = Trace.sysout("startButton.onToggleRdpInspector;"); return getToolboxWhenReady().then(toolbox => { - let context = ToolboxChrome.getContext(toolbox); - let overlayId = ToolboxOverlay.prototype.overlayId; - let overlay = context.getOverlay(overlayId); - if (!overlay) { - TraceError.sysout("startButton.onToggleRdpInspector; ERROR " + - " No overlay: " + overlayId, context); - return null; - } - - let win = overlay.toggleInspector(); - - // xxxHonza: register listeners to update the UI button. - // Or the toolbox overlay could update it. - return win; + Dispatcher.emit("onToggleRDPInspector", [{ toolbox }]); + + return toolbox; }); }, From 76f2a6003ba3e853de63ba7c43fbdd2b19844268 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Wed, 2 Sep 2015 18:22:46 +0200 Subject: [PATCH 04/20] fix lint errors --- lib/inspector-window.js | 1 - lib/start-button.js | 5 +---- 2 files changed, 1 insertion(+), 5 deletions(-) diff --git a/lib/inspector-window.js b/lib/inspector-window.js index 2e495f7..3ff26ca 100644 --- a/lib/inspector-window.js +++ b/lib/inspector-window.js @@ -11,7 +11,6 @@ const self = require("sdk/self"); /*const options = require("@loader/options");*/ const { Ci, Cc } = require("chrome"); const { Class } = require("sdk/core/heritage"); -const { getMostRecentWindow } = require("sdk/window/utils"); const { openDialog } = require("sdk/window/utils"); const Events = require("sdk/dom/events"); const { all } = require("sdk/core/promise"); diff --git a/lib/start-button.js b/lib/start-button.js index 7495ae6..47a6505 100644 --- a/lib/start-button.js +++ b/lib/start-button.js @@ -18,10 +18,9 @@ const { getNodeView } = require("sdk/view/core"); const { Class } = require("sdk/core/heritage"); // Firebug.SDK -const { Trace, TraceError } = require("firebug.sdk/lib/core/trace.js").get(module.id); +const { Trace/*, TraceError*/ } = require("firebug.sdk/lib/core/trace.js").get(module.id); const { Locale } = require("firebug.sdk/lib/core/locale.js"); const { ToolbarButton } = require("firebug.sdk/lib/toolbar-button.js"); -const { ToolboxChrome } = require("firebug.sdk/lib/toolbox-chrome.js"); const { Dispatcher } = require("firebug.sdk/lib/dispatcher.js"); // Platform @@ -34,8 +33,6 @@ const { AddonManager } = Cu.import("resource://gre/modules/AddonManager.jsm", {} const { devtools, gDevTools } = require("firebug.sdk/lib/core/devtools.js"); // RDP Inspector -const { ToolboxOverlay } = require("./toolbox-overlay"); - const startButtonId = "rdp-inspector-start-button"; // Helpers From be8597d0fc7ba438bd7f5be74d37d86c6faafbe3 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Thu, 3 Sep 2015 12:43:55 +0200 Subject: [PATCH 05/20] add 'RDP Connection List Selector' menu item to the start button --- chrome/locale/en-US/toolbox.properties | 6 ++++++ lib/start-button.js | 13 +++++++++++++ 2 files changed, 19 insertions(+) diff --git a/chrome/locale/en-US/toolbox.properties b/chrome/locale/en-US/toolbox.properties index 3ffea5b..e92d8f4 100644 --- a/chrome/locale/en-US/toolbox.properties +++ b/chrome/locale/en-US/toolbox.properties @@ -53,3 +53,9 @@ rdpInspector.menu.showInlineDetails.tip=Show a detailed tree view of the Packet # button located in Firefox toolbar, inside the Options sub-menu. rdpInspector.menu.webideConnectionsMonitor.label=Monitor WebIDE connections rdpInspector.menu.webideConnectionsMonitor.tip=Monitor WebIDE connections and auto-open an RDP inspector window. + +# LOCALIZATION NOTE (rdpInspector.menu.connectionsList.label, rdpInspector.menu.connectionsList.tip): +# RDP Inspector menu label. The menu is available in RDP Inspector start +# button located in Firefox toolbar. +rdpInspector.menu.connectionsList.label=RDP Connections List Selector +rdpInspector.menu.connectionsList.tip=Open a dialog which lists all the RDP Connections available to the RDPInspector diff --git a/lib/start-button.js b/lib/start-button.js index 47a6505..704ef08 100644 --- a/lib/start-button.js +++ b/lib/start-button.js @@ -172,6 +172,13 @@ var StartButton = ] }); + items.push({ + nol10n: true, + label: Locale.$STR("rdpInspector.menu.connectionsList.label"), + tooltiptext: Locale.$STR("rdpInspector.menu.connectionsList.tip"), + command: this.onConnectionsList.bind(this) + }); + items.push({ nol10n: true, label: Locale.$STR("rdpInspector.menu.visitHomePage.label"), @@ -217,6 +224,12 @@ var StartButton = }, // Commands + onConnectionsList: function(event) { + cancelEvent(event); + + // TODO: open a connections list dialog + }, + onToggleWebideConnectionsMonitor: function(event) { cancelEvent(event); From c128b41f8e4e4695a32334aa9c90312040b5aca3 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Thu, 3 Sep 2015 13:08:07 +0200 Subject: [PATCH 06/20] register the InspectorService to the Dispatcher on addon loading --- lib/main.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/main.js b/lib/main.js index 0a6c62b..8e5ee4b 100644 --- a/lib/main.js +++ b/lib/main.js @@ -10,7 +10,7 @@ const { ToolboxChrome } = require("firebug.sdk/lib/toolbox-chrome.js"); // RDP Inspector require("./start-button.js"); require("./webide-connections-monitor"); -// const { ToolboxOverlay } = require("./toolbox-overlay.js"); +require("./inspector-service"); // Localization files Locale.registerStringBundle("chrome://rdpinspector/locale/toolbox.properties"); From 7502b4950e1f1bdd28eaad901bde0586c0d16931 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Fri, 4 Sep 2015 13:37:13 +0200 Subject: [PATCH 07/20] move rdp-inspector-window in data/shared and inject relative domTree.css url when chrome urls are not available --- data/inspector/components/actors-panel.js | 2 +- data/inspector/components/actors-toolbar.js | 2 +- data/inspector/components/main-tabbed-area.js | 2 +- data/inspector/components/packet.js | 2 +- data/inspector/components/packets-limit.js | 2 +- data/inspector/components/packets-summary.js | 2 +- data/inspector/components/packets-toolbar.js | 2 +- data/inspector/components/stack-frame-rep.js | 2 +- data/inspector/config.js | 1 + data/inspector/main.js | 2 +- data/inspector/packets-store.js | 2 +- .../rdp-inspector-window.js | 9 +++++++ data/shared/react-helpers.js | 25 +++++++++++++++++++ 13 files changed, 45 insertions(+), 10 deletions(-) rename data/{inspector => shared}/rdp-inspector-window.js (74%) create mode 100644 data/shared/react-helpers.js diff --git a/data/inspector/components/actors-panel.js b/data/inspector/components/actors-panel.js index baa7ab5..90b263b 100644 --- a/data/inspector/components/actors-panel.js +++ b/data/inspector/components/actors-panel.js @@ -14,7 +14,7 @@ const { Reps } = require("reps/repository"); // RDP Inspector const { ActorsToolbar } = require("./actors-toolbar"); -const { Locale } = require("../rdp-inspector-window"); +const { Locale } = require("shared/rdp-inspector-window"); // Shortcuts const { TR, TD, TABLE, TBODY, THEAD, TH, DIV, H4 } = Reps.DOM; diff --git a/data/inspector/components/actors-toolbar.js b/data/inspector/components/actors-toolbar.js index 6396377..15200f3 100644 --- a/data/inspector/components/actors-toolbar.js +++ b/data/inspector/components/actors-toolbar.js @@ -16,7 +16,7 @@ const { Reps } = require("reps/reps"); const { SELECT, OPTION } = Reps.DOM; // RDP Window injected APIs -const { Locale } = require("../rdp-inspector-window"); +const { Locale } = require("shared/rdp-inspector-window"); /** * @template This object is responsible for rendering the toolbar diff --git a/data/inspector/components/main-tabbed-area.js b/data/inspector/components/main-tabbed-area.js index 70487f4..b500b15 100644 --- a/data/inspector/components/main-tabbed-area.js +++ b/data/inspector/components/main-tabbed-area.js @@ -19,7 +19,7 @@ const TabPane = React.createFactory(ReactBootstrap.TabPane); const Alert = React.createFactory(ReactBootstrap.Alert); // RDP Window injected APIs -const { Locale } = require("../rdp-inspector-window"); +const { Locale } = require("shared/rdp-inspector-window"); /** * @template This template is responsible for rendering the main diff --git a/data/inspector/components/packet.js b/data/inspector/components/packet.js index e37466a..a554d77 100644 --- a/data/inspector/components/packet.js +++ b/data/inspector/components/packet.js @@ -18,7 +18,7 @@ const { TreeView } = require("reps/tree-view"); const { DIV, SPAN, UL, LI, A } = Reps.DOM; // RDP Window injected APIs -const { Locale, Str } = require("../rdp-inspector-window"); +const { Locale, Str } = require("shared/rdp-inspector-window"); /** * @template This template is responsible for rendering a packet. diff --git a/data/inspector/components/packets-limit.js b/data/inspector/components/packets-limit.js index 6ced265..f0be4a5 100644 --- a/data/inspector/components/packets-limit.js +++ b/data/inspector/components/packets-limit.js @@ -14,7 +14,7 @@ const { Reps } = require("reps/reps"); const { DIV, SPAN } = Reps.DOM; // RDP Window injected APIs -const { Locale } = require("../rdp-inspector-window"); +const { Locale } = require("shared/rdp-inspector-window"); /** * @template This template is responsible for rendering a message diff --git a/data/inspector/components/packets-summary.js b/data/inspector/components/packets-summary.js index 71d6169..8cd82fb 100644 --- a/data/inspector/components/packets-summary.js +++ b/data/inspector/components/packets-summary.js @@ -14,7 +14,7 @@ const { Reps } = require("reps/reps"); const { TextWithTooltip } = require("./text-with-tooltip"); // RDP Window injected APIs -const { Locale, Str } = require("../rdp-inspector-window"); +const { Locale, Str } = require("shared/rdp-inspector-window"); // Constants diff --git a/data/inspector/components/packets-toolbar.js b/data/inspector/components/packets-toolbar.js index 098a104..d70255d 100644 --- a/data/inspector/components/packets-toolbar.js +++ b/data/inspector/components/packets-toolbar.js @@ -20,7 +20,7 @@ const { Reps } = require("reps/reps"); const { SPAN, INPUT } = Reps.DOM; // RDP Window injected APIs -const { Locale } = require("../rdp-inspector-window"); +const { Locale } = require("shared/rdp-inspector-window"); /** * @template This object represents a template for a toolbar displayed diff --git a/data/inspector/components/stack-frame-rep.js b/data/inspector/components/stack-frame-rep.js index 891972a..f8f3134 100644 --- a/data/inspector/components/stack-frame-rep.js +++ b/data/inspector/components/stack-frame-rep.js @@ -18,7 +18,7 @@ const { StackFrame } = require("../packets-store"); const { SPAN } = Reps.DOM; // RDP Window injected APIs -const { postChromeMessage } = require("../rdp-inspector-window"); +const { postChromeMessage } = require("shared/rdp-inspector-window"); /** * This component is responsible for rendering a stack frame. diff --git a/data/inspector/config.js b/data/inspector/config.js index 6f478f2..118f043 100644 --- a/data/inspector/config.js +++ b/data/inspector/config.js @@ -6,6 +6,7 @@ require.config({ baseUrl: ".", paths: { + "shared": "../shared", "jquery": "../lib/jquery/jquery", "react": "../lib/react/react", "bootstrap": "../lib/bootstrap/js/bootstrap", diff --git a/data/inspector/main.js b/data/inspector/main.js index 777513c..a03b3c3 100644 --- a/data/inspector/main.js +++ b/data/inspector/main.js @@ -18,7 +18,7 @@ var { Search } = require("search"); require("./components/stack-frame-rep"); // RDP Window injected APIs -var { Locale, postChromeMessage } = require("./rdp-inspector-window"); +var { Locale, postChromeMessage } = require("shared/rdp-inspector-window"); var packetsStore; var theApp; diff --git a/data/inspector/packets-store.js b/data/inspector/packets-store.js index f5e6ea3..26cfa7a 100644 --- a/data/inspector/packets-store.js +++ b/data/inspector/packets-store.js @@ -5,7 +5,7 @@ define(function(require, exports/*, module*/) { "use strict"; // RDP Window injected APIs -const { Options } = require("./rdp-inspector-window"); +const { Options } = require("shared/rdp-inspector-window"); // Constants const refreshTimeout = 200; diff --git a/data/inspector/rdp-inspector-window.js b/data/shared/rdp-inspector-window.js similarity index 74% rename from data/inspector/rdp-inspector-window.js rename to data/shared/rdp-inspector-window.js index 7b52dfe..247f0b8 100644 --- a/data/inspector/rdp-inspector-window.js +++ b/data/shared/rdp-inspector-window.js @@ -35,6 +35,15 @@ if (["http:", "https:", "file:"].indexOf(window.location.protocol) >= 0) { exports.postChromeMessage = window.postChromeMessage = function() { console.log("POST CHROME MESSAGE", arguments); }; + + // inject domTree css with a relative url (chrom urls can't be + // loaded in a page not loaded from a resource or chrome urls) + + const domTreeStylesheet = document.createElement("link"); + domTreeStylesheet.setAttribute("href", "../../node_modules/firebug.sdk/skin/classic/shared/domTree.css"); + domTreeStylesheet.setAttribute("rel", "stylesheet"); + + document.querySelector("head").appendChild(domTreeStylesheet); } else { /* globals Str, Locale, Options, Trace, postChromeMessage */ exports.Str = Str; diff --git a/data/shared/react-helpers.js b/data/shared/react-helpers.js new file mode 100644 index 0000000..76205a9 --- /dev/null +++ b/data/shared/react-helpers.js @@ -0,0 +1,25 @@ +/* See license.txt for terms of usage */ + +define(function(require, exports/*, module*/) { + +"use strict"; + +const React = require("react"); + +exports.ReactLazyFactories = (reactElementsSource) => { + return new Proxy({}, { + get(target, name) { + if ( !(name in reactElementsSource) ) { + throw Error(`ReactLazyFactories: ${name} not found`); + } + + if ( !(name in target) ) { + target[name] = React.createFactory(reactElementsSource[name]); + } + + return target[name]; + } + }); +}; + +}); From 3818de0ebb33ebe611fdbcbff7514e28ebb1940c Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Fri, 4 Sep 2015 14:14:26 +0200 Subject: [PATCH 08/20] enable let and more ES6 features in modules loaded by RequireJS related requirejs issue: https://github.com/jrburke/requirejs/issues/157 --- data/inspector/config.js | 1 + 1 file changed, 1 insertion(+) diff --git a/data/inspector/config.js b/data/inspector/config.js index 118f043..3ef9200 100644 --- a/data/inspector/config.js +++ b/data/inspector/config.js @@ -5,6 +5,7 @@ // RequireJS configuration require.config({ baseUrl: ".", + scriptType: "application/javascript;version=1.8", paths: { "shared": "../shared", "jquery": "../lib/jquery/jquery", From ec84ecd990f1ba294bc45c0b11d3fd53755cbbab Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Fri, 4 Sep 2015 15:13:49 +0200 Subject: [PATCH 09/20] add connections list React UI prototype --- .../components/connections-list.js | 61 +++++++++++++++++++ .../connections-list/components/main-panel.js | 33 ++++++++++ data/connections-list/config.js | 21 +++++++ data/connections-list/index.html | 26 ++++++++ data/connections-list/index.js | 19 ++++++ data/shared/react-bootstrap-factories.js | 12 ++++ 6 files changed, 172 insertions(+) create mode 100644 data/connections-list/components/connections-list.js create mode 100644 data/connections-list/components/main-panel.js create mode 100644 data/connections-list/config.js create mode 100644 data/connections-list/index.html create mode 100644 data/connections-list/index.js create mode 100644 data/shared/react-bootstrap-factories.js diff --git a/data/connections-list/components/connections-list.js b/data/connections-list/components/connections-list.js new file mode 100644 index 0000000..7fc3ba3 --- /dev/null +++ b/data/connections-list/components/connections-list.js @@ -0,0 +1,61 @@ +/* See license.txt for terms of usage */ + +define(function(require, exports/*, module*/) { + +"use strict"; + +// ReactJS +const React = require("react"); + +// React Bootstrap factories +const { + ListGroup, ListGroupItem, + TabbedArea, TabPane +} = require("shared/react-bootstrap-factories"); + +const ConnectionsGroup = React.createClass({ + displayName: "ConnectionsGroup", + + render() { + let connections = this.props.connectionsList.map((conn) => { + return ListGroupItem({ + onClick: (evt) => { + this.props.onConnectionClick(conn, evt); + } + }, conn.name); + }); + + return ListGroup({}, connections); + } +}); + +exports.ConnectionsList = React.createClass({ + displayName: "ConnectionsList", + + render() { + const connections = this.props.connections || {}; + + // turn the first level (connections group) into a ConnectionsGroups components + const connectionsGroups = Object.keys(connections).map((groupName, i) => { + return TabPane({ + key: groupName, + tab: groupName, + eventKey: i + 1 + }, React.createElement(ConnectionsGroup, { + onConnectionClick: this.onConnectionClick, + connectionsList: connections[groupName] + })); + }); + + return TabbedArea({ + className: "mainTabbedArea", + defaultActiveKey: 1, animation: false + }, connectionsGroups); + }, + + onConnectionClick(conn) { + console.log("CONNECTION CLICKED", conn); + } +}); + +}); diff --git a/data/connections-list/components/main-panel.js b/data/connections-list/components/main-panel.js new file mode 100644 index 0000000..f491a6a --- /dev/null +++ b/data/connections-list/components/main-panel.js @@ -0,0 +1,33 @@ +/* See license.txt for terms of usage */ + +define(function(require, exports/*, module*/) { + +"use strict"; + +// ReactJS +const React = require("react"); + +// Connections List components +const { ConnectionsList } = require("./connections-list"); + +exports.MainPanel = React.createClass({ + displayName: "MainPanel", + + render() { + let connections = { + "Local Tabs": [ + { name: "New Tab", status: "CONNECTED" }, + { name: "Tab2", status: "CONNECTED" }, + ], + "WebIDE": [ + { name: "Remote", status: "CONNECTED" } + ] + }; + + return React.createElement(ConnectionsList, { + connections + }); + } +}); + +}); diff --git a/data/connections-list/config.js b/data/connections-list/config.js new file mode 100644 index 0000000..ec35884 --- /dev/null +++ b/data/connections-list/config.js @@ -0,0 +1,21 @@ +/* See license.txt for terms of usage */ + +/* globals requirejs */ + +// RequireJS configuration +require.config({ + baseUrl: ".", + scriptType: "application/javascript;version=1.8", + paths: { + "shared": "../shared", + "jquery": "../lib/jquery/jquery", + "react": "../lib/react/react", + "bootstrap": "../lib/bootstrap/js/bootstrap", + "immutable": "../lib/immutable/immutable", + "react-bootstrap": "../lib/react-bootstrap/react-bootstrap", + "reps": "../../node_modules/firebug.sdk/lib/reps" + } +}); + +// Load the main panel module +requirejs(["index"]); diff --git a/data/connections-list/index.html b/data/connections-list/index.html new file mode 100644 index 0000000..d205c41 --- /dev/null +++ b/data/connections-list/index.html @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + + + + + + +
+ + diff --git a/data/connections-list/index.js b/data/connections-list/index.js new file mode 100644 index 0000000..cf5351c --- /dev/null +++ b/data/connections-list/index.js @@ -0,0 +1,19 @@ +/* See license.txt for terms of usage */ + +define(function(require/*, exports, module*/) { + +"use strict"; + +require("shared/rdp-inspector-window"); + +const { MainPanel } = require("./components/main-panel"); + +// ReactJS +var React = require("react"); + +React.render( + React.createElement(MainPanel, {}), + document.querySelector("#content") +); + +}); diff --git a/data/shared/react-bootstrap-factories.js b/data/shared/react-bootstrap-factories.js new file mode 100644 index 0000000..5c9a9de --- /dev/null +++ b/data/shared/react-bootstrap-factories.js @@ -0,0 +1,12 @@ +/* See license.txt for terms of usage */ + +define(function(require, exports, module) { + +"use strict"; + +const ReactBootstrap = require("react-bootstrap"); +const { ReactLazyFactories } = require("shared/react-helpers"); + +module.exports = ReactLazyFactories(ReactBootstrap); + +}); From f89fdfaa8414bede11839fc1c3cd9bba963a9674 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Fri, 4 Sep 2015 15:15:57 +0200 Subject: [PATCH 10/20] auto open RDP console window only for WebIDE connections --- lib/inspector-service.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/lib/inspector-service.js b/lib/inspector-service.js index cb1ae65..d24bb8e 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -89,8 +89,12 @@ const InspectorService = let inspectorWindowName; + let autoOpenInspectorConsole = false; + if (clientInfo && clientInfo.webide) { inspectorWindowName = `WebIDE: ${clientInfo.webide.selectedRuntime.name}`; + + autoOpenInspectorConsole = true; } else if (toolbox.target.isLocalTab) { inspectorWindowName = `Tab: ${toolbox.target.tab.label}`; } @@ -100,7 +104,9 @@ const InspectorService = this._setClientInfo(toolbox.target.client, { toolboxOverlay }); - toolboxOverlay.openInspectorWindow(); + if (autoOpenInspectorConsole) { + toolboxOverlay.openInspectorWindow(); + } }, onToolboxDestroy: function(/*eventId, toolbox*/) { From 536a403146dbe354311062eb38b23bb81495a3c9 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Fri, 4 Sep 2015 15:17:57 +0200 Subject: [PATCH 11/20] generate an uuid to keep track and identify connections --- lib/inspector-service.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/lib/inspector-service.js b/lib/inspector-service.js index d24bb8e..d751efb 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -11,6 +11,8 @@ const options = require("@loader/options"); const { Cu } = require("chrome"); const { defer, all } = require("sdk/core/promise"); +const { uuid } = require("sdk/util/uuid"); + // Firebug SDK const { Dispatcher } = require("firebug.sdk/lib/dispatcher"); const { Trace/*, TraceError*/ } = require("firebug.sdk/lib/core/trace.js").get(module.id); @@ -70,7 +72,9 @@ const InspectorService = if (!client) { return; } - let clientInfo = this.clientsMap.get(client) || {}; + let clientInfo = this.clientsMap.get(client) || { + uuid: uuid() + }; this.clientsMap.set(client, Object.assign({}, clientInfo, moreInfo)); }, From 92e4a922652f8c96d54efe70e25903ec40fbf37f Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Fri, 4 Sep 2015 15:44:05 +0200 Subject: [PATCH 12/20] add connections list window manager class --- chrome/content/connections-window.xul | 50 +++++++ lib/connections-list-window.js | 207 ++++++++++++++++++++++++++ lib/inspector-window.js | 5 +- lib/start-button.js | 6 +- 4 files changed, 264 insertions(+), 4 deletions(-) create mode 100644 chrome/content/connections-window.xul create mode 100644 lib/connections-list-window.js diff --git a/chrome/content/connections-window.xul b/chrome/content/connections-window.xul new file mode 100644 index 0000000..0ad0cff --- /dev/null +++ b/chrome/content/connections-window.xul @@ -0,0 +1,50 @@ + + + + + + + + + + + + diff --git a/lib/connections-list-window.js b/lib/connections-list-window.js new file mode 100644 index 0000000..80b6a9f --- /dev/null +++ b/lib/connections-list-window.js @@ -0,0 +1,207 @@ +/* See license.txt for terms of usage */ + +"use strict"; + +module.metadata = { + "stability": "experimental" +}; + +// Add-on SDK +const self = require("sdk/self"); +/*const options = require("@loader/options");*/ +const { Class } = require("sdk/core/heritage"); +const { openDialog, getMostRecentWindow } = require("sdk/window/utils"); +const Events = require("sdk/dom/events"); + +// Firebug SDK +const { Trace, TraceError } = require("firebug.sdk/lib/core/trace.js").get(module.id); +const { Locale } = require("firebug.sdk/lib/core/locale.js"); +const { Content } = require("firebug.sdk/lib/core/content.js"); +const { Str } = require("firebug.sdk/lib/core/string.js"); +const { Options } = require("firebug.sdk/lib/core/options.js"); + +// Constants +const { InspectorService } = require("./inspector-service.js"); + +const WINDOW_TYPE = "RDPInspectorConnectionsList"; +const CONNECTIONS_XUL_URL = "chrome://rdpinspector/content/connections-window.xul"; + +/** + * This class manages the connections list window + */ +const ConnectionsListWindow = Class( +/** @lends ConnectionsListWindow */ +{ + initialize() { + // TODO: bind event handling methods + + // DOM Events + this.onClose = this.onClose.bind(this); + this.onLoad = this.onLoad.bind(this); + this.onFrameContentLoaded = this.onFrameContentLoaded.bind(this); + + // Message Manager + this.onContentMessage = this.onContentMessage.bind(this); + }, + + destroy() { + // TODO: cleanup (e.g. close the connection list window) + }, + + open() { + Trace.sysout("ConnectionsListWindow.open;", arguments); + + // If the Connections List window is already opened, focus and return it. + let win = getMostRecentWindow(WINDOW_TYPE); + + if (win) { + win.focus(); + return win; + } + + return this._open("rdp-inspector-connections", CONNECTIONS_XUL_URL, [{}]); + }, + + _open(windowType, url, params) { + Trace.sysout("ConnectionsListWindow.open;", arguments); + + // Open RDP Inspector console window. + this.win = openDialog({ + url: url, + name: WINDOW_TYPE, + args: params, + features: "chrome,resizable,scrollbars=auto,minimizable,dialog=no" + }); + + // Hook events + Events.on(this.win, "load", this.onLoad); + Events.on(this.win, "close", this.onClose); + + return this.win; + }, + + // Event Handlers + + onLoad(event) { + Trace.sysout("ConnectionsListWindow.onLoad; ", event); + + let frame = this.getFrame(); + frame.setAttribute("src", self.data.url("connections-list/index.html")); + + // Load content script and handle messages sent from it. + let { messageManager } = frame.frameLoader; + if (messageManager) { + let url = self.data.url("inspector/frame-script.js"); + messageManager.loadFrameScript(url, false); + messageManager.addMessageListener("message", this.onContentMessage); + } + + Events.once(frame, "DOMContentLoaded", this.onFrameContentLoaded); + }, + + onFrameContentLoaded(event) { + Trace.sysout("ConnectionsListWindow.onFrameContentLoaded; ", event); + + let contentWindow = this.getContentWindow(); + + let { Trace: contentTrace } = FBTrace.get("CONTENT"); + Content.exportIntoContentScope(contentWindow, Str, "Str"); + Content.exportIntoContentScope(contentWindow, Locale, "Locale"); + Content.exportIntoContentScope(contentWindow, contentTrace, "Trace"); + Content.exportIntoContentScope(contentWindow, TraceError, "TraceError"); + Content.exportIntoContentScope(contentWindow, Options, "Options"); + }, + + onClose(event) { + Trace.sysout("ConnectionsListWindow.onClose; " + event, arguments); + + this.win = null; + }, + + // Content <-> Chrome Communication + + /** + * Handle messages coming from the content scope (from panel's iframe). + */ + onContentMessage: function(msg) { + Trace.sysout("InspectorWindow.onContentMessage; " + msg.data.type, msg); + + let event = msg.data; + let args = event.args; + + switch (event.type) { + case "inject-rdp-packet": + this.onInjectRDPPacket(args); + break; + + case "get-rdp-actors": + this.onGetRDPActors(); + break; + + case "find": + this.win.gFindBar.onFindCommand(); + break; + + case "initialized": + this.onWindowInitialized(); + break; + + case "pause": + this.onPause(args); + break; + + case "load-from-file": + this.onLoadFromFile(args); + break; + + case "save-to-file": + this.onSaveToFile(args); + break; + + case "options-toggle": + this.onOptionsToggle(args); + break; + + case "view-source": + this.onViewSource(args); + break; + } + }, + + postCommand: function(type, data) { + let contentWindow = this.getContentWindow(); + if (!contentWindow) { + TraceError.sysout("InspectorWindow.postCommand; ERROR no window for: " + + type, data); + return; + } + + var event = new contentWindow.MessageEvent(type, { + bubbles: true, + cancelable: true, + data: data + }); + + contentWindow.dispatchEvent(event); + }, + + getContentWindow: function() { + let frame = this.getFrame(); + if (!frame) { + return null; + } + + return frame && frame.contentWindow; + }, + + getFrame: function() { + if (!this.win) { + return null; + } + + return this.win.document.getElementById("contentFrame"); + } +}); + +// Exports from this module +exports.ConnectionsListWindow = ConnectionsListWindow; diff --git a/lib/inspector-window.js b/lib/inspector-window.js index 3ff26ca..92330a3 100644 --- a/lib/inspector-window.js +++ b/lib/inspector-window.js @@ -70,7 +70,7 @@ const InspectorWindow = Class( }, open: function() { - Trace.sysout("InspectorWindow.toggle;", arguments); + Trace.sysout("InspectorWindow.open;", arguments); // If the Inspector is already opened, focus and return it. if (this.win) { @@ -78,8 +78,7 @@ const InspectorWindow = Class( return this.win; } - let url = INSPECTOR_XUL_URL; - return this._open("rdp-inspector", url, [{ + return this._open("rdp-inspector", INSPECTOR_XUL_URL, [{ inspectorWindowName: this.inspectorWindowName }]); }, diff --git a/lib/start-button.js b/lib/start-button.js index 704ef08..8d93b12 100644 --- a/lib/start-button.js +++ b/lib/start-button.js @@ -33,6 +33,8 @@ const { AddonManager } = Cu.import("resource://gre/modules/AddonManager.jsm", {} const { devtools, gDevTools } = require("firebug.sdk/lib/core/devtools.js"); // RDP Inspector +const { ConnectionsListWindow } = require("./connections-list-window"); + const startButtonId = "rdp-inspector-start-button"; // Helpers @@ -101,6 +103,8 @@ var StartButton = allowedAreas: [AREA_PANEL, AREA_NAVBAR], onBuild: this.onBuild.bind(this) }); + + this.connectionsListWindow = new ConnectionsListWindow(); }, shutdown: function(/*reason*/) { @@ -227,7 +231,7 @@ var StartButton = onConnectionsList: function(event) { cancelEvent(event); - // TODO: open a connections list dialog + this.connectionsListWindow.open(); }, onToggleWebideConnectionsMonitor: function(event) { From 34e89b042b78e5e5824cd332e3aa63dd404c73ac Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Fri, 4 Sep 2015 18:46:50 +0200 Subject: [PATCH 13/20] render rdp connections list, realtime update the list and open inspector window on click --- .../components/connections-list.js | 11 +- .../connections-list/components/main-panel.js | 13 +- data/connections-list/index.js | 27 +++- data/inspector/main.js | 2 +- data/shared/rdp-inspector-window.js | 17 ++- data/{inspector => shared}/resizer.js | 0 lib/connections-list-window.js | 125 ++++++++---------- lib/inspector-service.js | 64 +++++++-- 8 files changed, 155 insertions(+), 104 deletions(-) rename data/{inspector => shared}/resizer.js (100%) diff --git a/data/connections-list/components/connections-list.js b/data/connections-list/components/connections-list.js index 7fc3ba3..a394a15 100644 --- a/data/connections-list/components/connections-list.js +++ b/data/connections-list/components/connections-list.js @@ -25,7 +25,7 @@ const ConnectionsGroup = React.createClass({ }, conn.name); }); - return ListGroup({}, connections); + return ListGroup({ fill: true }, connections); } }); @@ -40,9 +40,10 @@ exports.ConnectionsList = React.createClass({ return TabPane({ key: groupName, tab: groupName, - eventKey: i + 1 + eventKey: i + 1, + style: { overflow: "auto"} }, React.createElement(ConnectionsGroup, { - onConnectionClick: this.onConnectionClick, + onConnectionClick: this.props.onConnectionClick, connectionsList: connections[groupName] })); }); @@ -51,10 +52,6 @@ exports.ConnectionsList = React.createClass({ className: "mainTabbedArea", defaultActiveKey: 1, animation: false }, connectionsGroups); - }, - - onConnectionClick(conn) { - console.log("CONNECTION CLICKED", conn); } }); diff --git a/data/connections-list/components/main-panel.js b/data/connections-list/components/main-panel.js index f491a6a..f7c71fd 100644 --- a/data/connections-list/components/main-panel.js +++ b/data/connections-list/components/main-panel.js @@ -14,18 +14,9 @@ exports.MainPanel = React.createClass({ displayName: "MainPanel", render() { - let connections = { - "Local Tabs": [ - { name: "New Tab", status: "CONNECTED" }, - { name: "Tab2", status: "CONNECTED" }, - ], - "WebIDE": [ - { name: "Remote", status: "CONNECTED" } - ] - }; - return React.createElement(ConnectionsList, { - connections + connections: this.props.connections, + onConnectionClick: this.props.onConnectionClick }); } }); diff --git a/data/connections-list/index.js b/data/connections-list/index.js index cf5351c..1da5888 100644 --- a/data/connections-list/index.js +++ b/data/connections-list/index.js @@ -4,16 +4,33 @@ define(function(require/*, exports, module*/) { "use strict"; -require("shared/rdp-inspector-window"); +const { RDPConnectionsList } = require("shared/rdp-inspector-window"); +var { Resizer } = require("shared/resizer"); const { MainPanel } = require("./components/main-panel"); // ReactJS var React = require("react"); -React.render( - React.createElement(MainPanel, {}), - document.querySelector("#content") -); +function render() { + let connections = RDPConnectionsList.getConnectionsInfo(); + + return React.render( + React.createElement(MainPanel, { + connections, + onConnectionClick: (conn) => { + RDPConnectionsList.openRDPInspectorWindow(conn); + } + }), + document.querySelector("#content") + ); +} + +let theApp = render(); +RDPConnectionsList.onConnectionsUpdated.addListener(render); + +/* eslint-disable no-new */ +new Resizer(window, theApp); +/* eslint-enable */ }); diff --git a/data/inspector/main.js b/data/inspector/main.js index a03b3c3..a7dcf0b 100644 --- a/data/inspector/main.js +++ b/data/inspector/main.js @@ -11,7 +11,7 @@ var React = require("react"); var { MainTabbedArea } = require("components/main-tabbed-area"); var { PacketsStore } = require("packets-store"); var { ActorsStore } = require("actors-store"); -var { Resizer } = require("resizer"); +var { Resizer } = require("shared/resizer"); var { Search } = require("search"); // Reps diff --git a/data/shared/rdp-inspector-window.js b/data/shared/rdp-inspector-window.js index 247f0b8..cd458ef 100644 --- a/data/shared/rdp-inspector-window.js +++ b/data/shared/rdp-inspector-window.js @@ -36,6 +36,15 @@ if (["http:", "https:", "file:"].indexOf(window.location.protocol) >= 0) { console.log("POST CHROME MESSAGE", arguments); }; + exports.RDPConnectionsList = { + getConnectionsInfo: () => {}, + onConnectionsUpdated: { + addListener: function() {}, + removeListener: function() {} + }, + openRDPInspectorWindow: () => {} + }; + // inject domTree css with a relative url (chrom urls can't be // loaded in a page not loaded from a resource or chrome urls) @@ -51,7 +60,13 @@ if (["http:", "https:", "file:"].indexOf(window.location.protocol) >= 0) { exports.Options = Options; exports.Trace = Trace; - exports.postChromeMessage = postChromeMessage; + if ("postChromeMessage" in window) { + exports.postChromeMessage = window.postChromeMessage; + } + + if ("RDPConnectionsList" in window) { + exports.RDPConnectionsList = window.RDPConnectionsList; + } } }); diff --git a/data/inspector/resizer.js b/data/shared/resizer.js similarity index 100% rename from data/inspector/resizer.js rename to data/shared/resizer.js diff --git a/lib/connections-list-window.js b/lib/connections-list-window.js index 80b6a9f..7afe114 100644 --- a/lib/connections-list-window.js +++ b/lib/connections-list-window.js @@ -7,11 +7,12 @@ module.metadata = { }; // Add-on SDK -const self = require("sdk/self"); +const { data } = require("sdk/self"); /*const options = require("@loader/options");*/ const { Class } = require("sdk/core/heritage"); const { openDialog, getMostRecentWindow } = require("sdk/window/utils"); const Events = require("sdk/dom/events"); +const { Cu } = require("chrome"); // Firebug SDK const { Trace, TraceError } = require("firebug.sdk/lib/core/trace.js").get(module.id); @@ -19,6 +20,7 @@ const { Locale } = require("firebug.sdk/lib/core/locale.js"); const { Content } = require("firebug.sdk/lib/core/content.js"); const { Str } = require("firebug.sdk/lib/core/string.js"); const { Options } = require("firebug.sdk/lib/core/options.js"); +const { Dispatcher } = require("firebug.sdk/lib/dispatcher.js"); // Constants const { InspectorService } = require("./inspector-service.js"); @@ -40,12 +42,23 @@ const ConnectionsListWindow = Class( this.onLoad = this.onLoad.bind(this); this.onFrameContentLoaded = this.onFrameContentLoaded.bind(this); - // Message Manager - this.onContentMessage = this.onContentMessage.bind(this); + // Content callbacks + this.connectionsUpdatedListeners = new Set(); + + // Dispatcher events + this.onRDPConnectionsUpdated = this.onRDPConnectionsUpdated.bind(this); + + Dispatcher.on("onRDPConnectionsUpdated", this.onRDPConnectionsUpdated); }, destroy() { // TODO: cleanup (e.g. close the connection list window) + + // Content callbacks + this.connectionsUpdatedListeners.clear(); + + // Dispatcher events + Dispatcher.off("onRDPConnectionsUpdated", this.onRDPConnectionsUpdated); }, open() { @@ -86,15 +99,7 @@ const ConnectionsListWindow = Class( Trace.sysout("ConnectionsListWindow.onLoad; ", event); let frame = this.getFrame(); - frame.setAttribute("src", self.data.url("connections-list/index.html")); - - // Load content script and handle messages sent from it. - let { messageManager } = frame.frameLoader; - if (messageManager) { - let url = self.data.url("inspector/frame-script.js"); - messageManager.loadFrameScript(url, false); - messageManager.addMessageListener("message", this.onContentMessage); - } + frame.setAttribute("src", data.url("connections-list/index.html")); Events.once(frame, "DOMContentLoaded", this.onFrameContentLoaded); }, @@ -110,79 +115,61 @@ const ConnectionsListWindow = Class( Content.exportIntoContentScope(contentWindow, contentTrace, "Trace"); Content.exportIntoContentScope(contentWindow, TraceError, "TraceError"); Content.exportIntoContentScope(contentWindow, Options, "Options"); - }, - onClose(event) { - Trace.sysout("ConnectionsListWindow.onClose; " + event, arguments); - - this.win = null; + this.exportCustomContentAPI(contentWindow); }, - // Content <-> Chrome Communication - - /** - * Handle messages coming from the content scope (from panel's iframe). - */ - onContentMessage: function(msg) { - Trace.sysout("InspectorWindow.onContentMessage; " + msg.data.type, msg); - - let event = msg.data; - let args = event.args; + exportCustomContentAPI(contentWindow) { + var contentAPI = Cu.createObjectIn(contentWindow, { + defineAs: "RDPConnectionsList" + }); - switch (event.type) { - case "inject-rdp-packet": - this.onInjectRDPPacket(args); - break; + Cu.exportFunction(function getConnectionsInfo() { + let connectionsInfo = InspectorService.getConnectionsInfo(); - case "get-rdp-actors": - this.onGetRDPActors(); - break; + return Cu.cloneInto(connectionsInfo, contentWindow); + }, contentAPI, { + defineAs: "getConnectionsInfo" + }); - case "find": - this.win.gFindBar.onFindCommand(); - break; + Cu.exportFunction(function openRDPInspectorWindow(conn) { + InspectorService.openRDPInspectorWindow(conn.uuid); + }, contentAPI, { + defineAs: "openRDPInspectorWindow" + }); - case "initialized": - this.onWindowInitialized(); - break; + var onConnectionsUpdated = Cu.createObjectIn(contentAPI, { + defineAs: "onConnectionsUpdated" + }); - case "pause": - this.onPause(args); - break; + Cu.exportFunction((cb) => { + this.connectionsUpdatedListeners.add(cb); + }, onConnectionsUpdated, { allowCallbacks: true, defineAs: "addListener" }); - case "load-from-file": - this.onLoadFromFile(args); - break; + Cu.exportFunction((cb) => { + this.connectionsUpdatedListeners.delete(cb); + }, onConnectionsUpdated, { allowCallbacks: true, defineAs: "removeListener" }); + }, - case "save-to-file": - this.onSaveToFile(args); - break; + onRDPConnectionsUpdated() { + let contentWindow = this.getContentWindow(); + let connectionsInfo = InspectorService.getConnectionsInfo(); - case "options-toggle": - this.onOptionsToggle(args); - break; + let contentConnInfo = Cu.cloneInto(connectionsInfo, contentWindow); - case "view-source": - this.onViewSource(args); - break; + for (let cb of this.connectionsUpdatedListeners) { + try { + cb(contentConnInfo); + } catch(e) { + TraceError.sysout("ConnectionsListWindow.onRDPConnectionsUpdated; ERROR in content cb: " + e); + } } }, - postCommand: function(type, data) { - let contentWindow = this.getContentWindow(); - if (!contentWindow) { - TraceError.sysout("InspectorWindow.postCommand; ERROR no window for: " + - type, data); - return; - } - - var event = new contentWindow.MessageEvent(type, { - bubbles: true, - cancelable: true, - data: data - }); + onClose(event) { + Trace.sysout("ConnectionsListWindow.onClose; " + event, arguments); - contentWindow.dispatchEvent(event); + this.win = null; }, getContentWindow: function() { diff --git a/lib/inspector-service.js b/lib/inspector-service.js index d751efb..fbd60fa 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -36,6 +36,8 @@ const { InspectorFront } = require("./inspector-front.js"); // installed and loaded on the backend. const actorModuleUrl = options.prefixURI + "lib/inspector-actor.js"; +const { ToolboxOverlay } = require("./toolbox-overlay"); + /** * @service This object represents 'RDP Inspector Service'. * This service is responsible for registering necessary back-end @@ -53,6 +55,7 @@ const InspectorService = // keeps track of connections and their relared targets/toolboxes/webide connections this.clientsMap = new Map(); + this.clientsByUUID = new Map(); this.onDebuggerClientConnect = this.onDebuggerClientConnect.bind(this); on(DebuggerClient, "connect", this.onDebuggerClientConnect); @@ -68,24 +71,59 @@ const InspectorService = this.unregisterActors(); }, + getConnectionsInfo() { + let localTabsConnections = []; + let webideConnections = []; + + for (let conn of this.clientsMap.values()) { + // filter out incomplete connections + if (!conn.toolbox) { + continue; + } + + let connDesc = { uuid: conn.uuid }; + + if (conn.webide) { + connDesc.name = conn.webide.selectedRuntime.name; + + webideConnections.push(connDesc); + } else if (conn.toolbox.target.isLocalTab) { + connDesc.name = conn.toolbox.target.tab.label; + + localTabsConnections.push(connDesc); + } + } + + let connectionsMap = { + "Local Tabs": localTabsConnections, + "WebIDE": webideConnections + }; + + return connectionsMap; + }, + + openRDPInspectorWindow(uuidConn) { + if (this.clientsByUUID.has(uuidConn)) { + this.clientsByUUID.get(uuidConn).toolboxOverlay.openInspectorWindow(); + } + }, + _setClientInfo(client, moreInfo) { if (!client) { return; } let clientInfo = this.clientsMap.get(client) || { - uuid: uuid() + uuid: uuid().toString() }; - this.clientsMap.set(client, Object.assign({}, clientInfo, moreInfo)); + + delete moreInfo["uuid"]; + let updatedInfo = Object.assign({}, clientInfo, moreInfo); + this.clientsMap.set(client, updatedInfo); + this.clientsByUUID.set(clientInfo.uuid, updatedInfo); }, // Toolbox Events - onToolboxCreated: function(eventId, toolbox) { - Trace.sysout("InspectorService.onToolboxCreated;"); - - this._setClientInfo(toolbox.target.client, { toolbox }); - }, - onToolboxReady: function(eventId, toolbox) { Trace.sysout("InspectorService.onToolboxReady;", toolbox); @@ -103,10 +141,13 @@ const InspectorService = inspectorWindowName = `Tab: ${toolbox.target.tab.label}`; } - const { ToolboxOverlay } = require("./toolbox-overlay"); let toolboxOverlay = new ToolboxOverlay({ inspectorWindowName, toolbox }); - this._setClientInfo(toolbox.target.client, { toolboxOverlay }); + this._setClientInfo(toolbox.target.client, { + toolbox, toolboxOverlay + }); + + Dispatcher.emit("onRDPConnectionsUpdated", []); if (autoOpenInspectorConsole) { toolboxOverlay.openInspectorWindow(); @@ -157,12 +198,15 @@ const InspectorService = Trace.sysout("InspectorService.onDebuggerClientClosed;", client); // TODO: any more cleanup tasks needed here? + // TODO: probably we should leave the window open? let clientInfo = this.clientsMap.get(client); if (clientInfo && clientInfo.toolboxOverlay) { clientInfo.toolboxOverlay.destroy(); } this.clientsMap.delete(client); + + Dispatcher.emit("onRDPConnectionsUpdated", []); }, // Backend Actors From 93a8690c872111b87635b21e99ebca6f897722cb Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Tue, 8 Sep 2015 17:46:37 +0200 Subject: [PATCH 14/20] fix karma-tests - added shared to the assets available during karma tests - remap components required in the existent spec files to prepare to introduce connections-list React unit tests --- karma-tests/components/main-tabbed-area-spec.js | 12 ++++++------ karma-tests/components/packet-spec.js | 2 +- karma-tests/components/packets-panel-spec.js | 8 ++++---- karma-tests/components/packets-sidebar-spec.js | 2 +- karma-tests/components/packets-toolbar-spec.js | 2 +- karma-tests/test-main.js | 17 +++++++++-------- 6 files changed, 22 insertions(+), 21 deletions(-) diff --git a/karma-tests/components/main-tabbed-area-spec.js b/karma-tests/components/main-tabbed-area-spec.js index 5a2be04..5b1b7e4 100644 --- a/karma-tests/components/main-tabbed-area-spec.js +++ b/karma-tests/components/main-tabbed-area-spec.js @@ -11,13 +11,13 @@ var React = require("react"); // Fake actions singleton var actions = {}; -var { MainTabbedArea: mainTabbedArea } = require("components/main-tabbed-area"); -var { PacketsSummaryComponent } = require("components/packets-summary"); -var { PacketComponent } = require("components/packet"); -var { PacketsPanelComponent } = require("components/packets-panel"); -var { ActorsPanelComponent } = require("components/actors-panel"); +var { MainTabbedArea: mainTabbedArea } = require("inspector/components/main-tabbed-area"); +var { PacketsSummaryComponent } = require("inspector/components/packets-summary"); +var { PacketComponent } = require("inspector/components/packet"); +var { PacketsPanelComponent } = require("inspector/components/packets-panel"); +var { ActorsPanelComponent } = require("inspector/components/actors-panel"); -var { PacketsStore } = require("packets-store"); +var { PacketsStore } = require("inspector/packets-store"); var theApp, packetsStore; theApp = React.render(mainTabbedArea({ actions: actions }), document.body); diff --git a/karma-tests/components/packet-spec.js b/karma-tests/components/packet-spec.js index 32e307d..e13074b 100644 --- a/karma-tests/components/packet-spec.js +++ b/karma-tests/components/packet-spec.js @@ -8,7 +8,7 @@ define(function (require) { var React = require("react"); var { TestUtils } = React.addons; -var { Packet } = require("components/packet"); +var { Packet } = require("inspector/components/packet"); const { TreeViewComponent } = require("reps/tree-view"); var ReactMatchers = require("karma-tests/custom-react-matchers"); diff --git a/karma-tests/components/packets-panel-spec.js b/karma-tests/components/packets-panel-spec.js index b39b003..fc8ee69 100644 --- a/karma-tests/components/packets-panel-spec.js +++ b/karma-tests/components/packets-panel-spec.js @@ -8,10 +8,10 @@ define(function (require) { var React = require("react"); var { TestUtils } = React.addons; -var { PacketsPanel } = require("components/packets-panel"); -var { PacketsToolbarComponent } = require("components/packets-toolbar"); -var { PacketListComponent } = require("components/packet-list"); -var { PacketsSidebarComponent } = require("components/packets-sidebar"); +var { PacketsPanel } = require("inspector/components/packets-panel"); +var { PacketsToolbarComponent } = require("inspector/components/packets-toolbar"); +var { PacketListComponent } = require("inspector/components/packet-list"); +var { PacketsSidebarComponent } = require("inspector/components/packets-sidebar"); var packetsPanel = TestUtils.renderIntoDocument(PacketsPanel({})); diff --git a/karma-tests/components/packets-sidebar-spec.js b/karma-tests/components/packets-sidebar-spec.js index 65d9ce4..d24f29f 100644 --- a/karma-tests/components/packets-sidebar-spec.js +++ b/karma-tests/components/packets-sidebar-spec.js @@ -8,7 +8,7 @@ define(function (require) { var React = require("react"); var { TestUtils } = React.addons; -var { PacketsSidebar } = require("components/packets-sidebar"); +var { PacketsSidebar } = require("inspector/components/packets-sidebar"); var ReactMatchers = require("karma-tests/custom-react-matchers"); describe("PacketsSidebar", () => { diff --git a/karma-tests/components/packets-toolbar-spec.js b/karma-tests/components/packets-toolbar-spec.js index d384cad..cbf246d 100644 --- a/karma-tests/components/packets-toolbar-spec.js +++ b/karma-tests/components/packets-toolbar-spec.js @@ -7,7 +7,7 @@ define(function (require) { var React = require("react"); var { TestUtils } = React.addons; -var { PacketsToolbar } = require("components/packets-toolbar"); +var { PacketsToolbar } = require("inspector/components/packets-toolbar"); var packetsToolbar = TestUtils.renderIntoDocument(PacketsToolbar({})); diff --git a/karma-tests/test-main.js b/karma-tests/test-main.js index 73b9bd0..331843a 100644 --- a/karma-tests/test-main.js +++ b/karma-tests/test-main.js @@ -17,24 +17,25 @@ Object.keys(window.__karma__.files).forEach(function(file) { require.config({ // Karma serves files under /base, which is the basePath from your config file - baseUrl: '/base/data/inspector/', + baseUrl: '/base/data/', // dynamically load all test files deps: allTestFiles, paths: { // rdp-inspector requirejs paths - "jquery": "../lib/jquery/jquery", - "bootstrap": "../lib/bootstrap/js/bootstrap", - "immutable": "../lib/immutable/immutable", - "react-bootstrap": "../lib/react-bootstrap/react-bootstrap", - "reps": "../../node_modules/firebug.sdk/lib/reps", + "shared": "./shared", + "jquery": "./lib/jquery/jquery", + "bootstrap": "./lib/bootstrap/js/bootstrap", + "immutable": "./lib/immutable/immutable", + "react-bootstrap": "./lib/react-bootstrap/react-bootstrap", + "reps": "../node_modules/firebug.sdk/lib/reps", // use react-with-addons during testing - "react": "../../karma-tests/lib/react-with-addons", + "react": "../karma-tests/lib/react-with-addons", // include jasmine custom matchers - "karma-tests": "../../karma-tests" + "karma-tests": "../karma-tests" }, // we have to kickoff jasmine, as it is asynchronous From 82f2bd19b761cd5c55752213b5d7e3ea58adb082 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Thu, 17 Sep 2015 17:27:29 +0200 Subject: [PATCH 15/20] fix InspectorService undefined in the InspectorWindow.onWindowInitialized handler with this change the InspectorService passes itself to the ToolboxOverlay which pass it to the InspectorWindow. --- lib/inspector-service.js | 8 +++++++- lib/inspector-window.js | 7 ++++--- lib/toolbox-overlay.js | 3 ++- 3 files changed, 13 insertions(+), 5 deletions(-) diff --git a/lib/inspector-service.js b/lib/inspector-service.js index fbd60fa..176d4f9 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -58,6 +58,12 @@ const InspectorService = this.clientsByUUID = new Map(); this.onDebuggerClientConnect = this.onDebuggerClientConnect.bind(this); + this.onDebuggerClientClosed = this.onDebuggerClientClosed.bind(this); + this.onToolboxReady = this.onToolboxReady.bind(this); + this.onToolboxDestroy = this.onToolboxDestroy.bind(this); + this.onWebIDEConnectionCreated = this.onWebIDEConnectionCreated.bind(this); + this.onWebIDEConnectionReady = this.onWebIDEConnectionReady.bind(this); + on(DebuggerClient, "connect", this.onDebuggerClientConnect); }, @@ -141,7 +147,7 @@ const InspectorService = inspectorWindowName = `Tab: ${toolbox.target.tab.label}`; } - let toolboxOverlay = new ToolboxOverlay({ inspectorWindowName, toolbox }); + let toolboxOverlay = new ToolboxOverlay({ InspectorService: this, inspectorWindowName, toolbox }); this._setClientInfo(toolbox.target.client, { toolbox, toolboxOverlay diff --git a/lib/inspector-window.js b/lib/inspector-window.js index 92330a3..b9a5af4 100644 --- a/lib/inspector-window.js +++ b/lib/inspector-window.js @@ -25,7 +25,6 @@ const { Str } = require("firebug.sdk/lib/core/string.js"); const { Options } = require("firebug.sdk/lib/core/options.js"); // Constants -const { InspectorService } = require("./inspector-service.js"); const nsIFilePicker = Ci.nsIFilePicker; const INSPECTOR_XUL_URL = "chrome://rdpinspector/content/inspector-window.xul"; @@ -38,7 +37,8 @@ const InspectorWindow = Class( { // Initialization - initialize: function(toolboxOverlay, inspectorWindowName) { + initialize: function(InspectorService, toolboxOverlay, inspectorWindowName) { + this.InspectorService = InspectorService; this.toolboxOverlay = toolboxOverlay; this.inspectorWindowName = inspectorWindowName; this.toolbox = toolboxOverlay.toolbox; @@ -53,6 +53,7 @@ const InspectorWindow = Class( // DOM Events this.onClose = this.onClose.bind(this); this.onLoad = this.onLoad.bind(this); + this.onWindowInitialized = this.onWindowInitialized.bind(this); this.onFrameContentLoaded = this.onFrameContentLoaded.bind(this); // Message Manager @@ -152,7 +153,7 @@ const InspectorWindow = Class( simplePrefs.on("showInlineDetails", this.onPrefsChanged); simplePrefs.on("packetCacheEnabled", this.onPrefsChanged); - InspectorService.getInspectorClients(this.toolbox).then(clients => { + this.InspectorService.getInspectorClients(this.toolbox).then(clients => { // install inspector actors this.inspectorActorClients = clients; // get the actors and factories info from the inspector actors diff --git a/lib/toolbox-overlay.js b/lib/toolbox-overlay.js index f2f0afe..c91c3b2 100644 --- a/lib/toolbox-overlay.js +++ b/lib/toolbox-overlay.js @@ -43,6 +43,7 @@ const ToolboxOverlay = Class( Trace.sysout("ToolboxOverlay.initialize;", options); + this.InspectorService = options.InspectorService; this.inspectorWindowName = options.inspectorWindowName; // handler of packetCache toggling @@ -194,7 +195,7 @@ const ToolboxOverlay = Class( Trace.sysout("ToolboxOverlay.toggleInspector;"); if (!this.inspector) { - this.inspector = new InspectorWindow(this, this.inspectorWindowName); + this.inspector = new InspectorWindow(this.InspectorService, this, this.inspectorWindowName); } // Show or hide the popup panel. From 28d8b574646dc970000dea4cdf6bc981d4d1570c Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Tue, 29 Sep 2015 17:57:36 +0200 Subject: [PATCH 16/20] Localize connection list UI tabs --- chrome/locale/en-US/connections.properties | 4 ++++ chrome/locale/en-US/toolbox.properties | 2 +- data/connections-list/components/connections-list.js | 4 ++-- lib/inspector-service.js | 11 +++++++++-- lib/main.js | 1 + 5 files changed, 17 insertions(+), 5 deletions(-) create mode 100644 chrome/locale/en-US/connections.properties diff --git a/chrome/locale/en-US/connections.properties b/chrome/locale/en-US/connections.properties new file mode 100644 index 0000000..5786f08 --- /dev/null +++ b/chrome/locale/en-US/connections.properties @@ -0,0 +1,4 @@ +# LOCALIZATION NOTE (rdpConnections.tab.LocalTabs, rdpConnections.tab.WebIDE) +# A label for "Connect To..." window tabs. +rdpConnections.tab.LocalTabs=Local Tabs +rdpConnections.tab.WebIDE=WebIDE diff --git a/chrome/locale/en-US/toolbox.properties b/chrome/locale/en-US/toolbox.properties index e92d8f4..7996ed9 100644 --- a/chrome/locale/en-US/toolbox.properties +++ b/chrome/locale/en-US/toolbox.properties @@ -57,5 +57,5 @@ rdpInspector.menu.webideConnectionsMonitor.tip=Monitor WebIDE connections and au # LOCALIZATION NOTE (rdpInspector.menu.connectionsList.label, rdpInspector.menu.connectionsList.tip): # RDP Inspector menu label. The menu is available in RDP Inspector start # button located in Firefox toolbar. -rdpInspector.menu.connectionsList.label=RDP Connections List Selector +rdpInspector.menu.connectionsList.label=Connect to... rdpInspector.menu.connectionsList.tip=Open a dialog which lists all the RDP Connections available to the RDPInspector diff --git a/data/connections-list/components/connections-list.js b/data/connections-list/components/connections-list.js index a394a15..daf4076 100644 --- a/data/connections-list/components/connections-list.js +++ b/data/connections-list/components/connections-list.js @@ -39,12 +39,12 @@ exports.ConnectionsList = React.createClass({ const connectionsGroups = Object.keys(connections).map((groupName, i) => { return TabPane({ key: groupName, - tab: groupName, + tab: connections[groupName].label, eventKey: i + 1, style: { overflow: "auto"} }, React.createElement(ConnectionsGroup, { onConnectionClick: this.props.onConnectionClick, - connectionsList: connections[groupName] + connectionsList: connections[groupName].connections })); }); diff --git a/lib/inspector-service.js b/lib/inspector-service.js index 176d4f9..436c0f5 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -14,6 +14,7 @@ const { defer, all } = require("sdk/core/promise"); const { uuid } = require("sdk/util/uuid"); // Firebug SDK +const { Locale } = require("firebug.sdk/lib/core/locale.js"); const { Dispatcher } = require("firebug.sdk/lib/dispatcher"); const { Trace/*, TraceError*/ } = require("firebug.sdk/lib/core/trace.js").get(module.id); const { Rdp } = require("firebug.sdk/lib/core/rdp.js"); @@ -101,8 +102,14 @@ const InspectorService = } let connectionsMap = { - "Local Tabs": localTabsConnections, - "WebIDE": webideConnections + "local_tabs": { + label: Locale.$STR("rdpConnections.tab.LocalTabs"), + connections: localTabsConnections + }, + "webide": { + label: Locale.$STR("rdpConnections.tab.WebIDE"), + connections: webideConnections + } }; return connectionsMap; diff --git a/lib/main.js b/lib/main.js index 8e5ee4b..e12c9cb 100644 --- a/lib/main.js +++ b/lib/main.js @@ -14,6 +14,7 @@ require("./inspector-service"); // Localization files Locale.registerStringBundle("chrome://rdpinspector/locale/toolbox.properties"); +Locale.registerStringBundle("chrome://rdpinspector/locale/connections.properties"); Locale.registerStringBundle("chrome://rdpinspector/locale/inspector.properties"); Locale.registerStringBundle("chrome://rdpinspector-firebug.sdk/locale/reps.properties"); From d56b6aad2f14723eeccf902854ff446eff50baae Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Tue, 29 Sep 2015 18:00:10 +0200 Subject: [PATCH 17/20] enclose 'Connect To...' menu item in the start button inside two menu item separators --- lib/start-button.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/lib/start-button.js b/lib/start-button.js index 8d93b12..afdaf1a 100644 --- a/lib/start-button.js +++ b/lib/start-button.js @@ -176,6 +176,8 @@ var StartButton = ] }); + items.push("-"); + items.push({ nol10n: true, label: Locale.$STR("rdpInspector.menu.connectionsList.label"), @@ -183,6 +185,8 @@ var StartButton = command: this.onConnectionsList.bind(this) }); + items.push("-"); + items.push({ nol10n: true, label: Locale.$STR("rdpInspector.menu.visitHomePage.label"), From 0045e9aaaf8e5116c163836a6c7c2d135435a40c Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Tue, 29 Sep 2015 18:26:16 +0200 Subject: [PATCH 18/20] remove "monitor webide connection" preference and add a new "auto open on webide connection" preference --- chrome/locale/en-US/toolbox.properties | 6 +++--- lib/inspector-service.js | 5 ++++- lib/start-button.js | 10 +++++----- lib/webide-connections-monitor.js | 4 +--- package.json | 6 +++--- 5 files changed, 16 insertions(+), 15 deletions(-) diff --git a/chrome/locale/en-US/toolbox.properties b/chrome/locale/en-US/toolbox.properties index 7996ed9..8210cdc 100644 --- a/chrome/locale/en-US/toolbox.properties +++ b/chrome/locale/en-US/toolbox.properties @@ -48,11 +48,11 @@ rdpInspector.menu.packetCache.tip=Store packets in a cache before the console is rdpInspector.menu.showInlineDetails.label=Show Packet Details Inline rdpInspector.menu.showInlineDetails.tip=Show a detailed tree view of the Packet content. -# LOCALIZATION NOTE (rdpInspector.menu.webideConnectionsMonitor.label,rdpInspector.menu.webideConnectionsMonitor.tip): +# LOCALIZATION NOTE (rdpInspector.menu.autoOpenOnWebIDEConnection.label,rdpInspector.menu.autoOpenOnWebIDEConnection.tip): # RDP Inspector menu label. The menu is available in RDP Inspector start # button located in Firefox toolbar, inside the Options sub-menu. -rdpInspector.menu.webideConnectionsMonitor.label=Monitor WebIDE connections -rdpInspector.menu.webideConnectionsMonitor.tip=Monitor WebIDE connections and auto-open an RDP inspector window. +rdpInspector.menu.autoOpenOnWebIDEConnection.label=Open automatically on new WebIDE connections +rdpInspector.menu.autoOpenOnWebIDEConnection.tip=Open an RDP inspector window automatically on every new WebIDE connections. # LOCALIZATION NOTE (rdpInspector.menu.connectionsList.label, rdpInspector.menu.connectionsList.tip): # RDP Inspector menu label. The menu is available in RDP Inspector start diff --git a/lib/inspector-service.js b/lib/inspector-service.js index 436c0f5..4fa2685 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -12,6 +12,7 @@ const { Cu } = require("chrome"); const { defer, all } = require("sdk/core/promise"); const { uuid } = require("sdk/util/uuid"); +const { prefs } = require("sdk/simple-prefs"); // Firebug SDK const { Locale } = require("firebug.sdk/lib/core/locale.js"); @@ -149,7 +150,9 @@ const InspectorService = if (clientInfo && clientInfo.webide) { inspectorWindowName = `WebIDE: ${clientInfo.webide.selectedRuntime.name}`; - autoOpenInspectorConsole = true; + if (prefs.autoOpenOnWebIDEConnection) { + autoOpenInspectorConsole = true; + } } else if (toolbox.target.isLocalTab) { inspectorWindowName = `Tab: ${toolbox.target.tab.label}`; } diff --git a/lib/start-button.js b/lib/start-button.js index afdaf1a..21ab7b7 100644 --- a/lib/start-button.js +++ b/lib/start-button.js @@ -151,11 +151,11 @@ var StartButton = items: [ { nol10n: true, - label: Locale.$STR("rdpInspector.menu.webideConnectionsMonitor.label"), - tooltiptext: Locale.$STR("rdpInspector.menu.webideConnectionsMonitor.tip"), + label: Locale.$STR("rdpInspector.menu.autoOpenOnWebIDEConnection.label"), + tooltiptext: Locale.$STR("rdpInspector.menu.autoOpenOnWebIDEConnection.tip"), type: "checkbox", checked: prefs.webideConnectionsMonitor, - command: this.onToggleWebideConnectionsMonitor.bind(this) + command: this.onToggleAutoOpenOnWebideConnections.bind(this) }, { nol10n: true, @@ -238,10 +238,10 @@ var StartButton = this.connectionsListWindow.open(); }, - onToggleWebideConnectionsMonitor: function(event) { + onToggleAutoOpenOnWebideConnections: function(event) { cancelEvent(event); - prefs.webideConnectionsMonitor = !prefs.webideConnectionsMonitor; + prefs.autoOpenOnWebIDEConnection = !prefs.autoOpenOnWebIDEConnection; }, onTogglePacketCache: function(event) { diff --git a/lib/webide-connections-monitor.js b/lib/webide-connections-monitor.js index 5bfdaa0..7690d89 100644 --- a/lib/webide-connections-monitor.js +++ b/lib/webide-connections-monitor.js @@ -6,8 +6,6 @@ module.metadata = { "stability": "extermental" }; -const { prefs } = require("sdk/simple-prefs"); - // Firebug SDK const { Dispatcher } = require("firebug.sdk/lib/dispatcher"); const { Trace/*, TraceError*/ } = require("firebug.sdk/lib/core/trace.js").get(module.id); @@ -53,7 +51,7 @@ const WebIDEConnectionsMonitor = Dispatcher.emit("onWebIDEConnectionCreated", [{ connection }]); connection.on(Connection.Events.CONNECTED, () => { - if (prefs.webideConnectionsMonitor && AppManager.connection == connection) { + if (AppManager.connection == connection) { Dispatcher.emit("onWebIDEConnectionReady", [{ connection, selectedRuntime: AppManager.selectedRuntime }]); } diff --git a/package.json b/package.json index 50d6d24..3d4a272 100644 --- a/package.json +++ b/package.json @@ -45,9 +45,9 @@ "preferences-branch": "rdpinspector", "preferences": [ { - "name": "webideConnectionMonitor", - "title": "Monitor WebIDE connections", - "description": "Monitor WebIDE connections and auto-open an RDP inspector window", + "name": "autoOpenOnWebIDEConnection", + "title": "Open RDP Inspector window automatically on new WebIDE connections", + "description": "auto-open an RDP inspector window on every new WebIDE connections", "type": "bool", "value": false }, From f674930146a2f861a0e7ab8a30b7740992def957 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Tue, 29 Sep 2015 20:01:42 +0200 Subject: [PATCH 19/20] massive rename of ConnectionsList to ConnectionList --- chrome/content/connections-window.xul | 4 ++-- chrome/locale/en-US/toolbox.properties | 6 ++--- .../components/connection-list.js} | 8 +++---- .../components/main-panel.js | 4 ++-- .../config.js | 0 .../index.html | 0 .../index.js | 8 +++---- data/shared/rdp-inspector-window.js | 6 ++--- ...st-window.js => connection-list-window.js} | 24 +++++++++---------- lib/start-button.js | 14 +++++------ 10 files changed, 37 insertions(+), 37 deletions(-) rename data/{connections-list/components/connections-list.js => connection-list/components/connection-list.js} (85%) rename data/{connections-list => connection-list}/components/main-panel.js (77%) rename data/{connections-list => connection-list}/config.js (100%) rename data/{connections-list => connection-list}/index.html (100%) rename data/{connections-list => connection-list}/index.js (66%) rename lib/{connections-list-window.js => connection-list-window.js} (87%) diff --git a/chrome/content/connections-window.xul b/chrome/content/connections-window.xul index 0ad0cff..7199073 100644 --- a/chrome/content/connections-window.xul +++ b/chrome/content/connections-window.xul @@ -7,8 +7,8 @@ diff --git a/chrome/locale/en-US/toolbox.properties b/chrome/locale/en-US/toolbox.properties index 8210cdc..fdfa8ac 100644 --- a/chrome/locale/en-US/toolbox.properties +++ b/chrome/locale/en-US/toolbox.properties @@ -54,8 +54,8 @@ rdpInspector.menu.showInlineDetails.tip=Show a detailed tree view of the Packet rdpInspector.menu.autoOpenOnWebIDEConnection.label=Open automatically on new WebIDE connections rdpInspector.menu.autoOpenOnWebIDEConnection.tip=Open an RDP inspector window automatically on every new WebIDE connections. -# LOCALIZATION NOTE (rdpInspector.menu.connectionsList.label, rdpInspector.menu.connectionsList.tip): +# LOCALIZATION NOTE (rdpInspector.menu.connectionList.label, rdpInspector.menu.connectionList.tip): # RDP Inspector menu label. The menu is available in RDP Inspector start # button located in Firefox toolbar. -rdpInspector.menu.connectionsList.label=Connect to... -rdpInspector.menu.connectionsList.tip=Open a dialog which lists all the RDP Connections available to the RDPInspector +rdpInspector.menu.connectionList.label=Connect to... +rdpInspector.menu.connectionList.tip=Open a dialog which lists all the RDP Connections available to the RDPInspector diff --git a/data/connections-list/components/connections-list.js b/data/connection-list/components/connection-list.js similarity index 85% rename from data/connections-list/components/connections-list.js rename to data/connection-list/components/connection-list.js index daf4076..c5bc0fa 100644 --- a/data/connections-list/components/connections-list.js +++ b/data/connection-list/components/connection-list.js @@ -17,7 +17,7 @@ const ConnectionsGroup = React.createClass({ displayName: "ConnectionsGroup", render() { - let connections = this.props.connectionsList.map((conn) => { + let connections = this.props.connections.map((conn) => { return ListGroupItem({ onClick: (evt) => { this.props.onConnectionClick(conn, evt); @@ -29,8 +29,8 @@ const ConnectionsGroup = React.createClass({ } }); -exports.ConnectionsList = React.createClass({ - displayName: "ConnectionsList", +exports.ConnectionList = React.createClass({ + displayName: "ConnectionList", render() { const connections = this.props.connections || {}; @@ -44,7 +44,7 @@ exports.ConnectionsList = React.createClass({ style: { overflow: "auto"} }, React.createElement(ConnectionsGroup, { onConnectionClick: this.props.onConnectionClick, - connectionsList: connections[groupName].connections + connections: connections[groupName].connections })); }); diff --git a/data/connections-list/components/main-panel.js b/data/connection-list/components/main-panel.js similarity index 77% rename from data/connections-list/components/main-panel.js rename to data/connection-list/components/main-panel.js index f7c71fd..fa56297 100644 --- a/data/connections-list/components/main-panel.js +++ b/data/connection-list/components/main-panel.js @@ -8,13 +8,13 @@ define(function(require, exports/*, module*/) { const React = require("react"); // Connections List components -const { ConnectionsList } = require("./connections-list"); +const { ConnectionList } = require("./connection-list"); exports.MainPanel = React.createClass({ displayName: "MainPanel", render() { - return React.createElement(ConnectionsList, { + return React.createElement(ConnectionList, { connections: this.props.connections, onConnectionClick: this.props.onConnectionClick }); diff --git a/data/connections-list/config.js b/data/connection-list/config.js similarity index 100% rename from data/connections-list/config.js rename to data/connection-list/config.js diff --git a/data/connections-list/index.html b/data/connection-list/index.html similarity index 100% rename from data/connections-list/index.html rename to data/connection-list/index.html diff --git a/data/connections-list/index.js b/data/connection-list/index.js similarity index 66% rename from data/connections-list/index.js rename to data/connection-list/index.js index 1da5888..58f38cc 100644 --- a/data/connections-list/index.js +++ b/data/connection-list/index.js @@ -4,7 +4,7 @@ define(function(require/*, exports, module*/) { "use strict"; -const { RDPConnectionsList } = require("shared/rdp-inspector-window"); +const { RDPConnectionList } = require("shared/rdp-inspector-window"); var { Resizer } = require("shared/resizer"); const { MainPanel } = require("./components/main-panel"); @@ -13,13 +13,13 @@ const { MainPanel } = require("./components/main-panel"); var React = require("react"); function render() { - let connections = RDPConnectionsList.getConnectionsInfo(); + let connections = RDPConnectionList.getConnectionsInfo(); return React.render( React.createElement(MainPanel, { connections, onConnectionClick: (conn) => { - RDPConnectionsList.openRDPInspectorWindow(conn); + RDPConnectionList.openRDPInspectorWindow(conn); } }), document.querySelector("#content") @@ -27,7 +27,7 @@ function render() { } let theApp = render(); -RDPConnectionsList.onConnectionsUpdated.addListener(render); +RDPConnectionList.onConnectionsUpdated.addListener(render); /* eslint-disable no-new */ new Resizer(window, theApp); diff --git a/data/shared/rdp-inspector-window.js b/data/shared/rdp-inspector-window.js index cd458ef..2d85fad 100644 --- a/data/shared/rdp-inspector-window.js +++ b/data/shared/rdp-inspector-window.js @@ -36,7 +36,7 @@ if (["http:", "https:", "file:"].indexOf(window.location.protocol) >= 0) { console.log("POST CHROME MESSAGE", arguments); }; - exports.RDPConnectionsList = { + exports.RDPConnectionList = { getConnectionsInfo: () => {}, onConnectionsUpdated: { addListener: function() {}, @@ -64,8 +64,8 @@ if (["http:", "https:", "file:"].indexOf(window.location.protocol) >= 0) { exports.postChromeMessage = window.postChromeMessage; } - if ("RDPConnectionsList" in window) { - exports.RDPConnectionsList = window.RDPConnectionsList; + if ("RDPConnectionList" in window) { + exports.RDPConnectionList = window.RDPConnectionList; } } diff --git a/lib/connections-list-window.js b/lib/connection-list-window.js similarity index 87% rename from lib/connections-list-window.js rename to lib/connection-list-window.js index 7afe114..2bf2ef1 100644 --- a/lib/connections-list-window.js +++ b/lib/connection-list-window.js @@ -25,14 +25,14 @@ const { Dispatcher } = require("firebug.sdk/lib/dispatcher.js"); // Constants const { InspectorService } = require("./inspector-service.js"); -const WINDOW_TYPE = "RDPInspectorConnectionsList"; +const WINDOW_TYPE = "RDPInspectorConnectionList"; const CONNECTIONS_XUL_URL = "chrome://rdpinspector/content/connections-window.xul"; /** * This class manages the connections list window */ -const ConnectionsListWindow = Class( -/** @lends ConnectionsListWindow */ +const ConnectionListWindow = Class( +/** @lends ConnectionListWindow */ { initialize() { // TODO: bind event handling methods @@ -62,7 +62,7 @@ const ConnectionsListWindow = Class( }, open() { - Trace.sysout("ConnectionsListWindow.open;", arguments); + Trace.sysout("ConnectionListWindow.open;", arguments); // If the Connections List window is already opened, focus and return it. let win = getMostRecentWindow(WINDOW_TYPE); @@ -76,7 +76,7 @@ const ConnectionsListWindow = Class( }, _open(windowType, url, params) { - Trace.sysout("ConnectionsListWindow.open;", arguments); + Trace.sysout("ConnectionListWindow.open;", arguments); // Open RDP Inspector console window. this.win = openDialog({ @@ -96,16 +96,16 @@ const ConnectionsListWindow = Class( // Event Handlers onLoad(event) { - Trace.sysout("ConnectionsListWindow.onLoad; ", event); + Trace.sysout("ConnectionListWindow.onLoad; ", event); let frame = this.getFrame(); - frame.setAttribute("src", data.url("connections-list/index.html")); + frame.setAttribute("src", data.url("connection-list/index.html")); Events.once(frame, "DOMContentLoaded", this.onFrameContentLoaded); }, onFrameContentLoaded(event) { - Trace.sysout("ConnectionsListWindow.onFrameContentLoaded; ", event); + Trace.sysout("ConnectionListWindow.onFrameContentLoaded; ", event); let contentWindow = this.getContentWindow(); @@ -121,7 +121,7 @@ const ConnectionsListWindow = Class( exportCustomContentAPI(contentWindow) { var contentAPI = Cu.createObjectIn(contentWindow, { - defineAs: "RDPConnectionsList" + defineAs: "RDPConnectionList" }); Cu.exportFunction(function getConnectionsInfo() { @@ -161,13 +161,13 @@ const ConnectionsListWindow = Class( try { cb(contentConnInfo); } catch(e) { - TraceError.sysout("ConnectionsListWindow.onRDPConnectionsUpdated; ERROR in content cb: " + e); + TraceError.sysout("ConnectionListWindow.onRDPConnectionsUpdated; ERROR in content cb: " + e); } } }, onClose(event) { - Trace.sysout("ConnectionsListWindow.onClose; " + event, arguments); + Trace.sysout("ConnectionListWindow.onClose; " + event, arguments); this.win = null; }, @@ -191,4 +191,4 @@ const ConnectionsListWindow = Class( }); // Exports from this module -exports.ConnectionsListWindow = ConnectionsListWindow; +exports.ConnectionListWindow = ConnectionListWindow; diff --git a/lib/start-button.js b/lib/start-button.js index 21ab7b7..4fcf7a4 100644 --- a/lib/start-button.js +++ b/lib/start-button.js @@ -33,7 +33,7 @@ const { AddonManager } = Cu.import("resource://gre/modules/AddonManager.jsm", {} const { devtools, gDevTools } = require("firebug.sdk/lib/core/devtools.js"); // RDP Inspector -const { ConnectionsListWindow } = require("./connections-list-window"); +const { ConnectionListWindow } = require("./connection-list-window"); const startButtonId = "rdp-inspector-start-button"; @@ -104,7 +104,7 @@ var StartButton = onBuild: this.onBuild.bind(this) }); - this.connectionsListWindow = new ConnectionsListWindow(); + this.connectionListWindow = new ConnectionListWindow(); }, shutdown: function(/*reason*/) { @@ -180,9 +180,9 @@ var StartButton = items.push({ nol10n: true, - label: Locale.$STR("rdpInspector.menu.connectionsList.label"), - tooltiptext: Locale.$STR("rdpInspector.menu.connectionsList.tip"), - command: this.onConnectionsList.bind(this) + label: Locale.$STR("rdpInspector.menu.connectionList.label"), + tooltiptext: Locale.$STR("rdpInspector.menu.connectionList.tip"), + command: this.onConnectionList.bind(this) }); items.push("-"); @@ -232,10 +232,10 @@ var StartButton = }, // Commands - onConnectionsList: function(event) { + onConnectionList: function(event) { cancelEvent(event); - this.connectionsListWindow.open(); + this.connectionListWindow.open(); }, onToggleAutoOpenOnWebideConnections: function(event) { From d821973f7abfccaa68b53f7251931c26ae3a4d92 Mon Sep 17 00:00:00 2001 From: Luca Greco Date: Wed, 30 Sep 2015 18:22:20 +0200 Subject: [PATCH 20/20] toolbox chrome helper emit toolbox overlay instead of creating it manually from the inspector service --- lib/inspector-service.js | 50 +++++++++++++++++++++------------------- lib/inspector-window.js | 6 ++--- lib/main.js | 3 +++ lib/toolbox-overlay.js | 7 ++---- 4 files changed, 34 insertions(+), 32 deletions(-) diff --git a/lib/inspector-service.js b/lib/inspector-service.js index 4fa2685..0286c8d 100644 --- a/lib/inspector-service.js +++ b/lib/inspector-service.js @@ -38,8 +38,6 @@ const { InspectorFront } = require("./inspector-front.js"); // installed and loaded on the backend. const actorModuleUrl = options.prefixURI + "lib/inspector-actor.js"; -const { ToolboxOverlay } = require("./toolbox-overlay"); - /** * @service This object represents 'RDP Inspector Service'. * This service is responsible for registering necessary back-end @@ -63,6 +61,8 @@ const InspectorService = this.onDebuggerClientClosed = this.onDebuggerClientClosed.bind(this); this.onToolboxReady = this.onToolboxReady.bind(this); this.onToolboxDestroy = this.onToolboxDestroy.bind(this); + this.onToolboxOverlay = this.onToolboxOverlay.bind(this); + this.onWebIDEConnectionCreated = this.onWebIDEConnectionCreated.bind(this); this.onWebIDEConnectionReady = this.onWebIDEConnectionReady.bind(this); @@ -118,7 +118,9 @@ const InspectorService = openRDPInspectorWindow(uuidConn) { if (this.clientsByUUID.has(uuidConn)) { - this.clientsByUUID.get(uuidConn).toolboxOverlay.openInspectorWindow(); + let { toolbox } = this.clientsByUUID.get(uuidConn); + + Dispatcher.emit("onToggleRDPInspector", [{ toolbox }]); } }, @@ -138,36 +140,28 @@ const InspectorService = // Toolbox Events - onToolboxReady: function(eventId, toolbox) { - Trace.sysout("InspectorService.onToolboxReady;", toolbox); + onToolboxOverlay: function({ toolbox, overlay }) { + this._setClientInfo(toolbox.target.client, { + toolbox, toolboxOverlay: overlay + }); let clientInfo = this.clientsMap.get(toolbox.target.client); - let inspectorWindowName; - let autoOpenInspectorConsole = false; - if (clientInfo && clientInfo.webide) { - inspectorWindowName = `WebIDE: ${clientInfo.webide.selectedRuntime.name}`; - - if (prefs.autoOpenOnWebIDEConnection) { - autoOpenInspectorConsole = true; - } - } else if (toolbox.target.isLocalTab) { - inspectorWindowName = `Tab: ${toolbox.target.tab.label}`; + if (clientInfo && clientInfo.webide && prefs.autoOpenOnWebIDEConnection) { + autoOpenInspectorConsole = true; } - let toolboxOverlay = new ToolboxOverlay({ InspectorService: this, inspectorWindowName, toolbox }); - - this._setClientInfo(toolbox.target.client, { - toolbox, toolboxOverlay - }); + if (autoOpenInspectorConsole) { + Dispatcher.emit("onToggleRDPInspector", [{ toolbox }]); + } Dispatcher.emit("onRDPConnectionsUpdated", []); + }, - if (autoOpenInspectorConsole) { - toolboxOverlay.openInspectorWindow(); - } + onToolboxReady: function(eventId, toolbox) { + Trace.sysout("InspectorService.onToolboxReady;", toolbox); }, onToolboxDestroy: function(/*eventId, toolbox*/) { @@ -193,10 +187,18 @@ const InspectorService = onToggleRDPInspector: function({ toolbox }) { Trace.sysout("InspectorService.onToggleRDPInspector;", toolbox); + let inspectorWindowName; + let clientInfo = this.clientsMap.get(toolbox.target.client); + if (clientInfo && clientInfo.webide) { + inspectorWindowName = `WebIDE: ${clientInfo.webide.selectedRuntime.name}`; + } else if (toolbox.target.isLocalTab) { + inspectorWindowName = `Tab: ${toolbox.target.tab.label}`; + } + if (clientInfo && clientInfo.toolboxOverlay) { - clientInfo.toolboxOverlay.openInspectorWindow(); + clientInfo.toolboxOverlay.openInspectorWindow(inspectorWindowName); } }, diff --git a/lib/inspector-window.js b/lib/inspector-window.js index b9a5af4..598904d 100644 --- a/lib/inspector-window.js +++ b/lib/inspector-window.js @@ -25,6 +25,7 @@ const { Str } = require("firebug.sdk/lib/core/string.js"); const { Options } = require("firebug.sdk/lib/core/options.js"); // Constants +const { InspectorService } = require("./inspector-service.js"); const nsIFilePicker = Ci.nsIFilePicker; const INSPECTOR_XUL_URL = "chrome://rdpinspector/content/inspector-window.xul"; @@ -37,8 +38,7 @@ const InspectorWindow = Class( { // Initialization - initialize: function(InspectorService, toolboxOverlay, inspectorWindowName) { - this.InspectorService = InspectorService; + initialize: function(toolboxOverlay, inspectorWindowName) { this.toolboxOverlay = toolboxOverlay; this.inspectorWindowName = inspectorWindowName; this.toolbox = toolboxOverlay.toolbox; @@ -153,7 +153,7 @@ const InspectorWindow = Class( simplePrefs.on("showInlineDetails", this.onPrefsChanged); simplePrefs.on("packetCacheEnabled", this.onPrefsChanged); - this.InspectorService.getInspectorClients(this.toolbox).then(clients => { + InspectorService.getInspectorClients(this.toolbox).then(clients => { // install inspector actors this.inspectorActorClients = clients; // get the actors and factories info from the inspector actors diff --git a/lib/main.js b/lib/main.js index e12c9cb..01ec2a7 100644 --- a/lib/main.js +++ b/lib/main.js @@ -11,6 +11,7 @@ const { ToolboxChrome } = require("firebug.sdk/lib/toolbox-chrome.js"); require("./start-button.js"); require("./webide-connections-monitor"); require("./inspector-service"); +const { ToolboxOverlay } = require("./toolbox-overlay"); // Localization files Locale.registerStringBundle("chrome://rdpinspector/locale/toolbox.properties"); @@ -26,11 +27,13 @@ function main(options/*, callbacks*/) { Trace.sysout("main;", options); ToolboxChrome.initialize(options); + ToolboxChrome.registerToolboxOverlay(ToolboxOverlay); } function onUnload(reason) { Trace.sysout("onUnload; " + reason); + ToolboxChrome.unregisterToolboxOverlay(ToolboxOverlay); ToolboxChrome.shutdown(reason); } diff --git a/lib/toolbox-overlay.js b/lib/toolbox-overlay.js index c91c3b2..603ffbb 100644 --- a/lib/toolbox-overlay.js +++ b/lib/toolbox-overlay.js @@ -43,9 +43,6 @@ const ToolboxOverlay = Class( Trace.sysout("ToolboxOverlay.initialize;", options); - this.InspectorService = options.InspectorService; - this.inspectorWindowName = options.inspectorWindowName; - // handler of packetCache toggling this.onToggleCache = this.onToggleCache.bind(this); @@ -191,11 +188,11 @@ const ToolboxOverlay = Class( // Commands - openInspectorWindow: function() { + openInspectorWindow: function(inspectorWindowName) { Trace.sysout("ToolboxOverlay.toggleInspector;"); if (!this.inspector) { - this.inspector = new InspectorWindow(this.InspectorService, this, this.inspectorWindowName); + this.inspector = new InspectorWindow(this, inspectorWindowName); } // Show or hide the popup panel.