firexfox extension toggle on off on icon click

I develop my first firefox extension. My usecase (already sucessfully implemented as a chrome extension):

Inject CSS of a specific page
Default load: contentscript-on.js
On Click icon (icon-on.png / icon-off.png) switch from contentscript-on.js to contentscript-off.js and backward

The contentscript-on.js already works on page load. I´ve searched a lot to find help or an example for my usecase. Any ideas?

Thank you very much!

main.js

var pageMod = require("sdk/page-mod");
var self = require("sdk/self");

pageMod.PageMod({
  include: "https://app.example.de/dashboard",
  contentScriptFile: [self.data.url("jquery-1.11.0.min.js"), self.data.url("contentscript-on.js")]
});

In my chrome extension, I use a background.js to toggle on / off and switch between the scripts

//toggle = true, because the contenscript-on.js is already loaded on initial loading of the page
var toggle = true;
chrome.browserAction.onClicked.addListener(function(tab) {
toggle = !toggle;
   if(toggle){
//change the icon after pushed the icon to On
    chrome.browserAction.setIcon({path: "icon-on.png", tabId:tab.id});
    //start the content script to hide dashboard
    chrome.tabs.executeScript({file:"contentscript-on.js"});
   }
   else{
//change the icon after pushed the icon to Off
    chrome.browserAction.setIcon({path: "icon-off.png", tabId:tab.id});
    //start the content script to hide dashboard
    chrome.tabs.executeScript({file:"contentscript-off.js"});
    }
});

Is there a similar way to this in firefox extensions?

Solution

The PageMod constructor has an optional onAttach property which passes a content worker to your function. This worker can be destroyed to remove the scripts from the page

var contentWorker; // Global (or greater scope) variable
// …
  onAttach: function(worker) {
    contentWorker = worker;
  }

Then, in your click listener

var tab = contentWorker.tab;
contentWorker.destroy();
contentWorker = tab.attach( {
  contentScriptFile: [self.data.url("jquery-1.11.0.min.js"), self.data.url("contentscript-off.js")]
});

Frankly, it would probably be easier just to attach both and toggle them somehow from within the content script code

As a side note, there's a new toggle button that you can can use that will have an activated/deactivated look that sounds like it would be good for your scenario.