Javascript 用于多显示器和全屏的Firefox Web Extensions API

Firefox Quantum最终于2017年11月14日发布。引述此文：

过去，您可以使用三种不同的系统之一开发Firefox扩展：XUL/XPCOM覆盖、引导扩展或附加SDK。到2017年11月底，WebExtensionsAPI将成为开发Firefox扩展的唯一途径，其他系统将被弃用

使用Firefox57 Quantum和Web Extensions API，我想做一个能够在多个屏幕上运行的扩展。此扩展将用于显示多个屏幕和仪表板

这个想法很简单。如果检测到两个或多个屏幕，则每个Firefox启动后都会在全屏模式下为每个监视器打开一个新窗口。我可以全屏显示，但在另一个显示器上打开并检测连接了多少个显示器时会遇到问题

使用

browser.windows

API创建另一个新选项卡，下面是一些代码片段：

getCurrentWindow().then((currentWindow) => {  
  let mirror1 = browser.windows.create({
    url: "http://172.20.12.211:8080/ivi",    
    state: "fullscreen"
  });

  mirror1.then(() => {
    browser.windows.remove(currentWindow.id);

    var updateInfo = {
      state: "fullscreen"
    };

    let mirror2 = browser.windows.create({
      url: "http://172.20.12.211:8080/ivi",    
      state: "fullscreen"
    }); 

    mirror2.then((nextWindow) => { 
      var updateInfo = {
        left: 1366
      };

      browser.windows.update(nextWindow.id, updateInfo);
    });

  });
});

显然，我上面的解决方案是针对两个监视器硬编码的，并将

left

参数设置为1366 px，因此，如果屏幕分辨率不等于1366x768或连接了两个以上的监视器，此解决方案将无法正常工作

---

因此，是否有API或更好的方法来检测连接了多少监视器，并检查其分辨率？Web扩展API是否具有检测多个监视器和分辨率值的功能？如果没有，可能的解决方法是什么？

没有现成的扩展API来回答您的问题，但是有足够的构建块以另一种方式回答问题

当前窗口相对于显示器的位置可通过以下方式获得：

• window.screenX

  -

• window.screenY

  -

显示窗口的显示器尺寸可通过以下方式检索：

• 屏幕宽度

  -

• 屏幕高度

  -

Firefox甚至能够读取当前显示器相对于所有其他显示器的位置。如果您有两个显示器，而当前屏幕实际上位于另一个屏幕的右侧，则非标准仅Firefox

屏幕。left

属性具有非零值

• sreen.left

  -

• sreen.top

  -

注意：当Firefox中的

privacy.fingerprinting

首选项打开时，上述所有API都返回伪值。您仍然可以通过

chrome.windows.get

扩展API查询窗口大小和位置

如果您创建一个虚拟窗口并在屏幕上移动它，那么您可以使用上面的API来推断有关屏幕的信息，并最终构建可用显示和大小的完整视图。下面是打印上述信息的扩展示例。您可以单击按钮打开窗口，然后手动移动窗口。
这可以通过打开一个非常窄的弹出窗口并使用

chrome.windows.update

来自动执行。如果左/上偏移太大，则窗口将粘在屏幕边缘（例如，如果在1024×x宽的屏幕上，将99999作为左偏移传递给宽度为100的窗口，则左偏移变为924）

manifest.json

{
“名称”：“显示信息”，
“版本”：“1”，
“清单版本”：2，
“背景”：{
“脚本”：[“background.js”]
},
“浏览器操作”：{
“默认标题”：“打开弹出窗口以显示信息”
}
}

background.js

chrome.browserAction.onClicked.addListener（函数（）{
chrome.windows.create({
url:chrome.runtime.getURL（'/display.html'），
});
});

display.html

display.js

setInterval（函数（）{
document.body.textContent=
'\n窗口偏移量：'+window.screenX+'，'+window.screenY+
'\n屏幕大小：'+screen.width+'x'+screen.height+
'\n屏幕偏移量：'+screen.left+'，'+screen.top；
chrome.windows.get（chrome.windows.WINDOW\u ID\u当前，函数（win）{
document.body.insertAdjacentText（'beforeend'，
“\n张力窗口偏移量：“+win.left+”、“+win.top”）；
});
}, 200);

以上API不是特定于扩展的。您还可以运行以下代码段并移动窗口以查看值

setInterval（函数（）{
document.body.textContent=
'\n窗口偏移量：'+window.screenX+'，'+window.screenY+
'\n屏幕大小：'+screen.width+'x'+screen.height+
'\n屏幕偏移量：'+screen.left+'，'+screen.top；
}, 200);

好问题，但据我所知，检测多个监视器是可能的。但是，您可以获得当前监视器的分辨率。尝试在当前屏幕之外生成一个窗口，然后在新窗口中检查

screen.width

所说的内容，这可能是值得的。如果它不在屏幕上，可能会显示0。。如果是这样的话，你也许可以用一个智能算法来解决这个问题。请记住，监视器并不总是挨在一起，它们几乎可以任意放置。@YohanesAI我知道这是一个很长的时间，但你找到了一个有效的解决方案吗？你能分享一下吗？谢谢