let dataBannerMain = document.querySelector("[data-banner]");
let dataCross = dataBannerMain.querySelector("[data-banner='close']");

let withBannerOffset = document.querySelector(".with-banner-offset");

let cookieBannerExist = Cookies.get("Banner");

function bannerShow() {
dataBannerMain.style.height = "auto";
dataCross.addEventListener("click", bannerHide);
}

function bannerHide() {
withBannerOffset.style.paddingTop = "0px";
dataBannerMain.style.height = "0px";
if (!cookieBannerExist) {
setBannerCookie();
}
}

function setBannerCookie() {
// Set cookie with expiration time (48 hours)
const expirationTime = 48 * 60 * 60 * 1000; // 48 hours in milliseconds
const expiryDate = new Date(Date.now() + expirationTime);
cookieBannerExist = Cookies.set("Banner", "Closed", { expires: expiryDate });
}

function CheckForBannerToShow() {
if (cookieBannerExist) {
bannerHide();
} else {
bannerShow();
console.log(cookieBannerExist);
}
}

CheckForBannerToShow(); // Invoke the function to check and show/hide banner initially

// ScrollTrigger configuration
gsap.registerPlugin(ScrollTrigger);

// Function to handle banner animation on scroll
function animateBannerOnScroll() {
gsap.to(dataBannerMain, {
scrollTrigger: {
trigger: dataBannerMain,
start: "top top", // Start animation when top of banner reaches top of viewport
end: "bottom top", // End animation when bottom of banner reaches top of viewport
scrub: true, // Smoothly animates the changes
},
marginTop: () => `-${dataBannerMain.clientHeight}px`, // Margin top decreases dynamically based on banner height
duration: 1,
ease: "ease-out", // Easing function for smooth animation
});
}

// Call this function to check banner status and animate on scroll
function setupBannerAnimation() {
if (!cookieBannerExist || cookieBannerExist !== "Closed") {
animateBannerOnScroll();
}
}

// Call this function to set up banner animation when the document is loaded
document.addEventListener("DOMContentLoaded", setupBannerAnimation);