How to show a Safari Extension popover programmatically

Question

I'm trying to write a Safari extension that consists of a button on the main toolbar with a popover tied to it, and a contextual menu item. The basic feel is modeled after the feel of the 1Password extension.

One of the jobs of the popover is to allow a person to log in. I'm also conditionally changing the action of the contextual menu item, and if a who person isn't logged in clicks the menu item I would like to show the popover allowing them to log in, but I can't find a way to do this in the developer guides.

How do I "show" a popover?

There is a discussion of this at http://stackoverflow.com/questions/12497414/how-to-open-popover-with-keyboard-shortcut — chulster, Nov 25 '12 at 04:04
@canisbos if you put the "Note" you made at the end of your answer there as an answer here I'll accept it. Or do you think we should vote to close? I feel like the questions are different enough even though the answer is the same. FWIW I did search before I asked and did not come across the other question. — rm-rf, Nov 25 '12 at 14:08

score 6 · Accepted Answer · answered Nov 25 '12 at 21:47

If you only have one toolbar item and one popover (and never plan to add more), then it's just one line. Assuming you've already assigned the popover to the toolbar item in Extension Builder, you can just use:

safari.extension.toolbarItems[0].showPopover();

But if you have more than one popover and (potentially) more than one toolbar item, here's a generalized function to open a popover, specified by its identifier, under the specified toolbar item in the active browser window:

function showPopover(popoverId, toolbarItemId) {
    var toolbarItem = safari.extension.toolbarItems.filter(function (tbi) {
        return tbi.identifier == toolbarItemId && tbi.browserWindow == safari.application.activeBrowserWindow;
    })[0];
    var popover = safari.extension.popovers.filter(function (po) {
        return po.identifier == popoverId;
    })[0];
    toolbarItem.popover = popover;
    toolbarItem.showPopover();  
}

How to show a Safari Extension popover programmatically

1 Answers1