<script src="https://unpkg.com/swiper@8/swiper-bundle.min.js"></script>
<script>
$(".swiper").append(`<div class="swiper-scrollbar"></div>`);
$(".swiper").append(`<div class="swiper-pagination"></div>`);
$(".swiper").append(`<div class="swiper-arrow button-prev"></div>`);
$(".swiper").append(`<div class="swiper-arrow button-next"></div>`);

const swiper2 = new Swiper(".is-swiper-slider", {
  // Optional parameters
  direction: "horizontal",
  a11y: true,
  loop: true,
  slidesPerView: 2,
  slidesPerGroup: 2,
  spaceBetween: 20,
  loop: false,
  parallax: true,
  centeredSlides: false,
  mousewheel: {
    forceToAxis: true
  },
  keyboard: {
      enabled: true
    },
  speed: 600,
  // Responsive breakpoints
  breakpoints: {
    // when window width is >= 0px
     0: {
      slidesPerView: 1,
      slidesPerGroup: 1
    },
    
    // when window width is >= 480px
    480: {
      slidesPerView: 1,
      slidesPerGroup: 1
    },
    // when window width is >= 768px
    768: {
      slidesPerView: 2,
      slidesPerGroup: 2
    },
    // when window width is >= 992px
    992: {
      slidesPerView: 2,
      slidesPerGroup: 2
    }
  },

  // Navigation arrows
  navigation: {
    nextEl: ".button-next",
    prevEl: ".button-prev"
  },

  // And if we need scrollbar
  scrollbar: {
    el: ".swiper-scrollbar",
    draggable: true
  }
});
</script>

<script>
//Heading Span Stroke
$(document).ready(function() {
    $('.text-style-base-line').each(function() {
        // Find the nearest image's src that is a sibling to the parent heading of the span
        let imageUrl = $(this).closest('h1, h2, h3, h4, h5, h6').siblings('img').attr('src');

        // If such an image exists and has a src, set it as the background
        if (imageUrl) {
            $(this).css('background-image', 'url(' + imageUrl + ')');
        }
    });
});
</script>

<script>

// Sticky Navbar Mechanism
// Get the navbar
var navbar = document.querySelector(".navbar_component");
var delayTimeout; // Keep a reference to the timeout so you can clear it

// Event handler for viewport > 991
function largeViewportHandler() {
  clearTimeout(delayTimeout); // Clear any existing timeout

  if (window.scrollY > 120 && window.scrollY <= 500) {
    // Set a delay to add the class
    delayTimeout = setTimeout(function() {
      navbar.classList.add("is-sticky");
    }, 500); // 500ms delay for demonstration, change as required
  } else if (window.scrollY <= 120) {
    navbar.classList.remove("is-sticky");
  } else if (window.scrollY > 500) {
    navbar.classList.add("is-sticky");
  }
}

// Event handler for viewport <= 991
function smallViewportHandler() {
  clearTimeout(delayTimeout); // Clear any existing timeout

  if (window.scrollY > 50 && window.scrollY <= 500) {
    // Set a delay to add the class
    delayTimeout = setTimeout(function() {
      navbar.classList.add("is-sticky");
    }, 500); // 500ms delay for demonstration, change as required
  } else if (window.scrollY <= 50) {
    navbar.classList.remove("is-sticky");
  } else if (window.scrollY > 500) {
    navbar.classList.add("is-sticky");
  }
}

// Attach the appropriate handler based on the viewport size
window.addEventListener("scroll", function() {
  if (window.innerWidth > 991) {
    largeViewportHandler();
  } else {
    smallViewportHandler();
  }
});

//Navbar menu button interaction
$('.navbar_menu-button').on('click', function() {
  console.log("Button clicked!"); // Add this line
  $('.navbar_container').toggleClass('is-open');
  $('body').toggleClass('overflow-hidden');
});

</script>

<script defer>
//Dynamic year values in "© 2023 Alternaleaf. All rights reserved."
$(function() {
  $('.current-year').text(new Date().getFullYear());
});
</script>

<script>
    jQuery(document).ready(function( $ ) {
        $("[fs-numbercount-element='number-1']").counterUp({
            delay: 10, // the delay time in ms
            time: 2000 // the speed time in ms
        });

        $("[fs-numbercount-element='number-2']").counterUp({
            delay: 10, // the delay time in ms
            time: 2000 // the speed time in ms
        });
    });
</script>
    

<script>
$(document).ready(function() {
  var searchInput = $("[data-blog-category='search']");
  var sectionBlog = $("[data-blog-category='section']");
  var recentArticleHeading = $("[data-blog-category='recent-article-heading']");

  searchInput.keyup(function() {
    var inputValue = $(this).val();
    
    if (inputValue.length > 0) {
      sectionBlog.css({ height: "0px", opacity: 0 });
      recentArticleHeading.css({ display: 'none' });
    } else {
      sectionBlog.css({ height: "auto", opacity: 1 });
      recentArticleHeading.css({ display: 'block' });
    }
  });
});

// Assuming you have jQuery loaded on your page
$(document).ready(function() {
  // Find the parent element with class .cannaverse-header_info-radio
  var parentElement = $('.cannaverse-header_info-radio');

  // Find the child element with class .cannaverse-header_info-item within the parent
  var childElement = parentElement.find('.cannaverse-header_info-item');

  // Click on the child element
  childElement.click();
});

</script>

