Enable/disable an Actionbutton on a given page

Asked

Viewed 381 times

1

I am developing an extension for Firefox browsers, soon arose the need to control the action button so that it is inactive until the user enters a particular page.

Exemplifying, I will use as an example the page "/". Well, I would like the button to be active only when the tab is active and this page is open.

Just follow my code:

var data = require("sdk/self").data;

// o painel que será exibido
var panel = require("sdk/panel").Panel({
    contentURL: data.url("painel.html")
});


// as configurações do botão de ação
var actionBtn = require("sdk/ui/button/action").ActionButton({
    id: "ID do botão",
    label: "Descrição do botão",
    icon: {
        "16": "./logo-16.png",
        "36": "./logo-36.png"
    },
    onClick : openPanel
});

// função que exibe o painel quando o botão de ação é clicado.
function openPanel(){
    panel.show();
}

So far I have the normal code, only to open the panel when the user clicks on it. How can I make this control on/off?

  • You can disable a button by setting the disabled property to true

  • yes, I saw this in the documentation. But the question is: how to make it disabled on the other pages that does not matter my extension? I want the button to be active only at a specific URL.

1 answer

1


Check the URL value, tabs.activeTab.url, and if whatever you want, you can disable the button by setting the disabled property to true;

var tabs = require("sdk/tabs");

function onOpen(tab) {
  console.log(tab.url + " is open");
  tab.on("pageshow", logShow);
  tab.on("activate", logActivate);    // Voce pode acessar a aba atual nesta funcao
  tab.on("deactivate", logDeactivate);
  tab.on("close", logClose);
}

function logShow(tab) {
  console.log(tab.url + " is loaded");
}

function logActivate(tab) {
  if(tab.url=="http://www.google.com"){
      actionBtn.disabled = true;
  } else {
      actionBtn.disabled = false;
  }
  console.log(tab.url + " is activated");
}

function logDeactivate(tab) {
  console.log(tab.url + " is deactivated");
}

function logClose(tab) {
  console.log(tab.url + " is closed");
}

tabs.on('open', onOpen);

References:

  1. https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/tabs
  2. https://stackoverflow.com/questions/11582607/find-url-of-current-tab-making-a-firefox-browser-add-on
  • Perfect! I will check as solved, but before... a question: If the user is already on the page I determined the button will not be activated, he will need to change to another tab and return to make button become accessible. Is there any way to do this (activate the button) with the user being with the tab opened in the specific url?

  • The Activate event is the one that will make this happen, when activating the tab, it checks the URL and activates (or does not) the agreement button.

  • Yes, but if I am in a tab opening that defined page, when the load is finished the button will not be active....

  • 1

    If active does not work in this case, and other events do not detect this, maybe you could additionally add a timer with a 300ms range that checks the url of the current tab.

  • I’ll try this, thank you.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.