import { loadCardDeck } from "./quickmenu/carddeck.js";
import { loadEvents } from "./quickmenu/events.js";
import { loadHeroBonus } from "./quickmenu/hero-bonus.js";
import { loadSealedLeague } from "./quickmenu/sealed-league.js";
import { loadSummoner } from "./quickmenu/summoner.js";
import { loadOnlinebonus } from "./quickmenu/onlinebonus.js";
import { loadActions } from "./quickmenu/actions.js";
import { loadBazaar } from "./buildings/bazaar.js";
import { loadBoosterAction } from "./quickmenu/booster-action.js";
import { loadBoosterHunt } from "./quickmenu/booster-hunt.js";

/* Popup-ID → Loader Funktion */
const popupLoaders = {
  "qm-popup-carddeck": loadCardDeck,
  "qm-popup-events": loadEvents,
  "qm-popup-heldenbonus": loadHeroBonus,
  "qm-popup-sealedliga": loadSealedLeague,
  "qm-popup-beschwoerer": loadSummoner,
  "qm-popup-onlinebonus": loadOnlinebonus,
  "qm-popup-aktionen": loadActions,
  "qm-popup-boosteraktion": loadBoosterAction,
  "qm-popup-boosterjagd": loadBoosterHunt,
};

/* Slots die ihr eigenes Popup-System haben (kein qm-popup öffnen) */
const customHandlers = {
  "qm-popup-basar": loadBazaar,
};

/* ================================
   Gaststätte – Tab-Logik
================================ */

document.querySelectorAll("#qm-body-gaststaette .qm-tab").forEach((tab) => {
  tab.addEventListener("click", () => {
    document.querySelectorAll("#qm-body-gaststaette .qm-tab").forEach((t) => t.classList.remove("active"));
    document.querySelectorAll("#qm-body-gaststaette .qm-tab-content").forEach((c) => c.classList.remove("active"));
    tab.classList.add("active");
    document.getElementById(tab.dataset.tab).classList.add("active");
  });
});

/* ================================
   Quick Menu – Toggle
================================ */

const panel = document.getElementById("quickmenu-panel");
const overlay = document.getElementById("qm-overlay");

/* ================================
   Quick Menu – Popups öffnen
================================ */

document.querySelectorAll(".qm-slot").forEach((slot) => {
  slot.addEventListener("click", () => {
    const id = slot.dataset.popup;
    if (!id) return;

    /* Eigenes Popup-System (z.B. Bazaar) → direkt aufrufen */
    if (customHandlers[id]) {
      customHandlers[id]();
      return;
    }

    const popup = document.getElementById(id);
    if (!popup) return;

    // Popup zurück zur Mitte setzen
    popup.style.transform = "translate(-50%, -50%) scale(1)";
    popup.style.left = "50%";
    popup.style.top  = "50%";

    overlay.classList.add("active");
    popup.classList.add("active");

    // Zugehörigen Loader aufrufen
    const loader = popupLoaders[id];
    if (loader) loader();
  });
});

/* ================================
   Quick Menu – Popups verschiebbar
================================ */

document.querySelectorAll(".qm-popup").forEach((popup) => {
  const header = popup.querySelector(".qm-popup-header");
  if (!header) return;

  let isDragging = false;
  let startX, startY, startLeft, startTop;

  header.style.cursor = "grab";

  header.addEventListener("mousedown", (e) => {
    if (e.target.classList.contains("qm-popup-close")) return;

    isDragging = true;
    header.style.cursor = "grabbing";

    const rect = popup.getBoundingClientRect();
    startX    = e.clientX;
    startY    = e.clientY;
    startLeft = rect.left;
    startTop  = rect.top;

    // transform zurücksetzen auf konkrete px-Werte
    popup.style.transform = "none";
    popup.style.left = startLeft + "px";
    popup.style.top  = startTop  + "px";

    e.preventDefault();
  });

  document.addEventListener("mousemove", (e) => {
    if (!isDragging) return;
    popup.style.left = (startLeft + (e.clientX - startX)) + "px";
    popup.style.top  = (startTop  + (e.clientY - startY)) + "px";
  });

  document.addEventListener("mouseup", () => {
    if (!isDragging) return;
    isDragging = false;
    header.style.cursor = "grab";
  });
});

/* ================================
   Quick Menu – Popups schließen
================================ */

function isBoosterSpinning() {
  const eventsPopup = document.getElementById("qm-popup-events");
  if (!eventsPopup || !eventsPopup.classList.contains("active")) return false;

  // Booster-UI oder Wood-UI aktiv und Slot dreht
  const boosterUi = document.getElementById("booster-ui");
  if (boosterUi && boosterUi.style.display !== "none" && boosterUi.querySelector(".booster-slot.spinning")) return true;

  const woodUi = document.getElementById("wood-ui");
  if (woodUi && woodUi.style.display !== "none" && woodUi.querySelector(".booster-slot.spinning")) return true;

  const goldUi = document.getElementById("gold-ui");
  if (goldUi && goldUi.style.display !== "none" && goldUi.querySelector(".booster-slot.spinning")) return true;

  // Arena Daily: sperren während Gegnersuche läuft
  const arenaUi = document.getElementById("arena-ui");
  if (arenaUi && arenaUi.style.display !== "none") {
    const card = arenaUi.querySelector(".arena-mode-card-daily.searching");
    if (card) return true;
  }

  const arena2Ui = document.getElementById("arena2-ui");
  if (arena2Ui && arena2Ui.style.display !== "none") {
    const card = arena2Ui.querySelector(".arena-mode-card-daily.searching");
    if (card) return true;
  }

  return false;
}

document.querySelectorAll(".qm-popup-close").forEach((btn) => {
  btn.addEventListener("click", closeAllPopups);
});

overlay.addEventListener("click", closeAllPopups);

function closeAllPopups() {
  if (isBoosterSpinning()) return;  // Slot dreht → sperren

  document.querySelectorAll(".qm-popup").forEach((p) => {
    p.classList.remove("active");
  });
  overlay.classList.remove("active");
}

document.addEventListener("keydown", (e) => {
  if (e.key === "Escape") {
    if (isBoosterSpinning()) {
      e.stopPropagation();
      e.preventDefault();
      return;
    }
    closeAllPopups();
  }
});