CODEWITHSUNDEEP
javascriptfirefox-addonfirefox-addon-sdkjpm
Nico Schlömer
Nico Schlömer

Reputation: 58791

Disabled Firefox Add-on ActionButton not grayed out

When creating a Firefox Add-on ActionButton disabled, e.g.,

var button = new ActionButton({
  id: 'my-link',
  label: 'My label',
  icon: {
    '16': './icon-16.png',
    '32': './icon-32.png',
    '64': './icon-64.png'
  },
  onClick: handleClick,
  disabled: true
});

the button indeed isn't clickable and doesn't produce any events, but the icon does not appear grayed out as advertised in the documentation.

Any ideas as to why this might be?

Upvotes: 3

Views: 157

Answers (1)

Noitidart
Noitidart

Reputation: 37238

Try this, the id of my button was toggle-button--helloname-my-button1 where helloname is the name of my addon and my-button1 was the id i set. So the dom id was toggle-button--helloname-my-button1 you should update this to be toggle-button--YOUR_ADDON_NAME-my-link:

// globals
Cu.import('resource://gre/modules/Services.jsm');
var sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);

var cssUri;
var svgFilterUrl;
// end globals

if (Services.vc.compare(Services.appinfo.version, 34) < 0) {
    // for less then firefox v34
    if (!svgFilterUrl) {
        Cu.importGlobalProperties(['URL']);
        var oFileBody = '<svg xmlns="http://www.w3.org/2000/svg"><filter id="grayscale"><feColorMatrix type="saturate" values="0"/></filter></svg>';
        var {Blob} = Cu.import("resource://gre/modules/Services.jsm", {});
        var oBlob = Blob([oFileBody], {
            type: "text/xml"
        });
        svgFilterUrl = URL.createObjectURL(oBlob);
        console.log(url)
    }
    var css = '#toggle-button--helloname-my-button1[disabled] { filter: url(' + url + '#grayscale); }';
} else {
    // for less then firefox >= v34
    var css = '#toggle-button--helloname-my-button1[disabled] { filter:grayscale(1) }';
}
var newURIParam = {
    aURL: 'data:text/css,' + encodeURIComponent(css),
    aOriginCharset: null,
    aBaseURI: null
};
var cssUri = Services.io.newURI(newURIParam.aURL, newURIParam.aOriginCharset, newURIParam.aBaseURI);
sss.loadAndRegisterSheet(cssUri, sss.AUTHOR_SHEET);

and when you want to uninstall/disable your addon do sss.unregisterSheet(cssUri, sss.AUTHOR_SHEET);

Upvotes: 1

Related Questions