3 files changed, 103 insertions, 0 deletions
diff --git a/store/works/ProxyChanger/popup/popup.css b/store/works/ProxyChanger/popup/popup.css
new file mode 100644
index 0000000..97601c2
--- /dev/null
+++ b/store/works/ProxyChanger/popup/popup.css
@@ -0,0 +1,28 @@
+html,
+body {
+  width: 200px;
+}
+
+body {
+  margin: 0;
+}
+
+.button {
+  margin: 0;
+  padding: 4px 20px;
+  text-align: center;
+  font-size: 1.5em;
+  cursor: pointer;
+}
+
+.button:hover {
+  background: #97c4ff;
+}
+
+.selected {
+  background: #4294ff;
+}
+
+.selected:hover {
+  background: #4294ff;
+}
diff --git a/store/works/ProxyChanger/popup/popup.html b/store/works/ProxyChanger/popup/popup.html
new file mode 100644
index 0000000..16e4bd0
--- /dev/null
+++ b/store/works/ProxyChanger/popup/popup.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <link rel="stylesheet" href="popup.css" />
+  </head>
+
+  <body>
+    <div id="direct_button" class="button">Direct</div>
+    <div id="system_button" class="button">System</div>
+    <div id="proxy_button" class="button">Proxy</div>
+    <hr />
+    <div id="settings_button" class="button">Settings</div>
+    <script src="popup.js"></script>
+  </body>
+</html>
diff --git a/store/works/ProxyChanger/popup/popup.js b/store/works/ProxyChanger/popup/popup.js
new file mode 100644
index 0000000..0615035
--- /dev/null
+++ b/store/works/ProxyChanger/popup/popup.js
@@ -0,0 +1,58 @@
+const buttons = {
+  direct: document.getElementById("direct_button"),
+  system: document.getElementById("system_button"),
+  proxy: document.getElementById("proxy_button"),
+};
+
+function setSelectedButton(button) {
+  for (const key in buttons) {
+    buttons[key].classList.remove("selected");
+  }
+  buttons[button].classList.add("selected");
+}
+
+browser.proxy.settings.get({}).then(({ value }) => {
+  console.log("current proxy settings: ", value);
+  if (value.proxyType === "none") {
+    setSelectedButton("direct");
+  } else if (value.proxyType === "system") {
+    setSelectedButton("system");
+  } else if (value.proxyType === "manual") {
+    setSelectedButton("proxy");
+  }
+});
+
+browser.storage.local.get("proxyUrl").then(({ proxyUrl }) => {
+  console.log("Saved proxy url is ", proxyUrl);
+
+  const proxyConfigs = {
+    direct: {
+      proxyType: "none",
+    },
+    system: {
+      proxyType: "system",
+    },
+    proxy: {
+      proxyType: "manual",
+      http: proxyUrl,
+      httpProxyAll: true,
+    },
+  };
+
+  for (const key in buttons) {
+    buttons[key].addEventListener("click", () => {
+      console.log("Try to set proxy to ", proxyConfigs[key]);
+      browser.proxy.settings
+        .set({ value: proxyConfigs[key] })
+        .then((success) => {
+          if (success) {
+            setSelectedButton(key);
+          }
+        });
+    });
+  }
+});
+
+document.getElementById("settings_button").addEventListener("click", () => {
+  browser.runtime.openOptionsPage();
+});