单击上下文菜单后,在safari扩展中创建一个Popover

时间:2013-10-15 10:59:22

标签: popover safari-extension

你好最好的同事,

目前我正在创建一个safari书签并运行到以下问题。我创建了一个上下文菜单项,并希望表现如下:

如果用户右键单击页面中的链接并单击此上下文项,则应获取此链接的href属性并在iframe中打开一个弹出窗口。

我该如何解决这个问题?

现在我已经获得了href属性但是如何打开一个popover?

我的结尾:default.js

document.addEventListener("contextmenu", handleContextMenu, false);

function handleContextMenu(event){  
    if(event.target.nodeName === "A"){
        var url = event.target.href;
        safari.self.tab.setContextMenuEventUserInfo(event, url);
    }
}

我的global.html

safari.application.addEventListener("command", performCommand, false);

function performCommand(event) {
if (event.command !== "DoAddSymbaloo")
        return;

        var u = event.userInfo;

}

我该如何解决这个问题? Tnx提前。

1 个答案:

答案 0 :(得分:3)

您将无法将弹出窗口的URL设置为Web URL(它必须是safari-extension URL),但您可以使用仅包含iframe的弹出框,并告诉popover在iframe中加载URL。

最简单的方法是在popover本身中设置一个“命令”事件的监听器(您可以使用Extension Builder或扩展API创建;如果需要复习,请阅读the docs

safari.application.addEventListener("command", function (evt) {
    if (evt.command == 'DoAddSymbaloo') {
        document.querySelector('iframe').src = evt.userInfo;
        // now let's show the popover
    }
}, false);

现在你必须显示popover。为了使popover变得可见,它需要附加到工具栏项。我将假设您已使用Extension Builder或API完成此操作。以编程方式显示弹出窗口的方法是在其工具栏项上使用showPopover方法。首先,您必须找到已附加弹出窗口的工具栏项。从popover的脚本:

var myToolbarItem = safari.extension.toolbarItems.filter(function (ti) {
    return ti.popover == safari.self;
})[0];

这只是说,“找到其弹出框与我相同的工具栏项,并将该工具栏项指定给变量myToolbarItem。”

如果您愿意,并且弹出框只会附加到一个工具栏项,而不是将找到的工具栏项指定给myToolbarItem,您可以将其设置为弹出框对象的属性,该弹出对象来自弹出窗口观点是safari.self

safari.self.toolbarItem = safari.extension.toolbarItems.filter(function (ti) {
    return ti.popover == safari.self;
})[0];

这将提供一种方便的方法,可以从脚本中的任何位置或从全局页面获取与弹出框关联的工具栏项。

现在,结合这些东西:

safari.self.toolbarItem = safari.extension.toolbarItems.filter(function (ti) {
    return ti.popover == safari.self;
})[0];

safari.application.addEventListener("command", function (evt) {
    if (evt.command == 'DoAddSymbaloo') {
        document.querySelector('iframe').src = evt.userInfo;
        safari.self.toolbarItem.showPopover();
    }
}, false);

(为简化最终剧本而编辑。)