javascript - 将插件窗口附加到 Firefox 浏览器窗口

Question

我正在开发一个插件，我的插件的所有按钮当前都位于我创建的额外窗口中

window.open("chrome://.../.../gui.html", "my addon", "location=no,directories=no,status=yes,menubar=no,scrollbars=yes,copyhistory=no");

我希望用户能够将此窗口附加到 Firefox 浏览器，就像我们将 Firebug 附加到浏览器窗口一样。我们如何做到这一点？我们如何创建这个额外的按钮来附加或分离插件窗口。

Answer 1

您正在编写 SDK 插件吗？如果没有，这里有一些代码可以帮助您将 Pane 附加到浏览器窗口，您需要添加一个按钮来附加此 Pane 或将其删除并打开一个单独的窗口...

/*
Here is a basic example of creating a vbox and inserting it at the bottom, with a movable splitter.
This can be done more easily using a XUL overlay, or at least some function to handle DOM operations
(IMO only a masochist would enjoy using DOM methods!)
*/


function removePane(){
    let xxx = document.getElementById("_xxx_");
    if(xxx) xxx.parentNode.removeChild(xxx);
    let sss = document.getElementById("_sss_");
    if(sss) sss.parentNode.removeChild(sss);
}

function addPane(path){ //path can be of any protocol (chrome, file, http, ...)
    removePane(); //just to be sure, optional
    let con = document.getElementById("appcontent");
    let vbox = document.createElement("vbox");
    vbox.setAttribute("id", "_xxx_");
    vbox.setAttribute("height", "300");
    let iframe = document.createElement("iframe");
    let splitter = document.createElement("splitter");
    splitter.setAttribute("id", "_sss_");
    iframe.setAttribute("src", path);
    iframe.setAttribute("flex", "1");
    con.appendChild(splitter);
    vbox.appendChild(iframe);
    con.appendChild(vbox);
}

function setPath(path){ //path can be of any protocol (chrome, file, http, ...)
    let vbox = document.getElementById("_xxx_");
    let iframe = vbox.querySelector("iframe");
    iframe.setAttribute("src", path);
}

/* usage demo */

//when opening the content in a window, just remove the pane
//removePane();

//create and set content
addPane("file:///E:/")

//change content later if needed
setPath("file:///E:/")