CODEWITHSUNDEEP
firefoxfirefox-addontoolbar
Tibor Szasz
Tibor Szasz

Reputation: 3227

Toolbar icon for Firefox extension

I have an old FF extension that I want to update. The problem is that the extension toolbar is no longer placed beside the address bar. I've searched a lot, and scripting seems to be the only way to do it, but I didn't find a way to make it work.

For example I have no idea how to get a reference to the nav bar.

I tried this, but no luck:

    var navBar = document.getElementById('nav-bar');
    if (!navBar) {
        return;
    }
    var btn = document.createElement('toolbarbutton');  
    btn.setAttribute('id', 'mybutton-id');
    btn.setAttribute('type', 'button');
    btn.setAttribute('class', 'toolbarbutton-1');
    btn.setAttribute('image', data.url('bulb.png'));
    btn.setAttribute('orient', 'horizontal');
    btn.setAttribute('label', 'My Button');
    navBar.appendChild(btn);

Upvotes: 1

Views: 310

Answers (1)

Filipe Silva
Filipe Silva

Reputation: 21657

You can most certanly add an icon to nav-bar. Here's the code i use:

function installButton(toolbarId, id, afterId) {
    if (!document.getElementById(id)) {
        var toolbar = document.getElementById(toolbarId);

        if (toolbar) {
            // If no afterId is given, then append the item to the toolbar
            var before = null;
            if (afterId) {
                var elem = document.getElementById(afterId);
                if (elem && elem.parentNode == toolbar)
                    before = elem.nextElementSibling;
            }


            toolbar.insertItem(id, before);
            toolbar.setAttribute("currentset", toolbar.currentSet);
            document.persist(toolbar.id, "currentset");

            if (toolbarId == "addon-bar")
                toolbar.collapsed = false;
        }

    }
}

You can call this with:

installButton("nav-bar","YOURBUTTONID");

Remember you have to have "YOURBUTTONID" inside your BrowserToolbarPalette

<toolbarpalette id="BrowserToolbarPalette">
    <toolbarbutton id="YOURBUTTONID"
                   image='...'
                   class="..."
                   oncommand="..."
                   tooltiptext="">

    </toolbarbutton>
</toolbarpalette>

Reference : Toolbar - Code snippets

Upvotes: 2

Related Questions