/* ================================
   HUD – Charakter & Währungsanzeige
================================ */

async function fetchHud() {
  const res = await fetch("/api/hud");
  if (!res.ok) throw new Error("HUD API Fehler");
  return await res.json();
}

function applyHudData(data) {
  const set = (id, val) => {
    const el = document.getElementById(id);
    if (el) el.textContent = formatNumber(val);
  };

  const nameEl = document.getElementById("hud-name");
  if (nameEl) nameEl.textContent = data.name;

  set("hud-gems",  data.gems);
  set("hud-gold",  data.gold);
  set("hud-wood",  data.wood);
  set("hud-stone", data.stone);

  /* ── Energie anzeigen ────────────────────────────── */
  const energy    = data.energy    ?? 40;
  const energyMax = data.energy_max ?? 40;
  const energyEl  = document.getElementById("hud-energy-value");
  if (energyEl) energyEl.textContent = energy + " / " + energyMax;

  /* Farbe je nach Stand */
  if (energyEl) {
    energyEl.style.color =
      energy <= 0        ? "#e74c3c"  // leer → rot
      : energy <= 10     ? "#e67e22"  // niedrig → orange
      : energy < energyMax ? "#f0d9a6" // teilweise → normal
      : "#7de87d";                     // voll → grün
  }
}

export async function loadHud() {
  try {
    const data = await fetchHud();
    applyHudData(data);
    // Auto-Refresh alle 30 Sekunden
    setInterval(async () => {
      try {
        const d = await fetchHud();
        applyHudData(d);
      } catch {}
    }, 30000);
  } catch (err) {
    console.error("HUD Fehler:", err);
  }
}

export async function refreshHud() {
  try {
    const data = await fetchHud();
    applyHudData(data);
  } catch (err) {
    console.error("HUD Refresh Fehler:", err);
  }
}

function formatNumber(n) {
  if (n === undefined || n === null) return "0";
  return Number(n).toLocaleString("de-DE");
}