summaryrefslogtreecommitdiffstats
path: root/devtools/client/projecteditor/lib
diff options
context:
space:
mode:
authorMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
committerMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
commit5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree10027f336435511475e392454359edea8e25895d /devtools/client/projecteditor/lib
parent49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
downloadUXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
Add m-esr52 at 52.6.0
Diffstat (limited to 'devtools/client/projecteditor/lib')
-rw-r--r--devtools/client/projecteditor/lib/editors.js303
-rw-r--r--devtools/client/projecteditor/lib/helpers/event.js86
-rw-r--r--devtools/client/projecteditor/lib/helpers/file-picker.js116
-rw-r--r--devtools/client/projecteditor/lib/helpers/l10n.js26
-rw-r--r--devtools/client/projecteditor/lib/helpers/moz.build12
-rw-r--r--devtools/client/projecteditor/lib/helpers/prompts.js33
-rw-r--r--devtools/client/projecteditor/lib/helpers/readdir.js89
-rw-r--r--devtools/client/projecteditor/lib/moz.build19
-rw-r--r--devtools/client/projecteditor/lib/plugins/app-manager/app-project-editor.js56
-rw-r--r--devtools/client/projecteditor/lib/plugins/app-manager/moz.build10
-rw-r--r--devtools/client/projecteditor/lib/plugins/app-manager/plugin.js77
-rw-r--r--devtools/client/projecteditor/lib/plugins/core.js83
-rw-r--r--devtools/client/projecteditor/lib/plugins/delete/delete.js67
-rw-r--r--devtools/client/projecteditor/lib/plugins/delete/moz.build9
-rw-r--r--devtools/client/projecteditor/lib/plugins/dirty/dirty.js47
-rw-r--r--devtools/client/projecteditor/lib/plugins/dirty/moz.build9
-rw-r--r--devtools/client/projecteditor/lib/plugins/image-view/image-editor.js50
-rw-r--r--devtools/client/projecteditor/lib/plugins/image-view/moz.build10
-rw-r--r--devtools/client/projecteditor/lib/plugins/image-view/plugin.js28
-rw-r--r--devtools/client/projecteditor/lib/plugins/logging/logging.js29
-rw-r--r--devtools/client/projecteditor/lib/plugins/logging/moz.build9
-rw-r--r--devtools/client/projecteditor/lib/plugins/moz.build21
-rw-r--r--devtools/client/projecteditor/lib/plugins/new/moz.build9
-rw-r--r--devtools/client/projecteditor/lib/plugins/new/new.js80
-rw-r--r--devtools/client/projecteditor/lib/plugins/rename/moz.build9
-rw-r--r--devtools/client/projecteditor/lib/plugins/rename/rename.js74
-rw-r--r--devtools/client/projecteditor/lib/plugins/save/moz.build9
-rw-r--r--devtools/client/projecteditor/lib/plugins/save/save.js93
-rw-r--r--devtools/client/projecteditor/lib/plugins/status-bar/moz.build9
-rw-r--r--devtools/client/projecteditor/lib/plugins/status-bar/plugin.js105
-rw-r--r--devtools/client/projecteditor/lib/project.js246
-rw-r--r--devtools/client/projecteditor/lib/projecteditor.js816
-rw-r--r--devtools/client/projecteditor/lib/shells.js243
-rw-r--r--devtools/client/projecteditor/lib/stores/base.js58
-rw-r--r--devtools/client/projecteditor/lib/stores/local.js215
-rw-r--r--devtools/client/projecteditor/lib/stores/moz.build11
-rw-r--r--devtools/client/projecteditor/lib/stores/resource.js398
-rw-r--r--devtools/client/projecteditor/lib/tree.js593
38 files changed, 4157 insertions, 0 deletions
diff --git a/devtools/client/projecteditor/lib/editors.js b/devtools/client/projecteditor/lib/editors.js
new file mode 100644
index 000000000..7d0150cf7
--- /dev/null
+++ b/devtools/client/projecteditor/lib/editors.js
@@ -0,0 +1,303 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const { EventTarget } = require("sdk/event/target");
+const { emit } = require("sdk/event/core");
+const promise = require("promise");
+const Editor = require("devtools/client/sourceeditor/editor");
+const HTML_NS = "http://www.w3.org/1999/xhtml";
+const XUL_NS = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
+
+/**
+ * ItchEditor is extended to implement an editor, which is the main view
+ * that shows up when a file is selected. This object should not be used
+ * directly - use TextEditor for a basic code editor.
+ */
+var ItchEditor = Class({
+ extends: EventTarget,
+
+ /**
+ * A boolean specifying if the toolbar above the editor should be hidden.
+ */
+ hidesToolbar: false,
+
+ /**
+ * A boolean specifying whether the editor can be edited / saved.
+ * For instance, a 'save' doesn't make sense on an image.
+ */
+ isEditable: false,
+
+ toString: function () {
+ return this.label || "";
+ },
+
+ emit: function (name, ...args) {
+ emit(this, name, ...args);
+ },
+
+ /* Does the editor not have any unsaved changes? */
+ isClean: function () {
+ return true;
+ },
+
+ /**
+ * Initialize the editor with a single host. This should be called
+ * by objects extending this object with:
+ * ItchEditor.prototype.initialize.apply(this, arguments)
+ */
+ initialize: function (host) {
+ this.host = host;
+ this.doc = host.document;
+ this.label = "";
+ this.elt = this.doc.createElement("vbox");
+ this.elt.setAttribute("flex", "1");
+ this.elt.editor = this;
+ this.toolbar = this.doc.querySelector("#projecteditor-toolbar");
+ this.projectEditorKeyset = host.projectEditorKeyset;
+ this.projectEditorCommandset = host.projectEditorCommandset;
+ },
+
+ /**
+ * Sets the visibility of the element that shows up above the editor
+ * based on the this.hidesToolbar property.
+ */
+ setToolbarVisibility: function () {
+ if (this.hidesToolbar) {
+ this.toolbar.setAttribute("hidden", "true");
+ } else {
+ this.toolbar.removeAttribute("hidden");
+ }
+ },
+
+
+ /**
+ * Load a single resource into the editor.
+ *
+ * @param Resource resource
+ * The single file / item that is being dealt with (see stores/base)
+ * @returns Promise
+ * A promise that is resolved once the editor has loaded the contents
+ * of the resource.
+ */
+ load: function (resource) {
+ return promise.resolve();
+ },
+
+ /**
+ * Clean up the editor. This can have different meanings
+ * depending on the type of editor.
+ */
+ destroy: function () {
+
+ },
+
+ /**
+ * Give focus to the editor. This can have different meanings
+ * depending on the type of editor.
+ *
+ * @returns Promise
+ * A promise that is resolved once the editor has been focused.
+ */
+ focus: function () {
+ return promise.resolve();
+ }
+});
+exports.ItchEditor = ItchEditor;
+
+/**
+ * The main implementation of the ItchEditor class. The TextEditor is used
+ * when editing any sort of plain text file, and can be created with different
+ * modes for syntax highlighting depending on the language.
+ */
+var TextEditor = Class({
+ extends: ItchEditor,
+
+ isEditable: true,
+
+ /**
+ * Extra keyboard shortcuts to use with the editor. Shortcuts defined
+ * within projecteditor should be triggered when they happen in the editor, and
+ * they would usually be swallowed without registering them.
+ * See "devtools/sourceeditor/editor" for more information.
+ */
+ get extraKeys() {
+ let extraKeys = {};
+
+ // Copy all of the registered keys into extraKeys object, to notify CodeMirror
+ // that it should be ignoring these keys
+ [...this.projectEditorKeyset.querySelectorAll("key")].forEach((key) => {
+ let keyUpper = key.getAttribute("key").toUpperCase();
+ let toolModifiers = key.getAttribute("modifiers");
+ let modifiers = {
+ alt: toolModifiers.includes("alt"),
+ shift: toolModifiers.includes("shift")
+ };
+
+ // On the key press, we will dispatch the event within projecteditor.
+ extraKeys[Editor.accel(keyUpper, modifiers)] = () => {
+ let doc = this.projectEditorCommandset.ownerDocument;
+ let event = doc.createEvent("Event");
+ event.initEvent("command", true, true);
+ let command = this.projectEditorCommandset.querySelector("#" + key.getAttribute("command"));
+ command.dispatchEvent(event);
+ };
+ });
+
+ return extraKeys;
+ },
+
+ isClean: function () {
+ if (!this.editor.isAppended()) {
+ return true;
+ }
+ return this.editor.getText() === this._savedResourceContents;
+ },
+
+ initialize: function (document, mode = Editor.modes.text) {
+ ItchEditor.prototype.initialize.apply(this, arguments);
+ this.label = mode.name;
+ this.editor = new Editor({
+ mode: mode,
+ lineNumbers: true,
+ extraKeys: this.extraKeys,
+ themeSwitching: false,
+ autocomplete: true,
+ contextMenu: this.host.textEditorContextMenuPopup
+ });
+
+ // Trigger a few editor specific events on `this`.
+ this.editor.on("change", (...args) => {
+ this.emit("change", ...args);
+ });
+ this.editor.on("cursorActivity", (...args) => {
+ this.emit("cursorActivity", ...args);
+ });
+ this.editor.on("focus", (...args) => {
+ this.emit("focus", ...args);
+ });
+ this.editor.on("saveRequested", (...args) => {
+ this.emit("saveRequested", ...args);
+ });
+
+ this.appended = this.editor.appendTo(this.elt);
+ },
+
+ /**
+ * Clean up the editor. This can have different meanings
+ * depending on the type of editor.
+ */
+ destroy: function () {
+ this.editor.destroy();
+ this.editor = null;
+ },
+
+ /**
+ * Load a single resource into the text editor.
+ *
+ * @param Resource resource
+ * The single file / item that is being dealt with (see stores/base)
+ * @returns Promise
+ * A promise that is resolved once the text editor has loaded the
+ * contents of the resource.
+ */
+ load: function (resource) {
+ // Wait for the editor.appendTo and resource.load before proceeding.
+ // They can run in parallel.
+ return promise.all([
+ resource.load(),
+ this.appended
+ ]).then(([resourceContents])=> {
+ if (!this.editor) {
+ return;
+ }
+ this._savedResourceContents = resourceContents;
+ this.editor.setText(resourceContents);
+ this.editor.clearHistory();
+ this.editor.setClean();
+ this.emit("load");
+ }, console.error);
+ },
+
+ /**
+ * Save the resource based on the current state of the editor
+ *
+ * @param Resource resource
+ * The single file / item to be saved
+ * @returns Promise
+ * A promise that is resolved once the resource has been
+ * saved.
+ */
+ save: function (resource) {
+ let newText = this.editor.getText();
+ return resource.save(newText).then(() => {
+ this._savedResourceContents = newText;
+ this.emit("save", resource);
+ });
+ },
+
+ /**
+ * Give focus to the code editor.
+ *
+ * @returns Promise
+ * A promise that is resolved once the editor has been focused.
+ */
+ focus: function () {
+ return this.appended.then(() => {
+ if (this.editor) {
+ this.editor.focus();
+ }
+ });
+ }
+});
+
+/**
+ * Wrapper for TextEditor using JavaScript syntax highlighting.
+ */
+function JSEditor(host) {
+ return TextEditor(host, Editor.modes.js);
+}
+
+/**
+ * Wrapper for TextEditor using CSS syntax highlighting.
+ */
+function CSSEditor(host) {
+ return TextEditor(host, Editor.modes.css);
+}
+
+/**
+ * Wrapper for TextEditor using HTML syntax highlighting.
+ */
+function HTMLEditor(host) {
+ return TextEditor(host, Editor.modes.html);
+}
+
+/**
+ * Get the type of editor that can handle a particular resource.
+ * @param Resource resource
+ * The single file that is going to be opened.
+ * @returns Type:Editor
+ * The type of editor that can handle this resource. The
+ * return value is a constructor function.
+ */
+function EditorTypeForResource(resource) {
+ const categoryMap = {
+ "txt": TextEditor,
+ "html": HTMLEditor,
+ "xml": HTMLEditor,
+ "css": CSSEditor,
+ "js": JSEditor,
+ "json": JSEditor
+ };
+ return categoryMap[resource.contentCategory] || TextEditor;
+}
+
+exports.TextEditor = TextEditor;
+exports.JSEditor = JSEditor;
+exports.CSSEditor = CSSEditor;
+exports.HTMLEditor = HTMLEditor;
+exports.EditorTypeForResource = EditorTypeForResource;
diff --git a/devtools/client/projecteditor/lib/helpers/event.js b/devtools/client/projecteditor/lib/helpers/event.js
new file mode 100644
index 000000000..74b4adb04
--- /dev/null
+++ b/devtools/client/projecteditor/lib/helpers/event.js
@@ -0,0 +1,86 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/**
+ * This file wraps EventEmitter objects to provide functions to forget
+ * all events bound on a certain object.
+ */
+
+const { Class } = require("sdk/core/heritage");
+
+/**
+ * The Scope object is used to keep track of listeners.
+ * This object is not exported.
+ */
+var Scope = Class({
+ on: function (target, event, handler) {
+ this.listeners = this.listeners || [];
+ this.listeners.push({
+ target: target,
+ event: event,
+ handler: handler
+ });
+ target.on(event, handler);
+ },
+
+ off: function (t, e, h) {
+ if (!this.listeners) return;
+ this.listeners = this.listeners.filter(({ target, event, handler }) => {
+ return !(target === t && event === e && handler === h);
+ });
+ target.off(event, handler);
+ },
+
+ clear: function (clearTarget) {
+ if (!this.listeners) return;
+ this.listeners = this.listeners.filter(({ target, event, handler }) => {
+ if (target === clearTarget) {
+ target.off(event, handler);
+ return false;
+ }
+ return true;
+ });
+ },
+
+ destroy: function () {
+ if (!this.listeners) return;
+ this.listeners.forEach(({ target, event, handler }) => {
+ target.off(event, handler);
+ });
+ this.listeners = undefined;
+ }
+});
+
+var scopes = new WeakMap();
+function scope(owner) {
+ if (!scopes.has(owner)) {
+ let scope = new Scope(owner);
+ scopes.set(owner, scope);
+ return scope;
+ }
+ return scopes.get(owner);
+}
+exports.scope = scope;
+
+exports.on = function on(owner, target, event, handler) {
+ if (!target) return;
+ scope(owner).on(target, event, handler);
+};
+
+exports.off = function off(owner, target, event, handler) {
+ if (!target) return;
+ scope(owner).off(target, event, handler);
+};
+
+exports.forget = function forget(owner, target) {
+ scope(owner).clear(target);
+};
+
+exports.done = function done(owner) {
+ scope(owner).destroy();
+ scopes.delete(owner);
+};
+
diff --git a/devtools/client/projecteditor/lib/helpers/file-picker.js b/devtools/client/projecteditor/lib/helpers/file-picker.js
new file mode 100644
index 000000000..1dab0f001
--- /dev/null
+++ b/devtools/client/projecteditor/lib/helpers/file-picker.js
@@ -0,0 +1,116 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/**
+ * This file contains helper functions for showing OS-specific
+ * file and folder pickers.
+ */
+
+const { Cu, Cc, Ci } = require("chrome");
+const { FileUtils } = Cu.import("resource://gre/modules/FileUtils.jsm", {});
+const promise = require("promise");
+const { merge } = require("sdk/util/object");
+const { getLocalizedString } = require("devtools/client/projecteditor/lib/helpers/l10n");
+
+/**
+ * Show a file / folder picker.
+ * https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFilePicker
+ *
+ * @param object options
+ * Additional options for setting the source. Supported options:
+ * - directory: string, The path to default opening
+ * - defaultName: string, The filename including extension that
+ * should be suggested to the user as a default
+ * - window: DOMWindow, The filename including extension that
+ * should be suggested to the user as a default
+ * - title: string, The filename including extension that
+ * should be suggested to the user as a default
+ * - mode: int, The type of picker to open.
+ *
+ * @return promise
+ * A promise that is resolved with the full path
+ * after the file has been picked.
+ */
+function showPicker(options) {
+ let fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
+ if (options.directory) {
+ try {
+ fp.displayDirectory = FileUtils.File(options.directory);
+ } catch (ex) {
+ console.warn(ex);
+ }
+ }
+
+ if (options.defaultName) {
+ fp.defaultString = options.defaultName;
+ }
+
+ fp.init(options.window, options.title, options.mode);
+ let deferred = promise.defer();
+ fp.open({
+ done: function (res) {
+ if (res === Ci.nsIFilePicker.returnOK || res === Ci.nsIFilePicker.returnReplace) {
+ deferred.resolve(fp.file.path);
+ } else {
+ deferred.reject();
+ }
+ }
+ });
+ return deferred.promise;
+}
+exports.showPicker = showPicker;
+
+/**
+ * Show a save dialog
+ * https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIFilePicker
+ *
+ * @param object options
+ * Additional options as specified in showPicker
+ *
+ * @return promise
+ * A promise that is resolved when the save dialog has closed
+ */
+function showSave(options) {
+ return showPicker(merge({
+ title: getLocalizedString("projecteditor.selectFileLabel"),
+ mode: Ci.nsIFilePicker.modeSave
+ }, options));
+}
+exports.showSave = showSave;
+
+/**
+ * Show a file open dialog
+ *
+ * @param object options
+ * Additional options as specified in showPicker
+ *
+ * @return promise
+ * A promise that is resolved when the file has been opened
+ */
+function showOpen(options) {
+ return showPicker(merge({
+ title: getLocalizedString("projecteditor.openFileLabel"),
+ mode: Ci.nsIFilePicker.modeOpen
+ }, options));
+}
+exports.showOpen = showOpen;
+
+/**
+ * Show a folder open dialog
+ *
+ * @param object options
+ * Additional options as specified in showPicker
+ *
+ * @return promise
+ * A promise that is resolved when the folder has been opened
+ */
+function showOpenFolder(options) {
+ return showPicker(merge({
+ title: getLocalizedString("projecteditor.openFolderLabel"),
+ mode: Ci.nsIFilePicker.modeGetFolder
+ }, options));
+}
+exports.showOpenFolder = showOpenFolder;
diff --git a/devtools/client/projecteditor/lib/helpers/l10n.js b/devtools/client/projecteditor/lib/helpers/l10n.js
new file mode 100644
index 000000000..b2b315ff8
--- /dev/null
+++ b/devtools/client/projecteditor/lib/helpers/l10n.js
@@ -0,0 +1,26 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+/**
+ * This file contains helper functions for internationalizing projecteditor strings
+ */
+
+const { LocalizationHelper } = require("devtools/shared/l10n");
+const ITCHPAD_STRINGS_URI = "devtools/client/locales/projecteditor.properties";
+const L10N = new LocalizationHelper(ITCHPAD_STRINGS_URI);
+
+function getLocalizedString(name) {
+ try {
+ return L10N.getStr(name);
+ } catch (ex) {
+ console.log("Error reading '" + name + "'");
+ throw new Error("l10n error with " + name);
+ }
+}
+
+exports.getLocalizedString = getLocalizedString;
diff --git a/devtools/client/projecteditor/lib/helpers/moz.build b/devtools/client/projecteditor/lib/helpers/moz.build
new file mode 100644
index 000000000..c2e14fce6
--- /dev/null
+++ b/devtools/client/projecteditor/lib/helpers/moz.build
@@ -0,0 +1,12 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'event.js',
+ 'file-picker.js',
+ 'l10n.js',
+ 'prompts.js',
+)
diff --git a/devtools/client/projecteditor/lib/helpers/prompts.js b/devtools/client/projecteditor/lib/helpers/prompts.js
new file mode 100644
index 000000000..0df6af304
--- /dev/null
+++ b/devtools/client/projecteditor/lib/helpers/prompts.js
@@ -0,0 +1,33 @@
+/* -*- Mode: Javascript; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/**
+ * This file contains helper functions for showing user prompts.
+ * See https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIPromptService
+ */
+
+const { Cu, Cc, Ci } = require("chrome");
+const { getLocalizedString } = require("devtools/client/projecteditor/lib/helpers/l10n");
+const prompts = Cc["@mozilla.org/embedcomp/prompt-service;1"]
+ .getService(Ci.nsIPromptService);
+
+/**
+ * Show a prompt.
+ *
+ * @param string title
+ * The title to the dialog
+ * @param string message
+ * The message to display
+ *
+ * @return bool
+ * Whether the user has confirmed the action
+ */
+function confirm(title, message) {
+ var result = prompts.confirm(null, title || "Title of this Dialog", message || "Are you sure?");
+ return result;
+}
+exports.confirm = confirm;
+
diff --git a/devtools/client/projecteditor/lib/helpers/readdir.js b/devtools/client/projecteditor/lib/helpers/readdir.js
new file mode 100644
index 000000000..054730faf
--- /dev/null
+++ b/devtools/client/projecteditor/lib/helpers/readdir.js
@@ -0,0 +1,89 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+importScripts("resource://gre/modules/osfile.jsm");
+
+/**
+ * This file is meant to be loaded in a worker using:
+ * new ChromeWorker("chrome://devtools/content/projecteditor/lib/helpers/readdir.js");
+ *
+ * Read a local directory inside of a web woker
+ *
+ * @param {string} path
+ * window to inspect
+ * @param {RegExp|string} ignore
+ * A pattern to ignore certain files. This is
+ * called with file.name.match(ignore).
+ * @param {Number} maxDepth
+ * How many directories to recurse before stopping.
+ * Directories with depth > maxDepth will be ignored.
+ */
+function readDir(path, ignore, maxDepth = Infinity) {
+ let ret = {};
+
+ let set = new Set();
+
+ let info = OS.File.stat(path);
+ set.add({
+ path: path,
+ name: info.name,
+ isDir: info.isDir,
+ isSymLink: info.isSymLink,
+ depth: 0
+ });
+
+ for (let info of set) {
+ let children = [];
+
+ if (info.isDir && !info.isSymLink) {
+ if (info.depth > maxDepth) {
+ continue;
+ }
+
+ let iterator = new OS.File.DirectoryIterator(info.path);
+ try {
+ for (let child in iterator) {
+ if (ignore && child.name.match(ignore)) {
+ continue;
+ }
+
+ children.push(child.path);
+ set.add({
+ path: child.path,
+ name: child.name,
+ isDir: child.isDir,
+ isSymLink: child.isSymLink,
+ depth: info.depth + 1
+ });
+ }
+ } finally {
+ iterator.close();
+ }
+ }
+
+ ret[info.path] = {
+ name: info.name,
+ isDir: info.isDir,
+ isSymLink: info.isSymLink,
+ depth: info.depth,
+ children: children,
+ };
+ }
+
+ return ret;
+}
+
+onmessage = function (event) {
+ try {
+ let {path, ignore, depth} = event.data;
+ let message = readDir(path, ignore, depth);
+ postMessage(message);
+ } catch (ex) {
+ console.log(ex);
+ }
+};
+
+
diff --git a/devtools/client/projecteditor/lib/moz.build b/devtools/client/projecteditor/lib/moz.build
new file mode 100644
index 000000000..91b88ed91
--- /dev/null
+++ b/devtools/client/projecteditor/lib/moz.build
@@ -0,0 +1,19 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DIRS += [
+ 'helpers',
+ 'plugins',
+ 'stores',
+]
+
+DevToolsModules(
+ 'editors.js',
+ 'project.js',
+ 'projecteditor.js',
+ 'shells.js',
+ 'tree.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/app-manager/app-project-editor.js b/devtools/client/projecteditor/lib/plugins/app-manager/app-project-editor.js
new file mode 100644
index 000000000..9a66770b0
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/app-manager/app-project-editor.js
@@ -0,0 +1,56 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const promise = require("promise");
+const { ItchEditor } = require("devtools/client/projecteditor/lib/editors");
+
+var AppProjectEditor = Class({
+ extends: ItchEditor,
+
+ hidesToolbar: true,
+
+ initialize: function (host) {
+ ItchEditor.prototype.initialize.apply(this, arguments);
+ this.appended = promise.resolve();
+ this.host = host;
+ this.label = "app-manager";
+ },
+
+ destroy: function () {
+ this.elt.remove();
+ this.elt = null;
+ },
+
+ load: function (resource) {
+ let {appManagerOpts} = this.host.project;
+
+ // Only load the frame the first time it is selected
+ if (!this.iframe || this.iframe.getAttribute("src") !== appManagerOpts.projectOverviewURL) {
+
+ this.elt.textContent = "";
+ let iframe = this.iframe = this.elt.ownerDocument.createElement("iframe");
+ let iframeLoaded = this.iframeLoaded = promise.defer();
+
+ iframe.addEventListener("load", function onLoad() {
+ iframe.removeEventListener("load", onLoad);
+ iframeLoaded.resolve();
+ });
+
+ iframe.setAttribute("flex", "1");
+ iframe.setAttribute("src", appManagerOpts.projectOverviewURL);
+ this.elt.appendChild(iframe);
+
+ }
+
+ promise.all([this.iframeLoaded.promise, this.appended]).then(() => {
+ this.emit("load");
+ });
+ }
+});
+
+exports.AppProjectEditor = AppProjectEditor;
diff --git a/devtools/client/projecteditor/lib/plugins/app-manager/moz.build b/devtools/client/projecteditor/lib/plugins/app-manager/moz.build
new file mode 100644
index 000000000..8aae52725
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/app-manager/moz.build
@@ -0,0 +1,10 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'app-project-editor.js',
+ 'plugin.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/app-manager/plugin.js b/devtools/client/projecteditor/lib/plugins/app-manager/plugin.js
new file mode 100644
index 000000000..82bbab34b
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/app-manager/plugin.js
@@ -0,0 +1,77 @@
+const { Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const { EventTarget } = require("sdk/event/target");
+const { emit } = require("sdk/event/core");
+const promise = require("promise");
+var { registerPlugin, Plugin } = require("devtools/client/projecteditor/lib/plugins/core");
+const { AppProjectEditor } = require("./app-project-editor");
+const OPTION_URL = "chrome://devtools/skin/images/tool-options.svg";
+const Services = require("Services");
+const Strings = Services.strings.createBundle("chrome://devtools/locale/webide.properties");
+
+var AppManagerRenderer = Class({
+ extends: Plugin,
+
+ isAppManagerProject: function () {
+ return !!this.host.project.appManagerOpts;
+ },
+ editorForResource: function (resource) {
+ if (!resource.parent && this.isAppManagerProject()) {
+ return AppProjectEditor;
+ }
+ },
+ getUI: function (parent) {
+ let doc = parent.ownerDocument;
+ if (parent.childElementCount == 0) {
+ let image = doc.createElement("image");
+ let optionImage = doc.createElement("image");
+ let flexElement = doc.createElement("div");
+ let nameLabel = doc.createElement("span");
+ let statusElement = doc.createElement("div");
+
+ image.className = "project-image";
+ optionImage.className = "project-options";
+ optionImage.setAttribute("src", OPTION_URL);
+ nameLabel.className = "project-name-label";
+ statusElement.className = "project-status";
+ flexElement.className = "project-flex";
+
+ parent.appendChild(image);
+ parent.appendChild(nameLabel);
+ parent.appendChild(flexElement);
+ parent.appendChild(statusElement);
+ parent.appendChild(optionImage);
+ }
+
+ return {
+ image: parent.querySelector(".project-image"),
+ nameLabel: parent.querySelector(".project-name-label"),
+ statusElement: parent.querySelector(".project-status")
+ };
+ },
+ onAnnotate: function (resource, editor, elt) {
+ if (resource.parent || !this.isAppManagerProject()) {
+ return;
+ }
+
+ let {appManagerOpts} = this.host.project;
+ let doc = elt.ownerDocument;
+
+ let {image, nameLabel, statusElement} = this.getUI(elt);
+ let name = appManagerOpts.name || resource.basename;
+ let url = appManagerOpts.iconUrl || "icon-sample.png";
+ let status = appManagerOpts.validationStatus || "unknown";
+ let tooltip = Strings.formatStringFromName("status_tooltip",
+ [Strings.GetStringFromName("status_" + status)], 1);
+
+ nameLabel.textContent = name;
+ image.setAttribute("src", url);
+ statusElement.setAttribute("status", status);
+ statusElement.setAttribute("tooltiptext", tooltip);
+
+ return true;
+ }
+});
+
+exports.AppManagerRenderer = AppManagerRenderer;
+registerPlugin(AppManagerRenderer);
diff --git a/devtools/client/projecteditor/lib/plugins/core.js b/devtools/client/projecteditor/lib/plugins/core.js
new file mode 100644
index 000000000..933eda043
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/core.js
@@ -0,0 +1,83 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// This is the core plugin API.
+
+const { Class } = require("sdk/core/heritage");
+
+var Plugin = Class({
+ initialize: function (host) {
+ this.host = host;
+ this.init(host);
+ },
+
+ destroy: function (host) { },
+
+ init: function (host) {},
+
+ showForCategories: function (elt, categories) {
+ this._showFor = this._showFor || [];
+ let set = new Set(categories);
+ this._showFor.push({
+ elt: elt,
+ categories: new Set(categories)
+ });
+ if (this.host.currentEditor) {
+ this.onEditorActivated(this.host.currentEditor);
+ } else {
+ elt.classList.add("plugin-hidden");
+ }
+ },
+
+ priv: function (item) {
+ if (!this._privData) {
+ this._privData = new WeakMap();
+ }
+ if (!this._privData.has(item)) {
+ this._privData.set(item, {});
+ }
+ return this._privData.get(item);
+ },
+ onTreeSelected: function (resource) {},
+
+
+ // Editor state lifetime...
+ onEditorCreated: function (editor) {},
+ onEditorDestroyed: function (editor) {},
+
+ onEditorActivated: function (editor) {
+ if (this._showFor) {
+ let category = editor.category;
+ for (let item of this._showFor) {
+ if (item.categories.has(category)) {
+ item.elt.classList.remove("plugin-hidden");
+ } else {
+ item.elt.classList.add("plugin-hidden");
+ }
+ }
+ }
+ },
+ onEditorDeactivated: function (editor) {
+ if (this._showFor) {
+ for (let item of this._showFor) {
+ item.elt.classList.add("plugin-hidden");
+ }
+ }
+ },
+
+ onEditorLoad: function (editor) {},
+ onEditorSave: function (editor) {},
+ onEditorChange: function (editor) {},
+ onEditorCursorActivity: function (editor) {},
+});
+exports.Plugin = Plugin;
+
+function registerPlugin(constr) {
+ exports.registeredPlugins.push(constr);
+}
+exports.registerPlugin = registerPlugin;
+
+exports.registeredPlugins = [];
diff --git a/devtools/client/projecteditor/lib/plugins/delete/delete.js b/devtools/client/projecteditor/lib/plugins/delete/delete.js
new file mode 100644
index 000000000..b28d6a0ef
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/delete/delete.js
@@ -0,0 +1,67 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Class } = require("sdk/core/heritage");
+const { registerPlugin, Plugin } = require("devtools/client/projecteditor/lib/plugins/core");
+const { confirm } = require("devtools/client/projecteditor/lib/helpers/prompts");
+const { getLocalizedString } = require("devtools/client/projecteditor/lib/helpers/l10n");
+
+var DeletePlugin = Class({
+ extends: Plugin,
+ shouldConfirm: true,
+
+ init: function (host) {
+ this.host.addCommand(this, {
+ id: "cmd-delete"
+ });
+ this.contextMenuItem = this.host.createMenuItem({
+ parent: this.host.contextMenuPopup,
+ label: getLocalizedString("projecteditor.deleteLabel"),
+ command: "cmd-delete"
+ });
+ },
+
+ confirmDelete: function (resource) {
+ let deletePromptMessage = resource.isDir ?
+ getLocalizedString("projecteditor.deleteFolderPromptMessage") :
+ getLocalizedString("projecteditor.deleteFilePromptMessage");
+ return !this.shouldConfirm || confirm(
+ getLocalizedString("projecteditor.deletePromptTitle"),
+ deletePromptMessage
+ );
+ },
+
+ onContextMenuOpen: function (resource) {
+ // Do not allow deletion of the top level items in the tree. In the
+ // case of the Web IDE in particular this can leave the UI in a weird
+ // state. If we'd like to add ability to delete the project folder from
+ // the tree in the future, then the UI could be cleaned up by listening
+ // to the ProjectTree's "resource-removed" event.
+ if (!resource.parent) {
+ this.contextMenuItem.setAttribute("hidden", "true");
+ } else {
+ this.contextMenuItem.removeAttribute("hidden");
+ }
+ },
+
+ onCommand: function (cmd) {
+ if (cmd === "cmd-delete") {
+ let tree = this.host.projectTree;
+ let resource = tree.getSelectedResource();
+
+ if (!this.confirmDelete(resource)) {
+ return;
+ }
+
+ resource.delete().then(() => {
+ this.host.project.refresh();
+ });
+ }
+ }
+});
+
+exports.DeletePlugin = DeletePlugin;
+registerPlugin(DeletePlugin);
diff --git a/devtools/client/projecteditor/lib/plugins/delete/moz.build b/devtools/client/projecteditor/lib/plugins/delete/moz.build
new file mode 100644
index 000000000..4b1d00466
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/delete/moz.build
@@ -0,0 +1,9 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'delete.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/dirty/dirty.js b/devtools/client/projecteditor/lib/plugins/dirty/dirty.js
new file mode 100644
index 000000000..f976c626f
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/dirty/dirty.js
@@ -0,0 +1,47 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Class } = require("sdk/core/heritage");
+const { registerPlugin, Plugin } = require("devtools/client/projecteditor/lib/plugins/core");
+const { emit } = require("sdk/event/core");
+
+var DirtyPlugin = Class({
+ extends: Plugin,
+
+ onEditorSave: function (editor) { this.onEditorChange(editor); },
+ onEditorLoad: function (editor) { this.onEditorChange(editor); },
+
+ onEditorChange: function (editor) {
+ // Only run on a TextEditor
+ if (!editor || !editor.editor) {
+ return;
+ }
+
+ // Dont' force a refresh unless the dirty state has changed...
+ let priv = this.priv(editor);
+ let clean = editor.isClean();
+ if (priv.isClean !== clean) {
+ let resource = editor.shell.resource;
+ emit(resource, "label-change", resource);
+ priv.isClean = clean;
+ }
+ },
+
+ onAnnotate: function (resource, editor, elt) {
+ // Only run on a TextEditor
+ if (!editor || !editor.editor) {
+ return;
+ }
+
+ if (!editor.isClean()) {
+ elt.textContent = "*" + resource.displayName;
+ return true;
+ }
+ }
+});
+exports.DirtyPlugin = DirtyPlugin;
+
+registerPlugin(DirtyPlugin);
diff --git a/devtools/client/projecteditor/lib/plugins/dirty/moz.build b/devtools/client/projecteditor/lib/plugins/dirty/moz.build
new file mode 100644
index 000000000..b86c5a9af
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/dirty/moz.build
@@ -0,0 +1,9 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'dirty.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/image-view/image-editor.js b/devtools/client/projecteditor/lib/plugins/image-view/image-editor.js
new file mode 100644
index 000000000..668fcbeb2
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/image-view/image-editor.js
@@ -0,0 +1,50 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const promise = require("promise");
+const { ItchEditor } = require("devtools/client/projecteditor/lib/editors");
+
+var ImageEditor = Class({
+ extends: ItchEditor,
+
+ initialize: function () {
+ ItchEditor.prototype.initialize.apply(this, arguments);
+ this.label = "image";
+ this.appended = promise.resolve();
+ },
+
+ load: function (resource) {
+ this.elt.innerHTML = "";
+ let image = this.image = this.doc.createElement("image");
+ image.className = "editor-image";
+ image.setAttribute("src", resource.uri);
+
+ let box1 = this.doc.createElement("box");
+ box1.appendChild(image);
+
+ let box2 = this.doc.createElement("box");
+ box2.setAttribute("flex", 1);
+
+ this.elt.appendChild(box1);
+ this.elt.appendChild(box2);
+
+ this.appended.then(() => {
+ this.emit("load");
+ });
+ },
+
+ destroy: function () {
+ if (this.image) {
+ this.image.remove();
+ this.image = null;
+ }
+ }
+
+});
+
+exports.ImageEditor = ImageEditor;
diff --git a/devtools/client/projecteditor/lib/plugins/image-view/moz.build b/devtools/client/projecteditor/lib/plugins/image-view/moz.build
new file mode 100644
index 000000000..d67370e5b
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/image-view/moz.build
@@ -0,0 +1,10 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'image-editor.js',
+ 'plugin.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/image-view/plugin.js b/devtools/client/projecteditor/lib/plugins/image-view/plugin.js
new file mode 100644
index 000000000..626ea3c9a
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/image-view/plugin.js
@@ -0,0 +1,28 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const promise = require("promise");
+const { ImageEditor } = require("./image-editor");
+const { registerPlugin, Plugin } = require("devtools/client/projecteditor/lib/plugins/core");
+
+var ImageEditorPlugin = Class({
+ extends: Plugin,
+
+ editorForResource: function (node) {
+ if (node.contentCategory === "image") {
+ return ImageEditor;
+ }
+ },
+
+ init: function (host) {
+
+ }
+});
+
+exports.ImageEditorPlugin = ImageEditorPlugin;
+registerPlugin(ImageEditorPlugin);
diff --git a/devtools/client/projecteditor/lib/plugins/logging/logging.js b/devtools/client/projecteditor/lib/plugins/logging/logging.js
new file mode 100644
index 000000000..cd5757b72
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/logging/logging.js
@@ -0,0 +1,29 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+var { Class } = require("sdk/core/heritage");
+var { registerPlugin, Plugin } = require("devtools/client/projecteditor/lib/plugins/core");
+
+var LoggingPlugin = Class({
+ extends: Plugin,
+
+ // Editor state lifetime...
+ onEditorCreated: function (editor) { console.log("editor created: " + editor); },
+ onEditorDestroyed: function (editor) { console.log("editor destroyed: " + editor);},
+
+ onEditorSave: function (editor) { console.log("editor saved: " + editor); },
+ onEditorLoad: function (editor) { console.log("editor loaded: " + editor); },
+
+ onEditorActivated: function (editor) { console.log("editor activated: " + editor);},
+ onEditorDeactivated: function (editor) { console.log("editor deactivated: " + editor);},
+
+ onEditorChange: function (editor) { console.log("editor changed: " + editor);},
+
+ onCommand: function (cmd) { console.log("Command: " + cmd); }
+});
+exports.LoggingPlugin = LoggingPlugin;
+
+registerPlugin(LoggingPlugin);
diff --git a/devtools/client/projecteditor/lib/plugins/logging/moz.build b/devtools/client/projecteditor/lib/plugins/logging/moz.build
new file mode 100644
index 000000000..5d8d98fbe
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/logging/moz.build
@@ -0,0 +1,9 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'logging.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/moz.build b/devtools/client/projecteditor/lib/plugins/moz.build
new file mode 100644
index 000000000..17bff7ce0
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/moz.build
@@ -0,0 +1,21 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DIRS += [
+ 'app-manager',
+ 'delete',
+ 'dirty',
+ 'image-view',
+ 'logging',
+ 'new',
+ 'rename',
+ 'save',
+ 'status-bar',
+]
+
+DevToolsModules(
+ 'core.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/new/moz.build b/devtools/client/projecteditor/lib/plugins/new/moz.build
new file mode 100644
index 000000000..3caacefb1
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/new/moz.build
@@ -0,0 +1,9 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'new.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/new/new.js b/devtools/client/projecteditor/lib/plugins/new/new.js
new file mode 100644
index 000000000..220cb4977
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/new/new.js
@@ -0,0 +1,80 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Class } = require("sdk/core/heritage");
+const { registerPlugin, Plugin } = require("devtools/client/projecteditor/lib/plugins/core");
+const { getLocalizedString } = require("devtools/client/projecteditor/lib/helpers/l10n");
+
+// Handles the new command.
+var NewFile = Class({
+ extends: Plugin,
+
+ init: function () {
+ this.command = this.host.addCommand(this, {
+ id: "cmd-new",
+ key: getLocalizedString("projecteditor.new.commandkey"),
+ modifiers: "accel"
+ });
+ this.host.createMenuItem({
+ parent: this.host.fileMenuPopup,
+ label: getLocalizedString("projecteditor.newLabel"),
+ command: "cmd-new",
+ key: "key_cmd-new"
+ });
+ this.host.createMenuItem({
+ parent: this.host.contextMenuPopup,
+ label: getLocalizedString("projecteditor.newLabel"),
+ command: "cmd-new"
+ });
+ },
+
+ onCommand: function (cmd) {
+ if (cmd === "cmd-new") {
+ let tree = this.host.projectTree;
+ let resource = tree.getSelectedResource();
+ parent = resource.isDir ? resource : resource.parent;
+ sibling = resource.isDir ? null : resource;
+
+ if (!("createChild" in parent)) {
+ return;
+ }
+
+ let extension = sibling ? sibling.contentCategory : parent.store.defaultCategory;
+ let template = "untitled{1}." + extension;
+ let name = this.suggestName(parent, template);
+
+ tree.promptNew(name, parent, sibling).then(name => {
+
+ // XXX: sanitize bad file names.
+
+ // If the name is already taken, just add/increment a number.
+ if (parent.hasChild(name)) {
+ let matches = name.match(/([^\d.]*)(\d*)([^.]*)(.*)/);
+ template = matches[1] + "{1}" + matches[3] + matches[4];
+ name = this.suggestName(parent, template, parseInt(matches[2]) || 2);
+ }
+
+ return parent.createChild(name);
+ }).then(resource => {
+ tree.selectResource(resource);
+ this.host.currentEditor.focus();
+ }).then(null, console.error);
+ }
+ },
+
+ suggestName: function (parent, template, start = 1) {
+ let i = start;
+ let name;
+ do {
+ name = template.replace("\{1\}", i === 1 ? "" : i);
+ i++;
+ } while (parent.hasChild(name));
+
+ return name;
+ }
+});
+exports.NewFile = NewFile;
+registerPlugin(NewFile);
diff --git a/devtools/client/projecteditor/lib/plugins/rename/moz.build b/devtools/client/projecteditor/lib/plugins/rename/moz.build
new file mode 100644
index 000000000..2b1612452
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/rename/moz.build
@@ -0,0 +1,9 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'rename.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/rename/rename.js b/devtools/client/projecteditor/lib/plugins/rename/rename.js
new file mode 100644
index 000000000..850401869
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/rename/rename.js
@@ -0,0 +1,74 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Class } = require("sdk/core/heritage");
+const { registerPlugin, Plugin } = require("devtools/client/projecteditor/lib/plugins/core");
+const { getLocalizedString } = require("devtools/client/projecteditor/lib/helpers/l10n");
+
+var RenamePlugin = Class({
+ extends: Plugin,
+
+ init: function (host) {
+ this.host.addCommand(this, {
+ id: "cmd-rename"
+ });
+ this.contextMenuItem = this.host.createMenuItem({
+ parent: this.host.contextMenuPopup,
+ label: getLocalizedString("projecteditor.renameLabel"),
+ command: "cmd-rename"
+ });
+ },
+
+ onContextMenuOpen: function (resource) {
+ if (resource.isRoot) {
+ this.contextMenuItem.setAttribute("hidden", "true");
+ } else {
+ this.contextMenuItem.removeAttribute("hidden");
+ }
+ },
+
+ onCommand: function (cmd) {
+ if (cmd === "cmd-rename") {
+ let tree = this.host.projectTree;
+ let resource = tree.getSelectedResource();
+ let parent = resource.parent;
+ let oldName = resource.basename;
+
+ tree.promptEdit(oldName, resource).then(name => {
+ if (name === oldName) {
+ return resource;
+ }
+ if (parent.hasChild(name)) {
+ let matches = name.match(/([^\d.]*)(\d*)([^.]*)(.*)/);
+ let template = matches[1] + "{1}" + matches[3] + matches[4];
+ name = this.suggestName(resource, template, parseInt(matches[2]) || 2);
+ }
+ return parent.rename(oldName, name);
+ }).then(resource => {
+ this.host.project.refresh();
+ tree.selectResource(resource);
+ if (!resource.isDir) {
+ this.host.currentEditor.focus();
+ }
+ }).then(null, console.error);
+ }
+ },
+
+ suggestName: function (resource, template, start = 1) {
+ let i = start;
+ let name;
+ let parent = resource.parent;
+ do {
+ name = template.replace("\{1\}", i === 1 ? "" : i);
+ i++;
+ } while (parent.hasChild(name));
+
+ return name;
+ }
+});
+
+exports.RenamePlugin = RenamePlugin;
+registerPlugin(RenamePlugin);
diff --git a/devtools/client/projecteditor/lib/plugins/save/moz.build b/devtools/client/projecteditor/lib/plugins/save/moz.build
new file mode 100644
index 000000000..66df054eb
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/save/moz.build
@@ -0,0 +1,9 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'save.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/save/save.js b/devtools/client/projecteditor/lib/plugins/save/save.js
new file mode 100644
index 000000000..43b2185d2
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/save/save.js
@@ -0,0 +1,93 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Class } = require("sdk/core/heritage");
+const { registerPlugin, Plugin } = require("devtools/client/projecteditor/lib/plugins/core");
+const picker = require("devtools/client/projecteditor/lib/helpers/file-picker");
+const { getLocalizedString } = require("devtools/client/projecteditor/lib/helpers/l10n");
+
+// Handles the save command.
+var SavePlugin = Class({
+ extends: Plugin,
+
+ init: function (host) {
+
+ this.host.addCommand(this, {
+ id: "cmd-save",
+ key: getLocalizedString("projecteditor.save.commandkey"),
+ modifiers: "accel"
+ });
+ this.host.addCommand(this, {
+ id: "cmd-saveas",
+ key: getLocalizedString("projecteditor.save.commandkey"),
+ modifiers: "accel shift"
+ });
+ this.host.createMenuItem({
+ parent: this.host.fileMenuPopup,
+ label: getLocalizedString("projecteditor.saveLabel"),
+ command: "cmd-save",
+ key: "key_cmd-save"
+ });
+ this.host.createMenuItem({
+ parent: this.host.fileMenuPopup,
+ label: getLocalizedString("projecteditor.saveAsLabel"),
+ command: "cmd-saveas",
+ key: "key_cmd-saveas"
+ });
+ },
+
+ isCommandEnabled: function (cmd) {
+ let currentEditor = this.host.currentEditor;
+ return currentEditor.isEditable;
+ },
+
+ onCommand: function (cmd) {
+ if (cmd === "cmd-save") {
+ this.onEditorSaveRequested();
+ } else if (cmd === "cmd-saveas") {
+ this.saveAs();
+ }
+ },
+
+ saveAs: function () {
+ let editor = this.host.currentEditor;
+ let project = this.host.resourceFor(editor);
+
+ let resource;
+ picker.showSave({
+ window: this.host.window,
+ directory: project && project.parent ? project.parent.path : null,
+ defaultName: project ? project.basename : null,
+ }).then(path => {
+ return this.createResource(path);
+ }).then(res => {
+ resource = res;
+ return this.saveResource(editor, resource);
+ }).then(() => {
+ this.host.openResource(resource);
+ }).then(null, console.error);
+ },
+
+ onEditorSaveRequested: function () {
+ let editor = this.host.currentEditor;
+ let resource = this.host.resourceFor(editor);
+ if (!resource) {
+ return this.saveAs();
+ }
+
+ return this.saveResource(editor, resource);
+ },
+
+ createResource: function (path) {
+ return this.host.project.resourceFor(path, { create: true });
+ },
+
+ saveResource: function (editor, resource) {
+ return editor.save(resource);
+ }
+});
+exports.SavePlugin = SavePlugin;
+registerPlugin(SavePlugin);
diff --git a/devtools/client/projecteditor/lib/plugins/status-bar/moz.build b/devtools/client/projecteditor/lib/plugins/status-bar/moz.build
new file mode 100644
index 000000000..87ce21584
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/status-bar/moz.build
@@ -0,0 +1,9 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'plugin.js',
+)
diff --git a/devtools/client/projecteditor/lib/plugins/status-bar/plugin.js b/devtools/client/projecteditor/lib/plugins/status-bar/plugin.js
new file mode 100644
index 000000000..9450baef3
--- /dev/null
+++ b/devtools/client/projecteditor/lib/plugins/status-bar/plugin.js
@@ -0,0 +1,105 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const promise = require("promise");
+const { registerPlugin, Plugin } = require("devtools/client/projecteditor/lib/plugins/core");
+
+/**
+ * Print information about the currently opened file
+ * and the state of the current editor
+ */
+var StatusBarPlugin = Class({
+ extends: Plugin,
+
+ init: function () {
+ this.box = this.host.createElement("hbox", {
+ parent: "#projecteditor-toolbar-bottom"
+ });
+
+ this.activeMode = this.host.createElement("label", {
+ parent: this.box,
+ class: "projecteditor-basic-display"
+ });
+
+ this.cursorPosition = this.host.createElement("label", {
+ parent: this.box,
+ class: "projecteditor-basic-display"
+ });
+
+ this.fileLabel = this.host.createElement("label", {
+ parent: "#plugin-toolbar-left",
+ class: "projecteditor-file-label"
+ });
+ },
+
+ destroy: function () {
+ },
+
+ /**
+ * Print information about the current state of the editor
+ *
+ * @param Editor editor
+ */
+ render: function (editor, resource) {
+ if (!resource || resource.isDir) {
+ this.fileLabel.textContent = "";
+ this.cursorPosition.value = "";
+ return;
+ }
+
+ this.fileLabel.textContent = resource.basename;
+ this.activeMode.value = editor.toString();
+ if (editor.editor) {
+ let cursorStart = editor.editor.getCursor("start");
+ let cursorEnd = editor.editor.getCursor("end");
+ if (cursorStart.line === cursorEnd.line && cursorStart.ch === cursorEnd.ch) {
+ this.cursorPosition.value = cursorStart.line + " " + cursorStart.ch;
+ } else {
+ this.cursorPosition.value = cursorStart.line + " " + cursorStart.ch + " | " +
+ cursorEnd.line + " " + cursorEnd.ch;
+ }
+ } else {
+ this.cursorPosition.value = "";
+ }
+ },
+
+
+ /**
+ * Print the current file name
+ *
+ * @param Resource resource
+ */
+ onTreeSelected: function (resource) {
+ if (!resource || resource.isDir) {
+ this.fileLabel.textContent = "";
+ return;
+ }
+ this.fileLabel.textContent = resource.basename;
+ },
+
+ onEditorDeactivated: function (editor) {
+ this.fileLabel.textContent = "";
+ this.cursorPosition.value = "";
+ },
+
+ onEditorChange: function (editor, resource) {
+ this.render(editor, resource);
+ },
+
+ onEditorCursorActivity: function (editor, resource) {
+ this.render(editor, resource);
+ },
+
+ onEditorActivated: function (editor, resource) {
+ this.render(editor, resource);
+ },
+
+});
+
+exports.StatusBarPlugin = StatusBarPlugin;
+registerPlugin(StatusBarPlugin);
diff --git a/devtools/client/projecteditor/lib/project.js b/devtools/client/projecteditor/lib/project.js
new file mode 100644
index 000000000..8e0a8802d
--- /dev/null
+++ b/devtools/client/projecteditor/lib/project.js
@@ -0,0 +1,246 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const { EventTarget } = require("sdk/event/target");
+const { emit } = require("sdk/event/core");
+const { scope, on, forget } = require("devtools/client/projecteditor/lib/helpers/event");
+const prefs = require("sdk/preferences/service");
+const { LocalStore } = require("devtools/client/projecteditor/lib/stores/local");
+const { OS } = Cu.import("resource://gre/modules/osfile.jsm", {});
+const { Task } = require("devtools/shared/task");
+const promise = require("promise");
+const { TextEncoder, TextDecoder } = require("sdk/io/buffer");
+const url = require("sdk/url");
+
+const gDecoder = new TextDecoder();
+const gEncoder = new TextEncoder();
+
+/**
+ * A Project keeps track of the opened folders using LocalStore
+ * objects. Resources are generally requested from the project,
+ * even though the Store is actually keeping track of them.
+ *
+ *
+ * This object emits the following events:
+ * - "refresh-complete": After all stores have been refreshed from disk.
+ * - "store-added": When a store has been added to the project.
+ * - "store-removed": When a store has been removed from the project.
+ * - "resource-added": When a resource has been added to one of the stores.
+ * - "resource-removed": When a resource has been removed from one of the stores.
+ */
+var Project = Class({
+ extends: EventTarget,
+
+ /**
+ * Intialize the Project.
+ *
+ * @param Object options
+ * Options to be passed into Project.load function
+ */
+ initialize: function (options) {
+ this.localStores = new Map();
+
+ this.load(options);
+ },
+
+ destroy: function () {
+ // We are removing the store because the project never gets persisted.
+ // There may need to be separate destroy functionality that doesn't remove
+ // from project if this is saved to DB.
+ this.removeAllStores();
+ },
+
+ toString: function () {
+ return "[Project] " + this.name;
+ },
+
+ /**
+ * Load a project given metadata about it.
+ *
+ * @param Object options
+ * Information about the project, containing:
+ * id: An ID (currently unused, but could be used for saving)
+ * name: The display name of the project
+ * directories: An array of path strings to load
+ */
+ load: function (options) {
+ this.id = options.id;
+ this.name = options.name || "Untitled";
+
+ let paths = new Set(options.directories.map(name => OS.Path.normalize(name)));
+
+ for (let [path, store] of this.localStores) {
+ if (!paths.has(path)) {
+ this.removePath(path);
+ }
+ }
+
+ for (let path of paths) {
+ this.addPath(path);
+ }
+ },
+
+ /**
+ * Refresh all project stores from disk
+ *
+ * @returns Promise
+ * A promise that resolves when everything has been refreshed.
+ */
+ refresh: function () {
+ return Task.spawn(function* () {
+ for (let [path, store] of this.localStores) {
+ yield store.refresh();
+ }
+ emit(this, "refresh-complete");
+ }.bind(this));
+ },
+
+
+ /**
+ * Fetch a resource from the backing storage system for the store.
+ *
+ * @param string path
+ * The path to fetch
+ * @param Object options
+ * "create": bool indicating whether to create a file if it does not exist.
+ * @returns Promise
+ * A promise that resolves with the Resource.
+ */
+ resourceFor: function (path, options) {
+ let store = this.storeContaining(path);
+ return store.resourceFor(path, options);
+ },
+
+ /**
+ * Get every resource used inside of the project.
+ *
+ * @returns Array<Resource>
+ * A list of all Resources in all Stores.
+ */
+ allResources: function () {
+ let resources = [];
+ for (let store of this.allStores()) {
+ resources = resources.concat(store.allResources());
+ }
+ return resources;
+ },
+
+ /**
+ * Get every Path used inside of the project.
+ *
+ * @returns generator-iterator<Store>
+ * A list of all Stores
+ */
+ allStores: function* () {
+ for (let [path, store] of this.localStores) {
+ yield store;
+ }
+ },
+
+ /**
+ * Get every file path used inside of the project.
+ *
+ * @returns Array<string>
+ * A list of all file paths
+ */
+ allPaths: function () {
+ return [...this.localStores.keys()];
+ },
+
+ /**
+ * Get the store that contains a path.
+ *
+ * @returns Store
+ * The store, if any. Will return null if no store
+ * contains the given path.
+ */
+ storeContaining: function (path) {
+ let containingStore = null;
+ for (let store of this.allStores()) {
+ if (store.contains(path)) {
+ // With nested projects, the final containing store will be returned.
+ containingStore = store;
+ }
+ }
+ return containingStore;
+ },
+
+ /**
+ * Add a store at the current path. If a store already exists
+ * for this path, then return it.
+ *
+ * @param string path
+ * @returns LocalStore
+ */
+ addPath: function (path) {
+ if (!this.localStores.has(path)) {
+ this.addLocalStore(new LocalStore(path));
+ }
+ return this.localStores.get(path);
+ },
+
+ /**
+ * Remove a store for a given path.
+ *
+ * @param string path
+ */
+ removePath: function (path) {
+ this.removeLocalStore(this.localStores.get(path));
+ },
+
+
+ /**
+ * Add the given Store to the project.
+ * Fires a 'store-added' event on the project.
+ *
+ * @param Store store
+ */
+ addLocalStore: function (store) {
+ store.canPair = true;
+ this.localStores.set(store.path, store);
+
+ // Originally StoreCollection.addStore
+ on(this, store, "resource-added", (resource) => {
+ emit(this, "resource-added", resource);
+ });
+ on(this, store, "resource-removed", (resource) => {
+ emit(this, "resource-removed", resource);
+ });
+
+ emit(this, "store-added", store);
+ },
+
+
+ /**
+ * Remove all of the Stores belonging to the project.
+ */
+ removeAllStores: function () {
+ for (let store of this.allStores()) {
+ this.removeLocalStore(store);
+ }
+ },
+
+ /**
+ * Remove the given Store from the project.
+ * Fires a 'store-removed' event on the project.
+ *
+ * @param Store store
+ */
+ removeLocalStore: function (store) {
+ // XXX: tree selection should be reset if active element is affected by
+ // the store being removed
+ if (store) {
+ this.localStores.delete(store.path);
+ forget(this, store);
+ emit(this, "store-removed", store);
+ store.destroy();
+ }
+ }
+});
+
+exports.Project = Project;
diff --git a/devtools/client/projecteditor/lib/projecteditor.js b/devtools/client/projecteditor/lib/projecteditor.js
new file mode 100644
index 000000000..a3ef06249
--- /dev/null
+++ b/devtools/client/projecteditor/lib/projecteditor.js
@@ -0,0 +1,816 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const { Cc, Ci, Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const { Project } = require("devtools/client/projecteditor/lib/project");
+const { ProjectTreeView } = require("devtools/client/projecteditor/lib/tree");
+const { ShellDeck } = require("devtools/client/projecteditor/lib/shells");
+const { Resource } = require("devtools/client/projecteditor/lib/stores/resource");
+const { registeredPlugins } = require("devtools/client/projecteditor/lib/plugins/core");
+const { EventTarget } = require("sdk/event/target");
+const { on, forget } = require("devtools/client/projecteditor/lib/helpers/event");
+const { emit } = require("sdk/event/core");
+const { merge } = require("sdk/util/object");
+const promise = require("promise");
+const { ViewHelpers } = require("devtools/client/shared/widgets/view-helpers");
+const { DOMHelpers } = require("resource://devtools/client/shared/DOMHelpers.jsm");
+const Services = require("Services");
+const { Task } = require("devtools/shared/task");
+const ITCHPAD_URL = "chrome://devtools/content/projecteditor/chrome/content/projecteditor.xul";
+const { confirm } = require("devtools/client/projecteditor/lib/helpers/prompts");
+const { getLocalizedString } = require("devtools/client/projecteditor/lib/helpers/l10n");
+
+// Enabled Plugins
+require("devtools/client/projecteditor/lib/plugins/dirty/dirty");
+require("devtools/client/projecteditor/lib/plugins/delete/delete");
+require("devtools/client/projecteditor/lib/plugins/new/new");
+require("devtools/client/projecteditor/lib/plugins/rename/rename");
+require("devtools/client/projecteditor/lib/plugins/save/save");
+require("devtools/client/projecteditor/lib/plugins/image-view/plugin");
+require("devtools/client/projecteditor/lib/plugins/app-manager/plugin");
+require("devtools/client/projecteditor/lib/plugins/status-bar/plugin");
+
+// Uncomment to enable logging.
+// require("devtools/client/projecteditor/lib/plugins/logging/logging");
+
+/**
+ * This is the main class tying together an instance of the ProjectEditor.
+ * The frontend is contained inside of this.iframe, which loads projecteditor.xul.
+ *
+ * Usage:
+ * let projecteditor = new ProjectEditor(frame);
+ * projecteditor.loaded.then((projecteditor) => {
+ * // Ready to use.
+ * });
+ *
+ * Responsible for maintaining:
+ * - The list of Plugins for this instance.
+ * - The ShellDeck, which includes all Shells for opened Resources
+ * -- Shells take in a Resource, and construct the appropriate Editor
+ * - The Project, which includes all Stores for this instance
+ * -- Stores manage all Resources starting from a root directory
+ * --- Resources are a representation of a file on disk
+ * - The ProjectTreeView that builds the UI for interacting with the
+ * project.
+ *
+ * This object emits the following events:
+ * - "onEditorDestroyed": When editor is destroyed
+ * - "onEditorSave": When editor is saved
+ * - "onEditorLoad": When editor is loaded
+ * - "onEditorActivated": When editor is activated
+ * - "onEditorChange": When editor is changed
+ * - "onEditorCursorActivity": When there is cursor activity in a text editor
+ * - "onCommand": When a command happens
+ * - "onEditorDestroyed": When editor is destroyed
+ * - "onContextMenuOpen": When the context menu is opened on the project tree
+ *
+ * The events can be bound like so:
+ * projecteditor.on("onEditorCreated", (editor) => { });
+ */
+var ProjectEditor = Class({
+ extends: EventTarget,
+
+ /**
+ * Initialize ProjectEditor, and load into an iframe if specified.
+ *
+ * @param Iframe iframe
+ * The iframe to inject the DOM into. If this is not
+ * specified, then this.load(frame) will need to be called
+ * before accessing ProjectEditor.
+ * @param Object options
+ * - menubar: a <menubar> element to inject menus into
+ * - menuindex: Integer child index to insert menus
+ */
+ initialize: function (iframe, options = {}) {
+ this._onTreeSelected = this._onTreeSelected.bind(this);
+ this._onTreeResourceRemoved = this._onTreeResourceRemoved.bind(this);
+ this._onEditorCreated = this._onEditorCreated.bind(this);
+ this._onEditorActivated = this._onEditorActivated.bind(this);
+ this._onEditorDeactivated = this._onEditorDeactivated.bind(this);
+ this._updateMenuItems = this._updateMenuItems.bind(this);
+ this._updateContextMenuItems = this._updateContextMenuItems.bind(this);
+ this.destroy = this.destroy.bind(this);
+ this.menubar = options.menubar || null;
+ this.menuindex = options.menuindex || null;
+ this._menuEnabled = true;
+ this._destroyed = false;
+ this._loaded = false;
+ this._pluginCommands = new Map();
+ if (iframe) {
+ this.load(iframe);
+ }
+ },
+
+ /**
+ * Load the instance inside of a specified iframe.
+ * This can be called more than once, and it will return the promise
+ * from the first call.
+ *
+ * @param Iframe iframe
+ * The iframe to inject the projecteditor DOM into
+ * @returns Promise
+ * A promise that is resolved once the iframe has been
+ * loaded.
+ */
+ load: function (iframe) {
+ if (this.loaded) {
+ return this.loaded;
+ }
+
+ let deferred = promise.defer();
+ this.loaded = deferred.promise;
+ this.iframe = iframe;
+
+ let domReady = () => {
+ if (this._destroyed) {
+ deferred.reject("Error: ProjectEditor has been destroyed before loading");
+ return;
+ }
+ this._onLoad();
+ this._loaded = true;
+ deferred.resolve(this);
+ };
+
+ let domHelper = new DOMHelpers(this.iframe.contentWindow);
+ domHelper.onceDOMReady(domReady);
+
+ this.iframe.setAttribute("src", ITCHPAD_URL);
+
+ return this.loaded;
+ },
+
+ /**
+ * Build the projecteditor DOM inside of this.iframe.
+ */
+ _onLoad: function () {
+ this.document = this.iframe.contentDocument;
+ this.window = this.iframe.contentWindow;
+
+ this._initCommands();
+ this._buildMenubar();
+ this._buildSidebar();
+
+ this.window.addEventListener("unload", this.destroy, false);
+
+ // Editor management
+ this.shells = new ShellDeck(this, this.document);
+ this.shells.on("editor-created", this._onEditorCreated);
+ this.shells.on("editor-activated", this._onEditorActivated);
+ this.shells.on("editor-deactivated", this._onEditorDeactivated);
+
+ let shellContainer = this.document.querySelector("#shells-deck-container");
+ shellContainer.appendChild(this.shells.elt);
+
+ // We are not allowing preset projects for now - rebuild a fresh one
+ // each time.
+ this.setProject(new Project({
+ id: "",
+ name: "",
+ directories: [],
+ openFiles: []
+ }));
+
+ this._initPlugins();
+ },
+
+ _buildMenubar: function () {
+
+ this.contextMenuPopup = this.document.getElementById("context-menu-popup");
+ this.contextMenuPopup.addEventListener("popupshowing", this._updateContextMenuItems);
+
+ this.textEditorContextMenuPopup = this.document.getElementById("texteditor-context-popup");
+ this.textEditorContextMenuPopup.addEventListener("popupshowing", this._updateMenuItems);
+
+ this.editMenu = this.document.getElementById("edit-menu");
+ this.fileMenu = this.document.getElementById("file-menu");
+
+ this.editMenuPopup = this.document.getElementById("edit-menu-popup");
+ this.fileMenuPopup = this.document.getElementById("file-menu-popup");
+ this.editMenu.addEventListener("popupshowing", this._updateMenuItems);
+ this.fileMenu.addEventListener("popupshowing", this._updateMenuItems);
+
+ if (this.menubar) {
+ let body = this.menubar.ownerDocument.body ||
+ this.menubar.ownerDocument.querySelector("window");
+ body.appendChild(this.projectEditorCommandset);
+ body.appendChild(this.projectEditorKeyset);
+ body.appendChild(this.editorCommandset);
+ body.appendChild(this.editorKeyset);
+ body.appendChild(this.contextMenuPopup);
+ body.appendChild(this.textEditorContextMenuPopup);
+
+ let index = this.menuindex || 0;
+ this.menubar.insertBefore(this.editMenu, this.menubar.children[index]);
+ this.menubar.insertBefore(this.fileMenu, this.menubar.children[index]);
+ } else {
+ this.document.getElementById("projecteditor-menubar").style.display = "block";
+ }
+
+ // Insert a controller to allow enabling and disabling of menu items.
+ this._commandWindow = this.editorCommandset.ownerDocument.defaultView;
+ this._commandController = getCommandController(this);
+ this._commandWindow.controllers.insertControllerAt(0, this._commandController);
+ },
+
+ /**
+ * Create the project tree sidebar that lists files.
+ */
+ _buildSidebar: function () {
+ this.projectTree = new ProjectTreeView(this.document, {
+ resourceVisible: this.resourceVisible.bind(this),
+ resourceFormatter: this.resourceFormatter.bind(this),
+ contextMenuPopup: this.contextMenuPopup
+ });
+ on(this, this.projectTree, "selection", this._onTreeSelected);
+ on(this, this.projectTree, "resource-removed", this._onTreeResourceRemoved);
+
+ let sourcesBox = this.document.querySelector("#sources > vbox");
+ sourcesBox.appendChild(this.projectTree.elt);
+ },
+
+ /**
+ * Set up listeners for commands to dispatch to all of the plugins
+ */
+ _initCommands: function () {
+
+ this.projectEditorCommandset = this.document.getElementById("projecteditor-commandset");
+ this.projectEditorKeyset = this.document.getElementById("projecteditor-keyset");
+
+ this.editorCommandset = this.document.getElementById("editMenuCommands");
+ this.editorKeyset = this.document.getElementById("editMenuKeys");
+
+ this.projectEditorCommandset.addEventListener("command", (evt) => {
+ evt.stopPropagation();
+ evt.preventDefault();
+ this.pluginDispatch("onCommand", evt.target.id, evt.target);
+ });
+ },
+
+ /**
+ * Initialize each plugin in registeredPlugins
+ */
+ _initPlugins: function () {
+ this._plugins = [];
+
+ for (let plugin of registeredPlugins) {
+ try {
+ this._plugins.push(plugin(this));
+ } catch (ex) {
+ console.exception(ex);
+ }
+ }
+
+ this.pluginDispatch("lateInit");
+ },
+
+ /**
+ * Enable / disable necessary menu items using globalOverlay.js.
+ */
+ _updateMenuItems: function () {
+ let window = this.editMenu.ownerDocument.defaultView;
+ let commands = ["cmd_undo", "cmd_redo", "cmd_delete", "cmd_cut", "cmd_copy", "cmd_paste"];
+ commands.forEach(window.goUpdateCommand);
+
+ for (let c of this._pluginCommands.keys()) {
+ window.goUpdateCommand(c);
+ }
+ },
+
+ /**
+ * Enable / disable necessary context menu items by passing an event
+ * onto plugins.
+ */
+ _updateContextMenuItems: function () {
+ let resource = this.projectTree.getSelectedResource();
+ this.pluginDispatch("onContextMenuOpen", resource);
+ },
+
+ /**
+ * Destroy all objects on the iframe unload event.
+ */
+ destroy: function () {
+ this._destroyed = true;
+
+
+ // If been destroyed before the iframe finished loading, then
+ // the properties below will not exist.
+ if (!this._loaded) {
+ this.iframe.setAttribute("src", "about:blank");
+ return;
+ }
+
+ // Reset the src for the iframe so if it reused for a new ProjectEditor
+ // instance, the load will fire properly.
+ this.window.removeEventListener("unload", this.destroy, false);
+ this.iframe.setAttribute("src", "about:blank");
+
+ this._plugins.forEach(plugin => { plugin.destroy(); });
+
+ forget(this, this.projectTree);
+ this.projectTree.destroy();
+ this.projectTree = null;
+
+ this.shells.destroy();
+
+ this.projectEditorCommandset.remove();
+ this.projectEditorKeyset.remove();
+ this.editorCommandset.remove();
+ this.editorKeyset.remove();
+ this.contextMenuPopup.remove();
+ this.textEditorContextMenuPopup.remove();
+ this.editMenu.remove();
+ this.fileMenu.remove();
+
+ this._commandWindow.controllers.removeController(this._commandController);
+ this._commandController = null;
+
+ forget(this, this.project);
+ this.project.destroy();
+ this.project = null;
+ },
+
+ /**
+ * Set the current project viewed by the projecteditor.
+ *
+ * @param Project project
+ * The project to set.
+ */
+ setProject: function (project) {
+ if (this.project) {
+ forget(this, this.project);
+ }
+ this.project = project;
+ this.projectTree.setProject(project);
+
+ // Whenever a store gets removed, clean up any editors that
+ // exist for resources within it.
+ on(this, project, "store-removed", (store) => {
+ store.allResources().forEach((resource) => {
+ this.shells.removeResource(resource);
+ });
+ });
+ },
+
+ /**
+ * Set the current project viewed by the projecteditor to a single path,
+ * used by the app manager.
+ *
+ * @param string path
+ * The file path to set
+ * @param Object opts
+ * Custom options used by the project.
+ * - name: display name for project
+ * - iconUrl: path to icon for project
+ * - validationStatus: one of 'unknown|error|warning|valid'
+ * - projectOverviewURL: path to load for iframe when project
+ * is selected in the tree.
+ * @param Promise
+ * Promise that is resolved once the project is ready to be used.
+ */
+ setProjectToAppPath: function (path, opts = {}) {
+ this.project.appManagerOpts = opts;
+
+ let existingPaths = this.project.allPaths();
+ if (existingPaths.length !== 1 || existingPaths[0] !== path) {
+ // Only fully reset if this is a new path.
+ this.project.removeAllStores();
+ this.project.addPath(path);
+ } else {
+ // Otherwise, just ask for the root to be redrawn
+ let rootResource = this.project.localStores.get(path).root;
+ emit(rootResource, "label-change", rootResource);
+ }
+
+ return this.project.refresh();
+ },
+
+ /**
+ * Open a resource in a particular shell.
+ *
+ * @param Resource resource
+ * The file to be opened.
+ */
+ openResource: function (resource) {
+ let shell = this.shells.open(resource);
+ this.projectTree.selectResource(resource);
+ shell.editor.focus();
+ },
+
+ /**
+ * When a node is selected in the tree, open its associated editor.
+ *
+ * @param Resource resource
+ * The file that has been selected
+ */
+ _onTreeSelected: function (resource) {
+ // Don't attempt to open a directory that is not the root element.
+ if (resource.isDir && resource.parent) {
+ return;
+ }
+ this.pluginDispatch("onTreeSelected", resource);
+ this.openResource(resource);
+ },
+
+ /**
+ * When a node is removed, destroy it and its associated editor.
+ *
+ * @param Resource resource
+ * The resource being removed
+ */
+ _onTreeResourceRemoved: function (resource) {
+ this.shells.removeResource(resource);
+ },
+
+ /**
+ * Create an xul element with options
+ *
+ * @param string type
+ * The tag name of the element to create.
+ * @param Object options
+ * "command": DOMNode or string ID of a command element.
+ * "parent": DOMNode or selector of parent to append child to.
+ * anything other keys are set as an attribute as the element.
+ * @returns DOMElement
+ * The element that has been created.
+ */
+ createElement: function (type, options) {
+ let elt = this.document.createElement(type);
+
+ let parent;
+
+ for (let opt in options) {
+ if (opt === "command") {
+ let command = typeof (options.command) === "string" ? options.command : options.command.id;
+ elt.setAttribute("command", command);
+ } else if (opt === "parent") {
+ continue;
+ } else {
+ elt.setAttribute(opt, options[opt]);
+ }
+ }
+
+ if (options.parent) {
+ let parent = options.parent;
+ if (typeof (parent) === "string") {
+ parent = this.document.querySelector(parent);
+ }
+ parent.appendChild(elt);
+ }
+
+ return elt;
+ },
+
+ /**
+ * Create a "menuitem" xul element with options
+ *
+ * @param Object options
+ * See createElement for available options.
+ * @returns DOMElement
+ * The menuitem that has been created.
+ */
+ createMenuItem: function (options) {
+ return this.createElement("menuitem", options);
+ },
+
+ /**
+ * Add a command to the projecteditor document.
+ * This method is meant to be used with plugins.
+ *
+ * @param Object definition
+ * key: a key/keycode string. Example: "f".
+ * id: Unique ID. Example: "find".
+ * modifiers: Key modifiers. Example: "accel".
+ * @returns DOMElement
+ * The command element that has been created.
+ */
+ addCommand: function (plugin, definition) {
+ this._pluginCommands.set(definition.id, plugin);
+ let document = this.projectEditorKeyset.ownerDocument;
+ let command = document.createElement("command");
+ command.setAttribute("id", definition.id);
+ if (definition.key) {
+ let key = document.createElement("key");
+ key.id = "key_" + definition.id;
+
+ let keyName = definition.key;
+ if (keyName.startsWith("VK_")) {
+ key.setAttribute("keycode", keyName);
+ } else {
+ key.setAttribute("key", keyName);
+ }
+ key.setAttribute("modifiers", definition.modifiers);
+ key.setAttribute("command", definition.id);
+ this.projectEditorKeyset.appendChild(key);
+ }
+ command.setAttribute("oncommand", "void(0);"); // needed. See bug 371900
+ this.projectEditorCommandset.appendChild(command);
+ return command;
+ },
+
+ /**
+ * Get the instance of a plugin registered with a certain type.
+ *
+ * @param Type pluginType
+ * The type, such as SavePlugin
+ * @returns Plugin
+ * The plugin instance matching the specified type.
+ */
+ getPlugin: function (pluginType) {
+ for (let plugin of this.plugins) {
+ if (plugin.constructor === pluginType) {
+ return plugin;
+ }
+ }
+ return null;
+ },
+
+ /**
+ * Get all plugin instances active for the current project
+ *
+ * @returns [Plugin]
+ */
+ get plugins() {
+ if (!this._plugins) {
+ console.log("plugins requested before _plugins was set");
+ return [];
+ }
+ // Could filter further based on the type of project selected,
+ // but no need right now.
+ return this._plugins;
+ },
+
+ /**
+ * Dispatch an onEditorCreated event, and listen for other events specific
+ * to this editor instance.
+ *
+ * @param Editor editor
+ * The new editor instance.
+ */
+ _onEditorCreated: function (editor) {
+ this.pluginDispatch("onEditorCreated", editor);
+ this._editorListenAndDispatch(editor, "change", "onEditorChange");
+ this._editorListenAndDispatch(editor, "cursorActivity", "onEditorCursorActivity");
+ this._editorListenAndDispatch(editor, "load", "onEditorLoad");
+ this._editorListenAndDispatch(editor, "saveRequested", "onEditorSaveRequested");
+ this._editorListenAndDispatch(editor, "save", "onEditorSave");
+
+ editor.on("focus", () => {
+ this.projectTree.selectResource(this.resourceFor(editor));
+ });
+ },
+
+ /**
+ * Dispatch an onEditorActivated event and finish setting up once the
+ * editor is ready to use.
+ *
+ * @param Editor editor
+ * The editor instance, which is now appended in the document.
+ * @param Resource resource
+ * The resource used by the editor
+ */
+ _onEditorActivated: function (editor, resource) {
+ editor.setToolbarVisibility();
+ this.pluginDispatch("onEditorActivated", editor, resource);
+ },
+
+ /**
+ * Dispatch an onEditorDactivated event once an editor loses focus
+ *
+ * @param Editor editor
+ * The editor instance, which is no longer active.
+ * @param Resource resource
+ * The resource used by the editor
+ */
+ _onEditorDeactivated: function (editor, resource) {
+ this.pluginDispatch("onEditorDeactivated", editor, resource);
+ },
+
+ /**
+ * Call a method on all plugins that implement the method.
+ * Also emits the same handler name on `this`.
+ *
+ * @param string handler
+ * Which function name to call on plugins.
+ * @param ...args args
+ * All remaining parameters are passed into the handler.
+ */
+ pluginDispatch: function (handler, ...args) {
+ emit(this, handler, ...args);
+ this.plugins.forEach(plugin => {
+ try {
+ if (handler in plugin) plugin[handler](...args);
+ } catch (ex) {
+ console.error(ex);
+ }
+ });
+ },
+
+ /**
+ * Listen to an event on the editor object and dispatch it
+ * to all plugins that implement the associated method
+ *
+ * @param Editor editor
+ * Which editor to listen to
+ * @param string event
+ * Which editor event to listen for
+ * @param string handler
+ * Which plugin method to call
+ */
+ _editorListenAndDispatch: function (editor, event, handler) {
+ editor.on(event, (...args) => {
+ this.pluginDispatch(handler, editor, this.resourceFor(editor), ...args);
+ });
+ },
+
+ /**
+ * Find a shell for a resource.
+ *
+ * @param Resource resource
+ * The file to be opened.
+ * @returns Shell
+ */
+ shellFor: function (resource) {
+ return this.shells.shellFor(resource);
+ },
+
+ /**
+ * Returns the Editor for a given resource.
+ *
+ * @param Resource resource
+ * The file to check.
+ * @returns Editor
+ * Instance of the editor for this file.
+ */
+ editorFor: function (resource) {
+ let shell = this.shellFor(resource);
+ return shell ? shell.editor : shell;
+ },
+
+ /**
+ * Returns a resource for the given editor
+ *
+ * @param Editor editor
+ * The editor to check
+ * @returns Resource
+ * The resource associated with this editor
+ */
+ resourceFor: function (editor) {
+ if (editor && editor.shell && editor.shell.resource) {
+ return editor.shell.resource;
+ }
+ return null;
+ },
+
+ /**
+ * Decide whether a given resource should be hidden in the tree.
+ *
+ * @param Resource resource
+ * The resource in the tree
+ * @returns Boolean
+ * True if the node should be visible, false if hidden.
+ */
+ resourceVisible: function (resource) {
+ return true;
+ },
+
+ /**
+ * Format the given node for display in the resource tree view.
+ *
+ * @param Resource resource
+ * The file to be opened.
+ * @param DOMNode elt
+ * The element in the tree to render into.
+ */
+ resourceFormatter: function (resource, elt) {
+ let editor = this.editorFor(resource);
+ let renderedByPlugin = false;
+
+ // Allow plugins to override default templating of resource in tree.
+ this.plugins.forEach(plugin => {
+ if (!plugin.onAnnotate) {
+ return;
+ }
+ if (plugin.onAnnotate(resource, editor, elt)) {
+ renderedByPlugin = true;
+ }
+ });
+
+ // If no plugin wants to handle it, just use a string from the resource.
+ if (!renderedByPlugin) {
+ elt.textContent = resource.displayName;
+ }
+ },
+
+ get sourcesVisible() {
+ return this.sourceToggle.classList.contains("pane-collapsed");
+ },
+
+ get currentShell() {
+ return this.shells.currentShell;
+ },
+
+ get currentEditor() {
+ return this.shells.currentEditor;
+ },
+
+ /**
+ * Whether or not menu items should be able to be enabled.
+ * Note that even if this is true, certain menu items will not be
+ * enabled until the correct state is achieved (for instance, the
+ * 'copy' menu item is only enabled when there is a selection).
+ * But if this is false, then nothing will be enabled.
+ */
+ set menuEnabled(val) {
+ this._menuEnabled = val;
+ if (this._loaded) {
+ this._updateMenuItems();
+ }
+ },
+
+ get menuEnabled() {
+ return this._menuEnabled;
+ },
+
+ /**
+ * Are there any unsaved resources in the Project?
+ */
+ get hasUnsavedResources() {
+ return this.project.allResources().some(resource=> {
+ let editor = this.editorFor(resource);
+ return editor && !editor.isClean();
+ });
+ },
+
+ /**
+ * Check with the user about navigating away with unsaved changes.
+ *
+ * @returns Boolean
+ * True if there are no unsaved changes
+ * Otherwise, ask the user to confirm and return the outcome.
+ */
+ confirmUnsaved: function () {
+ if (this.hasUnsavedResources) {
+ return confirm(
+ getLocalizedString("projecteditor.confirmUnsavedTitle"),
+ getLocalizedString("projecteditor.confirmUnsavedLabel2")
+ );
+ }
+
+ return true;
+ },
+
+ /**
+ * Save all the changes in source files.
+ *
+ * @returns Boolean
+ * True if there were resources to save.
+ */
+ saveAllFiles: Task.async(function* () {
+ if (this.hasUnsavedResources) {
+ for (let resource of this.project.allResources()) {
+ let editor = this.editorFor(resource);
+ if (editor && !editor.isClean()) {
+ yield editor.save(resource);
+ }
+ }
+
+ return true;
+ }
+
+ return false;
+ })
+
+});
+
+
+/**
+ * Returns a controller object that can be used for
+ * editor-specific commands such as find, jump to line,
+ * copy/paste, etc.
+ */
+function getCommandController(host) {
+ return {
+ supportsCommand: function (cmd) {
+ return host._pluginCommands.get(cmd);
+ },
+
+ isCommandEnabled: function (cmd) {
+ if (!host.menuEnabled) {
+ return false;
+ }
+ let plugin = host._pluginCommands.get(cmd);
+ if (plugin && plugin.isCommandEnabled) {
+ return plugin.isCommandEnabled(cmd);
+ }
+ return true;
+ },
+ doCommand: function (cmd) {
+ }
+ };
+}
+
+exports.ProjectEditor = ProjectEditor;
diff --git a/devtools/client/projecteditor/lib/shells.js b/devtools/client/projecteditor/lib/shells.js
new file mode 100644
index 000000000..8004f24a2
--- /dev/null
+++ b/devtools/client/projecteditor/lib/shells.js
@@ -0,0 +1,243 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const { EventTarget } = require("sdk/event/target");
+const { emit } = require("sdk/event/core");
+const { EditorTypeForResource } = require("devtools/client/projecteditor/lib/editors");
+const NetworkHelper = require("devtools/shared/webconsole/network-helper");
+const promise = require("promise");
+
+/**
+ * The Shell is the object that manages the editor for a single resource.
+ * It is in charge of selecting the proper Editor (text/image/plugin-defined)
+ * and instantiating / appending the editor.
+ * This object is not exported, it is just used internally by the ShellDeck.
+ *
+ * This object has a promise `editorAppended`, that will resolve once the editor
+ * is ready to be used.
+ */
+var Shell = Class({
+ extends: EventTarget,
+
+ /**
+ * @param ProjectEditor host
+ * @param Resource resource
+ */
+ initialize: function (host, resource) {
+ this.host = host;
+ this.doc = host.document;
+ this.resource = resource;
+ this.elt = this.doc.createElement("vbox");
+ this.elt.classList.add("view-project-detail");
+ this.elt.shell = this;
+
+ let constructor = this._editorTypeForResource();
+
+ this.editor = constructor(this.host);
+ this.editor.shell = this;
+ this.editorAppended = this.editor.appended;
+
+ this.editor.on("load", () => {
+ this.editorDeferred.resolve();
+ });
+ this.elt.appendChild(this.editor.elt);
+ },
+
+ /**
+ * Start loading the resource. The 'load' event happens as
+ * a result of this function, so any listeners to 'editorAppended'
+ * need to be added before calling this.
+ */
+ load: function () {
+ this.editorDeferred = promise.defer();
+ this.editorLoaded = this.editorDeferred.promise;
+ this.editor.load(this.resource);
+ },
+
+ /**
+ * Destroy the shell and its associated editor
+ */
+ destroy: function () {
+ this.editor.destroy();
+ this.resource.destroy();
+ },
+
+ /**
+ * Make sure the correct editor is selected for the resource.
+ * @returns Type:Editor
+ */
+ _editorTypeForResource: function () {
+ let resource = this.resource;
+ let constructor = EditorTypeForResource(resource);
+
+ if (this.host.plugins) {
+ this.host.plugins.forEach(plugin => {
+ if (plugin.editorForResource) {
+ let pluginEditor = plugin.editorForResource(resource);
+ if (pluginEditor) {
+ constructor = pluginEditor;
+ }
+ }
+ });
+ }
+
+ return constructor;
+ }
+});
+
+/**
+ * The ShellDeck is in charge of managing the list of active Shells for
+ * the current ProjectEditor instance (aka host).
+ *
+ * This object emits the following events:
+ * - "editor-created": When an editor is initially created
+ * - "editor-activated": When an editor is ready to use
+ * - "editor-deactivated": When an editor is ready to use
+ */
+var ShellDeck = Class({
+ extends: EventTarget,
+
+ /**
+ * @param ProjectEditor host
+ * @param Document document
+ */
+ initialize: function (host, document) {
+ this.doc = document;
+ this.host = host;
+ this.deck = this.doc.createElement("deck");
+ this.deck.setAttribute("flex", "1");
+ this.elt = this.deck;
+
+ this.shells = new Map();
+
+ this._activeShell = null;
+ },
+
+ /**
+ * Open a resource in a Shell. Will create the Shell
+ * if it doesn't exist yet.
+ *
+ * @param Resource resource
+ * The file to be opened
+ * @returns Shell
+ */
+ open: function (defaultResource) {
+ let shell = this.shellFor(defaultResource);
+ if (!shell) {
+ shell = this._createShell(defaultResource);
+ this.shells.set(defaultResource, shell);
+ }
+ this.selectShell(shell);
+ return shell;
+ },
+
+ /**
+ * Create a new Shell for a resource. Called by `open`.
+ *
+ * @returns Shell
+ */
+ _createShell: function (defaultResource) {
+ let shell = Shell(this.host, defaultResource);
+
+ shell.editorAppended.then(() => {
+ this.shells.set(shell.resource, shell);
+ emit(this, "editor-created", shell.editor);
+ if (this.currentShell === shell) {
+ this.selectShell(shell);
+ }
+
+ });
+
+ shell.load();
+ this.deck.appendChild(shell.elt);
+ return shell;
+ },
+
+ /**
+ * Remove the shell for a given resource.
+ *
+ * @param Resource resource
+ */
+ removeResource: function (resource) {
+ let shell = this.shellFor(resource);
+ if (shell) {
+ this.shells.delete(resource);
+ shell.destroy();
+ }
+ },
+
+ destroy: function () {
+ for (let [resource, shell] of this.shells.entries()) {
+ this.shells.delete(resource);
+ shell.destroy();
+ }
+ },
+
+ /**
+ * Select a given shell and open its editor.
+ * Will fire editor-deactivated on the old selected Shell (if any),
+ * and editor-activated on the new one once it is ready
+ *
+ * @param Shell shell
+ */
+ selectShell: function (shell) {
+ // Don't fire another activate if this is already the active shell
+ if (this._activeShell != shell) {
+ if (this._activeShell) {
+ emit(this, "editor-deactivated", this._activeShell.editor, this._activeShell.resource);
+ }
+ this.deck.selectedPanel = shell.elt;
+ this._activeShell = shell;
+
+ // Only reload the shell if the editor doesn't have local changes.
+ if (shell.editor.isClean()) {
+ shell.load();
+ }
+ shell.editorLoaded.then(() => {
+ // Handle case where another shell has been requested before this
+ // one is finished loading.
+ if (this._activeShell === shell) {
+ emit(this, "editor-activated", shell.editor, shell.resource);
+ }
+ });
+ }
+ },
+
+ /**
+ * Find a Shell for a Resource.
+ *
+ * @param Resource resource
+ * @returns Shell
+ */
+ shellFor: function (resource) {
+ return this.shells.get(resource);
+ },
+
+ /**
+ * The currently active Shell. Note: the editor may not yet be available
+ * on the current shell. Best to wait for the 'editor-activated' event
+ * instead.
+ *
+ * @returns Shell
+ */
+ get currentShell() {
+ return this._activeShell;
+ },
+
+ /**
+ * The currently active Editor, or null if it is not ready.
+ *
+ * @returns Editor
+ */
+ get currentEditor() {
+ let shell = this.currentShell;
+ return shell ? shell.editor : null;
+ },
+
+});
+exports.ShellDeck = ShellDeck;
diff --git a/devtools/client/projecteditor/lib/stores/base.js b/devtools/client/projecteditor/lib/stores/base.js
new file mode 100644
index 000000000..ef9495c77
--- /dev/null
+++ b/devtools/client/projecteditor/lib/stores/base.js
@@ -0,0 +1,58 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cc, Ci, Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const { EventTarget } = require("sdk/event/target");
+const { emit } = require("sdk/event/core");
+const promise = require("promise");
+
+/**
+ * A Store object maintains a collection of Resource objects stored in a tree.
+ *
+ * The Store class should not be instantiated directly. Instead, you should
+ * use a class extending it - right now this is only a LocalStore.
+ *
+ * Events:
+ * This object emits the 'resource-added' and 'resource-removed' events.
+ */
+var Store = Class({
+ extends: EventTarget,
+
+ /**
+ * Should be called during initialize() of a subclass.
+ */
+ initStore: function () {
+ this.resources = new Map();
+ },
+
+ refresh: function () {
+ return promise.resolve();
+ },
+
+ /**
+ * Return a sorted Array of all Resources in the Store
+ */
+ allResources: function () {
+ var resources = [];
+ function addResource(resource) {
+ resources.push(resource);
+ resource.childrenSorted.forEach(addResource);
+ }
+ addResource(this.root);
+ return resources;
+ },
+
+ notifyAdd: function (resource) {
+ emit(this, "resource-added", resource);
+ },
+
+ notifyRemove: function (resource) {
+ emit(this, "resource-removed", resource);
+ }
+});
+
+exports.Store = Store;
diff --git a/devtools/client/projecteditor/lib/stores/local.js b/devtools/client/projecteditor/lib/stores/local.js
new file mode 100644
index 000000000..1f782dadf
--- /dev/null
+++ b/devtools/client/projecteditor/lib/stores/local.js
@@ -0,0 +1,215 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cc, Ci, Cu, ChromeWorker } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const { OS } = require("resource://gre/modules/osfile.jsm");
+const { emit } = require("sdk/event/core");
+const { Store } = require("devtools/client/projecteditor/lib/stores/base");
+const { Task } = require("devtools/shared/task");
+const promise = require("promise");
+const Services = require("Services");
+const { on, forget } = require("devtools/client/projecteditor/lib/helpers/event");
+const { FileResource } = require("devtools/client/projecteditor/lib/stores/resource");
+
+const CHECK_LINKED_DIRECTORY_DELAY = 5000;
+const SHOULD_LIVE_REFRESH = true;
+// XXX: Ignores should be customizable
+const IGNORE_REGEX = /(^\.)|(\~$)|(^node_modules$)/;
+
+/**
+ * A LocalStore object maintains a collection of Resource objects
+ * from the file system.
+ *
+ * This object emits the following events:
+ * - "resource-added": When a resource is added
+ * - "resource-removed": When a resource is removed
+ */
+var LocalStore = Class({
+ extends: Store,
+
+ defaultCategory: "js",
+
+ initialize: function(path) {
+ this.initStore();
+ this.path = OS.Path.normalize(path);
+ this.rootPath = this.path;
+ this.displayName = this.path;
+ this.root = this._forPath(this.path);
+ this.notifyAdd(this.root);
+ this.refreshLoop = this.refreshLoop.bind(this);
+ this.refreshLoop();
+ },
+
+ destroy: function() {
+ clearTimeout(this._refreshTimeout);
+
+ if (this._refreshDeferred) {
+ this._refreshDeferred.reject("destroy");
+ }
+ if (this.worker) {
+ this.worker.terminate();
+ }
+
+ this._refreshTimeout = null;
+ this._refreshDeferred = null;
+ this.worker = null;
+
+ if (this.root) {
+ forget(this, this.root);
+ this.root.destroy();
+ }
+ },
+
+ toString: function() { return "[LocalStore:" + this.path + "]" },
+
+ /**
+ * Return a FileResource object for the given path. If a FileInfo
+ * is provided the resource will use it, otherwise the FileResource
+ * might not have full information until the next refresh.
+ *
+ * The following parameters are passed into the FileResource constructor
+ * See resource.js for information about them
+ *
+ * @param String path
+ * @param FileInfo info
+ * @returns Resource
+ */
+ _forPath: function(path, info=null) {
+ if (this.resources.has(path)) {
+ return this.resources.get(path);
+ }
+
+ let resource = FileResource(this, path, info);
+ this.resources.set(path, resource);
+ return resource;
+ },
+
+ /**
+ * Return a promise that resolves to a fully-functional FileResource
+ * within this project. This will hit the disk for stat info.
+ * options:
+ *
+ * create: If true, a resource will be created even if the underlying
+ * file doesn't exist.
+ */
+ resourceFor: function(path, options) {
+ path = OS.Path.normalize(path);
+
+ if (this.resources.has(path)) {
+ return promise.resolve(this.resources.get(path));
+ }
+
+ if (!this.contains(path)) {
+ return promise.reject(new Error(path + " does not belong to " + this.path));
+ }
+
+ return Task.spawn(function*() {
+ let parent = yield this.resourceFor(OS.Path.dirname(path));
+
+ let info;
+ try {
+ info = yield OS.File.stat(path);
+ } catch (ex if ex instanceof OS.File.Error && ex.becauseNoSuchFile) {
+ if (!options.create) {
+ throw ex;
+ }
+ }
+
+ let resource = this._forPath(path, info);
+ parent.addChild(resource);
+ return resource;
+ }.bind(this));
+ },
+
+ refreshLoop: function() {
+ // XXX: Once Bug 958280 adds a watch function, will not need to forever loop here.
+ this.refresh().then(() => {
+ if (SHOULD_LIVE_REFRESH) {
+ this._refreshTimeout = setTimeout(this.refreshLoop,
+ CHECK_LINKED_DIRECTORY_DELAY);
+ }
+ });
+ },
+
+ _refreshTimeout: null,
+ _refreshDeferred: null,
+
+ /**
+ * Refresh the directory structure.
+ */
+ refresh: function(path=this.rootPath) {
+ if (this._refreshDeferred) {
+ return this._refreshDeferred.promise;
+ }
+ this._refreshDeferred = promise.defer();
+
+ let worker = this.worker = new ChromeWorker("chrome://devtools/content/projecteditor/lib/helpers/readdir.js");
+ let start = Date.now();
+
+ worker.onmessage = evt => {
+ // console.log("Directory read finished in " + ( Date.now() - start ) +"ms", evt);
+ for (path in evt.data) {
+ let info = evt.data[path];
+ info.path = path;
+
+ let resource = this._forPath(path, info);
+ resource.info = info;
+ if (info.isDir) {
+ let newChildren = new Set();
+ for (let childPath of info.children) {
+ childInfo = evt.data[childPath];
+ newChildren.add(this._forPath(childPath, childInfo));
+ }
+ resource.setChildren(newChildren);
+ }
+ resource.info.children = null;
+ }
+
+ worker = null;
+ this._refreshDeferred.resolve();
+ this._refreshDeferred = null;
+ };
+ worker.onerror = ex => {
+ console.error(ex);
+ worker = null;
+ this._refreshDeferred.reject(ex);
+ this._refreshDeferred = null;
+ }
+ worker.postMessage({ path: this.rootPath, ignore: IGNORE_REGEX });
+ return this._refreshDeferred.promise;
+ },
+
+ /**
+ * Returns true if the given path would be a child of the store's
+ * root directory.
+ */
+ contains: function(path) {
+ path = OS.Path.normalize(path);
+ let thisPath = OS.Path.split(this.rootPath);
+ let thatPath = OS.Path.split(path)
+
+ if (!(thisPath.absolute && thatPath.absolute)) {
+ throw new Error("Contains only works with absolute paths.");
+ }
+
+ if (thisPath.winDrive && (thisPath.winDrive != thatPath.winDrive)) {
+ return false;
+ }
+
+ if (thatPath.components.length <= thisPath.components.length) {
+ return false;
+ }
+
+ for (let i = 0; i < thisPath.components.length; i++) {
+ if (thisPath.components[i] != thatPath.components[i]) {
+ return false;
+ }
+ }
+ return true;
+ }
+});
+exports.LocalStore = LocalStore;
diff --git a/devtools/client/projecteditor/lib/stores/moz.build b/devtools/client/projecteditor/lib/stores/moz.build
new file mode 100644
index 000000000..5a6becd92
--- /dev/null
+++ b/devtools/client/projecteditor/lib/stores/moz.build
@@ -0,0 +1,11 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+ 'base.js',
+ 'local.js',
+ 'resource.js',
+)
diff --git a/devtools/client/projecteditor/lib/stores/resource.js b/devtools/client/projecteditor/lib/stores/resource.js
new file mode 100644
index 000000000..53e3e7348
--- /dev/null
+++ b/devtools/client/projecteditor/lib/stores/resource.js
@@ -0,0 +1,398 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const { Cc, Ci, Cu } = require("chrome");
+const { TextEncoder, TextDecoder } = require("sdk/io/buffer");
+const { Class } = require("sdk/core/heritage");
+const { EventTarget } = require("sdk/event/target");
+const { emit } = require("sdk/event/core");
+const URL = require("sdk/url");
+const promise = require("promise");
+const { OS } = Cu.import("resource://gre/modules/osfile.jsm", {});
+const { FileUtils } = Cu.import("resource://gre/modules/FileUtils.jsm", {});
+const mimeService = Cc["@mozilla.org/mime;1"].getService(Ci.nsIMIMEService);
+const { Task } = require("devtools/shared/task");
+
+const gDecoder = new TextDecoder();
+const gEncoder = new TextEncoder();
+
+/**
+ * A Resource is a single file-like object that can be respresented
+ * as a file for ProjectEditor.
+ *
+ * The Resource class is not exported, and should not be instantiated
+ * Instead, you should use the FileResource class that extends it.
+ *
+ * This object emits the following events:
+ * - "children-changed": When a child has been added or removed.
+ * See setChildren.
+ * - "deleted": When the resource has been deleted.
+ */
+var Resource = Class({
+ extends: EventTarget,
+
+ refresh: function () { return promise.resolve(this); },
+ destroy: function () { },
+ delete: function () { },
+
+ setURI: function (uri) {
+ if (typeof (uri) === "string") {
+ uri = URL.URL(uri);
+ }
+ this.uri = uri;
+ },
+
+ /**
+ * Is there more than 1 child Resource?
+ */
+ get hasChildren() { return this.children && this.children.size > 0; },
+
+ /**
+ * Is this Resource the root (top level for the store)?
+ */
+ get isRoot() {
+ return !this.parent;
+ },
+
+ /**
+ * Sorted array of children for display
+ */
+ get childrenSorted() {
+ if (!this.hasChildren) {
+ return [];
+ }
+
+ return [...this.children].sort((a, b)=> {
+ // Put directories above files.
+ if (a.isDir !== b.isDir) {
+ return b.isDir;
+ }
+ return a.basename.toLowerCase() > b.basename.toLowerCase();
+ });
+ },
+
+ /**
+ * Set the children set of this Resource, and notify of any
+ * additions / removals that happened in the change.
+ */
+ setChildren: function (newChildren) {
+ let oldChildren = this.children || new Set();
+ let change = false;
+
+ for (let child of oldChildren) {
+ if (!newChildren.has(child)) {
+ change = true;
+ child.parent = null;
+ this.store.notifyRemove(child);
+ }
+ }
+
+ for (let child of newChildren) {
+ if (!oldChildren.has(child)) {
+ change = true;
+ child.parent = this;
+ this.store.notifyAdd(child);
+ }
+ }
+
+ this.children = newChildren;
+ if (change) {
+ emit(this, "children-changed", this);
+ }
+ },
+
+ /**
+ * Add a resource to children set and notify of the change.
+ *
+ * @param Resource resource
+ */
+ addChild: function (resource) {
+ this.children = this.children || new Set();
+
+ resource.parent = this;
+ this.children.add(resource);
+ this.store.notifyAdd(resource);
+ emit(this, "children-changed", this);
+ return resource;
+ },
+
+ /**
+ * Checks if current object has child with specific name.
+ *
+ * @param string name
+ */
+ hasChild: function (name) {
+ for (let child of this.children) {
+ if (child.basename === name) {
+ return true;
+ }
+ }
+ return false;
+ },
+
+ /**
+ * Remove a resource to children set and notify of the change.
+ *
+ * @param Resource resource
+ */
+ removeChild: function (resource) {
+ resource.parent = null;
+ this.children.remove(resource);
+ this.store.notifyRemove(resource);
+ emit(this, "children-changed", this);
+ return resource;
+ },
+
+ /**
+ * Return a set with children, children of children, etc -
+ * gathered recursively.
+ *
+ * @returns Set<Resource>
+ */
+ allDescendants: function () {
+ let set = new Set();
+
+ function addChildren(item) {
+ if (!item.children) {
+ return;
+ }
+
+ for (let child of item.children) {
+ set.add(child);
+ }
+ }
+
+ addChildren(this);
+ for (let item of set) {
+ addChildren(item);
+ }
+
+ return set;
+ },
+});
+
+/**
+ * A FileResource is an implementation of Resource for a File System
+ * backing. This is exported, and should be used instead of Resource.
+ */
+var FileResource = Class({
+ extends: Resource,
+
+ /**
+ * @param Store store
+ * @param String path
+ * @param FileInfo info
+ * https://developer.mozilla.org/en-US/docs/JavaScript_OS.File/OS.File.Info
+ */
+ initialize: function (store, path, info) {
+ this.store = store;
+ this.path = path;
+
+ this.setURI(URL.URL(URL.fromFilename(path)));
+ this._lastReadModification = undefined;
+
+ this.info = info;
+ this.parent = null;
+ },
+
+ toString: function () {
+ return "[FileResource:" + this.path + "]";
+ },
+
+ destroy: function () {
+ if (this._refreshDeferred) {
+ this._refreshDeferred.reject();
+ }
+ this._refreshDeferred = null;
+ },
+
+ /**
+ * Fetch and cache information about this particular file.
+ * https://developer.mozilla.org/en-US/docs/JavaScript_OS.File/OS.File_for_the_main_thread#OS.File.stat
+ *
+ * @returns Promise
+ * Resolves once the File.stat has finished.
+ */
+ refresh: function () {
+ if (this._refreshDeferred) {
+ return this._refreshDeferred.promise;
+ }
+ this._refreshDeferred = promise.defer();
+ OS.File.stat(this.path).then(info => {
+ this.info = info;
+ if (this._refreshDeferred) {
+ this._refreshDeferred.resolve(this);
+ this._refreshDeferred = null;
+ }
+ });
+ return this._refreshDeferred.promise;
+ },
+
+ /**
+ * Return the trailing name component of this Resource
+ */
+ get basename() {
+ return this.path.replace(/\/+$/, "").replace(/\\/g, "/").replace(/.*\//, "");
+ },
+
+ /**
+ * A string to be used when displaying this Resource in views
+ */
+ get displayName() {
+ return this.basename + (this.isDir ? "/" : "");
+ },
+
+ /**
+ * Is this FileResource a directory? Rather than checking children
+ * here, we use this.info. So this could return a false negative
+ * if there was no info passed in on constructor and the first
+ * refresh hasn't yet finished.
+ */
+ get isDir() {
+ if (!this.info) { return false; }
+ return this.info.isDir && !this.info.isSymLink;
+ },
+
+ /**
+ * Read the file as a string asynchronously.
+ *
+ * @returns Promise
+ * Resolves with the text of the file.
+ */
+ load: function () {
+ return OS.File.read(this.path).then(bytes => {
+ return gDecoder.decode(bytes);
+ });
+ },
+
+ /**
+ * Delete the file from the filesystem
+ *
+ * @returns Promise
+ * Resolves when the file is deleted
+ */
+ delete: function () {
+ emit(this, "deleted", this);
+ if (this.isDir) {
+ return OS.File.removeDir(this.path);
+ } else {
+ return OS.File.remove(this.path);
+ }
+ },
+
+ /**
+ * Add a text file as a child of this FileResource.
+ * This instance must be a directory.
+ *
+ * @param string name
+ * The filename (path will be generated based on this.path).
+ * string initial
+ * The content to write to the new file.
+ * @returns Promise
+ * Resolves with the new FileResource once it has
+ * been written to disk.
+ * Rejected if this is not a directory.
+ */
+ createChild: function (name, initial = "") {
+ if (!this.isDir) {
+ return promise.reject(new Error("Cannot add child to a regular file"));
+ }
+
+ let newPath = OS.Path.join(this.path, name);
+
+ let buffer = initial ? gEncoder.encode(initial) : "";
+ return OS.File.writeAtomic(newPath, buffer, {
+ noOverwrite: true
+ }).then(() => {
+ return this.store.refresh();
+ }).then(() => {
+ let resource = this.store.resources.get(newPath);
+ if (!resource) {
+ throw new Error("Error creating " + newPath);
+ }
+ return resource;
+ });
+ },
+
+ /**
+ * Rename the file from the filesystem
+ *
+ * @returns Promise
+ * Resolves with the renamed FileResource.
+ */
+ rename: function (oldName, newName) {
+ let oldPath = OS.Path.join(this.path, oldName);
+ let newPath = OS.Path.join(this.path, newName);
+
+ return OS.File.move(oldPath, newPath).then(() => {
+ return this.store.refresh();
+ }).then(() => {
+ let resource = this.store.resources.get(newPath);
+ if (!resource) {
+ throw new Error("Error creating " + newPath);
+ }
+ return resource;
+ });
+ },
+
+ /**
+ * Write a string to this file.
+ *
+ * @param string content
+ * @returns Promise
+ * Resolves once it has been written to disk.
+ * Rejected if there is an error
+ */
+ save: Task.async(function* (content) {
+ // XXX: writeAtomic was losing permissions after saving on OSX
+ // return OS.File.writeAtomic(this.path, buffer, { tmpPath: this.path + ".tmp" });
+ let buffer = gEncoder.encode(content);
+ let path = this.path;
+ let file = yield OS.File.open(path, {truncate: true});
+ yield file.write(buffer);
+ yield file.close();
+ }),
+
+ /**
+ * Attempts to get the content type from the file.
+ */
+ get contentType() {
+ if (this._contentType) {
+ return this._contentType;
+ }
+ if (this.isDir) {
+ return "x-directory/normal";
+ }
+ try {
+ this._contentType = mimeService.getTypeFromFile(new FileUtils.File(this.path));
+ } catch (ex) {
+ if (ex.name !== "NS_ERROR_NOT_AVAILABLE" &&
+ ex.name !== "NS_ERROR_FAILURE") {
+ console.error(ex, this.path);
+ }
+ this._contentType = null;
+ }
+ return this._contentType;
+ },
+
+ /**
+ * A string used when determining the type of Editor to open for this.
+ * See editors.js -> EditorTypeForResource.
+ */
+ get contentCategory() {
+ const NetworkHelper = require("devtools/shared/webconsole/network-helper");
+ let category = NetworkHelper.mimeCategoryMap[this.contentType];
+ // Special treatment for manifest.webapp.
+ if (!category && this.basename === "manifest.webapp") {
+ return "json";
+ }
+ return category || "txt";
+ }
+});
+
+exports.FileResource = FileResource;
diff --git a/devtools/client/projecteditor/lib/tree.js b/devtools/client/projecteditor/lib/tree.js
new file mode 100644
index 000000000..50597804d
--- /dev/null
+++ b/devtools/client/projecteditor/lib/tree.js
@@ -0,0 +1,593 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const { Cu } = require("chrome");
+const { Class } = require("sdk/core/heritage");
+const { emit } = require("sdk/event/core");
+const { EventTarget } = require("sdk/event/target");
+const { merge } = require("sdk/util/object");
+const promise = require("promise");
+const { InplaceEditor } = require("devtools/client/shared/inplace-editor");
+const { on, forget } = require("devtools/client/projecteditor/lib/helpers/event");
+const { OS } = Cu.import("resource://gre/modules/osfile.jsm", {});
+
+const HTML_NS = "http://www.w3.org/1999/xhtml";
+
+/**
+ * ResourceContainer is used as the view of a single Resource in
+ * the tree. It is not exported.
+ */
+var ResourceContainer = Class({
+ /**
+ * @param ProjectTreeView tree
+ * @param Resource resource
+ */
+ initialize: function (tree, resource) {
+ this.tree = tree;
+ this.resource = resource;
+ this.elt = null;
+ this.expander = null;
+ this.children = null;
+
+ let doc = tree.doc;
+
+ this.elt = doc.createElementNS(HTML_NS, "li");
+ this.elt.classList.add("child");
+
+ this.line = doc.createElementNS(HTML_NS, "div");
+ this.line.classList.add("child");
+ this.line.classList.add("entry");
+ this.line.setAttribute("theme", "dark");
+ this.line.setAttribute("tabindex", "0");
+
+ this.elt.appendChild(this.line);
+
+ this.highlighter = doc.createElementNS(HTML_NS, "span");
+ this.highlighter.classList.add("highlighter");
+ this.line.appendChild(this.highlighter);
+
+ this.expander = doc.createElementNS(HTML_NS, "span");
+ this.expander.className = "arrow expander";
+ this.expander.setAttribute("open", "");
+ this.line.appendChild(this.expander);
+
+ this.label = doc.createElementNS(HTML_NS, "span");
+ this.label.className = "file-label";
+ this.line.appendChild(this.label);
+
+ this.line.addEventListener("contextmenu", (ev) => {
+ this.select();
+ this.openContextMenu(ev);
+ }, false);
+
+ this.children = doc.createElementNS(HTML_NS, "ul");
+ this.children.classList.add("children");
+
+ this.elt.appendChild(this.children);
+
+ this.line.addEventListener("click", (evt) => {
+ this.select();
+ this.toggleExpansion();
+ evt.stopPropagation();
+ }, false);
+ this.expander.addEventListener("click", (evt) => {
+ this.toggleExpansion();
+ this.select();
+ evt.stopPropagation();
+ }, true);
+
+ if (!this.resource.isRoot) {
+ this.expanded = false;
+ }
+ this.update();
+ },
+
+ toggleExpansion: function () {
+ if (!this.resource.isRoot) {
+ this.expanded = !this.expanded;
+ } else {
+ this.expanded = true;
+ }
+ },
+
+ destroy: function () {
+ this.elt.remove();
+ this.expander.remove();
+ this.highlighter.remove();
+ this.children.remove();
+ this.label.remove();
+ this.elt = this.expander = this.highlighter = this.children = this.label = null;
+ },
+
+ /**
+ * Open the context menu when right clicking on the view.
+ * XXX: We could pass this to plugins to allow themselves
+ * to be register/remove items from the context menu if needed.
+ *
+ * @param Event e
+ */
+ openContextMenu: function (ev) {
+ ev.preventDefault();
+ let popup = this.tree.options.contextMenuPopup;
+ popup.openPopupAtScreen(ev.screenX, ev.screenY, true);
+ },
+
+ /**
+ * Update the view based on the current state of the Resource.
+ */
+ update: function () {
+ let visible = this.tree.options.resourceVisible ?
+ this.tree.options.resourceVisible(this.resource) :
+ true;
+
+ this.elt.hidden = !visible;
+
+ this.tree.options.resourceFormatter(this.resource, this.label);
+
+ this.expander.style.visibility = this.resource.hasChildren ? "visible" : "hidden";
+
+ },
+
+ /**
+ * Select this view in the ProjectTreeView.
+ */
+ select: function () {
+ this.tree.selectContainer(this);
+ },
+
+ /**
+ * @returns Boolean
+ * Is this view currently selected
+ */
+ get selected() {
+ return this.line.classList.contains("selected");
+ },
+
+ /**
+ * Set the selected state in the UI.
+ */
+ set selected(v) {
+ if (v) {
+ this.line.classList.add("selected");
+ } else {
+ this.line.classList.remove("selected");
+ }
+ },
+
+ /**
+ * @returns Boolean
+ * Are any children visible.
+ */
+ get expanded() {
+ return !this.elt.classList.contains("tree-collapsed");
+ },
+
+ /**
+ * Set the visiblity state of children.
+ */
+ set expanded(v) {
+ if (v) {
+ this.elt.classList.remove("tree-collapsed");
+ this.expander.setAttribute("open", "");
+ } else {
+ this.expander.removeAttribute("open");
+ this.elt.classList.add("tree-collapsed");
+ }
+ }
+});
+
+/**
+ * TreeView is a view managing a list of children.
+ * It is not to be instantiated directly - only extended.
+ * Use ProjectTreeView instead.
+ */
+var TreeView = Class({
+ extends: EventTarget,
+
+ /**
+ * @param Document document
+ * @param Object options
+ * - contextMenuPopup: a <menupopup> element
+ * - resourceFormatter: a function(Resource, DOMNode)
+ * that renders the resource into the view
+ * - resourceVisible: a function(Resource) -> Boolean
+ * that determines if the resource should show up.
+ */
+ initialize: function (doc, options) {
+ this.doc = doc;
+ this.options = merge({
+ resourceFormatter: function (resource, elt) {
+ elt.textContent = resource.toString();
+ }
+ }, options);
+ this.models = new Set();
+ this.roots = new Set();
+ this._containers = new Map();
+ this.elt = this.doc.createElementNS(HTML_NS, "div");
+ this.elt.tree = this;
+ this.elt.className = "sources-tree";
+ this.elt.setAttribute("with-arrows", "true");
+ this.elt.setAttribute("theme", "dark");
+ this.elt.setAttribute("flex", "1");
+
+ this.children = this.doc.createElementNS(HTML_NS, "ul");
+ this.elt.appendChild(this.children);
+
+ this.resourceChildrenChanged = this.resourceChildrenChanged.bind(this);
+ this.removeResource = this.removeResource.bind(this);
+ this.updateResource = this.updateResource.bind(this);
+ },
+
+ destroy: function () {
+ this._destroyed = true;
+ this.elt.remove();
+ },
+
+ /**
+ * Helper function to create DOM elements for promptNew and promptEdit
+ */
+ createInputContainer: function () {
+ let inputholder = this.doc.createElementNS(HTML_NS, "div");
+ inputholder.className = "child entry";
+
+ let expander = this.doc.createElementNS(HTML_NS, "span");
+ expander.className = "arrow expander";
+ expander.setAttribute("invisible", "");
+ inputholder.appendChild(expander);
+
+ let placeholder = this.doc.createElementNS(HTML_NS, "div");
+ placeholder.className = "child";
+ inputholder.appendChild(placeholder);
+
+ return {inputholder, placeholder};
+ },
+
+ /**
+ * Prompt the user to create a new file in the tree.
+ *
+ * @param string initial
+ * The suggested starting file name
+ * @param Resource parent
+ * @param Resource sibling
+ * Which resource to put this next to. If not set,
+ * it will be put in front of all other children.
+ *
+ * @returns Promise
+ * Resolves once the prompt has been successful,
+ * Rejected if it is cancelled
+ */
+ promptNew: function (initial, parent, sibling = null) {
+ let deferred = promise.defer();
+
+ let parentContainer = this._containers.get(parent);
+ let item = this.doc.createElement("li");
+ item.className = "child";
+
+ let {inputholder, placeholder} = this.createInputContainer();
+ item.appendChild(inputholder);
+
+ let children = parentContainer.children;
+ sibling = sibling ? this._containers.get(sibling).elt : null;
+ parentContainer.children.insertBefore(item, sibling ? sibling.nextSibling : children.firstChild);
+
+ new InplaceEditor({
+ element: placeholder,
+ initial: initial,
+ preserveTextStyles: true,
+ start: editor => {
+ editor.input.select();
+ },
+ done: function (val, commit) {
+ if (commit) {
+ deferred.resolve(val);
+ } else {
+ deferred.reject(val);
+ }
+ parentContainer.line.focus();
+ },
+ destroy: () => {
+ item.parentNode.removeChild(item);
+ },
+ });
+
+ return deferred.promise;
+ },
+
+ /**
+ * Prompt the user to rename file in the tree.
+ *
+ * @param string initial
+ * The suggested starting file name
+ * @param resource
+ *
+ * @returns Promise
+ * Resolves once the prompt has been successful,
+ * Rejected if it is cancelled
+ */
+ promptEdit: function (initial, resource) {
+ let deferred = promise.defer();
+ let item = this._containers.get(resource).elt;
+ let originalText = item.childNodes[0];
+
+ let {inputholder, placeholder} = this.createInputContainer();
+ item.insertBefore(inputholder, originalText);
+
+ item.removeChild(originalText);
+
+ new InplaceEditor({
+ element: placeholder,
+ initial: initial,
+ preserveTextStyles: true,
+ start: editor => {
+ editor.input.select();
+ },
+ done: function (val, commit) {
+ if (val === initial) {
+ item.insertBefore(originalText, inputholder);
+ }
+
+ item.removeChild(inputholder);
+
+ if (commit) {
+ deferred.resolve(val);
+ } else {
+ deferred.reject(val);
+ }
+ },
+ });
+
+ return deferred.promise;
+ },
+
+ /**
+ * Add a new Store into the TreeView
+ *
+ * @param Store model
+ */
+ addModel: function (model) {
+ if (this.models.has(model)) {
+ // Requesting to add a model that already exists
+ return;
+ }
+ this.models.add(model);
+ let placeholder = this.doc.createElementNS(HTML_NS, "li");
+ placeholder.style.display = "none";
+ this.children.appendChild(placeholder);
+ this.roots.add(model.root);
+ model.root.refresh().then(root => {
+ if (this._destroyed || !this.models.has(model)) {
+ // model may have been removed during the initial refresh.
+ // In this case, do not import the resource or add to DOM, just leave it be.
+ return;
+ }
+ let container = this.importResource(root);
+ container.line.classList.add("entry-group-title");
+ container.line.setAttribute("theme", "dark");
+ this.selectContainer(container);
+
+ this.children.insertBefore(container.elt, placeholder);
+ this.children.removeChild(placeholder);
+ });
+ },
+
+ /**
+ * Remove a Store from the TreeView
+ *
+ * @param Store model
+ */
+ removeModel: function (model) {
+ this.models.delete(model);
+ this.removeResource(model.root);
+ },
+
+
+ /**
+ * Get the ResourceContainer. Used for testing the view.
+ *
+ * @param Resource resource
+ * @returns ResourceContainer
+ */
+ getViewContainer: function (resource) {
+ return this._containers.get(resource);
+ },
+
+ /**
+ * Select a ResourceContainer in the tree.
+ *
+ * @param ResourceContainer container
+ */
+ selectContainer: function (container) {
+ if (this.selectedContainer === container) {
+ return;
+ }
+ if (this.selectedContainer) {
+ this.selectedContainer.selected = false;
+ }
+ this.selectedContainer = container;
+ container.selected = true;
+ emit(this, "selection", container.resource);
+ },
+
+ /**
+ * Select a Resource in the tree.
+ *
+ * @param Resource resource
+ */
+ selectResource: function (resource) {
+ this.selectContainer(this._containers.get(resource));
+ },
+
+ /**
+ * Get the currently selected Resource
+ *
+ * @param Resource resource
+ */
+ getSelectedResource: function () {
+ return this.selectedContainer.resource;
+ },
+
+ /**
+ * Insert a Resource into the view.
+ * Makes a new ResourceContainer if needed
+ *
+ * @param Resource resource
+ */
+ importResource: function (resource) {
+ if (!resource) {
+ return null;
+ }
+
+ if (this._containers.has(resource)) {
+ return this._containers.get(resource);
+ }
+ var container = ResourceContainer(this, resource);
+ this._containers.set(resource, container);
+ this._updateChildren(container);
+
+ on(this, resource, "children-changed", this.resourceChildrenChanged);
+ on(this, resource, "label-change", this.updateResource);
+ on(this, resource, "deleted", this.removeResource);
+
+ return container;
+ },
+
+ /**
+ * Remove a Resource (including children) from the view.
+ *
+ * @param Resource resource
+ */
+ removeResource: function (resource) {
+ let toRemove = resource.allDescendants();
+ toRemove.add(resource);
+ for (let remove of toRemove) {
+ this._removeResource(remove);
+ }
+ },
+
+ /**
+ * Remove an individual Resource (but not children) from the view.
+ *
+ * @param Resource resource
+ */
+ _removeResource: function (resource) {
+ forget(this, resource);
+ if (this._containers.get(resource)) {
+ this._containers.get(resource).destroy();
+ this._containers.delete(resource);
+ }
+ emit(this, "resource-removed", resource);
+ },
+
+ /**
+ * Listener for when a resource has new children.
+ * This can happen as files are being loaded in from FileSystem, for example.
+ *
+ * @param Resource resource
+ */
+ resourceChildrenChanged: function (resource) {
+ this.updateResource(resource);
+ this._updateChildren(this._containers.get(resource));
+ },
+
+ /**
+ * Listener for when a label in the view has been updated.
+ * For example, the 'dirty' plugin marks changed files with an '*'
+ * next to the filename, and notifies with this event.
+ *
+ * @param Resource resource
+ */
+ updateResource: function (resource) {
+ let container = this._containers.get(resource);
+ container.update();
+ },
+
+ /**
+ * Build necessary ResourceContainers for a Resource and its
+ * children, then append them into the view.
+ *
+ * @param ResourceContainer container
+ */
+ _updateChildren: function (container) {
+ let resource = container.resource;
+ let fragment = this.doc.createDocumentFragment();
+ if (resource.children) {
+ for (let child of resource.childrenSorted) {
+ let childContainer = this.importResource(child);
+ fragment.appendChild(childContainer.elt);
+ }
+ }
+
+ while (container.children.firstChild) {
+ container.children.firstChild.remove();
+ }
+
+ container.children.appendChild(fragment);
+ },
+});
+
+/**
+ * ProjectTreeView is the implementation of TreeView
+ * that is exported. This is the class that is to be used
+ * directly.
+ */
+var ProjectTreeView = Class({
+ extends: TreeView,
+
+ /**
+ * See TreeView.initialize
+ *
+ * @param Document document
+ * @param Object options
+ */
+ initialize: function (document, options) {
+ TreeView.prototype.initialize.apply(this, arguments);
+ },
+
+ destroy: function () {
+ this.forgetProject();
+ TreeView.prototype.destroy.apply(this, arguments);
+ },
+
+ /**
+ * Remove current project and empty the tree
+ */
+ forgetProject: function () {
+ if (this.project) {
+ forget(this, this.project);
+ for (let store of this.project.allStores()) {
+ this.removeModel(store);
+ }
+ }
+ },
+
+ /**
+ * Show a project in the tree
+ *
+ * @param Project project
+ * The project to render into a tree
+ */
+ setProject: function (project) {
+ this.forgetProject();
+ this.project = project;
+ if (this.project) {
+ on(this, project, "store-added", this.addModel.bind(this));
+ on(this, project, "store-removed", this.removeModel.bind(this));
+ on(this, project, "project-saved", this.refresh.bind(this));
+ this.refresh();
+ }
+ },
+
+ /**
+ * Refresh the tree with all of the current project stores
+ */
+ refresh: function () {
+ for (let store of this.project.allStores()) {
+ this.addModel(store);
+ }
+ }
+});
+
+exports.ProjectTreeView = ProjectTreeView;