WIP update to V3

Agathebadia · Mar 21, 2022 · 4213a9e · 4213a9e
1 parent 05092b1
commit 4213a9e
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 50 deletions.
diff --git a/background.js b/background.js
@@ -1,47 +1,4 @@
-//Listeners for colorblind filter buttons
-//Injects a javascript file on click event, the js file applies a filter to simulate colorblindness
-
-// stores the currently selected filter so that when the user stops hovering
-// over options, the currently selected filter will still be applied to the popup
-window.selectedFilter = null;
-
-/**
- * get the selected filter on popup open
- */
-window.onload = function() {
-  if (!chrome || !chrome.storage || !chrome.storage.local) return;
-  chrome.storage.local.get(["key"], function(result) {
-    try {
-      document.getElementById(result.key).click();
-    } catch (e) {
-      console.log(e);
-    }
-  });
-};
-
-/**
- * Sets the selected filter in storage
- * @param {String} value the selected input
- */
-function setSelected(value) {
-  try {
-    chrome.storage.local.set({ key: value }, function() {
-      document.getElementById(value).checked = true;
-    });
-  } catch {}
-}
-
-function injectFilter(fileName) {
-  chrome.tabs.executeScript({ file: fileName });
-}
-
-document.querySelectorAll(['[id^="radio"]']).forEach(radioButton => {
-  const filter = radioButton.parentElement.id.replace("option-", "");
-  radioButton.addEventListener("click", function() {
-    // page-specific filters
-    setSelected(radioButton.id);
-    injectFilter(`filters/${filter}.js`);
-    // popup-specific filters
-    applyFilter((window.selectedFilter = filter));
-  });
+chrome.scripting.executeScript({
+    target: {tabId: chrome.window.getCurrent, allFrames: true},
+    files: ['colorblindListener.js'],
 });
diff --git a/manifest.json b/manifest.json
@@ -2,19 +2,28 @@
   "name": "Colorblindness Emulator",
   "description": "Emulate 8 types of colorblindness on your browser!",
   "version": "1.0",
-  "manifest_version": 2,
+  "manifest_version": 3,
   "background": {
     "service_worker": "background.js"
   },
   "permissions": [
     "storage",
     "activeTab",
-    "tabs"
+    "tabs",
+    "scripting"
   ],
-  "browser_action": {
+  "action": {
     "default_title": "Colorblindness emulator",
     "default_popup": "popup.html"
   },
+  "content_scripts":[
+        {
+            "matches": [
+                "<all_urls>"
+            ],
+            "js": ["background.js"]
+        }
+    ],
   "icons": {
     "16": "public/assets/icon-sm.png",
     "48": "public/assets/icon-md.png",

diff --git a/styles.css b/styles.css
@@ -21,7 +21,7 @@ form {
 }
 
 .headline {
-  padding: 15px 10px 0 10px;
+  padding: 15px 10px 15px 10px;
   margin-bottom: 5px;
   font-family: 'Roboto';
   display: flex;