MemberScripts

<!--
  MEMBERSCRIPT #154
  ---------------------------------
  LOGIN PAGE SCRIPT
-->

<script>
(async function() {
  const delay = ms => new Promise(r => setTimeout(r, ms));

  async function routeLogin() {
    try {
      // Check if Memberstack is loaded
      if (!window.$memberstackDom) {
        console.log("Memberstack not loaded yet");
        return;
      }

      // Get current member
      const { data: member } = await window.$memberstackDom.getCurrentMember();
      if (!member) return; // Exit if not logged in

      // Get member JSON data
      const jsonResponse = await window.$memberstackDom.getMemberJSON();
      const memberData = jsonResponse.data || {};
      
      // Check if 2FA is enabled
      const needs2FA = memberData["2fa_enabled"] === true || 
                      jsonResponse["2fa_enabled"] === true;
      
      // Check session storage for verification status
      const verified = sessionStorage.getItem("2fa_verified") === "true";

      console.log("2FA Status:", { 
        enabled: needs2FA, 
        verified: verified,
        currentPath: window.location.pathname
      });

      // Handle 2FA redirect
      if (needs2FA && !verified) {
        if (!window.location.pathname.includes("/2fa-verify")) {
          console.log("Redirecting to /2fa-verify");
          window.location.href = "/2fa-verify";
        }
        return; // Stop further execution
      }

      // Handle success redirect
      if (!window.location.pathname.includes("/success")) {
        console.log("Redirecting to /success");
        
        // Remove Memberstack's auto-redirect if login form exists
        const loginForm = document.querySelector('[data-ms-form="login"]');
        if (loginForm) {
          loginForm.removeAttribute('data-ms-redirect');
        }
        
        window.location.href = "/success";
      }
    } catch (err) {
      console.error("2FA routing error:", err);
    }
  }

  // Wait for Memberstack to initialize
  await delay(300);
  routeLogin();
  
  // Poll with cleanup
  const pollInterval = setInterval(routeLogin, 500);
  setTimeout(() => clearInterval(pollInterval), 10000);
})();
</script>

<!--
  MEMBERSCRIPT #154
  ---------------------------------
  SETTINGS PAGE SCRIPT
-->

<!-- Load otplib preset-browser -->
<script src="https://unpkg.com/@otplib/preset-browser@^12.0.0/buffer.js"></script>
<script src="https://unpkg.com/@otplib/preset-browser@^12.0.0/index.js"></script>

<script>
document.addEventListener("DOMContentLoaded", async () => {
  const ms = window.$memberstackDom;
  const { data: member } = await ms.getCurrentMember();
  if (!member) return;

  const checkbox = document.querySelector('[data-ms-code="enable-2fa"]');
  const qrContainer = document.querySelector('[data-ms-code="2fa-qr-container"]');
  const qrImage = document.querySelector('[data-ms-code="2fa-qr-image"]');

  // Hide QR container by default
  qrContainer.style.display = "none";

  // Load member JSON and ensure data object exists
  const jsonObj = await ms.getMemberJSON(); // { data: ... } or { data: null }
  if (!jsonObj.data) jsonObj.data = {};
  const inner = jsonObj.data;

  // Set checkbox initial state
  const enabled = inner["2fa_enabled"] === true;
  checkbox.checked = enabled;

  checkbox.addEventListener("change", async (e) => {
    const isChecked = e.target.checked;

    // Reload member and JSON
    const { data: member } = await ms.getCurrentMember();
    const jsonObj2 = await ms.getMemberJSON();
    if (!jsonObj2.data) jsonObj2.data = {};
    const inner2 = jsonObj2.data;

    if (isChecked) {
      // Enable 2FA: generate secret and QR
      const secret = window.otplib.authenticator.generateSecret();
      const uri = window.otplib.authenticator.keyuri(member.email, "Memberscript #154", secret);
      qrImage.src = "https://api.qrserver.com/v1/create-qr-code/?data=" + encodeURIComponent(uri);
      qrContainer.style.display = "flex";

      inner2["2fa_enabled"] = true;
      inner2["2fa_secret"] = secret;

      await ms.updateMember({
        customFields: { "2fa-enabled": "true" }
      });
    } else {
      // Disable 2FA: remove secret and hide QR
      qrContainer.style.display = "none";

      inner2["2fa_enabled"] = false;
      delete inner2["2fa_secret"];

      await ms.updateMember({
        customFields: { "2fa-enabled": "false" }
      });
    }

    // Persist only nested JSON
    await ms.updateMemberJSON({ json: inner2 });

    // ✅ Debugging: check result
    const check = await ms.getMemberJSON();
    console.log(check);
  });
});
</script>

<!--
  MEMBERSCRIPT #154
  ---------------------------------
  SUCCESS / DASHBOARD PAGE SCRIPT
-->

<script>
  window.$memberstackDom.getCurrentMember().then(({ data: member }) => {
    if (!member) return; // Not logged in, no redirect

    window.$memberstackDom.getMemberJSON().then(json => {
      const enabled = json["2fa_enabled"];
      const verified = sessionStorage.getItem("2fa_verified") === "true";
      if (enabled && !verified && window.location.pathname !== "/2fa-verify") {
        window.location.href = "/2fa-verify";
      }
    });
  });
</script>

<!--
  MEMBERSCRIPT #154
  ---------------------------------
  TWO FACTOR VERIFICATION PAGE SCRIPT
-->

<!-- Include the Buffer polyfill -->
<script src="https://unpkg.com/@otplib/preset-browser@^12.0.0/buffer.js"></script>

<!-- Include the otplib library -->
<script src="https://unpkg.com/@otplib/preset-browser@^12.0.0/index.js"></script>

