More themes, somewhat better application system

public/resources/nebulaclock.js

@@ -33,14 +33,11 @@ function displayTime() {
   var mm = String(today.getMonth() + 1).padStart(2, "0"); //January is 0!
   var yyyy = today.getFullYear();
   today = mm + "/" + dd + "/" + yyyy;
-  var time =
+  var time = h + "<span style='opacity:100%;' class='clockColon'>:</span>" + m;
-    h + "<span style='opacity:100%;' class='clockColon'>:</span>" + m;
   try {
-    document.getElementById("digitalClock").innerHTML = getDayName(today, "us-US") + ", " + time + " " + session + ".";
+    document.getElementById("digitalClock").innerHTML =
-  } catch {
+      getDayName(today, "us-US") + ", " + time + " " + session + ".";
-
+  } catch {}
-  }
-
 
   return time;
 }

public/resources/nebulamain.js

@@ -17,7 +17,8 @@ function closeNav() {
 }
 
 function setLoaderText() {
-  document.getElementById('connectorText').textContent = "connecting to service"
+  document.getElementById("connectorText").textContent =
+    "connecting to service";
   const loader = document.getElementById("lpoader");
 
   const loadConstructer = loader.style;
@@ -26,11 +27,13 @@ function setLoaderText() {
   // Changing the text over multiple periods of time creates character, and aliveness (is that even a word?)
   setTimeout(() => {
     document.getElementById("connectorText").style.fontSize = "12px";
-    document.getElementById("connectorText").textContent = "Due to high server load, this may take a while.";
+    document.getElementById("connectorText").textContent =
+      "Due to high server load, this may take a while.";
   }, 3200);
   setTimeout(() => {
     document.getElementById("connectorText").style.fontSize = "14px";
-    document.getElementById("connectorText").textContent = "Hmmm.. Something isn't right..";
+    document.getElementById("connectorText").textContent =
+      "Hmmm.. Something isn't right..";
   }, 17000);
 }
 
@@ -39,25 +42,6 @@ window.stealthEngineLoaded = false;
 window.addEventListener("load", () => {
   // Register the service workers for Osana and Ultraviolet proxy protocols
   // This is a better method than registering onsubmit because this allows the ability to use proxied links on the main page.
-  const dbPromise = Ultraviolet.openDB("keyval-store", 1, {
-    upgrade(db) {
-      db.createObjectStore("keyval");
-    }
-  });
-  self.storage = {
-    async get(key) {
-      return (await dbPromise).get("keyval", key);
-    },
-
-    async set(key, val) {
-      console.log("please wait");
-      return (await dbPromise).put("keyval", val, key);
-    },
-
-    async del(key) {
-      return (await dbPromise).delete("keyval", key);
-    }
-  };
 
   navigator.serviceWorker.register("./sw.js", {
     scope: "/service/"
@@ -84,8 +68,6 @@ window.addEventListener("load", () => {
   hasLoadedElement.style.display = "none";
   document.body.appendChild(hasLoadedElement);
 
-
-
   inpbox.addEventListener("submit", (event) => {
     // Prevents the default event tasks
     event.preventDefault();
@@ -99,7 +81,9 @@ window.addEventListener("load", () => {
     event.preventDefault();
     // Check if the service worker (commonly called SW) is registered
     if (typeof navigator.serviceWorker === "undefined")
-      alert("An error occured registering your service worker. Please contact support - discord.gg/unblocker");
+      alert(
+        "An error occured registering your service worker. Please contact support - discord.gg/unblocker"
+      );
     //
     if (proxy === "uv" || proxy === "osana") {
       // Re-register the service worker incase it failed to onload
@@ -123,7 +107,9 @@ window.addEventListener("load", () => {
             if (window.stealthEngineLoaded !== false) {
               stealthEngine(redirectTo);
             } else {
-              console.error("Stealth Engine failed to load! Please contact support - discord.gg/unblocker")
+              console.error(
+                "Stealth Engine failed to load! Please contact support - discord.gg/unblocker"
+              );
             }
           } else {
             setTimeout(() => {
@@ -209,8 +195,6 @@ document.addEventListener("visibilitychange", handleTabLeave)
         });
     }
   });
-
-
 });
 
 // Set the option
@@ -219,49 +203,27 @@ if (localStorage.getItem("theme") == null) {
   localStorage.setItem("theme", "dark");
 }
 
-window.onload = function () {
-  changeCSS("--background-primary", localStorage.getItem("--background-primary"));
-  changeCSS("--navbar-color", localStorage.getItem("--navbar-color"));
-  changeCSS("--navbar-height", localStorage.getItem("--navbar-height"));
-  changeCSS("--navbar-text-color", localStorage.getItem("--navbar-text-color"));
-  changeCSS("--input-text-color", localStorage.getItem("--input-text-color"));
-  changeCSS("--input-placeholder-color", localStorage.getItem("--input-placeholder-color"));
-  changeCSS("--input-background-color", localStorage.getItem("--input-background-color"));
-  changeCSS("--input-border-color", localStorage.getItem("--input-border-color"));
-  changeCSS("--input-border-size", localStorage.getItem("--input-border-size"));
-  changeCSS("--navbar-link-color", localStorage.getItem("--navbar-link-color"));
-  changeCSS("--navbar-font", localStorage.getItem("--navbar-font"));
-  changeCSS("--navbar-logo-filter", localStorage.getItem("--navbar-logo-filter"));
-  changeCSS("--text-color-primary", localStorage.getItem("--text-color-primary"));
-};
-
-function changeCSS(variable, value, saveBool) {
-  document.documentElement.style.setProperty(variable, value);
-
-  if (saveBool === true) {
-    saveCSS(variable, value);
-  }
-}
-
-function saveCSS(variable, value) {
-  localStorage.setItem(variable, value);
-}
-
 // Extra logging for support
 function log() {
   setTimeout(
     console.log.bind(
-      console, "%cWelcome To Nebula", "background: #3F51B5;color:#FFF;padding:5px;border-radius: 5px;line-height: 26px; font-size:30px;"
+      console,
+      "%cWelcome To Nebula",
+      "background: #3F51B5;color:#FFF;padding:5px;border-radius: 5px;line-height: 26px; font-size:30px;"
     )
   );
   setTimeout(
     console.log.bind(
-      console, "%c If you are seeing this, Nebula's main script has succesfully loaded!", "background: green;color:#FFF;padding:5px;border-radius: 5px;line-height: 26px; font-size:12px;"
+      console,
+      "%c If you are seeing this, Nebula's main script has succesfully loaded!",
+      "background: green;color:#FFF;padding:5px;border-radius: 5px;line-height: 26px; font-size:12px;"
     )
   );
   setTimeout(
     console.log.bind(
-      console, "%cIf you encounter an error, contact our support team on discord. Copy and paste the information below and send it in the ticket", "background: red;color:#FFF;padding:5px;border-radius: 5px;line-height: 26px; font-size:12px;"
+      console,
+      "%cIf you encounter an error, contact our support team on discord. Copy and paste the information below and send it in the ticket",
+      "background: red;color:#FFF;padding:5px;border-radius: 5px;line-height: 26px; font-size:12px;"
     )
   );
   let online = navigator.onLine;
@@ -288,59 +250,6 @@ function log() {
   );
 }
 log();
-function switchTheme() {
-  var selecter = document.getElementById("themeSwitcher");
-  var selectedOption = selecter.value;
-  if (selectedOption == "dark") {
-    changeCSS("--background-primary", "#191724", true);
-    changeCSS("--navbar-color", "#26233a", true);
-    changeCSS("--navbar-height", "60px", true);
-    changeCSS("--navbar-text-color", "#7967dd", true);
-    changeCSS("--input-text-color", "#e0def4", true);
-    changeCSS("--input-placeholder-color", "#6e6a86", true);
-    changeCSS("--input-background-color", "#1f1d2e", true);
-    changeCSS("--input-placeholder-color", "white", true);
-    changeCSS("--input-border-color", "#eb6f92", true);
-    changeCSS("--input-border-size", "1.3px", true);
-    changeCSS("--navbar-link-color", "#e0def4", true);
-    changeCSS("--navbar-font", '"Roboto"', true);
-    changeCSS("--navbar-logo-filter", "invert(0%)", true);
-    changeCSS("--text-color-primary", "#e0def4", true);
-    localStorage.setItem("theme", "dark");
-  }
-  if (selectedOption == "light") {
-    changeCSS("--background-primary", "#d8d8d8", true);
-    changeCSS("--navbar-color", "#a2a2a2", true);
-    changeCSS("--navbar-height", "4em", true);
-    changeCSS("--navbar-text-color", "#000000", true);
-    changeCSS("--input-text-color", "#e0def4", true);
-    changeCSS("--input-placeholder-color", "white", true);
-    changeCSS("--input-background-color", "black", true);
-    changeCSS("--input-border-color", "#eb6f92", true);
-    changeCSS("--input-border-size", "1.3px", true);
-    changeCSS("--navbar-link-color", "#000000", true);
-    changeCSS("--navbar-font", '"Roboto"', true);
-    changeCSS("--navbar-logo-filter", "invert(30%)", true);
-    changeCSS("--text-color-primary", "#303030", true);
-    localStorage.setItem("theme", "light");
-  }
-  if (selectedOption == 'custom') {
-    changeCSS('--background-primary', localStorage.getItem("--background-primary"), true)
-    changeCSS('--navbar-color', localStorage.getItem("--navbar-color"), true)
-    changeCSS('--navbar-height', localStorage.getItem("--navbar-height"), true)
-    changeCSS('--navbar-text-color', localStorage.getItem("--navbar-text-color"), true)
-    changeCSS('--input-text-color', localStorage.getItem("--input-text-color"), true)
-    changeCSS('--input-placeholder-color', localStorage.getItem("--input-placeholder-color"), true)
-    changeCSS('--input-background-color', localStorage.getItem("--input-background-color"), true)
-    changeCSS('--input-border-color', localStorage.getItem("--input-border-color"), true)
-    changeCSS('--input-border-size', localStorage.getItem("--input-border-size"), true)
-    changeCSS('--navbar-link-color', localStorage.getItem("--navbar-link-color"), true)
-    changeCSS('--navbar-font', localStorage.getItem("--navbar-font"), true)
-    changeCSS('--navbar-logo-filter', localStorage.getItem("--navbar-logo-filter"), true)
-    changeCSS('--text-color-primary', localStorage.getItem("--text-color-primary"), true)
-    localStorage.setItem('theme', 'custom')
-  }
-}
 
 // Adjectives and surnames for a more advanced stealth engine.
 // Used together to generate random names for the tab name
@@ -353,12 +262,10 @@ async function surnameAdjectivesData() {
     .then((data) => {
       adjectives = data.adjectives;
       surnames = data.surnames;
-    })
+    });
 }
 surnameAdjectivesData();
 
-
-
 // Random number generator
 // Dependency of getRandomName function
 function getRandomNumber(min, max) {
@@ -376,13 +283,6 @@ function getRandomName() {
   return randomName;
 }
 
-// Check if the Browser variable is undefined
-// This is unused as of now but it could be used for better cloaking in the future, specifically with activeTab
-if (typeof browser === "undefined") {
-  var browser = chrome;
-}
-browser = chrome;
-
 // Clickoff cloaking
 // This is used to cloak the tab when it is not active
 function handleTabLeave() {
@@ -403,7 +303,8 @@ function handleTabLeave() {
         link.rel = "icon";
         document.getElementsByTagName("head")[0].appendChild(link);
       }
-      link.href = "https://camo.githubusercontent.com/b565ae2e136e0ac6023e7099288a62382de7c2b8cdce86a8b90449b86649434c/68747470733a2f2f6e6562756c6170726f78792e6e6562756c612e62696f2f696d616765732f6c6f676f2e706e67";
+      link.href =
+        "https://camo.githubusercontent.com/b565ae2e136e0ac6023e7099288a62382de7c2b8cdce86a8b90449b86649434c/68747470733a2f2f6e6562756c6170726f78792e6e6562756c612e62696f2f696d616765732f6c6f676f2e706e67";
     } else {
       return false;
     }
@@ -412,31 +313,44 @@ function handleTabLeave() {
 // Create and Add the event listener
 document.addEventListener("visibilitychange", handleTabLeave);
 
-const stealthStored = localStorage.getItem('nogg')
+const stealthStored = localStorage.getItem("nogg");
 function link(_link) {
   if (stealthStored == "on") {
-    let inFrame
+    let inFrame;
-    try { inFrame = window !== top } catch (e) { inFrame = true }
+    try {
+      inFrame = window !== top;
+    } catch (e) {
+      inFrame = true;
+    }
     setTimeout(() => {
       if (!inFrame && !navigator.userAgent.includes("Firefox")) {
-        const popup = open("about:blank", "_blank")
+        const popup = open("about:blank", "_blank");
-        if (!popup || popup.closed) { alert("Popups are disabled!") } else {
+        if (!popup || popup.closed) {
-          const doc = popup.document
+          alert("Popups are disabled!");
-          const iframe = doc.createElement("iframe")
+        } else {
-          const style = iframe.style
+          const doc = popup.document;
-          const img = doc.createElement("link")
+          const iframe = doc.createElement("iframe");
-          img.rel = "icon"
+          const style = iframe.style;
-          img.href = "https://ssl.gstatic.com/images/branding/product/1x/drive_2020q4_32dp.png"
+          const img = doc.createElement("link");
-          doc.title = getRandomName()
+          img.rel = "icon";
-          var currentLink = _link.slice(0, _link.length - 1)
+          img.href =
-          iframe.src = location.origin + "/service/go/" + __uv$config.encodeUrl(currentLink)
+            "https://ssl.gstatic.com/images/branding/product/1x/drive_2020q4_32dp.png";
-          style.position = "fixed"
+          doc.title = getRandomName();
-          style.top = style.bottom = style.left = style.right = 0
+          var currentLink = _link.slice(0, _link.length - 1);
-          style.border = style.outline = "none"
+          iframe.src =
-          style.width = style.height = "100%"
+            location.origin +
-          doc.body.appendChild(iframe)
+            "/service/go/" +
+            __uv$config.encodeUrl(currentLink);
+          style.position = "fixed";
+          style.top = style.bottom = style.left = style.right = 0;
+          style.border = style.outline = "none";
+          style.width = style.height = "100%";
+          doc.body.appendChild(iframe);
         }
       }
-    }, 200)
+    }, 200);
-  } else { location.href = "service/go/" + __uv$config.encodeUrl("https://radon.games/") }
+  } else {
+    location.href =
+      "service/go/" + __uv$config.encodeUrl("https://radon.games/");
+  }
 }

public/resources/options.js

@@ -10,164 +10,6 @@ function switchProxy() {
   var storedChoice = localStorage.getItem("proxy");
   console.log(selectedOption);
 }
-function switchTheme() {
-  var selecter = document.getElementById("themeSwitcher");
-  var selectedOption = selecter.value;
-  if (selectedOption == "dark") {
-    changeCSS("--background-primary", "#191724", true);
-    changeCSS("--navbar-color", "#26233a", true);
-    changeCSS("--navbar-height", "60px", true);
-    changeCSS("--navbar-text-color", "#7967dd", true);
-    changeCSS("--input-text-color", "#e0def4", true);
-    changeCSS("--input-placeholder-color", "#6e6a86", true);
-    changeCSS("--input-background-color", "#1f1d2e", true);
-    changeCSS("--input-placeholder-color", "white", true);
-    changeCSS("--input-border-color", "#eb6f92", true);
-    changeCSS("--input-border-size", "1.3px", true);
-    changeCSS("--navbar-link-color", "#e0def4", true);
-    changeCSS("--navbar-font", '"Roboto"', true);
-    changeCSS("--navbar-logo-filter", "invert(0%)", true);
-    changeCSS("--text-color-primary", "#e0def4", true);
-    localStorage.setItem("theme", "dark");
-  }
-  if (selectedOption == "light") {
-    changeCSS("--background-primary", "#d8d8d8", true);
-    changeCSS("--navbar-color", "#a2a2a2", true);
-    changeCSS("--navbar-height", "4em", true);
-    changeCSS("--navbar-text-color", "#000000", true);
-    changeCSS("--input-text-color", "#e0def4", true);
-    changeCSS("--input-placeholder-color", "white", true);
-    changeCSS("--input-background-color", "black", true);
-    changeCSS("--input-border-color", "#eb6f92", true);
-    changeCSS("--input-border-size", "1.3px", true);
-    changeCSS("--navbar-link-color", "#000000", true);
-    changeCSS("--navbar-font", '"Roboto"', true);
-    changeCSS("--navbar-logo-filter", "invert(30%)", true);
-    changeCSS("--text-color-primary", "#303030", true);
-    localStorage.setItem("theme", "light");
-  }
-  if (selectedOption == "custom") {
-    let startCustom = prompt(
-      "Would you like to have an interactive setup? Y/N",
-      ""
-    );
-    if (startCustom == "Y" || startCustom == "y") {
-      alert(
-        "Welcome to the interactive setup. Please enter the following values. If you don't know what to enter, just press enter. They will default to Dark Mode."
-      );
-      let background = prompt(
-        "Background color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #191724",
-        ""
-      );
-      let navbar = prompt(
-        "Navbar color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #26233a",
-        ""
-      );
-      let navbarHeight = prompt(
-        "Navbar height || Possible Types: ABSOLUTE: cm, mm, Q, in, pc, pt, px  RELATIVE: em, ex, ch, rem, lh, rlh, vw, vh, vb, vi || Default Value: 60px",
-        ""
-      );
-      let navbarText = prompt(
-        "Navbar text color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #7967dd",
-        ""
-      );
-      let inputText = prompt(
-        "Input text color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #e0def4",
-        ""
-      );
-      let inputPlaceholder = prompt(
-        "Input placeholder color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #6e6a86",
-        ""
-      );
-      let inputBackground = prompt(
-        "Input background color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #1f1d2e",
-        ""
-      );
-      let inputBorder = prompt(
-        "Input border color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #eb6f92",
-        ""
-      );
-      let inputBorderSize = prompt(
-        "Input border size || Possible Types: ABSOLUTE: cm, mm, Q, in, pc, pt, px  RELATIVE: em, ex, ch, rem, lh, rlh, vw, vh, vb, vi || Default Value: 1.3px",
-        ""
-      );
-      let navbarFont = prompt(
-        'Navbar font || Enter a default font name, custom ones will likely not work. || Default Value: "Roboto"',
-        ""
-      );
-      let navbarLink = prompt(
-        "Navbar link color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #e0def4",
-        ""
-      );
-      let navbarLogoFilter = prompt(
-        "Navbar logo filter || Adjust the NavBar-Logo-Filter. || Default Value: invert(0%)",
-        ""
-      );
-      let textColorPrimary = prompt(
-        "Text color primary || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #e0def4",
-        ""
-      );
-      localStorage.setItem("theme", "custom");
-      changeCSS("--background-primary", background, true);
-      changeCSS("--navbar-color", navbar, true);
-      changeCSS("--navbar-height", navbarHeight, true);
-      changeCSS("--navbar-text-color", navbarText, true);
-      changeCSS("--input-text-color", inputText, true);
-      changeCSS("--input-placeholder-color", inputPlaceholder, true);
-      changeCSS("--input-background-color", inputBackground, true);
-      changeCSS("--input-border-color", inputBorder, true);
-      changeCSS("--input-border-size", inputBorderSize, true);
-      changeCSS("--navbar-link-color", navbarLink, true);
-      changeCSS("--navbar-font", navbarFont, true);
-      changeCSS("--navbar-logo-filter", navbarLogoFilter, true);
-      changeCSS("--text-color-primary", textColorPrimary, true);
-    } else {
-      alert("Non-Interactive Setup Not supported yet.");
-    }
-  }
-}
-
-// onload event
-window.onload = function () {
-  let background = localStorage.getItem("--background-primary");
-  let navbar = localStorage.getItem("--navbar-color");
-  let navbarHeight = localStorage.getItem("--navbar-height");
-  let navbarText = localStorage.getItem("--navbar-text-color");
-  let inputText = localStorage.getItem("--input-text-color");
-  let inputPlaceholder = localStorage.getItem("--input-placeholder-color");
-  let inputBackground = localStorage.getItem("--input-background-color");
-  let inputBorder = localStorage.getItem("--input-border-color");
-  let inputBorderSize = localStorage.getItem("--input-border-size");
-  let navbarFont = localStorage.getItem("--navbar-font");
-  let navbarLink = localStorage.getItem("--navbar-link-color");
-  let navbarLogoFilter = localStorage.getItem("--navbar-logo-filter");
-  let textColorPrimary = localStorage.getItem("--text-color-primary");
-  changeCSS("--background-primary", background);
-  changeCSS("--navbar-color", navbar);
-  changeCSS("--navbar-height", navbarHeight);
-  changeCSS("--navbar-text-color", navbarText);
-  changeCSS("--input-text-color", inputText);
-  changeCSS("--input-placeholder-color", inputPlaceholder);
-  changeCSS("--input-background-color", inputBackground);
-  changeCSS("--input-border-color", inputBorder);
-  changeCSS("--input-border-size", inputBorderSize);
-  changeCSS("--navbar-link-color", navbarLink);
-  changeCSS("--navbar-font", navbarFont);
-  changeCSS("--navbar-logo-filter", navbarLogoFilter);
-  changeCSS("--text-color-primary", textColorPrimary);
-};
-
-function changeCSS(variable, value, saveBool) {
-  document.documentElement.style.setProperty(variable, value);
-
-  if (saveBool === true) {
-    saveCSS(variable, value);
-  }
-}
-
-function saveCSS(variable, value) {
-  localStorage.setItem(variable, value);
-}
 
 function resetViews() {
   changeCSS("--background-primary", "#191724", true);

public/resources/preload.js

@@ -0,0 +1,33 @@
+window.onload = function () {
+  changeCSS(
+    "--background-primary",
+    localStorage.getItem("--background-primary")
+  );
+  changeCSS("--navbar-color", localStorage.getItem("--navbar-color"));
+  changeCSS("--navbar-height", localStorage.getItem("--navbar-height"));
+  changeCSS("--navbar-text-color", localStorage.getItem("--navbar-text-color"));
+  changeCSS("--input-text-color", localStorage.getItem("--input-text-color"));
+  changeCSS(
+    "--input-placeholder-color",
+    localStorage.getItem("--input-placeholder-color")
+  );
+  changeCSS(
+    "--input-background-color",
+    localStorage.getItem("--input-background-color")
+  );
+  changeCSS(
+    "--input-border-color",
+    localStorage.getItem("--input-border-color")
+  );
+  changeCSS("--input-border-size", localStorage.getItem("--input-border-size"));
+  changeCSS("--navbar-link-color", localStorage.getItem("--navbar-link-color"));
+  changeCSS("--navbar-font", localStorage.getItem("--navbar-font"));
+  changeCSS(
+    "--navbar-logo-filter",
+    localStorage.getItem("--navbar-logo-filter")
+  );
+  changeCSS(
+    "--text-color-primary",
+    localStorage.getItem("--text-color-primary")
+  );
+};

public/resources/stealthEngine.js

@@ -20,23 +20,28 @@ function stealthEngine(encodedURL) {
     if (!inFrame && !navigator.userAgent.includes("Firefox")) {
       const popup = open("about:blank", "_blank");
       if (!popup || popup.closed) {
-        alert("StealthEngine was unable to open a popup. (do you have popups disabled?)");
+        alert(
+          "StealthEngine was unable to open a popup. (do you have popups disabled?)"
+        );
       } else {
         const doc = popup.document;
         const iframe = doc.createElement("iframe");
         const style = iframe.style;
         popup.onload = () => {
-          document.getElementById("lpoader").style.display = "none"
+          document.getElementById("lpoader").style.display = "none";
-          document.getElementById('connectorText').textContent = "connecting to service"
+          document.getElementById("connectorText").textContent =
+            "connecting to service";
           setTimeout(() => {
-            document.getElementById('connectorText').textContent = "connecting to service"
+            document.getElementById("connectorText").textContent =
+              "connecting to service";
           }, 17500);
         };
         var isClosed = setInterval(function () {
           if (popup.closed) {
             clearInterval(isClosed);
-            document.getElementById("lpoader").style.display = "none"
+            document.getElementById("lpoader").style.display = "none";
-            document.getElementById('connectorText').textContent = "connecting to service"
+            document.getElementById("connectorText").textContent =
+              "connecting to service";
           }
         }, 1000);
         // Favicon attachment
@@ -48,14 +53,15 @@ function stealthEngine(encodedURL) {
         doc.head.appendChild(arcSrc);
         const link = location.href;
         img.rel = "icon";
-        img.href = ABFavicon || "https://ssl.gstatic.com/images/branding/product/1x/drive_2020q4_32dp.png";
+        img.href =
+          ABFavicon ||
+          "https://ssl.gstatic.com/images/branding/product/1x/drive_2020q4_32dp.png";
         if (localStorage.nogg == "on") {
           doc.title = ABTitle || getRandomName();
         } else {
           doc.title = ABTitle || "Nebula";
         }
 
-
         var currentLink = link.slice(0, link.length - 1);
 
         iframe.src = currentLink + encodedURL;

public/resources/theme.js

@@ -0,0 +1,189 @@
+const THEME_OPTIONS = {
+  dark: {
+    "--background-primary": "#191724",
+    "--navbar-color": "#26233a",
+    "--navbar-height": "60px",
+    "--navbar-text-color": "#7967dd",
+    "--input-text-color": "#e0def4",
+    "--input-placeholder-color": "#6e6a86",
+    "--input-background-color": "#1f1d2e",
+    "--input-placeholder-color": "white",
+    "--input-border-color": "#eb6f92",
+    "--input-border-size": "1.3px",
+    "--navbar-link-color": "#e0def4",
+    "--navbar-font": '"Roboto"',
+    "--navbar-logo-filter": "invert(0%)",
+    "--text-color-primary": "#e0def4"
+  },
+  light: {
+    "--background-primary": "#d8d8d8",
+    "--navbar-color": "#a2a2a2",
+    "--navbar-height": "4em",
+    "--navbar-text-color": "#000000",
+    "--input-text-color": "#e0def4",
+    "--input-placeholder-color": "white",
+    "--input-background-color": "black",
+    "--input-border-color": "#eb6f92",
+    "--input-border-size": "1.3px",
+    "--navbar-link-color": "#000000",
+    "--navbar-font": '"Roboto"',
+    "--navbar-logo-filter": "invert(30%)",
+    "--text-color-primary": "#303030"
+  },
+  suit: {
+    "--background-primary": "#0c0c0c",
+    "--navbar-color": "#ff2e4e",
+    "--navbar-height": "4em",
+    "--navbar-text-color": "#000000",
+    "--input-text-color": "#e0def4",
+    "--input-placeholder-color": "white",
+    "--input-background-color": "#00000000",
+    "--input-border-color": "#ff346e",
+    "--input-border-size": "1.3px",
+    "--navbar-link-color": "#000000",
+    "--navbar-font": '"Roboto"',
+    "--navbar-logo-filter": "brightness(30)",
+    "--text-color-primary": "#00000"
+  },
+  metallic: {
+    "--background-primary": "#171717",
+    "--navbar-color": "#004953",
+    "--navbar-height": "4em",
+    "--navbar-text-color": "#ffffff",
+    "--input-text-color": "#e0def4",
+    "--input-placeholder-color": "white",
+    "--input-background-color": "#004953",
+    "--input-border-color": "#000000",
+    "--input-border-size": "1.3px",
+    "--navbar-link-color": "#e0def4",
+    "--navbar-font": '"Roboto"',
+    "--navbar-logo-filter": "invert(50%)",
+    "--text-color-primary": "#e0def4"
+  },
+  dante: {
+    "--background-primary": "#131313",
+    "--navbar-color": "#e4ff8b",
+    "--navbar-height": "3.5em",
+    "--navbar-text-color": "#000000",
+    "--input-text-color": "#000000",
+    "--input-placeholder-color": "000000",
+    "--input-background-color": "#e4ff8b",
+    "--input-border-color": "#00000000",
+    "--input-border-size": "1.3px",
+    "--navbar-link-color": "#000000",
+    "--navbar-font": '"Roboto"',
+    "--navbar-logo-filter": "brightness(0%)",
+    "--text-color-primary": "#000"
+  }
+};
+
+function changeCSS(property, value, isRoot = false) {
+  const root = document.documentElement;
+  isRoot
+    ? root.style.setProperty(property, value)
+    : root.style.setProperty(property, value, "important");
+}
+
+function saveCSS(variable, value) {
+  localStorage.setItem(variable, value);
+}
+function applyTheme(theme) {
+  Object.entries(theme).forEach(([property, value]) => {
+    changeCSS(property, value);
+    localStorage.setItem(property, value);
+  });
+}
+
+function switchTheme() {
+  const selecter = document.getElementById("themeSwitcher");
+  const selectedOption = selecter.value;
+  console.log(selectedOption);
+  const theme = THEME_OPTIONS[selectedOption];
+
+  if (!theme) {
+    return;
+  }
+
+  applyTheme(theme);
+  localStorage.setItem("theme", selectedOption);
+
+  if (selectedOption == "custom") {
+    let startCustom = prompt(
+      "Would you like to have an interactive setup? Y/N",
+      ""
+    );
+    if (startCustom == "Y" || startCustom == "y") {
+      alert(
+        "Welcome to the interactive setup. Please enter the following values. If you don't know what to enter, just press enter. They will default to Dark Mode."
+      );
+      let background = prompt(
+        "Background color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #191724",
+        ""
+      );
+      let navbar = prompt(
+        "Navbar color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #26233a",
+        ""
+      );
+      let navbarHeight = prompt(
+        "Navbar height || Possible Types: ABSOLUTE: cm, mm, Q, in, pc, pt, px  RELATIVE: em, ex, ch, rem, lh, rlh, vw, vh, vb, vi || Default Value: 60px",
+        ""
+      );
+      let navbarText = prompt(
+        "Navbar text color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #7967dd",
+        ""
+      );
+      let inputText = prompt(
+        "Input text color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #e0def4",
+        ""
+      );
+      let inputPlaceholder = prompt(
+        "Input placeholder color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #6e6a86",
+        ""
+      );
+      let inputBackground = prompt(
+        "Input background color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #1f1d2e",
+        ""
+      );
+      let inputBorder = prompt(
+        "Input border color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #eb6f92",
+        ""
+      );
+      let inputBorderSize = prompt(
+        "Input border size || Possible Types: ABSOLUTE: cm, mm, Q, in, pc, pt, px  RELATIVE: em, ex, ch, rem, lh, rlh, vw, vh, vb, vi || Default Value: 1.3px",
+        ""
+      );
+      let navbarFont = prompt(
+        'Navbar font || Enter a default font name, custom ones will likely not work. || Default Value: "Roboto"',
+        ""
+      );
+      let navbarLink = prompt(
+        "Navbar link color || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #e0def4",
+        ""
+      );
+      let navbarLogoFilter = prompt(
+        "Navbar logo filter || Adjust the NavBar-Logo-Filter. || Default Value: invert(0%)",
+        ""
+      );
+      let textColorPrimary = prompt(
+        "Text color primary || Possible Types: Keywords, RGB, RBBA, HSL, HSLA, Hexadecimal. || Default Value: #e0def4",
+        ""
+      );
+      localStorage.setItem("theme", "custom");
+      changeCSS("--background-primary", background, true);
+      changeCSS("--navbar-color", navbar, true);
+      changeCSS("--navbar-height", navbarHeight, true);
+      changeCSS("--navbar-text-color", navbarText, true);
+      changeCSS("--input-text-color", inputText, true);
+      changeCSS("--input-placeholder-color", inputPlaceholder, true);
+      changeCSS("--input-background-color", inputBackground, true);
+      changeCSS("--input-border-color", inputBorder, true);
+      changeCSS("--input-border-size", inputBorderSize, true);
+      changeCSS("--navbar-link-color", navbarLink, true);
+      changeCSS("--navbar-font", navbarFont, true);
+      changeCSS("--navbar-logo-filter", navbarLogoFilter, true);
+      changeCSS("--text-color-primary", textColorPrimary, true);
+    } else {
+      alert("Non-Interactive Setup Not supported yet.");
+    }
+  }
+}

public/resources/v.js

@@ -15,21 +15,23 @@ validateOTP.onclick = () => {
     body: JSON.stringify({
       otp: document.getElementById("otp").value
     })
-  }).then((response) => {
+  })
+    .then((response) => {
       return response.json();
-  }).then((data) => {
+    })
+    .then((data) => {
       if (data.success) {
         setCookie("validation", data.validation, 30);
         location.href = "/";
       } else {
         alert("Invalid OTP.");
       }
-  }).catch(() => {
+    })
-    alert("An error occurred while validating your OTP.")
+    .catch(() => {
+      alert("An error occurred while validating your OTP.");
     });
 };
 
-
 function setCookie(name, value, days) {
   var expires = "";
   if (days) {

src/index.html

@@ -37,17 +37,23 @@
     <meta name="revisit-after" content="10 days" />
     <meta name="author" content="Nebula Services" />
 
-    <!-- Stylesheets -->
+    <!-- Scripts -->
+    <script src="resources/preload.js"></script>
+    <script src="resources/theme.js"></script>
     <script src="resources/nebulamain.js"></script>
     <script src="resources/nebulaclock.js"></script>
     <script src="resources/stealthEngine.js"></script>
-    <link rel="stylesheet" href="style/main.css">
+    <!-- Stylesheet -->
+    <link rel="stylesheet" href="style/main.css" />
     <!-- Embed -->
-    <meta name="theme-color" content="#eb6f92">
+    <meta name="theme-color" content="#eb6f92" />
-    <meta property="og:title" content="Nebula">
+    <meta property="og:title" content="Nebula" />
-    <meta property="og:type" content="website">
+    <meta property="og:type" content="website" />
-    <meta property="og:image" content="https://static.nebulacdn.xyz/content/images/nebula_logo_619x619.png">
+    <meta
-    <meta property="og:description" content="Nebula Web">
+      property="og:image"
+      content="https://static.nebulacdn.xyz/content/images/nebula_logo_619x619.png"
+    />
+    <meta property="og:description" content="Nebula Web" />
   </head>
   <body>
     <!-- Scripts -->
@@ -388,7 +394,8 @@
       <a
         class="tos"
         href="#"
-        onclick='window.href = "/service/go/" + __uv$config.encodeUrl("https://static.nebulacdn.xyz/content/other/nebula-privacy-policy/index.html")'>Privacy</a
+        onclick='window.href = "/service/go/" + __uv$config.encodeUrl("https://static.nebulacdn.xyz/content/other/nebula-privacy-policy/index.html")'
+        >Privacy</a
       >
     </div>
   </body>

src/options.html

@@ -12,8 +12,9 @@
       <!-- Embed -->
 
       <script src="../uv/uv.bundle.js"></script>
-      <script src="../resources/appModules/BareSwitcher.js"></script>
+       <script src="resources/preload.js"></script>
        <script src="../resources/options.js"></script>
+       <script src="resources/theme.js"></script>
       <meta name="theme-color" content="#5a189a">
       <meta property=og:title content=Nebula>
       <meta property="og:type" content="website" />
@@ -120,23 +121,18 @@
                <a onclick="unsavedChanges();">
                   <select class="dropdown" id="themeSwitcher">
                      <option value="dark">Shades</option>
+                      <option value="suit">Suit (new) </option>
+                        <option value="metallic">Metallic (new) </option>
+                          <option value="dante">Dante (new) </option>
                      <option value="light">Blizzard</option>
+                     
                      <option value="custom">Custom (Beta)</option>
                   </select>
                </a>
             </span>
             <a onclick="saveIc();switchTheme();" class="button-save"> Apply </a>
          </div>
-         <!--
+     
-         <div class="settings-cont">
-            <p class="name" style="font-size: 21px;"> AB Random Tab Name </p>
-            <p class="description"> Choose to randomize your Stealth Tab name or not. </p>
-            <a onclick="saveIc();" class="button-save" style="
-               margin-right: 20px;
-               "> Disable </a>
-            <a onclick="saveIc();" class="button-save"> Enable (recommended) </a>
-            </span>
-         </div>-->
          <div class="settings-cont">
             <p class="name" style="font-size: 21px;"> Custom AB Tab Info </p>
             <p class="description"> Choose a custom Title + Favicon for your AB Tab </p>
@@ -154,13 +150,7 @@
             <label disabled for="ssuggestion" style="background: grey;">
             </label>
          </div>
-         <div class="settings-cont">
+       
-            <p class="name" style="font-size: 24px;"> Bare location </p>
-            <p class="description">Choose the location where a bare server is hosted. </p>
-            <input id="bareLocationInput" class="bareLocationInput" type="url">
-          <p id="validIndicator" class="bareValidSignal" > </p>
-            </label>
-         </div>
          <div class="settings-cont">
             <p class="name"> Misc </p>
             <p class="description"></p>
@@ -176,7 +166,7 @@
       </div>
       <div id='sidebar'>
       </div>
-      <p class="stamp"> Version 7.11.4 (Public Release) | Nebula Copyright (c) Nebula Services 2022 </p>
+      <p class="stamp"> Nebula Copyright (c) Nebula Services 2022 </p>
       </div>
       <script> 
 var noggStored = localStorage.getItem("nogg")
@@ -201,9 +191,6 @@ if (cloakStored == "on") {
 themeSelector.value = themeStored
 proxySel.value = proxyStored
 
-getBareLocation().then(bareLocation => {
-document.getElementById("bareLocationInput").value = bareLocation;
-});
 
       </script>
    </body>