132 lines
3.6 KiB
JavaScript
132 lines
3.6 KiB
JavaScript
// web_proxy toggle — popup logic.
|
|
//
|
|
// Lee y escribe el estado en chrome.storage.local. El service worker
|
|
// (background.js) reacciona a cada cambio y reconfigura el proxy real, de modo
|
|
// que el popup nunca llama directamente a chrome.proxy.
|
|
|
|
const DEFAULT_STATE = {
|
|
enabled: false,
|
|
activeProxy: "capture",
|
|
proxies: [
|
|
{
|
|
id: "capture",
|
|
name: "Captura web_proxy",
|
|
scheme: "http",
|
|
host: "127.0.0.1",
|
|
port: 8889,
|
|
},
|
|
],
|
|
};
|
|
|
|
async function getState() {
|
|
const r = await chrome.storage.local.get("state");
|
|
return r.state || structuredClone(DEFAULT_STATE);
|
|
}
|
|
|
|
async function setState(state) {
|
|
await chrome.storage.local.set({ state });
|
|
}
|
|
|
|
function newId() {
|
|
return "p" + Math.random().toString(36).slice(2, 9);
|
|
}
|
|
|
|
function render(state) {
|
|
const toggle = document.getElementById("toggle");
|
|
const status = document.getElementById("status");
|
|
toggle.checked = !!state.enabled;
|
|
|
|
const active = state.proxies.find((p) => p.id === state.activeProxy);
|
|
if (state.enabled && active) {
|
|
status.textContent = `Capturando via ${active.host}:${active.port}`;
|
|
status.style.color = "var(--green)";
|
|
} else {
|
|
status.textContent = "Captura desactivada";
|
|
status.style.color = "var(--muted)";
|
|
}
|
|
|
|
const list = document.getElementById("proxy-list");
|
|
list.innerHTML = "";
|
|
for (const p of state.proxies) {
|
|
const li = document.createElement("li");
|
|
|
|
const radio = document.createElement("input");
|
|
radio.type = "radio";
|
|
radio.name = "active";
|
|
radio.checked = p.id === state.activeProxy;
|
|
radio.addEventListener("change", async () => {
|
|
const s = await getState();
|
|
s.activeProxy = p.id;
|
|
await setState(s);
|
|
render(s);
|
|
});
|
|
|
|
const meta = document.createElement("div");
|
|
meta.className = "meta";
|
|
const name = document.createElement("div");
|
|
name.className = "name";
|
|
name.textContent = p.name || p.id;
|
|
const addr = document.createElement("div");
|
|
addr.className = "addr";
|
|
addr.textContent = `${p.scheme}://${p.host}:${p.port}`;
|
|
meta.append(name, addr);
|
|
|
|
li.append(radio, meta);
|
|
|
|
// El proxy de captura por defecto no se puede borrar.
|
|
if (p.id !== "capture") {
|
|
const del = document.createElement("button");
|
|
del.className = "del";
|
|
del.textContent = "✕";
|
|
del.title = "Eliminar";
|
|
del.addEventListener("click", async () => {
|
|
const s = await getState();
|
|
s.proxies = s.proxies.filter((x) => x.id !== p.id);
|
|
if (s.activeProxy === p.id) {
|
|
s.activeProxy = s.proxies[0] ? s.proxies[0].id : "capture";
|
|
}
|
|
await setState(s);
|
|
render(s);
|
|
});
|
|
li.append(del);
|
|
}
|
|
|
|
list.append(li);
|
|
}
|
|
}
|
|
|
|
async function init() {
|
|
const state = await getState();
|
|
render(state);
|
|
|
|
document.getElementById("toggle").addEventListener("change", async (e) => {
|
|
const s = await getState();
|
|
s.enabled = e.target.checked;
|
|
await setState(s);
|
|
render(s);
|
|
});
|
|
|
|
document.getElementById("f-add").addEventListener("click", async () => {
|
|
const name = document.getElementById("f-name").value.trim();
|
|
const scheme = document.getElementById("f-scheme").value;
|
|
const host = document.getElementById("f-host").value.trim();
|
|
const port = parseInt(document.getElementById("f-port").value, 10);
|
|
if (!host || !port) return;
|
|
const s = await getState();
|
|
s.proxies.push({
|
|
id: newId(),
|
|
name: name || `${host}:${port}`,
|
|
scheme,
|
|
host,
|
|
port,
|
|
});
|
|
await setState(s);
|
|
document.getElementById("f-name").value = "";
|
|
document.getElementById("f-host").value = "";
|
|
document.getElementById("f-port").value = "";
|
|
render(s);
|
|
});
|
|
}
|
|
|
|
init();
|