<script>
document.addEventListener("DOMContentLoaded", async () => {
  const memberstack = window.$memberstackDom;
  const { data: member } = await memberstack.getCurrentMember();
  if (!member) return;

  const form = document.querySelector('[data-ms-form="2fa-verification"]');
  if (!form) return;

  const codeInput = form.querySelector('[data-ms-code="2fa-code"]');
  const errorContainer = form.querySelector('[data-ms-error="2fa-code"]');

  function showError(message) {
    if (errorContainer) {
      errorContainer.textContent = message;
      errorContainer.style.display = 'block';
    } else {
      alert(message);
    }
  }

  function clearError() {
    if (errorContainer) {
      errorContainer.textContent = '';
      errorContainer.style.display = 'none';
    }
  }

  form.addEventListener('submit', async (e) => {
    e.preventDefault();
    e.stopImmediatePropagation(); // important to stop other listeners
    clearError();

    const code = codeInput.value.trim();
    const { data: json } = await memberstack.getMemberJSON();
    const secret = json?.["2fa_secret"];

    if (!secret || !code) {
      const msg = form.getAttribute('data-ms-error-msg-missing') || 'Please enter your 2FA code';
      showError(msg);
      return;
    }

    if (otplib.authenticator.check(code, secret)) {
      sessionStorage.setItem('2fa_verified', 'true');
      window.location.href = '/success';
    } else {
      const msg = form.getAttribute('data-ms-error-msg-invalid') || 'Oops, the 2FA code is incorrect. Try again.';
      showError(msg);
    }
  });
});
</script>

<!-- 💙 MEMBERSCRIPT #153 v2.0 💙 - FREE MULTILINGUAL SITE WITH GOOGLE TRANSLATE -->
<script>
  // 1) Load Google Translate
  const gtScript = document.createElement('script');
  gtScript.src = "//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit";
  document.head.appendChild(gtScript);

  // 2) Hide Google UI
  const style = document.createElement('style');
  style.innerHTML = `
    body { top: 0px !important; position: static !important; }
    .goog-te-banner-frame, .skiptranslate,
    #goog-gt-tt, .goog-te-balloon-frame,
    .goog-text-highlight {
      display: none !important;
      background: none !important;
      box-shadow: none !important;
    }
  `;
  document.head.appendChild(style);

  // 3) Ensure container exists
  if (!document.getElementById('google_translate_element')) {
    const holder = document.createElement('div');
    holder.id = 'google_translate_element';
    holder.style.display = 'none';
    document.body.appendChild(holder);
  }

  // 4) Init widget
  window.googleTranslateElementInit = function () {
    new google.translate.TranslateElement({
      pageLanguage: 'en',
      layout: google.translate.TranslateElement.FloatPosition.TOP_LEFT
    }, 'google_translate_element');
  };

  // 5) Cookies
  function getCookie(name) {
    const cookies = document.cookie.split(';');
    for (let cookie of cookies) {
      const [key, value] = cookie.trim().split('=');
      if (key === name) return decodeURIComponent(value);
    }
    return null;
  }
  function setGoogTransCookie(pathValue) {
    const expiresPast = "expires=Thu, 01 Jan 1970 00:00:01 GMT;";
    const expiresFuture = "expires=Fri, 31 Dec 9999 23:59:59 GMT;";
    if (!pathValue) {
      document.cookie = "googtrans=;path=/;" + expiresPast;
      document.cookie = "googtrans=;domain=.webflow.io;path=/;" + expiresPast;
    } else {
      document.cookie = "googtrans=" + encodeURIComponent(pathValue) + ";path=/;" + expiresFuture;
      document.cookie = "googtrans=" + encodeURIComponent(pathValue) + ";domain=.webflow.io;path=/;" + expiresFuture;
    }
  }

  // 6) Language map
  const languageMap = new Map([
    ["af","Afrikaans"], ["sq","Albanian"], ["ar","Arabic"], ["hy","Armenian"],
    ["az","Azerbaijani"], ["eu","Basque"], ["be","Belarusian"], ["bg","Bulgarian"],
    ["ca","Catalan"], ["zh-CN","ChineseSimplified"], ["zh-TW","ChineseTraditional"],
    ["hr","Croatian"], ["cs","Czech"], ["da","Danish"], ["nl","Dutch"], ["de","German"],
    ["en","English"], ["et","Estonian"], ["tl","Filipino"], ["fi","Finnish"],
    ["fr","French"], ["gl","Galician"], ["ka","Georgian"], ["el","Greek"],
    ["ht","Haitian"], ["iw","Hebrew"], ["hi","Hindi"], ["hu","Hungarian"],
    ["is","Icelandic"], ["id","Indonesian"], ["ga","Irish"], ["it","Italian"],
    ["ja","Japanese"], ["ko","Korean"], ["lv","Latvian"], ["lt","Lithuanian"],
    ["mk","Macedonian"], ["ms","Malay"], ["mt","Maltese"], ["no","Norwegian"],
    ["fa","Persian"], ["pl","Polish"], ["pt","Portuguese"], ["ro","Romanian"],
    ["ru","Russian"], ["sr","Serbian"], ["sk","Slovak"], ["sl","Slovenian"],
    ["es","Spanish"], ["sw","Swahili"], ["sv","Swedish"], ["th","Thai"],
    ["tr","Turkish"], ["uk","Ukrainian"], ["ur","Urdu"], ["vi","Vietnamese"],
    ["cy","Welsh"], ["yi","Yiddish"]
  ]);

  // 7) Current language
  let currentLang = getCookie("googtrans")?.split("/").pop() || "en";

  // 8) Badge + content helpers
  function formatLangCodeForBadge(code) {
    return code && code.includes('-') ? code.toUpperCase() : (code || 'en').slice(0, 2).toUpperCase();
  }
  function updateLanguageBadge(langCode) {
    const badgeEl = document.querySelector('.material-icons.language .google-icons');
    if (badgeEl) {
      const lc = langCode || 'en';
      badgeEl.textContent = formatLangCodeForBadge(lc);
      badgeEl.setAttribute('data-lang', lc);
      const readable = languageMap.get(lc) || lc;
      badgeEl.setAttribute('title', readable);
      badgeEl.setAttribute('aria-label', `Language: ${readable}`);
    }
  }
  function updateLanguageSpecificContent(langCode) {
    const readable = languageMap.get(langCode || 'en');
    const langClass = readable ? `.languagespecific.${readable.toLowerCase()}specific` : `.languagespecific.englishspecific`;
    const fallbackClass = `.languagespecific.englishspecific`;
    document.querySelectorAll('.languagespecific').forEach(el => { el.style.display = 'none'; });
    if (document.querySelector(langClass)) {
      document.querySelectorAll(langClass).forEach(el => el.style.display = 'block');
    } else {
      document.querySelectorAll(fallbackClass).forEach(el => el.style.display = 'block');
    }
  }

  // 9) Wait for dropdown
  function waitForCombo(maxWaitMs = 6000) {
    return new Promise((resolve) => {
      const existing = document.querySelector('.goog-te-combo');
      if (existing) return resolve(existing);
      const started = Date.now();
      const obs = new MutationObserver(() => {
        const c = document.querySelector('.goog-te-combo');
        if (c) {
          obs.disconnect();
          resolve(c);
        } else if (Date.now() - started > maxWaitMs) {
          obs.disconnect();
          resolve(null);
        }
      });
      obs.observe(document.body, { childList: true, subtree: true });
      setTimeout(() => {
        const c = document.querySelector('.goog-te-combo');
        if (c) {
          obs.disconnect();
          resolve(c);
        }
      }, maxWaitMs);
    });
  }

  // 10) Robust event dispatch
  function fireComboEvents(combo) {
    combo.dispatchEvent(new Event('input', { bubbles: true }));
    combo.dispatchEvent(new Event('change', { bubbles: true }));
    combo.dispatchEvent(new Event('blur', { bubbles: true }));
  }
  const sleep = (ms) => new Promise(r => setTimeout(r, ms));

  // 11) Apply language (single-click reliable)
  async function applyLanguage(langCode) {
    const combo = await waitForCombo();

    const target = langCode || 'en';
    updateLanguageBadge(target);
    updateLanguageSpecificContent(target);

    if (!combo) {
      if (target === 'en') {
        setGoogTransCookie('');
        window.location.hash = '';
      } else {
        setGoogTransCookie(`/en/${target}`);
        window.location.hash = `#googtrans(en|${target})`;
      }
      return;
    }

    combo.focus();

    if (target === 'en') {
      setGoogTransCookie('');
      window.location.hash = '';

      const hasBlank = Array.from(combo.options).some(o => o.value === '');
      if (hasBlank) {
        combo.value = '';
        fireComboEvents(combo);
      } else {
        combo.value = 'en';
        fireComboEvents(combo);
        await sleep(120);
        combo.value = '';
        fireComboEvents(combo);
      }
      return;
    }

    if (combo.value === '') {
      combo.value = 'en';
      fireComboEvents(combo);
      await sleep(120);
    }

    setGoogTransCookie(`/en/${target}`);
    window.location.hash = `#googtrans(en|${target})`;

    combo.value = target;
    fireComboEvents(combo);

    await sleep(120);
    if (combo.value !== target) {
      combo.value = target;
      fireComboEvents(combo);
    }
  }

  // 12) Wire up
  document.addEventListener("DOMContentLoaded", function () {
    updateLanguageBadge(currentLang);
    updateLanguageSpecificContent(currentLang);

    document.querySelectorAll('[data-ms-code-lang-select]').forEach(el => {
      el.addEventListener('click', function (e) {
        e.preventDefault();
        const selectedLang = this.getAttribute('data-ms-code-lang');
        applyLanguage(selectedLang);
      });
    });

    waitForCombo().then((combo) => {
      if (!combo) return;
      if (!combo._msBound) {
        combo.addEventListener('change', () => {
          const val = combo.value || 'en';
          updateLanguageBadge(val);
          updateLanguageSpecificContent(val);
        });
        combo._msBound = true;
      }
    });
  });
