74 lines
2.6 KiB
JavaScript
74 lines
2.6 KiB
JavaScript
// ============================================================
|
||
// 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/`; // <=== hier angepasst!
|
||
|
||
// === Favicon setzen (.webp) ===
|
||
setFavicon(`${basePath}1920/webp/${filename}.webp`);
|
||
|
||
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;
|
||
}
|
||
|
||
window.addEventListener("DOMContentLoaded", () => {
|
||
const picture = document.querySelector(".kalenderbild picture");
|
||
const img = picture?.querySelector("img");
|
||
const sources = picture?.querySelectorAll("source");
|
||
|
||
if (!picture || !img || !sources) return;
|
||
|
||
const breakpoints = [420, 768, 1024, 1280, 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) responsiv setzen ===
|
||
const jpegSrcset = breakpoints
|
||
.map(bp => `${basePath}${bp}/jpeg/${filename}.jpg ${bp}w`)
|
||
.join(", ");
|
||
|
||
img.setAttribute("src", `${basePath}1920/jpeg/${filename}.jpg`);
|
||
img.setAttribute("srcset", jpegSrcset);
|
||
img.setAttribute("sizes", "100vw");
|
||
|
||
console.log(`[Bratonien] Kalenderbild gesetzt für Tag ${filename}`);
|
||
setFavicon(`${basePath}${filename}.webp`);
|
||
console.log(`[Bratonien] Favicon gesetzt für Tag ${filename}`);
|
||
});
|
||
})(); |