CODEWITHSUNDEEP
javascripthtmlmacossafarisafari-extension
Prognastat
Prognastat

Reputation: 87

Creating a Popover in extension bar for safari

I am creating a Safari Extension Bar and was wanting to have multiple Links in it and by clicking on the link have a popover specific to that link appear.

So far I have found these: https://developer.apple.com/library/archive/documentation/Tools/Conceptual/SafariExtensionGuide/AddingPopovers/AddingPopovers.html https://developer.apple.com/documentation/safariextensions/safariextension/1635377-popovers

However everything seems to be referring to using them with toolbar items, not extension bars.

I was wondering if it is even possible to make popovers work with links in an extension bar and if so if someone could point me in the right direction with this.

Upvotes: 0

Views: 901

Answers (1)

chulster
chulster

Reputation: 2829

Sure, why not? Here's some sample code to get you started.

Say your extension bar has a couple of links like this:

<a href="javascript:openPopover('p0');">Open Popover 0</a>
<a href="javascript:openPopover('p1');">Open Popover 1</a>

(Not the most elegant way to run some JavaScript when you click a link, but whatever.)

Furthermore, say you have a single toolbarItem (toolbar button) and you want a different popover to pop up under it depending on which link on the bar you click. The openPopover function can be as simple as this:

function openPopover(pid) {
    var tbItem = safari.extension.toolbarItems[0];
    var thisPop = safari.extension.popovers.filter(function (p) {
        return p.identifier == pid;
    })[0];
    tbItem.popover = thisPop;
    tbItem.showPopover();
}

Since the extension bar has access to the global safari object of your extension, it can directly manipulate toolbarItems and open popovers, without having to pass messages to the global page. Indeed, your extension may not need a global page at all.

Upvotes: 0

Related Questions