// ============================================================
// Adventskalender 2025 – Hintergrund- & Favicon-Wechsel nach Tag
// ============================================================

(function () {
  const pathYear = window.location.pathname.match(/(\d{4})/);
  const YEAR = pathYear ? parseInt(pathYear[1], 10) : new Date().getFullYear();
  const DEV_MODE = window.location.search.includes("dev");
  const STORAGE_BASE = `bratonien_${YEAR}_lock`;

  function getSimulatedDay() {
    if (!DEV_MODE) return null;
    const val = localStorage.getItem(`${STORAGE_BASE}_simday`);
    return val ? parseInt(val, 10) : null;
  }

  const now = new Date();
  let dayToShow = now.getMonth() === 11 ? now.getDate() : 0;
  const sim = getSimulatedDay();
  if (DEV_MODE && sim) dayToShow = sim;

  const padded =
    dayToShow >= 1 && dayToShow <= 24
      ? String(dayToShow).padStart(2, "0")
      : "Basisbild";

  const filename = padded;
  const basePath = `/${YEAR}/assets/images/`;

  // === Favicon-Logik ===
  function setFavicon(path) {
    let link = document.querySelector('link[rel="icon"]');
    if (!link) {
      link = document.createElement("link");
      link.rel = "icon";
      link.type = "image/png";
      document.head.appendChild(link);
    }
    link.href = path;
  }

  // === Setze Favicon direkt ===
  const faviconPath = `${basePath}1920/webp/${filename}.webp`;
  setFavicon(faviconPath);

  // === Hintergrundbilder ===
  window.addEventListener("DOMContentLoaded", () => {
    const picture = document.querySelector(".kalenderbild picture");
    const img = picture?.querySelector("img");
    const sources = picture?.querySelectorAll("source");

    if (!picture || !img || !sources) return;

    // === Daumenkino (nur für Tag 1) ===
    if (dayToShow === 1) {
      const thumbkino = document.querySelector(".thumbkino-video");
      if (thumbkino) {
        const formats = ["webm", "mp4"];
        const resolutions = [
          "nHD",
          "FWVGA",
          "qHD",
          "HD",
          "HDplus",
          "FullHD",
          "1440p",
          "4K",
        ];
        const breakpoints = [640, 854, 960, 1280, 1600, 1920, 2560, 3840];

        // alte Quellen entfernen
        while (thumbkino.firstChild) thumbkino.removeChild(thumbkino.firstChild);

        formats.forEach((format) => {
          resolutions.forEach((res, i) => {
            const mediaQuery =
              i === resolutions.length - 1
                ? "(min-width: 2561px)"
                : `(max-width: ${breakpoints[i]}px)`;

            const source = document.createElement("source");
            source.src = `/${YEAR}/assets/videos/${res}/${format}/${padded}.${format}`;
            source.type = `video/${format}`;
            source.media = mediaQuery;
            thumbkino.appendChild(source);
          });
        });

        thumbkino.load();
        thumbkino.play().catch(() => {});

        console.log(`[Bratonien] Daumenkino gesetzt für Tag ${padded}`);
      }
    }

    const breakpoints = [420, 768, 1024, 1366, 1600, 1920, 2560, 3840];

    // === <source> für AVIF und WebP aktualisieren ===
    sources.forEach((source) => {
      const type = source.getAttribute("type");
      const format = type?.split("/")[1]; // "avif" oder "webp"
      if (!format) return;

      const newSrcset = breakpoints
        .map(
          (bp) => `${basePath}${bp}/${format}/${filename}.${format} ${bp}w`
        )
        .join(", ");
      source.setAttribute("srcset", newSrcset);
    });

    // === <img> (JPEG-Fallback) ===
    const jpegSrcset = breakpoints
      .map((bp) => `${basePath}${bp}/jpeg/${filename}.jpeg ${bp}w`)
      .join(", ");

    img.setAttribute("src", `${basePath}1920/jpeg/${filename}.jpeg`);
    img.setAttribute("srcset", jpegSrcset);
    img.setAttribute("sizes", "100vw");

    console.log(`[Bratonien] Kalenderbild gesetzt für Tag ${filename}`);
    console.log(`[Bratonien] Favicon gesetzt: ${faviconPath}`);
  });
})();