Modularization working and complete! We can now use common.ts as a mo…

…dule

package.json

@@ -13,6 +13,7 @@
   },
   "homepage": "https://github.com/basshelal/Wudooh",
   "readme": "https://github.com/basshelal/Wudooh/README.md",
+  "type": "module",
   "scripts": {
     "minifyMain": "uglifyjs -c -m --output src/main.min.js -- src/main.js",
     "minifyPopup": "uglifyjs -c -m --output src/popup.min.js -- src/popup.js",

public/custom_fonts.css

@@ -1,6 +1,6 @@
-@import "public/animations.css";
-@import "public/material.css";
-@import "public/fonts.css";
+@import "animations.css";
+@import "material.css";
+@import "fonts.css";
 
 /* The main parts of the HTML, but not the items */
 html, header, body, footer {

public/custom_fonts.html

@@ -90,6 +90,6 @@ <h1>Add New Font</h1>
     </div>
 </div>
 </body>
-<script src="../dist/js/common.js"></script>
-<script src="../dist/js/custom_fonts.js"></script>
+<script src="js/common.js"></script>
+<script src="js/custom_fonts.js"></script>
 </html>

public/manifest.json

@@ -30,17 +30,16 @@
       "all_frames": true,
       "run_at": "document_start",
       "js": [
-        "common.js",
-        "plugins.js",
-        "main.js"
+        "js/main.js"
       ],
       "css": [
         "fonts.css"
       ]
     }
   ],
   "background": {
-    "service_worker": "background.js"
+    "service_worker": "js/background.js",
+    "type": "module"
   },
   "web_accessible_resources": [
     {

public/popup.css

@@ -1,6 +1,6 @@
-@import "public/animations.css";
-@import "public/material.css";
-@import "public/fonts.css";
+@import "animations.css";
+@import "material.css";
+@import "fonts.css";
 
 /* The main parts of the HTML, but not the items */
 header, body, footer {

public/popup.html

@@ -142,7 +142,7 @@
 <div class="centered" style="font-family: 'Noto Nastaliq Urdu', 'Roboto Light', sans-serif">
     <a href="https://github.com/basshelal/Wudooh" target="_blank">By Bassam Helal بسّام هلال</a>
 </div>
-<script src="../dist/js/common.js"></script>
-<script src="../dist/js/popup.js"></script>
+<script src="js/common.js"></script>
+<script src="js/popup.js"></script>
 </body>
 </html>

src/background.ts

@@ -1,10 +1,21 @@
-importScripts("./common.js")
+import {
+    DefaultWudoohStorage,
+    extensions,
+    MessageReasons,
+    runtime,
+    sync,
+    tabs,
+    WudoohKeys,
+    WudoohStorage
+} from "./common"
 /**
  * This is the code that runs on the background page of the extension.
  *
  * Here we only run code that will execute when the extension is installed or updated.
  */
 
+extensions()
+
 /**
  * Runs on install or update to check if the storage has initialized all its values correctly.
  * If some key has not been initialized then it will create it and set it to its default value