const DEFAULT_SETTINGS = {
  uploadMode: "desktop",
  apiUrl: "https://f0ckm.com/api/v2/upload",
  apiKey: "",
  rating: "s",
  tags: "",
  visibility: "0",
  isOc: false,
  urlType: "post"
};

function normalizeApiUrl(url) {
  if (!url) return "";
  url = url.trim().replace(/^['"]|['"]$/g, "");
  if (!url) return "";
  if (!/^https?:\/\//i.test(url)) {
    url = "http://" + url;
  }
  try {
    const parsed = new URL(url);
    let path = parsed.pathname.replace(/\/+$/, "");
    if (!path || path === "") {
      return `${parsed.origin}/api/v2/upload`;
    } else if (path.endsWith("/api/v2")) {
      return `${parsed.origin}/upload`;
    } else if (!path.endsWith("/upload")) {
      return `${parsed.origin}/api/v2/upload`;
    }
    return url;
  } catch (e) {
    return url;
  }
}

document.addEventListener("DOMContentLoaded", () => {
  const form = document.getElementById("settings-form");
  const modeDesktop = document.getElementById("mode-desktop");
  const modeDirect = document.getElementById("mode-direct");
  const apiUrl = document.getElementById("apiUrl");
  const apiKey = document.getElementById("apiKey");
  const rating = document.getElementById("rating");
  const visibility = document.getElementById("visibility");
  const tags = document.getElementById("tags");
  const isOc = document.getElementById("isOc");
  const urlType = document.getElementById("urlType");
  const saveToast = document.getElementById("save-toast");
  const btnTest = document.getElementById("btn-test-connection");
  const testToast = document.getElementById("test-toast");

  // Load existing settings
  chrome.storage.sync.get(DEFAULT_SETTINGS, (items) => {
    if (items.uploadMode === "direct") {
      modeDirect.checked = true;
    } else {
      modeDesktop.checked = true;
    }

    apiUrl.value = items.apiUrl || "";
    apiKey.value = items.apiKey || "";
    rating.value = items.rating || "s";
    visibility.value = items.visibility !== undefined ? String(items.visibility) : "0";
    tags.value = items.tags || "";
    isOc.checked = !!items.isOc;
    urlType.value = items.urlType || "post";
  });

  // Save settings on form submit
  form.addEventListener("submit", (e) => {
    e.preventDefault();
    const rawUrl = apiUrl.value.trim();
    const normUrl = normalizeApiUrl(rawUrl);
    if (normUrl && normUrl !== rawUrl) {
      apiUrl.value = normUrl;
    }

    const newSettings = {
      uploadMode: modeDirect.checked ? "direct" : "desktop",
      apiUrl: normUrl || rawUrl,
      apiKey: apiKey.value.trim(),
      rating: rating.value,
      visibility: visibility.value,
      tags: tags.value.trim(),
      isOc: isOc.checked,
      urlType: urlType.value
    };

    chrome.storage.sync.set(newSettings, () => {
      saveToast.classList.remove("hidden");
      setTimeout(() => {
        saveToast.classList.add("hidden");
      }, 2500);
    });
  });

  // Test Connection button
  if (btnTest) {
    btnTest.addEventListener("click", () => {
      const url = apiUrl.value.trim();
      const key = apiKey.value.trim();
      if (!url || !key) {
        if (testToast) {
          testToast.textContent = "Please enter API URL and API Key.";
          testToast.style.color = "#ff4444";
          testToast.classList.remove("hidden");
        }
        return;
      }

      btnTest.disabled = true;
      btnTest.textContent = "Testing...";
      if (testToast) testToast.classList.add("hidden");

      chrome.runtime.sendMessage({ action: "test_connection", apiUrl: url, apiKey: key }, (res) => {
        btnTest.disabled = false;
        btnTest.textContent = "Test Connection";
        if (testToast) {
          testToast.classList.remove("hidden");
          if (res && res.success) {
            testToast.textContent = "✓ " + res.msg;
            testToast.style.color = "#00e676";
          } else {
            testToast.textContent = "❌ " + (res ? res.msg : "Test failed");
            testToast.style.color = "#ff4444";
          }
        }
      });
    });
  }
});