title: How to switch (on/off) content script in chrome extension with an extension icon?
body: <p>My chrome extension consists from <code>background.js</code> and <code>content.js</code> which I launch from <code>background.js</code>. I have two icons that show if the extension is on or off and for that I use the following script in <code>background.js</code> based on <a href="https://stackoverflow.com/questions/16136275/how-to-make-on-off-buttons-icons-for-a-chrome-extension">this example</a>: </p>
  
  <pre><code>var toggle = false;
  chrome.browserAction.onClicked.addListener(function(tab) {
  var config = {allPages: []};
  toggle = !toggle;   
  if(toggle){
        chrome.browserAction.setIcon({path: "on.png"});
        chrome.tabs.executeScript(null, {
              code: 'var config = ' + JSON.stringify(config)
        }, function() {
              chrome.tabs.executeScript(null, { file: "jquery.js" }, function() {
                    chrome.tabs.executeScript(null, { file: "content.js" });
              });
        });
        console.log('active ');
  }
  else{
       chrome.browserAction.setIcon({path: "off.png"});
       chrome.tabs.executeScript(null, {code:"console.log('not active')"});
      }
  });
  </code></pre>
  
  <p>The icon toggling works fine, but script executing doesn't. The content script works even if the icon shows that the extension is off. 
  My code in <code>content.js</code>is the following:</p>
  
  <pre><code>$(document).ready(function(){
      var url = document.location.href;
      var pageModel = {
          url: url
      }; 
      config.allPages.push(pageModel);
  
      chrome.storage.local.set({'config': config}, function () {
          console.log('savedPageModelNew: ', config);
      });   
  });
  </code></pre>
  
  <p>How can I toggle not only icons but script executing also? To be frank my script in <code>content.js</code> is rather huge and I can't put it whole here. What I need is the content script that works when the extension is on and "pauses" when the extension is off. Maybe someone has an answer? </p>
  
  <p>I really hope so. Thanks a lot in advance!</p>
  
  <p>P.S. Here is also my manifest.json:</p>
  
  <pre><code>{
    "manifest_version": 2,
  
    "name": "ChromeExt",
    "version": "1.0",
  
    "permissions": [
        "activeTab",
        "tabs",
        "&lt;all_urls&gt;",
        "contextMenus",
        "storage",
        "https://*/*", "http://*/*"
    ],
  
    "browser_action": {
        "default_title": "Inactive.",
        "default_icon": "off.png"
    },
  
    "background": {
        "scripts": ["background.js"]
    },
    "content_scripts": [
        {
          "matches": ["http://*///*//", "https://*/*"],
          "css": ["mainStyles.css"]
        }
    ]
  </code></pre>
  
  <p>}</p>