completely revamp settings and have them sync. Also update icons

Author: baseballlover723

Merged/enhance.js

@@ -1,9 +1,9 @@
-async function main() {
-  // Use browser.* if available, otherwise fall back to chrome.*
-  if (typeof browser === 'undefined') {
-    var browser = chrome;
-  }
+// Use browser.* if available, otherwise fall back to chrome.*
+if (typeof browser === 'undefined') {
+  var browser = chrome;
+}
 
+async function main() {
   const subPrefixes = {
     anime: '#',
     manga: '//#',
@@ -39,30 +39,12 @@ async function main() {
     // console.log(`Error: ${error}`);
   }
 
-  function onGot(result) {
-    if (result.opcommentfaces !== undefined) {
-      cf = result.opcommentfaces;
-    } else {
-      cf = true;
-    }
-
-    if (result.opanisearch !== undefined) {
-      as = result.opanisearch;
-    } else {
-      as = true;
-    }
-
-    if (result.opspoiler !== undefined) {
-      sp = result.opspoiler;
-    } else {
-      sp = false;
-    }
-
-    if (result.nuspoiler !== undefined) {
-      nsp = result.nuspoiler;
-    } else {
-      nsp = false;
-    }
+  function onGot(options) {
+    options = options.options;
+    const cf = options?.legacy?.enabled && options?.legacy?.subOptions?.commentFaces?.enabled;
+    const as = options?.legacy?.enabled && options?.legacy?.subOptions?.aniSearch?.enabled;
+    const sp = options?.legacy?.enabled && options?.legacy?.subOptions?.spoiler?.enabled;
+    const nsp = options?.legacy?.enabled && options?.legacy?.subOptions?.nuSpoiler?.enabled;
 
     if (nsp) {
       nuSpoilers();
@@ -73,7 +55,7 @@ async function main() {
 
 // Get Option Data from Storage
 
-  const getting = browser.storage.local.get(['opcommentfaces', 'opanisearch', 'opspoiler', 'nuspoiler']);
+  var getting = browser.storage.sync.get("options");
   getting.then(onGot, onError);
 
 // Create Menu
@@ -773,13 +755,13 @@ async function main() {
   */
 
   function nuSpoilers(nsp) {
-    const nuspoiler = document.getElementsByClassName('md-spoiler-text');
+    const nuSpoiler = document.getElementsByClassName('md-spoiler-text');
 
-    for (let i = 0; i < nuspoiler.length; i++) {
-      nuspoiler[i].addEventListener('mouseover', function () {
+    for (let i = 0; i < nuSpoiler.length; i++) {
+      nuSpoiler[i].addEventListener('mouseover', function () {
         this.classList.add('revealed');
       });
-      nuspoiler[i].addEventListener('mouseout', function () {
+      nuSpoiler[i].addEventListener('mouseout', function () {
         this.classList.remove('revealed');
       });
     }

Merged/icons/LICENSE

@@ -1,8 +1,8 @@
 {
   "description": "Add functionalities to r/anime",
   "manifest_version": 3,
-  "name": "r/anime Enhanced",
-  "version": "3.1.0",
+  "name": "r/anime Enhanced 2.0",
+  "version": "3.2.0",
   "permissions": [
     "storage"
   ],
@@ -11,7 +11,22 @@
   ],
   "homepage_url": "https://github.com/r-anime/ranime-Extension",
   "icons": {
-    "48": "icons/border-48.png"
+    "16": "icons/Snoo_square_icon_16.png",
+    "32": "icons/Snoo_square_icon_32.png",
+    "48": "icons/Snoo_square_icon_48.png",
+    "64": "icons/Snoo_square_icon_64.png",
+    "128": "icons/Snoo_square_icon_128.png"
+  },
+  "action": {
+    "default_icon": {
+      "16": "icons/Snoo_square_icon_16.png",
+      "32": "icons/Snoo_square_icon_32.png",
+      "48": "icons/Snoo_square_icon_48.png",
+      "64": "icons/Snoo_square_icon_64.png",
+      "128": "icons/Snoo_square_icon_128.png"
+    },
+    "default_title": "r/anime Enhanced 2.0",
+    "default_popup": "options.html"
   },
   "content_scripts": [
     {
@@ -26,12 +41,14 @@
       ],
       "type": "module",
       "css": [
-        "enhance.css"
+        "enhance.css",
+        "options.css"
       ]
     }
   ],
   "options_ui": {
-    "page": "options.html"
+    "page": "options.html",
+    "open_in_tab": true
   },
   "browser_specific_settings": {
     "gecko": {

Merged/icons/Snoo_square_icon_128.png

@@ -0,0 +1,36 @@
+.ranimeenhanced-options {
+    --indent: 10px;
+    /*width: 700px;*/
+    display: inline-block;
+
+    .option-group {
+        & > .option input {
+            margin-right: var(--indent);
+        }
+
+        .sub-options {
+            margin-left: var(--indent);
+            margin-bottom: 20px;
+        }
+    }
+
+    .option {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        gap: 5px;
+
+        &.disabled {
+            opacity: 0.6;
+            cursor: not-allowed;
+            color: red;
+        }
+        &.disabled * {
+            cursor: inherit;
+        }
+
+        label {
+            white-space: nowrap;
+        }
+    }
+}