</script>

<!-- 💙 MEMBERSCRIPT #152 v1.0 💙 - OTP VERIFICATION VIA WHATSAPP IN WEBFLOW -->
<script>
  document.addEventListener("DOMContentLoaded", function () {
    const phoneInput = document.querySelector('[data-ms-code="phone-number"]');
    const form = phoneInput?.closest("form");
    const submitBtn = form?.querySelector('[type="submit"]');

    let isVerified = false;
    let originalMsFormValue = "signup"; // update this if your form uses another Memberstack action

    if (phoneInput && form && submitBtn && window.$WhatsAuthForm) {
      // Temporarily disable Memberstack
      form.removeAttribute("data-ms-form");

      // Create error message
      const errorMsg = document.createElement('div');
      errorMsg.style.color = 'red';
      errorMsg.style.marginTop = '8px';
      errorMsg.style.display = 'none';
      errorMsg.textContent = '⚠️ Please verify your phone number via WhatsApp.';
      phoneInput.parentNode.appendChild(errorMsg);

      // Initially disable submit
      submitBtn.disabled = true;
      submitBtn.style.opacity = 0.6;
      submitBtn.style.cursor = 'not-allowed';

      // Init WhatsAuth
      window.$WhatsAuthForm.init({
        inputSelector: '[data-ms-code="phone-number"]',
        apiKey: "k07Zj8EwdAIzHzLcLPQh-5jCuREbSKXG", //REPLACE WITH YOUR API KEY
        placeholder: phoneInput.getAttribute("data-ms-placeholder") || "",
        primaryColor: phoneInput.getAttribute("data-ms-primary-color") || "",
        secondaryColor: phoneInput.getAttribute("data-ms-secondary-color") || "",
        btnText: phoneInput.getAttribute("data-ms-btn-text") || ""
      });

      // Watch for success class from WhatsAuth
      const observer = new MutationObserver(() => {
        if (phoneInput.classList.contains("whatsauth-success") && !isVerified) {
          isVerified = true;

          // Enable submit
          submitBtn.disabled = false;
          submitBtn.style.opacity = 1;
          submitBtn.style.cursor = 'pointer';

          // Hide error
          errorMsg.style.display = 'none';

          // Re-enable Memberstack
          form.setAttribute("data-ms-form", originalMsFormValue);
        }
      });

      observer.observe(phoneInput, { attributes: true, attributeFilter: ["class"] });

      // Final form safeguard
      form.addEventListener("submit", function (e) {
        if (!isVerified) {
          e.preventDefault();
          errorMsg.style.display = 'block';
        }
      });

      submitBtn.addEventListener("click", function (e) {
        if (!isVerified) {
          e.preventDefault();
          errorMsg.style.display = 'block';
        }
      });
    }
  });
</script>

