const $ = (id) => document.getElementById(id);

function status(text, kind = "") {
  $("status").textContent = text;
  $("status").className = kind;
}

function showConnected(on) {
  $("now").hidden = !on;
  $("off").hidden = !on;
}

async function init() {
  const cfg = await LabSync.getConfig();
  if (cfg) {
    $("url").value = cfg.url;
    $("user").value = cfg.user;
    $("pass").value = cfg.pass;
    showConnected(true);
  }
}

async function runSync() {
  status("> synchronisiere …");
  try {
    const r = await LabSync.sync();
    status(`> OK – ${r.links} Links abgeglichen.`, "ok");
  } catch (e) {
    status("> FEHLER: " + e.message, "err");
  }
}

$("cfg").addEventListener("submit", async (e) => {
  e.preventDefault();
  const cfg = { url: $("url").value.trim(), user: $("user").value.trim(), pass: $("pass").value };

  let origin;
  try { origin = new URL(cfg.url).origin + "/*"; } catch { return status("> FEHLER: Ungültige URL.", "err"); }

  // Muss direkt aus dem Klick heraus aufgerufen werden (Nutzergeste).
  const granted = await chrome.permissions.request({ origins: [origin] });
  if (!granted) return status("> FEHLER: Zugriff auf den Server wurde nicht erlaubt.", "err");

  await LabSync.setConfig(cfg);
  showConnected(true);
  await runSync();
});

$("now").addEventListener("click", runSync);

$("off").addEventListener("click", async () => {
  const cfg = await LabSync.getConfig();
  await LabSync.setConfig(null);
  if (cfg) {
    try { await chrome.permissions.remove({ origins: [new URL(cfg.url).origin + "/*"] }); } catch {}
  }
  for (const id of ["url", "user", "pass"]) $(id).value = "";
  showConnected(false);
  status("> Sync getrennt. Lokale Links bleiben erhalten.");
});

init();