gecko-dev/devtools/client/styleeditor/styleeditor-panel.js

159 lines
4.6 KiB
JavaScript

/* 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";
var Services = require("Services");
var promise = require("promise");
var {Task} = require("devtools/shared/task");
var {XPCOMUtils} = require("resource://gre/modules/XPCOMUtils.jsm");
var EventEmitter = require("devtools/shared/event-emitter");
var {StyleEditorUI} = require("resource://devtools/client/styleeditor/StyleEditorUI.jsm");
var {getString} = require("resource://devtools/client/styleeditor/StyleEditorUtil.jsm");
var {initCssProperties} = require("devtools/shared/fronts/css-properties");
loader.lazyGetter(this, "StyleSheetsFront",
() => require("devtools/shared/fronts/stylesheets").StyleSheetsFront);
loader.lazyGetter(this, "StyleEditorFront",
() => require("devtools/shared/fronts/styleeditor").StyleEditorFront);
var StyleEditorPanel = function StyleEditorPanel(panelWin, toolbox) {
EventEmitter.decorate(this);
this._toolbox = toolbox;
this._target = toolbox.target;
this._panelWin = panelWin;
this._panelDoc = panelWin.document;
this.destroy = this.destroy.bind(this);
this._showError = this._showError.bind(this);
};
exports.StyleEditorPanel = StyleEditorPanel;
StyleEditorPanel.prototype = {
get target() {
return this._toolbox.target;
},
get panelWindow() {
return this._panelWin;
},
/**
* open is effectively an asynchronous constructor
*/
open: Task.async(function* () {
// We always interact with the target as if it were remote
if (!this.target.isRemote) {
yield this.target.makeRemote();
}
this.target.on("close", this.destroy);
if (this.target.form.styleSheetsActor) {
this._debuggee = StyleSheetsFront(this.target.client, this.target.form);
} else {
/* We're talking to a pre-Firefox 29 server-side */
this._debuggee = StyleEditorFront(this.target.client, this.target.form);
}
// Initialize the CSS properties database.
const {cssProperties} = yield initCssProperties(this._toolbox);
// Initialize the UI
this.UI = new StyleEditorUI(this._debuggee, this.target, this._panelDoc,
cssProperties);
this.UI.on("error", this._showError);
yield this.UI.initialize();
this.isReady = true;
return this;
}),
/**
* Show an error message from the style editor in the toolbox
* notification box.
*
* @param {string} event
* Type of event
* @param {string} data
* The parameters to customize the error message
*/
_showError: function (event, data) {
if (!this._toolbox) {
// could get an async error after we've been destroyed
return;
}
let errorMessage = getString(data.key);
if (data.append) {
errorMessage += " " + data.append;
}
let notificationBox = this._toolbox.getNotificationBox();
let notification =
notificationBox.getNotificationWithValue("styleeditor-error");
let level = (data.level === "info") ?
notificationBox.PRIORITY_INFO_LOW :
notificationBox.PRIORITY_CRITICAL_LOW;
if (!notification) {
notificationBox.appendNotification(errorMessage, "styleeditor-error",
"", level);
}
},
/**
* Select a stylesheet.
*
* @param {string} href
* Url of stylesheet to find and select in editor
* @param {number} line
* Line number to jump to after selecting. One-indexed
* @param {number} col
* Column number to jump to after selecting. One-indexed
* @return {Promise}
* Promise that will resolve when the editor is selected and ready
* to be used.
*/
selectStyleSheet: function (href, line, col) {
if (!this._debuggee || !this.UI) {
return null;
}
return this.UI.selectStyleSheet(href, line - 1, col ? col - 1 : 0);
},
/**
* Destroy the style editor.
*/
destroy: function () {
if (!this._destroyed) {
this._destroyed = true;
this._target.off("close", this.destroy);
this._target = null;
this._toolbox = null;
this._panelWin = null;
this._panelDoc = null;
this._debuggee.destroy();
this._debuggee = null;
this.UI.destroy();
this.UI = null;
}
return promise.resolve(null);
},
};
XPCOMUtils.defineLazyGetter(StyleEditorPanel.prototype, "strings",
function () {
return Services.strings.createBundle(
"chrome://devtools/locale/styleeditor.properties");
});