<!-- 💙 MEMBERSCRIPT #151 v0.1 💙 - ONBOARDING TOUR FOR NEW MEMBERS -->
<script>
  // 1. Wait for Memberstack v2 DOM
  function ready(fn) {
    if (window.$memberstackReady) return fn();
    document.addEventListener("memberstack.ready", fn);
  }

  // 2. Collect all steps from the DOM
  function collectSteps() {
    // all elements with ms-code-step, in a NodeList
    var els = document.querySelectorAll("[ms-code-step]");
    // build an array of { order, element, intro }
    var steps = Array.prototype.map.call(els, function(el) {
      return {
        order: parseInt(el.getAttribute("ms-code-step"), 10),
        element: el,
        intro: el.getAttribute("ms-code-intro") || ""
      };
    });
    // sort by order ascending
    return steps.sort(function(a, b) {
      return a.order - b.order;
    }).map(function(s) {
      return { element: s.element, intro: s.intro };
    });
  }

  // 3. Kick off the tour for first-time members
  function launchTour(member) {
    if (!member || !member.id) return;                // only for logged-in
    if (localStorage.getItem("ms-code-tour-shown")) return;
    // Build steps dynamically
    var options = {
      steps: collectSteps(),
      showProgress: true,
      exitOnOverlayClick: false
    };
    introJs().setOptions(options).start();
    localStorage.setItem("ms-code-tour-shown", "true");
  }

  // 4. Glue it together
  ready(function() {
    window.$memberstackDom
      .getCurrentMember()
      .then(function(res) {
        launchTour(res.data);
      })
      .catch(function(err) {
        console.error("MS-Code-Tour error:", err);
      });
  });
</script>

<!-- 💙 MEMBERSCRIPT #150 v0.1 💙 - SAVE AND UNSAVE ITEMS TO YOUR COLLECTION PART 1 -->
<script>
document.addEventListener("DOMContentLoaded", async () => {
  const ms = window.$memberstackDom;
  const member = await ms.getCurrentMember();
  const isLoggedIn = !!member;
  let savedItems = {};

  const fetchSavedItems = async () => {
    try {
      const { data } = await ms.getMemberJSON();
      savedItems = data.savedItems || {};
    } catch {
      savedItems = {};
    }
  };

  const persistSavedItems = async () => {
    try {
      await ms.updateMemberJSON({ json: { savedItems } });
    } catch (err) {
      console.error("Error saving items:", err);
    }
  };

  const updateButtons = () => {
    document.querySelectorAll('[ms-code-add-button]').forEach(btn => {
      const id = btn.getAttribute('ms-code-save');
      const category = btn.getAttribute('ms-code-category');
      const exists = savedItems[category]?.some(i => i.id === id);
      btn.style.display = exists ? 'none' : 'inline-block';
    });

    document.querySelectorAll('[ms-code-unsave-button]').forEach(btn => {
      const id = btn.getAttribute('ms-code-unsave');
      const category = btn.getAttribute('ms-code-category');
      const exists = savedItems[category]?.some(i => i.id === id);
      btn.style.display = exists ? 'inline-block' : 'none';
    });
  };

  const onAddClick = async (e) => {
    e.preventDefault();
    if (!isLoggedIn) return;

    const btn = e.currentTarget;
    const container = btn.closest('[ms-code-save-item]');
    const id = btn.getAttribute('ms-code-save');
    const category = btn.getAttribute('ms-code-category');
    const img = container?.querySelector('[ms-code-image]');
    const url = img?.src;

    if (!savedItems[category]) savedItems[category] = [];
    if (!savedItems[category].some(i => i.id === id)) {
      savedItems[category].push({ id, url });
      updateButtons();
      await persistSavedItems();
    }
  };

  const onUnsaveClick = async (e) => {
    e.preventDefault();
    if (!isLoggedIn) return;

    const btn = e.currentTarget;
    const id = btn.getAttribute('ms-code-unsave');
    const category = btn.getAttribute('ms-code-category');

    if (savedItems[category]) {
      savedItems[category] = savedItems[category].filter(i => i.id !== id);
      if (savedItems[category].length === 0) delete savedItems[category];
      updateButtons();
      await persistSavedItems();
    }
  };

  const onDownloadClick = (e) => {
    e.preventDefault();
    const btn = e.currentTarget;
    const container = btn.closest('[ms-code-save-item]');
    const img = container?.querySelector('[ms-code-image]');
    const url = img?.src;

    if (url) {
      const a = document.createElement('a');
      a.href = url;
      a.download = '';
      document.body.appendChild(a);
      a.click();
      a.remove();
    }
  };

  const attachListeners = () => {
    document.querySelectorAll('[ms-code-add-button]').forEach(b => b.addEventListener('click', onAddClick));
    document.querySelectorAll('[ms-code-unsave-button]').forEach(b => b.addEventListener('click', onUnsaveClick));
    document.querySelectorAll('[ms-code-download-button]').forEach(b => b.addEventListener('click', onDownloadClick));
  };

  await fetchSavedItems();
  updateButtons();
  attachListeners();
});
</script>

<!-- GENERATE PINTEREST GRID STYLE -->
<script>
$(document).ready(function () {
  setTimeout(function() {
    function resizeGridItem(item) {
      grid = document.getElementsByClassName("grid")[0];
      rowHeight = parseInt(window.getComputedStyle(grid).getPropertyValue('grid-auto-rows'));
      rowGap = parseInt(window.getComputedStyle(grid).getPropertyValue('grid-row-gap'));
      rowSpan = Math.ceil((item.querySelector('.content').getBoundingClientRect().height + rowGap) / (rowHeight + rowGap));
      item.style.gridRowEnd = "span " + rowSpan;
    }

    function resizeAllGridItems() {
      allItems = document.getElementsByClassName("item");
      for (x = 0; x < allItems.length; x++) {
        resizeGridItem(allItems[x]);
      }
    }

    function resizeInstance(instance) {
      item = instance.elements[0];
      resizeGridItem(item);
    }

    window.onload = resizeAllGridItems();
    window.addEventListener("resize", resizeAllGridItems);

    allItems = document.getElementsByClassName("item");
    for (x = 0; x < allItems.length; x++) {
      imagesLoaded(allItems[x], resizeInstance);
    }

    setTimeout(function() { resizeInstance() }, 100);
  }, 800);
})
</script>

