"use strict";

// --- Headerbar (eingeloggt?) ---
let loggedIn = false;

async function refreshHeader() {
  const h = await api.get("/auth/headerbar");
  loggedIn = !!h.loggedin;

  document.getElementById("auth-box").hidden = loggedIn;
  document.getElementById("compose").hidden = !loggedIn;

  const bar = document.getElementById("headerbar");
  if (loggedIn) {
    const me = await api.get("/user/info");
    const user = encodeURIComponent(me.username);
    bar.innerHTML = `<a class="button" href="/u/${user}">mein Profil</a> <button id="logout-btn">Logout</button>`;
    document.getElementById("logout-btn").addEventListener("click", async () => {
      await api.get("/auth/logout");
      await refreshHeader();
    });
  } else {
    bar.innerHTML = "";
    showAuth("login");
  }
}

// --- Login / Registrierung ---
const loginForm = document.getElementById("login-form");
const registerForm = document.getElementById("register-form");
const authMsg = document.getElementById("auth-msg");

function showAuth(which) {
  loginForm.hidden = which !== "login";
  registerForm.hidden = which !== "register";
  authMsg.textContent = "";
}

document.getElementById("show-register").addEventListener("click", (e) => {
  e.preventDefault();
  showAuth("register");
});
document.getElementById("show-login").addEventListener("click", (e) => {
  e.preventDefault();
  showAuth("login");
});

loginForm.addEventListener("submit", async (e) => {
  e.preventDefault();
  const res = await api.post("/auth/login", new FormData(e.target));
  if (res.ok) {
    await refreshHeader();
  } else {
    authMsg.textContent = res.data.error || "Login fehlgeschlagen.";
  }
});

registerForm.addEventListener("submit", async (e) => {
  e.preventDefault();
  const data = new FormData(e.target);
  const res = await api.post("/auth/newuser", data);
  if (!res.ok) {
    // newuser liefert eine Fehlerliste ({"errors": [...]}).
    const errors = res.data.errors || [res.data.error || "Registrierung fehlgeschlagen."];
    authMsg.textContent = errors.join(" ");
    return;
  }
  // Direkt mit denselben Daten einloggen, damit der Nutzer gleich drin ist.
  const login = new FormData();
  login.append("user", data.get("user"));
  login.append("pass", data.get("pass1"));
  login.append("timeout", "86400");
  await api.post("/auth/login", login);
  await refreshHeader();
});

// --- Feed ---
const feed = createFeed(
  document.getElementById("feed"),
  document.getElementById("sentinel"),
  (page) => `/entry/feed/${page}`
);

// --- Neuer Beitrag ---
document.getElementById("entry-form").addEventListener("submit", async (e) => {
  e.preventDefault();
  const res = await api.post("/entry/create", new FormData(e.target));
  const msg = document.getElementById("entry-msg");
  if (res.ok) {
    msg.textContent = "";
    document.getElementById("paste-msg").textContent = "";
    e.target.reset();
    feed.reset();
  } else {
    msg.textContent = res.data.error || "Beitrag fehlgeschlagen.";
  }
});

// --- Bild aus der Zwischenablage einfügen ---
// Strg+V im Textfeld: liegt ein Bild in der Zwischenablage, übernehmen wir es in
// den File-Input (über DataTransfer, weil sich .files nicht direkt setzen lässt).
// Liegt kein Bild vor (Text o. Ä.), tun wir nichts und lassen den normalen Paste
// durchlaufen -> preventDefault nur, wenn wir wirklich ein Bild gegriffen haben.
document.getElementById("entry-form").addEventListener("paste", (e) => {
  const item = [...(e.clipboardData?.items ?? [])].find(
    (it) => it.kind === "file" && it.type.startsWith("image/")
  );
  if (!item) return;

  const original = item.getAsFile();
  if (!original) return;
  e.preventDefault();

  // Browser benennt Clipboard-Bilder uneinheitlich ("grafik.png" o. Ä.) -> neu
  // verpacken mit sprechendem Namen. Endung aus dem MIME-Typ, sonst png.
  const ext = (original.type.split("/")[1] || "png").toLowerCase();
  const file = new File([original], `zwischenablage.${ext}`, { type: original.type });

  const input = document.querySelector("#entry-form input[name='file']");
  const dt = new DataTransfer();
  dt.items.add(file);
  input.files = dt.files;

  document.getElementById("paste-msg").textContent = "Bild aus Zwischenablage übernommen.";
});

// --- Statuszeile unter dem Titel ---
// Tage ohne Datenverlust (fester Startpunkt, Kontinuität seit der alten
// Version) plus aktuelle Kennzahlen aus /stats.
const dataLossStart = new Date("2025-12-13T12:44:00").getTime();

function plural(n, one, many) {
  return `${n} ${n === 1 ? one : many}`;
}

async function renderStats() {
  const el = document.getElementById("stats");
  if (!el) return;
  const days = Math.floor((Date.now() - dataLossStart) / 86400000);
  const s = await api.get("/stats");
  el.textContent =
    `Ohne Datenverlust seit ${plural(days, "Tag", "Tagen")} · ` +
    `${plural(s.users ?? 0, "Profil", "Profile")} · ` +
    `${plural(s.entries ?? 0, "Beitrag", "Beiträge")}`;
}

// --- Start ---
refreshHeader();
renderStats();
