2

I have an options page for my extension that is made with HTML and javascript tio be activated when options are selected. The extension is a window that hovers over the web page, and it has an "Options" button in it already.

I need to have the options page be opened in a separate tab in the browser when the button is clicked. What I have so far is:

mainPanel.port.on("options", function () {
    currentUser=null;
    mainPanel.hide();
    var url = serverURL+"/options.html";
    tabs.open(url);
});

options.html is stored in the main file for the extension, and serverURL refers to the main server that the extension contacts for information.

stuartd
  • 70,509
  • 14
  • 132
  • 163
c0rv0s
  • 301
  • 1
  • 16
  • 1
    I'm not sure about addon-sdk but this is how i do it from bootstrap: https://github.com/Noitidart/l10n/tree/html-options – Noitidart Apr 16 '15 at 03:56
  • 1
    See if this helps: [Firefox Addon SDK: Ways to display options to user?](http://stackoverflow.com/questions/9195774/firefox-addon-sdk-ways-to-display-options-to-user) – erosman Apr 17 '15 at 19:19
  • There is a html option way for sdk i dont know sdk though but its there. The bootstrap way isnt hard if you want to go that way (the one i linked) – Noitidart Apr 18 '15 at 12:33

1 Answers1

0

In this case you need to use Port.on()/Port.emit() to send a controll option from options.html, like click on setting button.

    options.html

    var panelIsOpen = 0;

    $('#settings').click(function() {
            self.port.emit("statusoptions", {optionsIsOpen:1});
        });

    popup.html

    Panel.port.on("statusoptions", function (panda) {
            if(panda.optionsIsOpen === 1){
                Panel.hide();
                tabs.open({
                    url: "options.html",
                    onReady: function onReady(tab) {
                       Panel.hide();
                    },
                    contentScriptFile: [
                        data.url("js/jquery-2.0.0.min.js"),
                        data.url("js/options.js")],
                });
            }
        });