<!-- 💙 MEMBERSCRIPT #150 v0.1 💙 - SAVE AND UNSAVE ITEMS TO YOUR COLLECTION PART 2 -->
<script>
document.addEventListener("DOMContentLoaded", async () => {
  const ms = window.$memberstackDom;
  const wrapper = document.querySelector('[ms-code-collections-wrapper]');
  const template = document.querySelector('[ms-code-folder-template]') || document.querySelector('[ms-code-folder]');
  const emptyState = document.querySelector('[ms-code-empty]');
  if (!wrapper || !template) return;

  let member;
  try {
    member = await ms.getCurrentMember();
  } catch {
    wrapper.textContent = "Please log in to view your collections.";
    return;
  }

  let savedItems = {};
  try {
    const { data } = await ms.getMemberJSON();
    savedItems = data?.savedItems || {};
  } catch {
    wrapper.textContent = "Could not load your collections.";
    return;
  }

  if (Object.keys(savedItems).length === 0) {
    wrapper.innerHTML = '';
    if (emptyState) emptyState.style.display = 'block';
    return;
  }

  if (emptyState) emptyState.style.display = 'none';
  wrapper.innerHTML = '';

  const persistSavedItems = async () => {
    try {
      await ms.updateMemberJSON({ json: { savedItems } });
    } catch (err) {
      console.error("Failed to save", err);
    }
  };

  const updateButtons = (modal, id, category) => {
    const addBtn = modal.querySelector('[ms-code-add-button]');
    const unsaveBtn = modal.querySelector('[ms-code-unsave-button]');
    const exists = savedItems[category]?.some(item => item.id === id);
    addBtn.style.display = exists ? 'none' : 'inline-block';
    unsaveBtn.style.display = exists ? 'inline-block' : 'none';
  };

  Object.entries(savedItems).forEach(([category, items]) => {
    const folderClone = template.cloneNode(true);
    const titleEl = folderClone.querySelector('[ms-code-folder-title]');
    if (titleEl) titleEl.textContent = `${category} (${items.length})`;

    const imageContainer = folderClone.querySelector('[ms-code-folder-items]');
    const imageTemplate = folderClone.querySelector('[ms-code-folder-image]');
    if (imageTemplate) imageTemplate.style.display = 'none';

    const modal = folderClone.querySelector('[ms-code-modal]');
    const modalImg = folderClone.querySelector('[ms-code-modal-img]');
    const modalClose = folderClone.querySelector('[ms-code-modal-close]');
    const addButton = folderClone.querySelector('[ms-code-add-button]');
    const unsaveButton = folderClone.querySelector('[ms-code-unsave-button]');
    const downloadButton = folderClone.querySelector('[ms-code-download-button]');
    const hiddenImage = folderClone.querySelector('[ms-code-image]');

    items.forEach(item => {
      const imgClone = imageTemplate.cloneNode(true);
      imgClone.src = item.url;
      imgClone.alt = category;
      imgClone.style.display = 'block';
      imgClone.style.objectFit = 'cover';
      imgClone.style.width = '100%';
      imgClone.style.height = 'auto';
      imgClone.style.maxWidth = '100%';

      imgClone.addEventListener('click', () => {
        if (modal && modalImg) {
          modalImg.src = item.url;
          if (hiddenImage) hiddenImage.src = item.url;

          const id = item.id;
          addButton.onclick = async (e) => {
            e.preventDefault();
            savedItems[category] = savedItems[category] || [];
            if (!savedItems[category].some(i => i.id === id)) {
              savedItems[category].push({ id, url: item.url });
              await persistSavedItems();
              updateButtons(modal, id, category);
            }
          };

          unsaveButton.onclick = async (e) => {
            e.preventDefault();
            savedItems[category] = savedItems[category].filter(i => i.id !== id);
            if (savedItems[category].length === 0) delete savedItems[category];
            await persistSavedItems();
            modal.style.display = 'none';
            location.reload();
          };

          downloadButton.onclick = (e) => {
            e.preventDefault();
            const a = document.createElement('a');
            a.href = item.url;
            a.download = '';
            document.body.appendChild(a);
            a.click();
            document.body.removeChild(a);
          };

          updateButtons(modal, id, category);
        }
        modal.style.display = 'flex';
      });

      imageContainer.appendChild(imgClone);
    });

    if (modal && modalClose) {
      modalClose.addEventListener('click', () => {
        modal.style.display = 'none';
        if (modalImg) modalImg.src = '';
      });
    }

    wrapper.appendChild(folderClone);
  });
});
</script>

<!-- 💙 MEMBERSCRIPT #149 v0.1 💙 - FAVICON FOR DARK/LIGHT MODE -->
<script>
  // Helper: Retrieve or create a favicon element
  function getFaviconElement() {
    let favicon = document.querySelector('link[rel="icon"]') ||
        document.querySelector('link[rel="shortcut icon"]');
    if (!favicon) {
      favicon = document.createElement('link');
      favicon.rel = 'icon';
      document.head.appendChild(favicon);
    }
    return favicon;
  }

  // Function to update the favicon based on dark mode
  function updateFavicon(e) {
    const darkModeOn = e ? e.matches : window.matchMedia('(prefers-color-scheme: dark)').matches;
    const favicon = getFaviconElement();
    // Update these paths to your favicon assets in Webflow’s Asset Manager or a CDN
    favicon.href = darkModeOn
      ? 'https://cdn.prod.website-files.com/67fcff014042c2f5945437c0/67fd000f85b2a9f281a373ca_Dark%20Mode%20Logo.png'
      : 'https://cdn.prod.website-files.com/67fcff014042c2f5945437c0/67fd000f1c2fa3cebee1b150_Light%20Mode%20Logo.png';
  }

  // Initialize the favicon update on page load
  updateFavicon();

  // Listen for changes in the dark mode media query
  const darkModeMediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
  if (typeof darkModeMediaQuery.addEventListener === 'function') {
    darkModeMediaQuery.addEventListener('change', updateFavicon);
  } else if (typeof darkModeMediaQuery.addListener === 'function') {
    darkModeMediaQuery.addListener(updateFavicon);
  }
</script>

<!-- 💙 MEMBERSCRIPT #148 v0.1 💙 - DISABLE WEBFLOW FORM SUCCESS WINDOW -->
<script>
  document.addEventListener('DOMContentLoaded', function () {
    const form = document.querySelector('[ms-code-form="form"]');
    const successEl = document.querySelector('[ms-code-success="true"]');

    if (!form || !successEl) return;

    const observer = new MutationObserver(() => {
      const isVisible = window.getComputedStyle(successEl).display !== 'none';
      if (isVisible) {
        successEl.style.display = 'none';
        form.style.display = 'block';
      }
    });

    observer.observe(successEl, { attributes: true, attributeFilter: ['style'] });

    // Cleanup observer when done (optional, for performance)
    form.addEventListener('w-form-success', () => {
      setTimeout(() => {
        observer.disconnect();
      }, 100);
    });
  });
