document.addEventListener("DOMContentLoaded", function() { const container = document.getElementById("smc-local-header"); const wrapper = document.getElementById("smc-local-header-wrapper"); const closeIcon = document.getElementById("smc-local-header-close"); let autoCloseTimer; function slideUpAndClose() { // äußerer Wrapper const zielElement = wrapper || (container ? container.parentElement : null); if (!zielElement) return; // Holt die exakte, aktuell gerenderte Höhe des Elements vor dem Schließen const startHoehe = zielElement.getBoundingClientRect().height || 65; // Schaltet CSS-Bremsen und Mindesthöhen beim äußeren Wrapper ab zielElement.style.setProperty("transition", "none", "important"); zielElement.style.setProperty("min-height", "0px", "important"); zielElement.style.overflow = "hidden"; // Bereitet den inneren Container auf das Mitverschieben vor if (container) { container.style.setProperty("transition", "none", "important"); } const animationsDauer = 600; const startZeit = performance.now(); function animate(jetztZeit) { let vergangeneZeit = jetztZeit - startZeit; let fortschritt = Math.min(vergangeneZeit / animationsDauer, 1); // Sanfter Brems-Effekt (Ease-Out) let easeOutProgress = 1 - Math.pow(1 - fortschritt, 3); // Berechnet die schrumpfende Höhe des äußeren Wrappers let aktuelleHoehe = startHoehe * (1 - easeOutProgress); // Berechnet, wie weit der innere Container nach oben geschoben werden muss let verschiebung = startHoehe * easeOutProgress; // Verringert die Höhe des Wrappers zielElement.style.setProperty("height", aktuelleHoehe + "px", "important"); // Schiebt den inneren Container synchron mit nach oben if (container) { container.style.setProperty("transform", `translateY(-${verschiebung}px)`, "important"); } if (fortschritt < 1) { requestAnimationFrame(animate); } else { // Am Ende den Wrapper komplett löschen zielElement.remove(); } } requestAnimationFrame(animate); } // Erstbesucher-Logik if (container && !localStorage.getItem("smc_header_gesehen")) { // Äußeren Wrapper einblenden (hebt display: none auf) const zielElement = wrapper || container.parentElement; if (zielElement) { zielElement.style.setProperty("display", "block", "important"); // WICHTIG: Erzwingt ein Browser-Reflow, damit das Element "ankommt" void zielElement.offsetHeight; } // Wir erzwingen hier KEIN block-Layout mehr, um Flexbox nicht zu zerstören container.style.setProperty("display", "flex", "important"); // WICHTIG FÜR GEO-REDIRECTS: Sofort als "gesehen" markieren! // Falls der Nutzer die Seite vor Ablauf der 15sek wechselt, // poppt der Header auf der nächsten Sprachseite nicht erneut auf. localStorage.setItem("smc_header_gesehen", "true"); // 15 Sekunden automatischer Timer autoCloseTimer = setTimeout(slideUpAndClose, 30000); // Klick-Event für das Schließen-Icon if (closeIcon) { closeIcon.addEventListener("click", slideUpAndClose); } } else { // Falls schon gesehen, direkt alles löschen const zielElement = wrapper || (container ? container.parentElement : null); if (zielElement) zielElement.remove(); } });