Bratonien-Adventskalender/adventskalender/2025/js/popup.js

// Adventskalender 2025 – Popup-Logik (Bratonien Edition)

const popupOverlay = document.getElementById("popup-overlay");
const popupBox = document.getElementById("popup-box");
const popupContent = document.getElementById("popup-content");
const popupClose = document.getElementById("popup-close");

// === Platzhalterfunktion ===
function placeholder(text) {
  return `
    <div class="placeholder">
      <p><em>${text}</em></p>
      <p style="opacity:0.7;">(Inhalt wird noch produziert)</p>
    </div>
  `;
}

// === Inhalte 1–24 (Platzhalter) ===
const popupData = {
  1: { title: "🎁 Adventskalenderstart + Daumenkino", content: placeholder("QR-Code zum Daumenkino & Intro-Post") },
  2: { title: "🍰 Foodcheck: Tassenkuchen", content: placeholder("3-Zutaten-Rezept – Quickclip folgt") },
  3: { title: "🎧 Mini-Podcast: Kindheitsweihnachten", content: placeholder("Audioaufnahme folgt – Thema: Kindheitsweihnachten") },
  4: { title: "🎞️ Mini-Comic", content: placeholder("Comic (1–3 Panels) folgt") },
  5: { title: "👗 Cosplay-Winter-Transformation", content: placeholder("Reel oder Kurzvideo folgt") },
  6: { title: "☕ Foodcheck: Winterdrink", content: placeholder("Rezeptclip / Ästhetikaufnahme folgt") },
  7: { title: "🎧 Mini-Podcast: Was ist Bratonien?", content: placeholder("Kurzpodcast mit Stimme & Haltung folgt") },
  8: { title: "📱 Bratonien Icon-Pack", content: placeholder("Download-Link & Vorschau folgen") },
  9: { title: "🍽️ Foodcheck: Last-Minute-Snack", content: placeholder("Schneller Clip / Humorige Variante folgt") },
  10: { title: "🥕 Fiktive Bratonien-Tradition", content: placeholder("Text oder Kurzclip zur Möhre auf dem Fenstersims folgt") },
  11: { title: "👑 Cosplay-Inspo: Accessoires", content: placeholder("Foto / Nahaufnahme folgt") },
  12: { title: "🎥 POV: So beginnt ein Bratonien-Stream", content: placeholder("Stream-Intro-Video folgt") },
  13: { title: "🎙️ Mini-Podcast: Weihnachtscringe", content: placeholder("Podcastaufnahme folgt") },
  14: { title: "🍪 Foodcheck: Last-Minute-Plätzchen", content: placeholder("Clip oder Foto folgt") },
  15: { title: "🧠 Mini-Podcast: Der große Wunsch", content: placeholder("Kurzer Audio-Text folgt") },
  16: { title: "📦 5 Dinge, die du nicht mehr kaufen solltest", content: placeholder("Humor-Reel folgt") },
  17: { title: "🎞️ Die besten Weihnachtsfilme in Bratonien", content: placeholder("Liste oder humorige Zusammenstellung folgt") },
  18: { title: "🎧 Mini-Podcast: Weihnachten früher", content: placeholder("Audioaufnahme folgt") },
  19: { title: "🍪 Foodcheck: Das hässlichste Plätzchen", content: placeholder("Humorclip oder Foto folgt") },
  20: { title: "🎁 3 Arten von Menschen beim Geschenkeeinpacken", content: placeholder("Sketch-Reel folgt") },
  21: { title: "📞 Audio-Sketch: Der Weihnachtsanruf", content: placeholder("Audioaufnahme folgt") },
  22: { title: "🎲 Bratonischer Geschenke-Generator", content: placeholder("Minispiel folgt") },
  23: { title: "🍨 Foodcheck: Deko-Dessert (Schneekugel)", content: placeholder("Foodfoto / Clip folgt") },
  24: { title: "🎬 Danke & Geschenk", content: placeholder("Finale Video & Freebie folgen") }
};

// === Türchen öffnen – HTML laden oder Fallback ===
function openPopup(day) {
  const data = popupData[day];
  if (!data) return;

  const tag = String(day).padStart(2, '0');
  const url = `/2025/content/tag${tag}.html`;

  fetch(url)
    .then(res => {
      if (!res.ok) throw new Error("Inhalt nicht gefunden");
      return res.text();
    })
    .then(html => {
      popupContent.innerHTML = `<h2>${data.title}</h2>${html}`;
      popupOverlay.classList.add("active");
    })
    .catch(err => {
      // Fallback auf bekannte JS-Daten
      popupContent.innerHTML = `<h2>${data.title}</h2>${data.content}`;
      popupOverlay.classList.add("active");
      console.warn(`Türchen ${day}: HTML konnte nicht geladen werden. Fallback verwendet.`, err);
    });
}

// === Gesperrte Türchen – Zufallsspruch + Countdown ===
window.showLockedPopup = function (day) {
  const sprueche = [
    "🎁 Na na na, hier wird nicht geschummelt!",
    "❄️ Geduld ist auch eine Form von Magie.",
    "🎅 Ho ho ho – zu früh! Versuch es später nochmal.",
    "⏳ Die Tür klemmt noch – vielleicht morgen?",
    "🍪 Kein Plätzchen für Ungeduldige!",
    "🎄 Schön, dass du neugierig bist – aber noch ist Geheimniszeit!",
    "🔒 Tür verriegelt. Der Weihnachtszauber hat Öffnungszeiten.",
    "✨ Geduld, kleiner Weihnachtself – noch ein bisschen Glitzer abwarten!",
    "🕯️ Zu früh dran? Das Lichtlein brennt noch nicht für dich."
  ];

  const zufall = sprueche[Math.floor(Math.random() * sprueche.length)];

  const yearMatch = document.title.match(/\d{4}/);
  const year = yearMatch ? parseInt(yearMatch[0], 10) : new Date().getFullYear();
  const unlockDate = new Date(year, 11, parseInt(day, 10), 0, 0, 0); // 11 = Dezember
  const now = new Date();

  let diff = unlockDate - now;
  if (diff < 0) diff = 0;

  const totalMinutes = Math.floor(diff / 60000);
  const days = Math.floor(totalMinutes / (60 * 24));
  const hours = Math.floor((totalMinutes % (60 * 24)) / 60);
  const minutes = totalMinutes % 60;

  let timeText = "";
  if (days > 0) timeText += `${days} Tag${days !== 1 ? "en" : ""}`;
  if (hours > 0) timeText += `${timeText ? ", " : ""}${hours} Stunde${hours !== 1 ? "n" : ""}`;
  if (minutes > 0 || timeText === "") timeText += `${timeText ? " und " : ""}${minutes} Minute${minutes !== 1 ? "n" : ""}`;

  popupContent.innerHTML = `
    <h2>Türchen ${day} ist noch geschlossen</h2>
    <p>${zufall}</p>
    <p style="margin-top: 10px; opacity: 0.8;">🔓 Öffnet in <strong>${timeText}</strong></p>
  `;

  popupOverlay.classList.add("active");
};

// === Schließen ===
popupClose.addEventListener("click", () => popupOverlay.classList.remove("active"));
popupOverlay.addEventListener("click", e => {
  if (e.target === popupOverlay) popupOverlay.classList.remove("active");
});

// === Export für door-open.js ===
window.openPopup = openPopup;