</script>

<!-- 💙 MEMBERSCRIPT #147 v0.1 💙 - AGE VERIFICATION POPUP WITH COOKIES -->
<script>
  // Simple cookie helper functions
  function setCookie(name, value, days) {
    const date = new Date();
    date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
    document.cookie = name + "=" + value + "; expires=" + date.toUTCString() + "; path=/";
  }

  function getCookie(name) {
    const cname = name + "=";
    const decodedCookie = decodeURIComponent(document.cookie);
    const cookies = decodedCookie.split(';');
    for (let i = 0; i < cookies.length; i++) {
      let c = cookies[i].trim();
      if (c.indexOf(cname) === 0) {
        return c.substring(cname.length, c.length);
      }
    }
    return "";
  }

  document.addEventListener('DOMContentLoaded', function() {
    // Select the age gate element via ms-code attribute
    const ageGateEl = document.querySelector('[ms-code-agegate]');

    // On page load: if the cookie exists, hide the age gate
    if (getCookie('ms-code-ageVerified') === 'true') {  
      if (ageGateEl) ageGateEl.style.display = 'none';
    }

    // Listen for clicks on elements with ms-code-click
    document.addEventListener('click', function(event) {
      if (event.target.closest('[ms-code-click="confirmAge"]')) {
        setCookie('ms-code-ageVerified', 'true', 30);
        if (ageGateEl) ageGateEl.style.display = 'none';
      } else if (event.target.closest('[ms-code-click="denyAge"]')) {
        window.location.href = 'https://age-verification-popup-with-cookies.webflow.io/access-denied'; // Change URL as needed
      }
    });
  });
</script>

<!-- 💙 MEMBERSCRIPT #146 v0.1 💙 - STOP VIDEOS FROM PLAYING WHEN A MODAL CLOSES -->
<script>
  document.addEventListener('DOMContentLoaded', function() {
    // Select all modals on the page
    var modals = document.querySelectorAll('[data-ms-modal="modal"]');

    function initializeModal(modal) {
      var iframe = modal.querySelector('iframe');
      if (!iframe) return; // If no iframe found, do nothing
      var originalSrc = iframe.dataset.src || iframe.src;

      // Function to stop video playback
      function stopVideo() {
        iframe.src = "";
        setTimeout(() => {
          iframe.src = originalSrc;
        }, 100);
      }

      // Attach event listeners to all close buttons inside the modal
      var closeBtns = modal.querySelectorAll('[data-ms-modal="close"]');
      closeBtns.forEach(function(closeBtn) {
        closeBtn.addEventListener('click', function(e) {
          e.preventDefault();
          stopVideo();
        });
      });

      // Also close the modal when clicking outside the content
      modal.addEventListener('click', function(e) {
        if (e.target === modal) {
          stopVideo();
        }
      });
    }

    // Initialize all modals
    modals.forEach(initializeModal);
  });
</script>

<!-- 💙 MEMBERSCRIPT #145 v0.1 💙 - HOW TO PRE-FILL FORM INPUT FIELDS AT PAGE LOAD -->
<script>
  document.addEventListener('DOMContentLoaded', function() {
    // Function to store form data in localStorage
    function storeFormData() {
      const fields = document.querySelectorAll('input[ms-code-field-id], textarea[ms-code-field-id], select[ms-code-field-id]');
      fields.forEach(function(field) {
        const fieldId = field.getAttribute('ms-code-field-id');
        const value = field.value.trim();
        if (value) {
          localStorage.setItem(fieldId, value);
        }
      });
    }

    // Function to pre-fill form fields with stored data
    function preFillForm() {
      const fields = document.querySelectorAll('input[ms-code-field-id], textarea[ms-code-field-id], select[ms-code-field-id]');
      fields.forEach(function(field) {
        const fieldId = field.getAttribute('ms-code-field-id');
        const storedValue = localStorage.getItem(fieldId);
        if (storedValue) {
          field.value = storedValue;
        }
      });
    }

    // Handle form submission
    const form = document.querySelector('#my-form, form[ms-code-form-id]');
    if (form) {
      form.addEventListener('submit', function(event) {
        event.preventDefault(); // Prevent default form submission
        storeFormData();

        // Refresh the page after storing data
        setTimeout(function() {
          location.reload();
        }, 500); // Short delay to simulate form submission
      });
    }

    // Pre-fill form fields when the page loads
    preFillForm();
  });
</script>

<!-- 💙 MEMBERSCRIPT #144 v0.1 💙 - TRACK A USERS LOGIN HISTORY & ACTIVE USERS -->
<script>
  (function(){
    const memberstack = window.$memberstackDom;

    // Helper: Execute callback when Memberstack is ready
    function onMemberstackReady(cb) {
      if (window.$memberstackReady) {
        cb();
      } else {
        document.addEventListener("memberstack.ready", cb);
      }
    }

    async function initTracking() {
      // Check if a member is logged in (via localStorage)
      const currentUser = JSON.parse(localStorage.getItem("_ms-mem") || "null");
      if (!currentUser) {
        console.warn("No logged-in member found. Tracking not applied.");
        return;
      }

      // Retrieve member metadata
      const memberJson = await memberstack.getMemberJSON();
      let metadata = memberJson.data || {};

      // Ensure userVisits exists as an array
      metadata.userVisits = Array.isArray(metadata.userVisits) ? metadata.userVisits : [];

      // Use ISO date (YYYY-MM-DD) to record one visit per day
      const today = new Date().toISOString().split("T")[0];
      if (!metadata.userVisits.includes(today)) {
        metadata.userVisits.push(today);
      }

      // Helper: Compute consecutive login streak from userVisits
      function computeStreak(visits) {
        if (!visits.length) return 0;
        // Ensure dates are unique and sorted ascending
        const uniqueVisits = [...new Set(visits)].sort();
        let streak = 1;
        let currentDate = new Date(uniqueVisits[uniqueVisits.length - 1]);
        for (let i = uniqueVisits.length - 2; i >= 0; i--) {
          const prevDate = new Date(uniqueVisits[i]);
          const diffDays = Math.floor((currentDate - prevDate) / (1000 * 60 * 60 * 24));
          if (diffDays === 1) {
            streak++;
            currentDate = prevDate;
          } else {
            break;
          }
        }
        return streak;
      }

      // Calculate the login streak and total visits
      metadata.loginStreak = computeStreak(metadata.userVisits);
      metadata.totalVisits = metadata.userVisits.length;

      // Update Memberstack metadata
      await memberstack.updateMemberJSON({ json: metadata });

      console.log("User visits:", metadata.userVisits);
      console.log("Login streak:", metadata.loginStreak);
      console.log("Total visits:", metadata.totalVisits);
    }

    onMemberstackReady(initTracking);
  })();
