/* ---------- INIT ---------- */
const $quizPage = $(".quiz-content-page");
const $nextBtns = $(".button-next");
const $radios = $(".w-radio");

/* ---------- Swiper ---------- */
const quizSwiper = new Swiper(".quiz-swiper", {
  slidesPerView: 1,
  effect: "fade",
  allowTouchMove: false,
  edgeSwipeDetection: "prevent",
});

/* ---------- Disable next buttons ---------- */
$nextBtns.not(".start").addClass("disabled-button");

/* ---------- Reset progress bar ---------- */
gsap.set(".progress-bar-fill", { width: "0%" });

/* ---------- Navigation ---------- */
$(".button-next").on("click", function () {
  $quizPage.scrollTop(0);
  quizSwiper.allowSlideNext = true;
  quizSwiper.slideNext();
  quizSwiper.allowSlidePrev = false;
});

$(".button-prev").on("click", function () {
  $quizPage.scrollTop(0);
  quizSwiper.allowSlidePrev = true;
  quizSwiper.slidePrev();
  quizSwiper.allowSlideNext = false;
});

/* ---------- Radio selection ---------- */
$(document).on("click", ".w-radio", function () {
  const $input = $(this).find("input");
  if (!$input.length) return;

  const name = $input.attr("name");

  $radios.removeClass("is-active");
  $(this).addClass("is-active");

  $('.button-next[data-name="' + name + '"]')
    .removeClass("disabled-button");
});

/* ---------- Calculate score ---------- */
$(".button.get-result").on("click", function () {
  let sum = 0;

  $("input:checked").each(function () {
    sum += Number(this.value) || 0;
  });

  $("#your-score").text(sum);
  $(".score-card-content").hide();

  if (sum >= 13) {
    $(".high").show();
    window.dataLayer?.push({ event: "quiz_score_high" });
  } else if (sum >= 4) {
    $(".moderate").show();
    window.dataLayer?.push({ event: "quiz_score_moderate" });
  } else {
    $(".low").show();
    window.dataLayer?.push({ event: "quiz_score_low" });
  }
});

// Share quiz link
async function fetchImage() {
  const url =
    "https://cdn.prod.website-files.com/64defcbd07e6565f76e4d366/67bd7f549d0edb0c5968de35_quiz-page-share-screen%20copy.jpg";
  const response = await fetch(url.toString());
  const encodedUri = encodeURIComponent(url);
  const instagramUrl = "instagram://library?AssetPath=" + encodedUri;

  const blob = await response.blob();
  const filesArray = [
    new File([blob], "Take the Am I Addicted Quiz.jpg", {
      type: "image/jpeg", // Corrected MIME type
      lastModified: new Date().getTime(),
    }),
  ];

  var shareData = {
    title: "Take the Am I Addicted Quiz",
    text: "",
    files: filesArray,
    url: window.location.href,
  };

  async function share() {
    try {
      if (navigator.share) {
        await navigator.share(shareData);
      } else {
        console.log("Share API not supported on this device.");
      }
    } catch (error) {
      console.log("Unable to share, try later", error);
    }
  }
  // Only enable the share API on mobile devices
  $("#share-link").click(function () {
    var userAgent = navigator.userAgent.toLowerCase();
    if (
      userAgent.match(
        /(android|webos|iphone|ipad|ipod|blackberry|windows phone)/
      ) &&
      navigator.share // Ensure share API is supported
    ) {
      //share on mobile
      copyLink();
      share();
    } else {
      //share on desktop
      toggleShareOn();
    }
  });
}

function toggleShareOn() {
  gsap.set(".share-text", { display: "block", opaicty: 1 });
  gsap.set(".share-social-icons", { display: "none", opacity: 0 });
  gsap.to(".share-text", { opacity: 0, display: "none", duration: 0.2 });
  gsap.to(
    ".share-social-icons",
    { display: "flex", opacity: 1, duration: 0.2 },
    ">"
  );
}
function resetShare() {
  gsap.to(".share-text", { display: "block", opacity: 1 });
  gsap.to(".share-social-icons", { display: "none", opacity: 0 });
}

$(".close-result").click(function () {
  resetShare();
});

// Call the fetchImage function
fetchImage();

function copyLink() {
  var copyText = window.location.href;
  navigator.clipboard.writeText(copyText);
}

$("#copy-clip").click(function () {
  copyLink();
  setTimeout(function () {
    $(".tooltip").html("Link copied!");
  }, 20);
});

$("#copy-clip").mouseout(function () {
  $(".tooltip").html("Copy link");
});