updated script to check if on/off, updated browser icon to have off s…

…tate when sidekick is disabled

package.json

@@ -32,8 +32,8 @@
     "eslint-config-airbnb-base": "^13.1.0",
     "eslint-loader": "^2.1.1",
     "eslint-plugin-import": "^2.14.0",
-    "jquery": "^3.3.1",
-    "lodash": "^4.17.11",
+    "jquery": "^3.4.1",
+    "lodash": "^4.17.15",
     "webpack": "^4.28.4",
     "webpack-merge": "^4.2.1"
   },

src/chrome/manifest.json

@@ -3,7 +3,7 @@
     "name": "Contentful Sidekick",
     "short_name": "Contentful Sidekick",
     "description": "Chrome Extension that enables inline editing for websites created in Contentful",
-    "version": "0.0.8",
+    "version": "0.0.9",
     "permissions": [
       "activeTab",
       "cookies",

src/shared/js/background.js

@@ -1,16 +1,51 @@
 /* global chrome */
 // Called when the user clicks on the browser action
 
+const setExtensionIcon = (curEnabled = false) => {
+  if (curEnabled) {
+    chrome.browserAction.setIcon({
+      path: {
+        16: '../img/icon16.png',
+        32: '../img/icon32.png',
+        48: '../img/icon48.png',
+        64: '../img/icon64.png',
+        128: '../img/icon128.png',
+        256: '../img/icon256.png',
+      },
+    });
+  } else {
+    chrome.browserAction.setIcon({
+      path: {
+        16: '../img/icon16Off.png',
+        32: '../img/icon32Off.png',
+        48: '../img/icon48Off.png',
+        64: '../img/icon64Off.png',
+        128: '../img/icon128Off.png',
+        256: '../img/icon256Off.png',
+      },
+    });
+  }
+};
+
 const toggleActive = () => {
   chrome.storage.sync.get({
     sideKickEnabled: false,
   }, (items) => {
     const curEnabled = !items.sideKickEnabled;
     chrome.storage.sync.set({ sideKickEnabled: curEnabled });
+    setExtensionIcon(curEnabled);
   });
 };
 
+chrome.tabs.onUpdated.addListener(() => {
+  chrome.storage.sync.get({
+    sideKickEnabled: false,
+  }, (items) => {
+    setExtensionIcon(items.sideKickEnabled);
+  });
+});
+
 
-chrome.browserAction.onClicked.addListener((tab) => {
+chrome.browserAction.onClicked.addListener(() => {
   toggleActive();
 });

src/shared/js/content.js

@@ -72,10 +72,16 @@ const init = () => {
     .on('mouseenter', () => { $('#csk-overlay').addClass('show'); })
     .on('mouseleave', () => { $('#csk-overlay').removeClass('show'); });
 
-  $('body').attr('data-init-csk', true);
-  if (!$('#csk-overlay').length) {
-    $('body').append($('<div>').attr('id', 'csk-overlay'));
-  }
+  chrome.storage.sync.get({
+    sideKickEnabled: false,
+  }, (items) => {
+    if (items.sideKickEnabled) {
+      $('body').attr('data-init-csk', true);
+      if (!$('#csk-overlay').length) {
+        $('body').append($('<div>').attr('id', 'csk-overlay'));
+      }
+    }
+  });
 };
 
 $(() => {