initial commit

options.js

@@ -0,0 +1,64 @@
+function buildBookmarkRows(bookmarks) {
+  const fields = document.getElementById("bookmark-fields");
+  fields.textContent = "";
+
+  bookmarks.forEach((bookmark, index) => {
+    const row = document.createElement("div");
+    row.className = "bookmark-row";
+
+    const title = document.createElement("input");
+    title.type = "text";
+    title.name = `bookmark-title-${index}`;
+    title.placeholder = `Bookmark ${index + 1} title`;
+    title.value = bookmark.title || "";
+
+    const url = document.createElement("input");
+    url.type = "text";
+    url.name = `bookmark-url-${index}`;
+    url.placeholder = `Bookmark ${index + 1} URL`;
+    url.value = bookmark.url || "";
+
+    row.append(title, url);
+    fields.append(row);
+  });
+}
+
+async function render() {
+  const settings = await browser.runtime.sendMessage({ type: "get-settings" });
+  buildBookmarkRows(settings.bookmarks);
+
+  document.querySelector('[name="trackers"]').checked = settings.blocking.trackers;
+  document.querySelector('[name="ads"]').checked = settings.blocking.ads;
+  document.querySelector('[name="analytics"]').checked = settings.blocking.analytics;
+  document.querySelector('[name="social"]').checked = settings.blocking.social;
+}
+
+document.getElementById("settings-form").addEventListener("submit", async (event) => {
+  event.preventDefault();
+
+  const bookmarks = Array.from({ length: 4 }, (_, index) => ({
+    title: document.querySelector(`[name="bookmark-title-${index}"]`).value.trim(),
+    url: document.querySelector(`[name="bookmark-url-${index}"]`).value.trim()
+  }));
+
+  await browser.runtime.sendMessage({
+    type: "save-settings",
+    settings: {
+      bookmarks,
+      blocking: {
+        trackers: document.querySelector('[name="trackers"]').checked,
+        ads: document.querySelector('[name="ads"]').checked,
+        analytics: document.querySelector('[name="analytics"]').checked,
+        social: document.querySelector('[name="social"]').checked
+      }
+    }
+  });
+
+  const status = document.getElementById("save-status");
+  status.textContent = "Saved";
+  window.setTimeout(() => {
+    status.textContent = "";
+  }, 1500);
+});
+
+void render();