replace all w3-include

assets/js/header.js

@@ -0,0 +1,33 @@
+export function headerToggle() {
+  const header = document.getElementById("site-header");
+  const buttonToggle = document.querySelector("#menu-toggle");
+  console.log(header);
+  console.log(buttonToggle);
+
+  if (!header || !buttonToggle) return;
+  buttonToggle.addEventListener("click", () => {
+    document.body.classList.toggle("menu-open");
+  });
+}
+
+export function headerScrollVisibility() {
+  const header = document.getElementById("site-header");
+  const hero = document.getElementById("hero");
+
+  if (!header || !hero) return;
+
+  function checkScroll() {
+    const headerHeight = parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--header-h')) || 0;
+    const heroBottom = hero.getBoundingClientRect().bottom;
+
+    if (heroBottom <= headerHeight) {
+      header.classList.add("is-visible");
+    } else {
+      header.classList.remove("is-visible");
+    }
+  }
+
+  window.addEventListener("scroll", checkScroll);
+  checkScroll(); // Vérifier au chargement
+}
+

assets/js/mobile-sticky.js

@@ -0,0 +1,50 @@
+let isInitialized = false;
+
+export function btnSticky(responsiveSmall) {
+    if (isInitialized) return;
+
+    let main = document.querySelector("main");
+    if (!main || !main.classList.contains("page-enquete")) return;
+
+    let bannerPage = main.querySelector("#banner--page");
+    let sectionDl = document.querySelector("#section__dl");
+    let footer = document.querySelector("#site-footer");
+
+    if (!bannerPage || !sectionDl || !footer) return;
+
+    function checkScroll() {
+        const screenWidth = window.innerWidth;
+
+        // Vérifier que l'écran est plus petit que responsiveSmall
+        if (screenWidth >= responsiveSmall) {
+            bannerPage.classList.remove('is-visible');
+            bannerPage.style.transform = 'translateY(0)';
+            return;
+        }
+
+        const sectionTop = sectionDl.getBoundingClientRect().top;
+        const footerTop = footer.getBoundingClientRect().top;
+        const windowHeight = window.innerHeight;
+
+        // Activer le banner quand #section__dl arrive en bas de l'écran
+        if (sectionTop <= windowHeight) {
+            bannerPage.classList.add('is-visible');
+
+            // Pousser le banner vers le haut si le footer arrive en bas de l'écran
+            if (footerTop < windowHeight) {
+                const pushUp = windowHeight - footerTop;
+                bannerPage.style.transform = `translateY(-${pushUp}px)`;
+            } else {
+                bannerPage.style.transform = 'translateY(0)';
+            }
+        } else {
+            bannerPage.classList.remove('is-visible');
+            bannerPage.style.transform = 'translateY(0)';
+        }
+    }
+
+    window.addEventListener('scroll', checkScroll);
+    checkScroll();
+
+    isInitialized = true;
+}

assets/js/script.js

@@ -1,51 +1,14 @@
-function updateLinkInterval(link, interval) {
-  const currentHref = link.getAttribute("href");
-  const newHref = currentHref.replace(
-    /default_interval=[om]/,
-    `default_interval=${interval}`
-  );
-  link.setAttribute("href", newHref);
-}
+import { headerToggle, headerScrollVisibility } from './header.js';
+import { copyLink } from './share.js';
+import { btnSticky } from './mobile-sticky.js';
 
-function updateAmountDisplay(link, amount, interval) {
-  const boldText = link.querySelector(".bold");
-  if (!boldText) return;
+const responsiveMedium = 1080;
+const responsiveSmall = 768;
 
-  const suffix = interval === "m" ? "€/mois" : "€";
-  boldText.innerHTML = `<span class="amount-value">${amount}</span>${suffix}`;
-}
-
-function switchActiveTab(clickedButton, allButtons) {
-  allButtons.forEach((btn) => btn.classList.remove("is-selected"));
-  clickedButton.classList.add("is-selected");
-}
-
-function handleDonationIntervalChange(interval) {
-  const donationLinks = document.querySelectorAll(".btn--donation[data-amount]");
-  const freeAmountLink = document.querySelector(".btn--donation:not([data-amount])");
-
-  donationLinks.forEach((link) => {
-    const amount = link.getAttribute("data-amount");
-    updateLinkInterval(link, interval);
-    updateAmountDisplay(link, amount, interval);
-  });
-
-  if (freeAmountLink) {
-    updateLinkInterval(freeAmountLink, interval);
-  }
-}
-
-document.addEventListener("DOMContentLoaded", function () {
-  const tabButtons = document.querySelectorAll(".nav--tabs__btn");
-  const donationLinks = document.querySelectorAll(".btn--donation[data-amount]");
-
-  if (tabButtons.length === 0 || donationLinks.length === 0) return;
-
-  tabButtons.forEach((button) => {
-    button.addEventListener("click", function () {
-      const interval = this.getAttribute("data-interval");
-      switchActiveTab(this, tabButtons);
-      handleDonationIntervalChange(interval);
-    });
-  });
-});
+window.onload = async function () { 
+  console.log("SCRIPT LOADED");
+  headerToggle();
+  headerScrollVisibility();
+  copyLink();
+  btnSticky(responsiveSmall);
+}

assets/js/share.js

@@ -0,0 +1,19 @@
+export function copyLink() {
+    let buttons = document.querySelectorAll('.copy-link button');
+    buttons.forEach(function (button, index) {
+        let link = button.parentNode.querySelector("input").value;
+
+        button.addEventListener('click', function() {
+            navigator.clipboard.writeText(link).then(() => {
+                const originalText = button.textContent;
+                button.textContent = 'Lien copié';
+                setTimeout(() => {
+                    button.textContent = originalText;
+                }, 1000);
+            }).catch(err => {
+                console.error('Erreur lors de la copie:', err);
+            });
+        });
+    });
+}
+