add storage extension

popup.html

@@ -1,5 +1,7 @@
 <link rel="stylesheet" href="styles/bootstrap.css" />
-<div class="container" style="width: 500px">
+
+<!-- TODO: get info -->
+<!-- <div class="container" style="width: 500px">
   <table class="table table-hover">
     <thead>
       <tr>
@@ -12,7 +14,7 @@
       </tr>
     </thead>
   </table>
+</div> -->
+<div class="container">
+  <h1 class="text-primary">Extension: set proxy by socket!</h1>
 </div>
-<script>
-  console.log(chrome)
-</script>

scripts/background.js

@@ -6,31 +6,117 @@ const credential = {
   password: "",
 };
 
+const colors = {
+  Green: [0, 128, 0, 255],
+  Red: [255, 0, 0, 255],
+  Orange: [255, 165, 0, 255],
+};
+
+function setProxy(proxy) {
+  const requestProxy = {
+    type: proxy.type,
+    host: proxy.host,
+    port: proxy.port,
+    proxyDNS: ["socks", "socks4"].includes(proxy.type),
+  };
+
+  // delete sendAuth old
+  if (typeof sendAuth === "function") {
+    browser.webRequest.onAuthRequired.removeListener(sendAuth);
+  }
+
+  if (requestProxy.username) {
+    requestProxy.username = credential.username = proxy.username;
+    requestProxy.password = credential.password = proxy.password;
+    sendAuth = async () => {
+      return {
+        authCredentials: credential,
+      };
+    };
+    browser.webRequest.onAuthRequired.addListener(
+      sendAuth,
+      {urls: ["<all_urls>"]},
+      ["blocking"]
+    );
+  }
+
+  // final handle
+  browser.proxy.onRequest.addListener(
+    (requestInfo) => {
+      return requestProxy;
+    },
+    {urls: ["<all_urls>"]}
+  );
+}
+
+function setStorage(proxy) {
+  chrome.storage.sync.set({proxy: proxy}, function () {
+    console.log("Settings saved");
+  });
+}
+
+async function getStorage() {
+  const promise = new Promise((res, rej) => {
+    chrome.storage.sync.get(["proxy"], function (values) {
+      res(values);
+    });
+  });
+  return promise;
+}
+
+function switchBadge(first, second) {
+  chrome.browserAction.getBadgeText({}, function (color) {
+    if (color === first) {
+      browser.browserAction.setBadgeText({text: second});
+    } else {
+      browser.browserAction.setBadgeText({text: first});
+    }
+  });
+}
+
+function intervalSetProxy(interval = 10000) {
+  if (!interval) {
+    interval = 10000;
+  }
+
+  if (typeof _intervalSetProxy === "number") {
+    clearInterval(_intervalSetProxy);
+  }
+
+  var _intervalSetProxy = setInterval(() => {
+    getStorage().then((values) => {
+      if (values?.proxy) {
+        console.count(values?.proxy.password);
+        switchBadge('P1', 'P2');
+        setProxy(values?.proxy);
+      } else {
+        clearInterval(_intervalSetProxy);
+      }
+    });
+  }, interval);
+}
+
 document.addEventListener("DOMContentLoaded", function () {
+  browser.browserAction.setBadgeTextColor({color: "#fff"});
+
   const socket = io("https://seotool.nswteam.net");
   socket.on("connect", function () {
     browser.browserAction.setBadgeText({text: "IO"});
-    browser.browserAction.setBadgeTextColor({color: "#fff"});
+    browser.browserAction.setBadgeBackgroundColor({color: colors.Green});
-    browser.browserAction.setBadgeBackgroundColor({color: "green"});
+    intervalSetProxy();
     console.log("socket.io connected");
   });
 
   socket.on("disconnect", function () {
     browser.browserAction.setBadgeText({text: "IO"});
-    browser.browserAction.setBadgeTextColor({color: "#fff"});
+    browser.browserAction.setBadgeBackgroundColor({color: colors.Red});
-    browser.browserAction.setBadgeBackgroundColor({color: "red"});
+
     console.log("socket.io disconnected");
   });
 
   socket.emit("join", {join: "set_proxy"});
+  // TODO get message set proxy
   socket.on("message", function (message) {
-    console.log({message});
-    chrome.runtime.sendMessage({
-      to: "content",
-      data: {
-        socket_message: message,
-      },
-    });
     /**
      * {
      *    browser_name: ...
@@ -42,40 +128,8 @@ document.addEventListener("DOMContentLoaded", function () {
      *    proxyDNS: ['socks', 'socks4'].includes(message.type)
      * }
      */
-    const proxyDNS = ["socks", "socks4"].includes(message.type);
+    console.log({message});
-    const proxy = {
+    setStorage(message);
-      type: message.type,
+    intervalSetProxy();
-      host: message.host,
-      port: message.port,
-      proxyDNS: proxyDNS,
-    };
-
-    // delete sendAuth old
-    if (typeof sendAuth === "function") {
-      browser.webRequest.onAuthRequired.removeListener(sendAuth);
-    }
-
-    if (message.username) {
-      proxy.username = credential.username = message.username;
-      proxy.password = credential.password = message.password;
-      sendAuth = async () => {
-        return {
-          authCredentials: credential,
-        };
-      };
-      browser.webRequest.onAuthRequired.addListener(
-        sendAuth,
-        {urls: ["<all_urls>"]},
-        ["blocking"]
-      );
-    }
-
-    // final handle
-    browser.proxy.onRequest.addListener(
-      (requestInfo) => {
-        return proxy;
-      },
-      {urls: ["<all_urls>"]}
-    );
   });
 }); // end ready