Search code examples
firefoxfirefox-addontoolbarfirefox-addon-sdk

Firefox: How can I add/modify toolbars using the Add-on SDK (Jetpack)


So I've looked over the documentation for the Add-on SDK several times now and no where can I see how to create toolbars or modify existing ones. They have a tutorial on creating add-on bar icons but thats not what I want. Does the Add-on SDK support this yet? If it does, can someone link me to an example/tutorial.


Solution

  • This works for me:

    var data = require("self").data;
    var {Cc, Ci} = require("chrome");
    var mediator = Cc['@mozilla.org/appshell/window-mediator;1'].getService(Ci.nsIWindowMediator);
    
    exports.main = function(options, callbacks) {
        addToolbarButton();
        // other stuff
    };
    
    function addToolbarButton() {
        var document = mediator.getMostRecentWindow("navigator:browser").document;      
        var navBar = document.getElementById("nav-bar");
        if (!navBar) {
            return;
        }
        var btn = document.createElement("toolbarbutton");  
    
        btn.setAttribute('type', 'button');
        btn.setAttribute('class', 'toolbarbutton-1');
        btn.setAttribute('image', data.url('img/icon16.png')); // path is relative to data folder
        btn.setAttribute('orient', 'horizontal');
        btn.setAttribute('label', 'My App');
        btn.addEventListener('click', function() {
            // use tabs.activeTab.attach() to execute scripts in the context of the browser tab
            console.log('clicked');
        }, false)
        navBar.appendChild(btn);
    }