<script>
document.addEventListener("DOMContentLoaded", function () {
  const triggerElements = document.querySelectorAll(
    "[data-trigger], [data-trigger-final]"
  );

  triggerElements.forEach(function (element) {
    element.addEventListener("click", function () {
      const triggerValue =
        element.getAttribute("data-trigger") ||
        element.getAttribute("data-trigger-final");
      const targetElements = document.querySelectorAll(
        "[data-target], [data-target-final]"
      );

      targetElements.forEach(function (targetElement) {
        const targetAttributeValue =
          targetElement.getAttribute("data-target") ||
          targetElement.getAttribute("data-target-final");

        if (targetAttributeValue === triggerValue) {
          targetElement.style.display = "block"; // Show matched elements using flex
        } else {
          targetElement.style.display = "none"; // Hide non-matched elements
        }
      });
    });
  });
});

document.addEventListener("DOMContentLoaded", function () {
  const triggerElements = document.querySelectorAll(
    "[data-trigger], [data-trigger-final], [data-trigger-style='short'], [data-btn='edit'], [data-form='back-btn']"
  );
  const quizListElement = document.querySelector(".cannaverse-quiz_quiz-list");

  triggerElements.forEach(function (element) {
    element.addEventListener("click", function () {
      if (
        element.getAttribute("data-btn") === "edit" ||
        element.getAttribute("data-form") === "back-btn"
      ) {
        quizListElement.classList.remove("is-step-2", "is-step-3", "is-small");
      } else {
        if (element.getAttribute("data-trigger")) {
          quizListElement.classList.add("is-step-2");
        }

        if (element.getAttribute("data-trigger-final")) {
          quizListElement.classList.add("is-step-3");
          quizListElement.classList.remove("is-small");
        }

        if (element.getAttribute("data-trigger-style") === "short") {
          quizListElement.classList.add("is-step-2", "is-small");
        }
      }
    });
  });
});
</script>

<script>
const element = document.querySelector("[data-article='breadcrumb-article-name']");

if (element && element.innerText.length > 10) {
    element.innerText = element.innerText.substring(0, 10) + '...';
}
</script>

<script>
    // Wait for the document to be ready
    $(document).ready(function() {
        // Find the first element with the attribute data-faq-accordion
        var firstAccordion = $('[data-faq-accordion]').first();

        // Find the child element with the attribute data-faq-question and simulate a click
        var questionElement = firstAccordion.find('[data-faq-question]').first();
        questionElement.click();
    }); 
    
//FAQ functionality
document.addEventListener("DOMContentLoaded", function () {
  const anchorLinks = document.querySelectorAll("[data-faq-anchor-link]");
  const categories = document.querySelectorAll("[data-faq-category]");

  // Set the 'is-current' class to the first button by default
  if (anchorLinks[0]) {
    anchorLinks[0].classList.add("is-current");
  }

  function resetButtonActiveState() {
    anchorLinks.forEach((link) => {
      link.classList.remove("is-current");
    });
  }

  function updateButtonActiveState() {
    let closestCategoryIndex = -1;
    let closestCategoryDistance = Infinity;

    categories.forEach((category, index) => {
      const rect = category.getBoundingClientRect();
      if (rect.top >= -140 && rect.top < closestCategoryDistance) {
        closestCategoryDistance = rect.top;
        closestCategoryIndex = index;
      }
    });

    if (closestCategoryIndex > -1) {
      resetButtonActiveState();
      anchorLinks[closestCategoryIndex].classList.add("is-current");
    }
  }

  // Adjust active state based on scrolling
  window.addEventListener("scroll", updateButtonActiveState);

  // Button click functionality
  anchorLinks.forEach((link, index) => {
    link.addEventListener("click", function () {
      if (categories[index]) {
        const targetPosition =
          categories[index].getBoundingClientRect().top +
          window.pageYOffset -
          140;
        window.scrollTo(0, targetPosition);

        // Wait for the scroll to complete, then update the button active state
        setTimeout(() => {
          updateButtonActiveState();
        }, 140); // Assuming it takes less than 160ms to scroll. Adjust if needed.
      }
    });
  });

  // Update button states initially
  updateButtonActiveState();
});
</script>

<script>
//direct file download
const downloadLinks = document.querySelectorAll('[data-download-file="link"]');

downloadLinks.forEach(link => {
  link.addEventListener('click', e => {
    e.preventDefault();
    const url = link.getAttribute('href');
    const fileName = link.getAttribute('data-file-name');
    const originalText = link.innerText;
    link.innerText = 'Downloading...';
    link.disabled = true;
    fetch(url)
      .then(response => response.blob())
      .then(blob => {
        const downloadLink = document.createElement('a');
        downloadLink.setAttribute('href', URL.createObjectURL(blob));
        downloadLink.setAttribute('download', fileName);
        downloadLink.setAttribute('target', '_blank');
        downloadLink.style.display = 'none';
        document.body.appendChild(downloadLink);
        downloadLink.click();
        link.innerText = originalText;
        link.disabled = false;
        setTimeout(() => {
          document.body.removeChild(downloadLink);
        }, 100);
      });
  });
});
</script>

<!-- [Attributes by Finsweet] CMS Sort -->
<script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmssort@1/cmssort.js"></script>

<!-- [Attributes by Finsweet] CMS Filter -->
<script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsfilter@1/cmsfilter.js"></script>

<!-- [Attributes by Finsweet] Disable scrolling -->
<script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-scrolldisable@1/scrolldisable.js"></script>

<!-- [Attributes by Finsweet] Disable scrolling -->
<script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-scrolldisable@1/scrolldisable.js"></script>