</script>

<!-- 💙 MEMBERSCRIPT #143 v0.1 💙 - GENERATE INITIALS BASED AVATAR -->
<script>
  document.addEventListener("DOMContentLoaded", function () {
    const checkMemberstack = setInterval(() => {
      if (window.$memberstackDom) {
        clearInterval(checkMemberstack);

        window.$memberstackDom.getCurrentMember().then(({ data }) => {
          if (!data) return console.log("No member data (logged out)");

          const profileImage = document.querySelector('[data-ms-member="profile-image"]');
          const avatarWrapper = document.querySelector('[data-ms-code="avatar"]');
          const initialsDiv = avatarWrapper?.querySelector('.ms-avatar-initial');

          if (data.profileImage) {
            profileImage?.style.setProperty("display", "block");
            avatarWrapper?.style.setProperty("display", "none");
          } else {
            profileImage?.style.setProperty("display", "none");
            avatarWrapper?.style.setProperty("display", "flex");

            // Get initials from available fields
            const first = data.customFields["first-name"]?.trim().charAt(0).toUpperCase() || "";
            const last = data.customFields["last-name"]?.trim().charAt(0).toUpperCase() || "";
            let initials = first + last;

            if (!initials) {
              const fullName = data.customFields["name"]?.trim().split(" ") || [];
              initials = fullName.length > 1
                ? (fullName[0].charAt(0) + fullName[1].charAt(0)).toUpperCase()
                : fullName[0]?.charAt(0).toUpperCase() || "?";
            }

            if (initialsDiv) {
              initialsDiv.textContent = initials;
            } else {
              avatarWrapper.innerHTML = `
${initials}
`;
            }
          }
        }).catch(console.error);
      }
    }, 100);
  });
</script>

<!-- 💙 MEMBERSCRIPT #142 v0.1 💙 - EMBED PDFS IN WEBFLOW -->
<script>
  document.addEventListener("DOMContentLoaded", function () {
    const pdfElements = document.querySelectorAll('[ms-code-pdf-src]');

    pdfElements.forEach(function (element) {
      const src = element.getAttribute('ms-code-pdf-src');
      const height = element.getAttribute('ms-code-pdf-height') || '500px';

      const iframe = document.createElement('iframe');
      iframe.src = src;
      iframe.style.width = '100%';
      iframe.style.height = height;
      iframe.style.border = 'none';
      // Set the iframe to block to remove any inline element gaps
      iframe.style.display = 'block';
      iframe.setAttribute('scrolling', 'auto');

      element.innerHTML = '';
      element.appendChild(iframe);
    });
  });
</script>

<!-- 💙 MEMBERSCRIPT #141 v0.1 💙 - START YOUTUBE VIDEO AT SPECIFIC TIME -->
<script>
  (function() {
    // Function to get URL parameters
    function getUrlParameter(name) {
      name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
      var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
      var results = regex.exec(location.search);
      return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
    }

    // Function to update YouTube embed src within Embedly iframe
    function updateYouTubeEmbed(embedly_iframe, startTime) {
      var embedly_src = embedly_iframe.src;
      var youtube_src_match = embedly_src.match(/src=([^&]+)/);
      if (youtube_src_match) {
        var youtube_src = decodeURIComponent(youtube_src_match[1]);
        var new_youtube_src = youtube_src.replace(/(\?|&)start=\d+/, '');
        new_youtube_src += (new_youtube_src.includes('?') ? '&' : '?') + 'start=' + startTime;
        var new_embedly_src = embedly_src.replace(/src=([^&]+)/, 'src=' + encodeURIComponent(new_youtube_src));
        embedly_iframe.src = new_embedly_src;
      }
    }

    // Get all elements with ms-code-yt-start attribute
    var elements = document.querySelectorAll('[ms-code-yt-start]');

    elements.forEach(function(element) {
      var paramName = element.getAttribute('ms-code-yt-start');
      var startTime = getUrlParameter(paramName);
      var defaultStartTime = element.getAttribute('ms-code-yt-start-default');

      // If no URL parameter, use the default start time (if specified)
      if (!startTime && defaultStartTime) {
        startTime = defaultStartTime;
      }

      // If we have a start time (either from URL or default), update the embed
      if (startTime) {
        var iframe = element.querySelector('iframe.embedly-embed');
        if (iframe) {
          updateYouTubeEmbed(iframe, startTime);
        }
      }
    });
  })();
</script>

<!-- 💙 MEMBERSCRIPT #140 v0.1 💙 - CONFIRM MATCHING INPUTS -->
<script>
  document.addEventListener('DOMContentLoaded', function() {
    const forms = document.querySelectorAll('form');

    forms.forEach(form => {
      const inputPairs = form.querySelectorAll('[ms-code-conf-input]');
      const submitButton = form.querySelector('input[type="submit"], button[type="submit"]');

      if (!submitButton) {
        console.error('Submit button not found in the form');
        return;
      }

      function validateForm() {
        let fieldsMatch = true;

        inputPairs.forEach(input => {
          const confType = input.getAttribute('ms-code-conf-input');
          const confirmInput = form.querySelector(`[ms-code-conf="${confType}"]`);
          const errorElement = form.querySelector(`[ms-code-conf-error="${confType}"]`);

          if (confirmInput && errorElement) {
            if (input.value && confirmInput.value) {
              if (input.value !== confirmInput.value) {
                errorElement.style.removeProperty('display');
                fieldsMatch = false;
              } else {
                errorElement.style.display = 'none';
              }
            } else {
              errorElement.style.display = 'none';
            }
          }
        });

        if (fieldsMatch) {
          submitButton.style.removeProperty('pointer-events');
          submitButton.disabled = false;
        } else {
          submitButton.style.pointerEvents = 'none';
          submitButton.disabled = true;
        }
      }

      inputPairs.forEach(input => {
        const confType = input.getAttribute('ms-code-conf-input');
        const confirmInput = form.querySelector(`[ms-code-conf="${confType}"]`);

        if (confirmInput) {
          input.addEventListener('input', validateForm);
          confirmInput.addEventListener('input', validateForm);
        }
      });

      // Initial validation
      validateForm();

      // Extra precaution: prevent form submission if fields don't match
      form.addEventListener('submit', function(event) {
        if (submitButton.disabled) {
          event.preventDefault();
          console.log('Form submission blocked: Fields do not match');
        }
      });
    });
  });
</script>

<!-- 💙 MEMBERSCRIPT #139 v0.1 💙 - RESET FORM BUTTON -->
<script>
  // Wait for the DOM to be fully loaded
  document.addEventListener('DOMContentLoaded', function() {
    // Find all "Add another" buttons
    const resetButtons = document.querySelectorAll('[ms-code-reset-form]');

    // Add click event listener to each button
    resetButtons.forEach(function(resetButton) {
      resetButton.addEventListener('click', function(e) {
        e.preventDefault(); // Prevent default link behavior

        // Find the closest form and success message elements
        const formWrapper = this.closest('.w-form');
        const form = formWrapper.querySelector('form');
        const successMessage = formWrapper.querySelector('.w-form-done');

        // Reset the form
        form.reset();

        // Hide the success message
        successMessage.style.display = 'none';

        // Show the form
        form.style.display = 'block';
      });
    });
  });
</script>

<!-- 💙 MEMBERSCRIPT #138 v0.1 💙 - ANCHOR LINK SCROLL OFFSET -->
<script>
  // Disable Webflow's built-in smooth scrolling
  var Webflow = Webflow || [];
  Webflow.push(function() {
    $(function() { 
      $(document).off('click.wf-scroll');
    });
  });

  // Smooth scroll implementation with customizable settings
  (function() {
    // Customizable settings
    const SCROLL_SETTINGS = {
      duration: 1000, // in milliseconds
      easing: 'easeInOutCubic' // 'linear', 'easeInQuad', 'easeOutQuad', 'easeInOutQuad', 'easeInCubic', 'easeOutCubic', 'easeInOutCubic'
    };

    const EASING_FUNCTIONS = {
      linear: t => t,
      easeInQuad: t => t * t,
      easeOutQuad: t => t * (2 - t),
      easeInOutQuad: t => t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t,
      easeInCubic: t => t * t * t,
      easeOutCubic: t => (--t) * t * t + 1,
      easeInOutCubic: t => t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1
    };

    function getOffset() {
      const navbar = document.querySelector('[ms-code-scroll-offset]');
      if (!navbar) return 0;
      const navbarHeight = navbar.offsetHeight;
      const customOffset = parseInt(navbar.getAttribute('ms-code-scroll-offset') || '0', 10);
      return navbarHeight + customOffset;
    }

    function smoothScroll(target) {
      const startPosition = window.pageYOffset;
      const offset = getOffset();
      const targetPosition = target.getBoundingClientRect().top + startPosition - offset;
      const distance = targetPosition - startPosition;
      let startTime = null;

      function animation(currentTime) {
        if (startTime === null) startTime = currentTime;
        const timeElapsed = currentTime - startTime;
        const progress = Math.min(timeElapsed / SCROLL_SETTINGS.duration, 1);
        const easeProgress = EASING_FUNCTIONS[SCROLL_SETTINGS.easing](progress);
        window.scrollTo(0, startPosition + distance * easeProgress);
        if (timeElapsed < SCROLL_SETTINGS.duration) requestAnimationFrame(animation);
      }

      requestAnimationFrame(animation);
    }

    function handleClick(e) {
      const href = e.currentTarget.getAttribute('href');
      if (href.startsWith('#')) {
        e.preventDefault();
        const target = document.getElementById(href.slice(1));
        if (target) smoothScroll(target);
      }
    }

    function handleHashChange() {
      if (window.location.hash) {
        const target = document.getElementById(window.location.hash.slice(1));
        if (target) {
          setTimeout(() => smoothScroll(target), 0);
        }
      }
    }

    function init() {
      document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', handleClick);
      });
      window.addEventListener('hashchange', handleHashChange);
      handleHashChange(); // Handle initial hash on page load
    }

    document.addEventListener('DOMContentLoaded', init);
    window.Webflow && window.Webflow.push(init);
  })();
</script>

<!-- 💙 MEMBERSCRIPT #137 v0.1 💙 - DISPLAY COUNTRY NAME -->
<script>
  document.addEventListener('DOMContentLoaded', function() {
    fetch('https://ipapi.co/json/')
      .then(response => response.json())
      .then(data => {
        if (data.country_name) {
          const countryElements = document.querySelectorAll('[ms-code-display-country]');
          countryElements.forEach(element => {
            element.textContent = data.country_name;
          });
        }
      })
      .catch(error => {
        console.error('Error fetching country:', error);
      });
  });
</script>

<!-- 💙 MEMBERSCRIPT #136 💙 REMOVE SECTION PATH FROM URL -->
<script>
document.addEventListener('DOMContentLoaded', function() {
    // Check if there's a hash in the URL
    if (window.location.hash) {
        // Get the target element
        const targetId = window.location.hash.substring(1);
        const targetElement = document.getElementById(targetId);

        if (targetElement) {
            // Scroll to the target element
            targetElement.scrollIntoView({behavior: 'smooth'});

            // Remove the hash after a short delay (to allow scrolling to complete)
            setTimeout(function() {
                history.pushState("", document.title, window.location.pathname + window.location.search);
            }, 100);
        }
    }

    // Add click event listeners to all internal links
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function(e) {
            e.preventDefault();

            const targetId = this.getAttribute('href').substring(1);
            const targetElement = document.getElementById(targetId);

            if (targetElement) {
                targetElement.scrollIntoView({behavior: 'smooth'});

                // Remove the hash after a short delay (to allow scrolling to complete)
                setTimeout(function() {
                    history.pushState("", document.title, window.location.pathname + window.location.search);
                }, 100);
            }
        });
    });
});
</script>