let lenis;
let page_wait_time = 1000;
let case_study_slider_can_load = false;
let case_study_slider_triggered = false;

function initScrollSmoother() {
  // lenis = new Lenis({
  //   lerp: 0.2, // Lower values create a smoother scroll effect
  //   smoothWheel: true, // Enables smooth scrolling for mouse wheel events
  // });

  lenis = new Lenis({
    lerp: 0.15, // Lower values create a smoother scroll effect
    // lerp: 0.2, // Lower values create a smoother scroll effect
    smoothWheel: true, // Enables smooth scrolling for mouse wheel events
    duration: 1.2,
    // duration: 1.2,
    easing: (t) => Math.min(1, 1.001 - Math.pow(2, -10 * t)),
    orientation: "vertical", // vertical, horizontal
    gestureOrientation: "vertical", // vertical, horizontal, both
    smoothWheel: true,
    wheelMultiplier: 1,
    smoothTouch: false,
    touchMultiplier: 2,
  });

  // lenis.on('scroll', (e) => {
  // console.log(e)
  // })

  lenis.on("scroll", ScrollTrigger.update);

  // gsap.ticker.add((time)=>{
  // lenis.raf(time * 1000)
  // })

  // gsap.ticker.lagSmoothing(0);

  // Define a function to run at each animation frame
  const scrollFn = (time) => {
    lenis.raf(time); // Run Lenis' requestAnimationFrame method
    requestAnimationFrame(scrollFn); // Recursively call scrollFn on each frame
  };
  // Start the animation frame loop
  requestAnimationFrame(scrollFn);
}

function initAnimationSetup() {
  gsap.registerPlugin(
    ScrollTrigger,
    Observer,
    Flip,
    DrawSVGPlugin,
    SplitText,
    MorphSVGPlugin,
    MotionPathPlugin
  );

  //Set default duration for gsap
  gsap.defaults({
    ease: "power2.inOut",
    // ease: "power3.out",
    duration: 0.75,
  });

  let SplitFeaturedHeading = new SplitText(`[text-split-target]`, {
    type: "lines, words, chars",
    linesClass: "magic-line",
    wordsClass: "magic-word",
    charsClass: "magic-character",
  });

  initScrollSmoother();
}

const uniqueId = function () {
  return "id-" + Math.random().toString(36).slice(2, 18);
};

setInitialSVGState = (type, name, target) => {
  let paths;
  let paths_with_dashes;
  let scale_eles = null;
  let scale_eles_no_origin = null;
  let fadein_eles;

  // return;

  let selector_name;

  if (type === "id") {
    selector_name = "#" + name;
  } else if (type === "class") {
    selector_name = "." + name;
  } else {
    selector_name = name;
  }

  if (type === undefined) {
    paths = document.querySelectorAll("svg path:not([no-draw])");
  } else if (target === undefined) {
    paths_with_dashes = $(`${selector_name} .maskReveal .dashedElement`);
    paths_with_dashes.attr("no-draw", "");

    paths = document.querySelectorAll(
      `${selector_name} path:not([no-draw]),
        ${selector_name} circle:not([no-draw]),
        ${selector_name} rect:not([no-draw]),
        ${selector_name} line:not([no-draw])`
    );
    scale_eles = document.querySelectorAll(`${selector_name} [scale-effect]`);
    fadein_eles = document.querySelectorAll(`${selector_name} [fadein-effect]`);
    scale_eles_no_origin = document.querySelectorAll(
      `${selector_name} [scale-effect-no-origin-interfere]`
    );
  } else if (target === "path") {
    paths = document.querySelectorAll(`path${selector_name}:not([no-draw])`);
  }

  if (scale_eles) {
    gsap.set(scale_eles, {
      transformOrigin: "50% 50%",
    });
  }
  if (fadein_eles) {
    gsap.set(fadein_eles, {
      opacity: 0,
    });
  }
  if (scale_eles) {
    gsap.set(scale_eles, {
      opacity: 0,
      scale: 0,
    });
  }
  if (scale_eles_no_origin) {
    gsap.set(scale_eles_no_origin, {
      opacity: 0,
      scale: 0,
    });
  }

  // return;

  try {
    //set up path, line, svg, circle with dashes
    paths_with_dashes.each(function (index) {
      //path, line, rect
      const current_ele = $(this);
      const current_MaskReveal_ele = current_ele.closest(".maskReveal");
      const current_Mask_ele = current_ele.closest("svg").find(".theMask");

      const maskId = uniqueId();
      current_Mask_ele.attr("id", maskId);
      current_MaskReveal_ele.attr("mask", `url(#${maskId})`);

      let clone = current_ele.clone();
      clone.removeAttr("stroke-dasharray");
      gsap.set(clone, { attr: { stroke: "white" }, drawSVG: 0 });
      current_Mask_ele.append(clone);
    });

    gsap.set(paths, {
      drawSVG: "0%",
    });
  } catch (error) {
    // Code to handle the error
    console.log("An error occurred:", error);
  }
};

drawSVG = (type, name, { duration, selector, reverse } = {}) => {
  if (!duration) {
    duration = 2;
  }

  // return;

  // Get the path(s) to animate based on the type and name parameters
  let paths;
  let scale_eles;
  let scale_eles_no_origin;
  let fadein_eles;

  let selector_name;

  if (type === "id") {
    selector_name = "#" + name;
  } else if (type === "class") {
    selector_name = "." + name;
  } else {
    selector_name = name;
  }

  if (!type) {
    paths = document.querySelectorAll("svg path:not([no-draw])");
  } else if (!selector) {
    paths_with_dashes = $(`${selector_name} svg .theMask .dashedElement`);

    paths = document.querySelectorAll(
      `${selector_name} path:not([no-draw]),
        ${selector_name} circle:not([no-draw]),
        ${selector_name} rect:not([no-draw]),
        ${selector_name} line:not([no-draw])`
    );
    scale_eles = document.querySelectorAll(`${selector_name} [scale-effect]`);
    fadein_eles = document.querySelectorAll(`${selector_name} [fadein-effect]`);
    scale_eles_no_origin = document.querySelectorAll(
      `${selector_name} [scale-effect-no-origin-interfere]`
    );
  } else if (selector === "path") {
    paths = document.querySelectorAll(`path${selector_name}:not([no-draw])`);
  }
  // return;
  gsap
    .timeline()

    .add(function () {
      if (reverse) {
        gsap
          .timeline()
          .to(paths, {
            drawSVG: "0%",
            duration,
            ease: "power2.inOut",
          })
          .to(
            paths_with_dashes,
            {
              duration,
              // delay: 0.5,
              stagger: {
                amount: 0.5,
              },
              drawSVG: "0%",
            },
            ">-0.35"
          );
      } else {
        gsap
          .timeline()
          .fromTo(
            paths,
            {
              drawSVG: "0%",
            },
            {
              drawSVG: "100%",
              duration,
              ease: "power2.inOut",
            }
          )
          .to(
            paths_with_dashes,
            {
              duration,
              // delay: 0.5,
              stagger: {
                amount: 0.5,
              },
              drawSVG: "100%",
            },
            ">-0.35"
          );
      }
    });

  if (scale_eles) {
    gsap.to(scale_eles, {
      opacity: 1,
      scale: 1,
      delay: 0.5,
    });
  }
  if (scale_eles_no_origin) {
    gsap.to(scale_eles_no_origin, {
      opacity: 1,
      scale: 1,
      delay: 0.5,
    });
  }
  if (fadein_eles) {
    gsap.to(fadein_eles, {
      opacity: 1,
    });
  }
};

function drawSVGgroup() {}

function currentViewPort() {
  const windowWidth = window.innerWidth;
  let viewport;
  if (windowWidth > 991) {
    viewport = "desktop";
  }
  if (windowWidth <= 991 && windowWidth > 767) {
    viewport = "tablet";
  }
  if (windowWidth <= 767) {
    viewport = "mobile";
  }

  return viewport;
}

let currentViewport = currentViewPort();
let lastWindowWidth = window.innerWidth;

window.addEventListener("resize", () => {
  const newWindowWidth = window.innerWidth;
  const newViewport = currentViewPort();

  if (newWindowWidth !== lastWindowWidth && newViewport !== currentViewport) {
    currentViewport = newViewport;
    location.reload(); // Refresh the browser
  }
});

setTimeout(function () {
  $(`[parallax-effect]`).each(function () {
    if (currentViewPort() === "desktop") {
      let elementHeight = $(this).innerHeight();
      // console.log(elementHeight);
      let parallax_type = $(this).attr("parallax-type");
      let parallax_faster = $(this).attr("parallax-faster");
      let parallax_start = $(this).attr("parallax-start");
      let parallax_end = $(this).attr("parallax-end");
      // let parallax_end_random = Math.random() * (35 - 5) + 5;
      let parallax_end_random = parallax_faster
        ? -1 * (Math.floor(Math.random() * (80 - 50 + 1)) - 80)
        : -1 * (Math.floor(Math.random() * (60 - 30 + 1)) - 60);
      let parallax_start_random = parallax_faster
        ? 80 - 50 + 50
        : Math.random() * (60 - 30) + 30;

      //Elements have to be a div with image background
      if (parallax_type === "image") {
        gsap
          .timeline({
            scrollTrigger: {
              trigger: $(this),
              // markers: true,
              scrub: 0.75,
            },
            defaults: {
              ease: "none",
            },
          })
          .fromTo(
            $(this),
            {
              backgroundPosition: `50% ${
                parallax_start !== undefined ? parallax_start : 100
              }%`,
            },
            {
              backgroundPosition: `50% ${
                parallax_end !== undefined ? parallax_end : 0
              }%`,
            }
          );
      } else {
        // if (elementHeight > 480) {
        //   // $(this).css("backgroundColor", "black");
        //   parallax_end_random = parallax_faster
        //     ? -1 * (Math.floor(Math.random() * (18 - 12 + 1)) - 18)
        //     : -1 * (Math.floor(Math.random() * (10 - 5 + 1)) - 10);
        //   parallax_start_random = parallax_faster
        //     ? Math.random() * (18 - 12) + 12
        //     : Math.random() * (10 - 5) + 5;
        //   // return;
        // }
        gsap
          .timeline({
            scrollTrigger: {
              trigger: $(this),
              scrub: 0.75,
              // markers: true,
              start: "0% 100%",
              end: "100% 0%",
            },
            // defaults: {
            //   ease: "none"
            // }
          })
          .fromTo(
            $(this),
            {
              y: `${
                parallax_start !== undefined
                  ? parallax_start
                  : parallax_start_random
              }`,
              // yPercent: `${parallax_start !== undefined ? parallax_start : 25}`
            },
            {
              y: `${
                parallax_end !== undefined
                  ? parallax_end
                  : parallax_end_random * -1
              }`,
            }
          );
      }
    }
  });
}, 1000);
// }, 1500);
$(`[fade-animation]`).each(function (index) {
  // if (windowViewPort !== "desktop") return;
  let triggerElement = $(this);
  let delay_duration = $(this).attr("delay-duration");
  if (delay_duration === undefined) {
    delay_duration = 0.1;
  }

  let tl = gsap.timeline({
    scrollTrigger: {
      trigger: triggerElement,
      start: "top 80%",
      end: "bottom center",
      toggleActions: "play none none none",
      // markers: true
      // scrub: 1
      // once: true
    },
  });
  tl.fromTo(
    triggerElement,
    {
      opacity: 0,
      // y: 10
      // scale: 0.92,
    },
    {
      delay: delay_duration,
      // y: 0,
      // scale: 1,
      ease: "power1.inOut",
      duration: 0.75,
      opacity: 1,
    }
  );
});

function mimicElementSize(sourceSelector, targetSelector) {
  const sourceElement = document.querySelector(sourceSelector);
  const targetElement = document.querySelector(targetSelector);

  if (sourceElement && targetElement) {
    const sourceRect = sourceElement.getBoundingClientRect();

    // Set dimensions to target element
    targetElement.style.width = `${sourceRect.width}px`;
    targetElement.style.height = `${sourceRect.height}px`;
  } else {
    console.error("Source or target element not found.");
  }
}

$(`[sizes-mimic-target]`).each(function () {
  const sourceSelector = $(this).attr("sizes-mimic-target");
  const targetClasses = $(this).attr("class");
  const targetSelector = `.${targetClasses.replace(/\s+/g, ".")}`;
  console.log(sourceSelector, targetSelector);
  mimicElementSize(sourceSelector, targetSelector);
});

$(`[parallax_effect]`).each(function () {
  if (currentViewPort() === "desktop") {
    let elementHeight = $(this).innerHeight();
    // console.log(elementHeight);
    let parallax_type = $(this).attr("parallax_type");
    let parallax_faster = $(this).attr("parallax_faster");
    let parallax_start = $(this).attr("parallax_start");
    let parallax_end = $(this).attr("parallax_end");
    // console.log("parallax effect running", parallax_start, parallax_end);
    // let parallax_end_random = Math.random() * (35 - 5) + 5;
    let parallax_end_random = parallax_faster
      ? -1 * (Math.floor(Math.random() * (50 - 45 + 1)) - 50)
      : -1 * (Math.floor(Math.random() * (30 - 20 + 1)) - 30);
    let parallax_start_random = parallax_faster
      ? 50 - 45 + 45
      : Math.random() * (30 - 20) + 20;

    switch (parallax_type) {
      case "image":
        gsap
          .timeline({
            scrollTrigger: {
              trigger: $(this),
              scrub: 0.75,
            },
            defaults: {
              ease: "none",
            },
          })
          .fromTo(
            $(this),
            {
              backgroundPosition: `50% ${
                parallax_start !== undefined ? parallax_start : 100
              }%`,
            },
            {
              backgroundPosition: `50% ${
                parallax_end !== undefined ? parallax_end : 0
              }%`,
            }
          );
        break;
      default:
        if (elementHeight > 480) {
          // $(this).css("backgroundColor", "black");
          parallax_end_random = parallax_faster
            ? -1 * (Math.floor(Math.random() * (18 - 12 + 1)) - 18)
            : -1 * (Math.floor(Math.random() * (10 - 5 + 1)) - 10);
          parallax_start_random = parallax_faster
            ? Math.random() * (18 - 12) + 12
            : Math.random() * (10 - 5) + 5;
          // return;
        }
        gsap
          .timeline({
            scrollTrigger: {
              trigger: $(this),
              scrub: 0.75,
              // markers: true,
              start: "0% 100%",
              end: "100% 0%",
            },
            // defaults: {
            //   ease: "none"
            // }
          })
          .fromTo(
            $(this),
            {
              yPercent: `${
                parallax_start !== undefined
                  ? parallax_start
                  : parallax_start_random
              }`,
              // yPercent: `${parallax_start !== undefined ? parallax_start : 25}`
            },
            {
              yPercent: `${
                parallax_end !== undefined
                  ? parallax_end
                  : parallax_end_random * -1
              }`,
            }
          );
    }
  }
});

// Define breakpoints for tablet and mobile
const BREAKPOINT_TABLET = 992;
const BREAKPOINT_MOBILE = 768;

// Initial state to keep track of current device type
let currentDevice = getDeviceType(window.innerWidth);

// Function to get the current device type
function getDeviceType(width) {
  if (width >= BREAKPOINT_TABLET) {
    return "desktop";
  } else if (width >= BREAKPOINT_MOBILE) {
    return "tablet";
  } else {
    return "mobile";
  }
}

// Callback functions for each device type
function onEnterDesktop() {
  // console.log("Entered Desktop (>= 992px)");
}

function onEnterTablet() {
  // console.log("Entered Tablet (>= 768px and < 992px)");
}

function onEnterMobile() {
  // console.log("Entered Mobile (< 768px)");
}

// Function to handle resize events
function handleResize() {
  const newDevice = getDeviceType(window.innerWidth);

  if (newDevice !== currentDevice) {
    if (newDevice === "desktop") {
      onEnterDesktop();
    } else if (newDevice === "tablet") {
      onEnterTablet();
    } else if (newDevice === "mobile") {
      onEnterMobile();
    }

    // Update the current device type
    currentDevice = newDevice;
  }
}

// Add event listener for resize event
window.addEventListener("resize", handleResize);

// Initial check
handleResize();

function section_w_svgs() {
  $("[section_w_svgs]").each(function (index) {
    const id = `section_w_svgs_${index}`;
    $(this).attr("id", id);

    setInitialSVGState("id", id);

    const triggerEle = $(this);
    gsap.timeline({
      scrollTrigger: {
        trigger: triggerEle,
        start: "top 50%",
        once: true,
        onEnter: () => {
          drawSVG("id", id, { speed: 1.5, reverse: false });
        },
        // end: "+=60%",
        // markers: true,
        // scrub: true,
        // pin: triggerEle,
      },
    });
  });
}
function initNav() {
  $(".nav_link:not([no_hover='true'])").on(
    "mouseenter mouseleave",
    function () {
      const current_link = $(this);
      current_link.toggleClass("state_open");
      current_link
        .find(".nav_link_left,.nav_link_arrow_wrapper,.nav_link_icon")
        .toggleClass("state_open");
    }
  );
  $(".hamburger_container").on("click", function () {
    // return;

    const nav = $(".nav");
    const nav_open = nav.attr("is_open");
    if (nav_open !== "true") {
      lenis.stop();
      nav.attr("is_open", "true");
      gsap
        .timeline({
          delay: 0.25,
        })
        .fromTo(
          ".nav_main_menu .nav_link, .nav_main_menu .main_button",
          {
            opacity: 0,
            // scale: 0,
          },
          {
            opacity: 1,
            // scale: 1,
            stagger: {
              from: "start",
              each: 0.25,
            },
          }
        )
        .fromTo(
          ".nav_main_menu .nav_divider",
          {
            // opacity: 0,
            width: "0%",
          },
          {
            // opacity: 0,
            width: "100%",
            stagger: {
              from: "start",
              each: 0.2,
            },
          },
          "<"
        );
    } else {
      gsap
        .timeline({
          onComplete: () => {
            lenis.start();
            nav.attr("is_open", "false");
          },
        })
        .to(
          ".nav_main_menu .nav_link, .nav_main_menu .main_button",

          {
            opacity: 0,
            // scale: 1,
            stagger: {
              from: "start",
              each: 0.1,
            },
          }
        )
        .to(
          ".nav_main_menu .nav_divider",
          {
            // opacity: 0,
            width: "0%",
            stagger: {
              from: "start",
              each: 0.2,
            },
          },
          "<"
        );
    }
  });
}

function ApplicationSection() {
  setTimeout(() => {
    ScrollTrigger.refresh();
  }, 1000);

  if (currentViewPort() === "mobile") {
    $(".home_application_process_card").each(function (index) {
      const triggerEle = $(this);
      const current_card = $(this);

      let tl = gsap.timeline({
        scrollTrigger: {
          trigger: triggerEle,
          start: "top 50%",
          end: "bottom bottom",
          // scrub: 0.25 ,
          // markers: true,
          // once: true,
          onEnter: () => {
            $(".home_application_process_card").attr("is_active", "false");
            current_card.attr("is_active", "true");
          },
          onEnterBack: () => {
            $(".home_application_process_card").attr("is_active", "false");
            current_card.attr("is_active", "true");
          },
        },
      });
    });
  }

  if (currentViewPort() !== "mobile") {
    $(".scroll_track.home").each(function (index) {
      const triggerEle = $(this);

      let tl = gsap
        .timeline({
          scrollTrigger: {
            trigger: triggerEle,
            start: "top 125%",
            end: "top top",
            // scrub: 1,
            once: true,
            // markers: true,
          },
          onStart: function () {
            // console.log("triggered");
            let st = ScrollTrigger.create({
              trigger: ".scroll_track.home",
              pin: ".home_application_section",
              start: "top top",
              end: "bottom bottom",
            });
            const bg_sketch = $(".home_application_sketch_img");
            let tl_2 = gsap
              .timeline({
                scrollTrigger: {
                  trigger: triggerEle,
                  start: "top top",
                  end: "bottom bottom",
                  scrub: 1,
                  // markers: true,
                  // once: true,
                },
              })
              .to(bg_sketch, {
                ease: "none",
                xPercent: -66,
              });

            $(".scroll_track_mark").each(function (index) {
              const triggerEle = $(this);
              const order = index + 1;

              const current_process_card = $(
                ".home_application_process_card"
              ).eq(index);
              const all_process_cards = $(".home_application_process_card").not(
                current_process_card
              );
              const current_process_card_illustration = $(
                `.application_illustration._${order}`
              );
              const all_process_card_illustrations = $(
                ".application_illustration"
              ).not(current_process_card_illustration);
              // is_active
              function updateUI() {
                all_process_card_illustrations.attr("is_active", "false");
                all_process_cards.attr("is_active", "false");
                current_process_card.attr("is_active", "true");
                setTimeout(() => {
                  current_process_card_illustration.attr("is_active", "true");
                }, 100);
              }
              let tl = gsap.timeline({
                scrollTrigger: {
                  trigger: triggerEle,
                  start: "-5% top",
                  end: "105% bottom",
                  // scrub: 0.25 ,
                  // markers: true,
                  // once: true,
                  onEnter: () => {
                    // console.log("Entering", order);
                    updateUI();
                  },
                  onLeave: () => {
                    // console.log("Leaving", order);
                    updateUI();
                  },
                  onEnterBack: () => {
                    // console.log("Entering back", order);
                    updateUI();
                  },
                  onLeaveBack: () => {
                    // console.log("Leaving back", order);
                    updateUI();
                  },
                },
              });
            });
          },
        })
        .to(triggerEle, {
          opacity: 1,
        });
    });
  }
}

function ClientLogoSection() {
  $(".section.client_section").each(function (index) {
    const triggerEle = $(this);
    let tl = gsap
      .timeline({
        scrollTrigger: {
          trigger: triggerEle,
          start: "top 50%",
          end: "top top",
          // scrub: 0.25 ,
          // markers: true,
          // once: true,
        },
      })
      .from(".client_group_logo", {
        scale: 0.5,
        opacity: 0,
        stagger: {
          from: "center",
          each: 0.05,
        },
      });
  });
}

function Faq_Component() {
  $(".faq_item").on("click", function (index) {
    const current_faq_item = $(this);

    const is_open = current_faq_item.attr("is_open");
    if (is_open !== "true") {
      $(".faq_item").attr("is_open", "false");
      current_faq_item.attr("is_open", "true");
    } else {
      current_faq_item.attr("is_open", "false");
    }
  });
  $(".faq_item a").on("click", function (e) {
    e.stopPropagation();
  });

  $(".faq_item").each(function (index) {
    const triggerEle = $(this);

    let tl = gsap
      .timeline({
        scrollTrigger: {
          trigger: triggerEle,
          start: "top 70%",
          end: "bottom bottom",
          // scrub: 0.25 ,
          // markers: true,
          // once: true,
        },
      })
      .fromTo(
        triggerEle,
        {
          opacity: 0,
          y: 20,
        },
        {
          opacity: 1,
          y: 0,
        }
      );
  });
}

function testimonial_swiper_component() {
  if (!case_study_slider_can_load) {
    return;
  } else {
    case_study_slider_triggered = true;
  }

  $(".case-study-swiper .w-dyn-empty").each(function () {
    $(this).closest("section").remove();
    ScrollTrigger.refresh();
  });

  // return;

  $(".section.case_study_swiper_section").each(function (index) {
    const current_section = $(this);
    const id = "section_" + index;
    current_section.attr("id", id);

    current_section.find(".case-study-slide").each(function () {
      const linked_case_study_button_not_showing =
        $(this).find(".linked_case_study_btn").css("display") === "none";
      // console.log("checking button", linked_case_study_button_not_showing);
      if (linked_case_study_button_not_showing) {
        // Show the button to Customer Stories page
        $(this)
          .find(".success_stories_btn")
          .removeClass("w-condition-invisible");
      }
    });

    const case_study_swiper = new Swiper(
      `.case_study_swiper_section#${id} .case-study-swiper.swiper`,
      {
        speed: 1200,
        // autoplay: {
        //     delay: 1500, // Delay in milliseconds between slides
        // },
        keyboard: true,
        mousewheel: {
          forceToAxis: true,
        },
        a11y: {
          enabled: true,
          slideRole: "listitem",
        },
        // slideToClickedSlide: true,
        // followFinger: false,
        // pagination: {
        //   el: "#pp-reactions-pagination",
        //   // dynamicBullets: true,
        //   type: "progressbar",
        // },
        // navigation: {
        //   nextEl: ".swiper_btn.next",
        //   prevEl: ".swiper_btn.prev",
        // },
        allowTouchMove: true,
        // loop: true,
        centeredSlides: true,
        spaceBetween: "2%",
        initialSlide: 1,
        on: {
          slideNextTransitionStart: (swiper) => {
            updateSliderUI_whenTransitionEnd("right");
          },
          slidePrevTransitionStart: (swiper) => {
            updateSliderUI_whenTransitionEnd("left");
          },
        },
        // slidesPerView: 'auto'
        // slidesPerView: 1,
        // breakpoints: {
        //   0: {
        //     slidesPerView: 1.1,
        //     spaceBetween: "14px",
        //   },
        //   768: {
        //     slidesPerView: 1.1,
        //     spaceBetween: "-250px",
        //   },
        //   991: {
        //     slidesPerView: 1.25,
        //     spaceBetween: "-350px",
        //   },
        // },
      }
    );

    const bullet_wrapper = $(
      `.case_study_swiper_section#${id} .swiper_bullet_wrapper.case_study_slider_ver`
    );

    const bullet_wrapper_track = $(bullet_wrapper).find(`.swiper_bullet_track`);
    bullet_wrapper_track.empty();
    const bullet_html = `<div class="swiper_bullet case_study_slide_ver swiper-slide"></div>`;
    const active_bullet_html = `<div class="swiper_bullet case_study_slide_ver swiper-slide"></div>`;
    $(
      `.case_study_swiper_section#${id} .case-study-slide-wrapper .case-study-slide`
    ).each(function (index) {
      if (index === case_study_swiper.activeIndex) {
        bullet_wrapper_track.append(active_bullet_html);
      } else {
        bullet_wrapper_track.append(bullet_html);
      }
    });

    const current_swiper_bullets = $(
      `.case_study_swiper_section#${id} .swiper_bullet`
    );
    const total_bullets = current_swiper_bullets.length;

    current_swiper_bullets.on("click", function () {
      const bullet_index = $(this).index();
      // case_study_swiper.slideTo(bullet_index, 500, true);
      case_study_swiper.slideTo(bullet_index);
    });

    //If there are only 1 slide (1 bullet) then hide the bullet
    if (current_swiper_bullets.length <= 1) {
      bullet_wrapper_track.hide();
    } else {
      bullet_wrapper_track.show();
    }
    //If there are too many slides, too many bullets, then turn on the bullet limited mode
    // if (current_swiper_bullets.length > 5) {
    //   bullet_wrapper.addClass("bullet_limited_mode");
    // }

    const current_bullet_swiper = new Swiper(
      `.case_study_swiper_section#${id} .swiper_bullet_wrapper.swiper`,
      {
        speed: 750,
        // autoplay: {
        //   delay: 1500, // Delay in milliseconds between slides
        // },
        keyboard: true,
        mousewheel: {
          forceToAxis: true,
        },
        slideToClickedSlide: true,
        // followFinger: false,
        // pagination: {
        //   el: "#pp-reactions-pagination",
        //   // dynamicBullets: true,
        //   type: "progressbar",
        // },
        // navigation: {
        //   nextEl: ".swiper_btn.next",
        //   prevEl: ".swiper_btn.prev",
        // },
        allowTouchMove: false,
        // loop: true,
        centeredSlides: true,
        // initialSlide: 1,
        spaceBetween: 8,
        slidesPerView: "auto",
        // slidesPerView: 1,
        // breakpoints: {
        //   0: {
        //     slidesPerView: 1.1,
        //     spaceBetween: "14px",
        //   },
        //   768: {
        //     slidesPerView: 1.1,
        //     spaceBetween: "-250px",
        //   },
        //   991: {
        //     slidesPerView: 1.25,
        //     spaceBetween: "-350px",
        //   },
        // },
      }
    );

    const slide_animated_children = $(
      `.case_study_swiper_section#${id} .swiper-slide.case-study-slide:not(.swiper-slide-active)`
    ).find("p, h2, .main_button, .case_study_logo, .case_study_quote_icon");

    gsap.set(slide_animated_children, {
      transition: "unset",
      opacity: 0,
    });

    if (
      $(
        `.case_study_swiper_section#${id} .swiper-slide.case-study-slide.swiper-slide-active .case_study_card`
      ).css("display") === "block"
    ) {
      // console.log("has card => hide the bg image  with markers background");

      $(`.case_study_swiper_section#${id} .case_study_bg_path_w_markers`).each(
        function () {
          if ($(this).css("display") === "block") {
            $(this).css("opacity", 0);
            $(this).attr("marker", "true");
          }
        }
      );

      if (currentViewPort() === "desktop") {
        gsap.set(`.case_study_swiper_section#${id} .u-container`, {
          placeContent: "center center",
          columnGap: "100px",
        });
      }
    } else {
      // console.log("ping 2");
    }

    setTimeout(() => {
      case_study_swiper.slideTo(0);
      // case_study_swiper.slideTo(0);
    }, 100);

    // Function to update navigation buttons visibility
    function updateSliderUI_whenTransitionStart() {
      let current_slide_index = case_study_swiper.activeIndex;
      const current_slide_order = current_slide_index + 1;

      if (!current_slide_index) {
        current_slide_index = 0;
      }
      // setTimeout(() => {
      current_bullet_swiper.slideTo(current_slide_index);
      // }, 30);

      current_swiper_bullets.removeClass("is_active");
      current_swiper_bullets.eq(current_slide_index).addClass("is_active");
      // console.log(current_slide_order, total_distance_need_to_move);
      // if (total_bullets > 3) {
      current_swiper_bullets.removeClass("in_range_1");
      current_swiper_bullets.removeClass("in_range_2");

      if (current_slide_index >= 2) {
        current_swiper_bullets
          .eq(current_slide_index - 2)
          .addClass("in_range_1");
      }
      current_swiper_bullets.eq(current_slide_index + 2).addClass("in_range_1");
      if (current_slide_index >= 3) {
        current_swiper_bullets
          .eq(current_slide_index - 3)
          .addClass("in_range_2");
      }
      current_swiper_bullets.eq(current_slide_index + 3).addClass("in_range_2");
      // }

      const activeSlideChildren = $(
        `.case_study_swiper_section#${id} .swiper-slide.case-study-slide.swiper-slide-active`
      ).find("p, h2, .main_button, .case_study_logo, .case_study_quote_icon");
      const nonActiveSlideChildren = $(
        `.case_study_swiper_section#${id} .swiper-slide.case-study-slide:not(.swiper-slide-active)`
      ).find("p, h2, .main_button, .case_study_logo, .case_study_quote_icon");

      gsap
        .timeline()
        .set(activeSlideChildren, {
          opacity: 0,
        })
        .to(nonActiveSlideChildren, {
          opacity: 0,
        });

      // const swiper_slide_having_card = $(
      //   ".swiper-slide.case-study-slide.swiper-slide-active"
      // )
      //   .find(".case_study_card")
      //   .css("display");
      // if (swiper_slide_having_card === "block") {
      //   gsap.to(
      //     `.case_study_swiper_section#${id} .case_study_bg_path_w_markers`,
      //     {
      //       opacity: 0,
      //     }
      //   );
      // } else {
      //   gsap.to(
      //     `.case_study_swiper_section#${id} .case_study_bg_path_w_markers`,
      //     {
      //       opacity: 1,
      //     }
      //   );
      // }
      // console.log("checking to see if it has card", swiper_slide_having_card);
    }
    function updateSliderUI_whenTransitionEnd(direction) {
      const activeSlideChildren = $(
        `.case_study_swiper_section#${id} .swiper-slide.case-study-slide.swiper-slide-active`
      ).find("p, h2, .main_button, .case_study_logo, .case_study_quote_icon");
      const nonActiveSlideChildren = $(
        `.case_study_swiper_section#${id} .swiper-slide.case-study-slide:not(.swiper-slide-active)`
      ).find("p, h2, .main_button, .case_study_logo, .case_study_quote_icon");

      // console.log(direction);

      gsap
        .timeline({
          delay: 0.25,
        })
        .fromTo(
          activeSlideChildren,
          {
            x: direction === "right" ? 45 : -45,
          },
          {
            opacity: 1,
            x: 0,
            stagger: {
              each: 0.1,
            },
          }
        );
    }

    // Update navigation buttons on slide change
    case_study_swiper.on("slideChangeTransitionStart", () => {
      updateSliderUI_whenTransitionStart();
    });
    // case_study_swiper.on(
    //   "slideChangeTransitionEnd",
    //   updateSliderUI_whenTransitionEnd
    // );
  });
}

function loanTable_section() {
  $(".franchisees_goal_option_grid").each(function (index) {
    const triggerEle = $(this);
    $(".loan_table_colum[is_active='true']").attr({
      is_active: "false",
      marked: "true",
    });
    $(".button.pre_approved_btn.green_btn").attr({
      marked: "true",
    });
    $(".button.pre_approved_btn.green_btn").removeClass("green_btn");
    ScrollTrigger.refresh(true);
    console.log("refreshed");
    let tl = gsap
      .timeline({
        scrollTrigger: {
          trigger: ".section.loan_section",
          start: "top 100%",
          end: "bottom bottom",

          // scrub: 0.25 ,
          // markers: true,
          // once: true,
        },
        onStart: () => {
          gsap.set(".franchisees_goal_option", {
            pointerEvents: "none",
          });
          // console.log("checking");
        },
        onComplete: () => {
          gsap.set(".loan_table_colum", {
            clearProps: "all",
          });
          gsap.set(".franchisees_goal_option", {
            pointerEvents: "auto",
          });
        },
      })
      .fromTo(
        ".franchisees_goal_option",
        {
          opacity: 0,
          // scale: 0.5,
        },
        {
          // scale: 0.5,
          opacity: 1,
          // scale: 1,
          stagger: {
            from: "start",
            each: 0.08,
          },
        }
      )
      .fromTo(
        ".loan_table_colum",
        {
          opacity: 0,
          y: 20,
        },
        {
          // scale: 0.5,
          // delay: 0.5,
          opacity: 1,
          y: 0,
          stagger: {
            from: "start",
            each: 0.15,
          },
        },
        "<"
      )
      .fromTo(
        ".loan_table_gray_bg",
        {
          width: "0%",
          // opacity: 0,
        },
        {
          width: "100%",
          // opacity: 1,
          duration: 1,
        }
      )
      .add(function () {
        $(".loan_table_colum[marked='true']").attr("is_active", "true");
        $(".button.pre_approved_btn[marked='true']").addClass("green_btn");
      })
      .from(".loan_table_colum_label", {
        opacity: 0,
      });
  });

  $(".franchisees_goal_option").on("click", function (index) {
    const current_option = $(this);
    const current_option_name = $(this).attr("option_name");
    const current_loan_section = $(".section.loan_section");
    // $(".franchisees_goal_option").attr("is_selected", "false");
    let is_current_option_selected = current_option.attr("is_selected");

    if (is_current_option_selected === "true") {
      current_option.attr("is_selected", "false");
    } else {
      current_option.attr("is_selected", "true");
    }

    current_loan_section.toggleClass(current_option_name);

    const goal_option_selected =
      $(".franchisees_goal_option[is_selected='true']").length >= 1;
    if (goal_option_selected) {
      current_loan_section.attr("option_selected", "true");
    } else {
      current_loan_section.attr("option_selected", "false");
    }
    // console.log("option clicked", goal_option_selected);
  });

  $(".section.loan_section").each(function (index) {
    const video_section = $(this);

    const video_discovery_btn = video_section.find(".button.discover_btn");
    const close_btn = video_screen.find(
      ".video_screen_close_btn, .video_screen_bg"
    );

    const iframe_src = video_discovery_btn.attr("video_url");
    console.log("iframe_src", iframe_src);
    // gsap.set(video_section, {
    //   zIndex: 5,
    // });

    video_discovery_btn.on("click", function () {
      openVideoScreenSrc(iframe_src);
    });
    close_btn.on("click", closeVideoScreenSrc);
  });
}

function Resource_card_w_swiper_component() {
  // if (!case_study_slider_can_load) {
  //   console.log("case 1");
  //   return;
  // } else {
  //   case_study_slider_triggered = true;
  //   console.log("case 2");
  // }
  $(".section:has(.resource_card_swiper_wrapper)").each(function (index) {
    // console.log("!");
    const current_section = $(this);

    current_section.attr("resource_group_section_order", index);

    const resource_card_swiper = new Swiper(
      `.section[resource_group_section_order="${index}"] .resource_card_swiper_wrapper.swiper`,
      {
        speed: currentViewPort() === "mobile" ? 500 : 0,
        // autoplay: {
        //     delay: 1500, // Delay in milliseconds between slides
        // },
        keyboard: true,
        mousewheel: {
          forceToAxis: true,
        },
        a11y: {
          enabled: true,
          slideRole: "listitem",
        },
        // slideToClickedSlide: true,
        // followFinger: false,
        // pagination: {
        //   el: "#pp-reactions-pagination",
        //   // dynamicBullets: true,
        //   type: "progressbar",
        // },
        // navigation: {
        //   nextEl: ".swiper_btn.next",
        //   prevEl: ".swiper_btn.prev",
        // },
        allowTouchMove: currentViewPort() === "mobile" ? true : false,
        // loop: true,
        centeredSlides: true,
        spaceBetween: "2%",
        initialSlide: 1,
        on: {
          slideNextTransitionStart: (swiper) => {},
          slidePrevTransitionStart: (swiper) => {},
        },
        // slidesPerView: 'auto'
        // slidesPerView: 1,
        // breakpoints: {
        //   0: {
        //     slidesPerView: 1.1,
        //     spaceBetween: "14px",
        //   },
        //   768: {
        //     slidesPerView: 1.1,
        //     spaceBetween: "-250px",
        //   },
        //   991: {
        //     slidesPerView: 1.25,
        //     spaceBetween: "-350px",
        //   },
        // },
      }
    );

    const bullet_wrapper = $(
      `.section[resource_group_section_order="${index}"] .swiper_bullet_wrapper.swiper`
    );

    const bullet_wrapper_track = $(bullet_wrapper).find(`.swiper_bullet_track`);
    // const bullet_wrapper_track = $(
    //   ".swiper_bullet_wrapper.resource_doc .swiper_bullet_track"
    // );
    bullet_wrapper_track.empty();
    const bullet_html = `<div class="swiper_bullet border-white swiper-slide"></div>`;
    const active_bullet_html = `<div class="swiper_bullet border-white swiper-slide"></div>`;
    $(
      `.section[resource_group_section_order="${index}"] .resource_card_swiper_wrapper .resource_card_swiper_slide`
    ).each(function (index) {
      if (index === resource_card_swiper.activeIndex) {
        bullet_wrapper_track.append(active_bullet_html);
      } else {
        bullet_wrapper_track.append(bullet_html);
      }
    });

    const current_swiper_bullets = bullet_wrapper.find(".swiper_bullet");
    const total_bullets = current_swiper_bullets.length;
    // console.log("checking", resource_doc_swiper_bullets.length);
    current_swiper_bullets.on("click", function () {
      const bullet_index = $(this).index();

      // resource_card_swiper.slideTo(bullet_index, 500, true);
      resource_card_swiper.slideTo(bullet_index);
    });

    if (current_swiper_bullets.length <= 1) {
      bullet_wrapper_track.hide();
    } else {
      bullet_wrapper_track.show();
    }

    const current_bullet_swiper = new Swiper(
      `.section[resource_group_section_order="${index}"] .swiper_bullet_wrapper.swiper`,
      {
        speed: 750,
        // autoplay: {
        //   delay: 1500, // Delay in milliseconds between slides
        // },
        keyboard: true,
        mousewheel: {
          forceToAxis: true,
        },
        slideToClickedSlide: true,
        // followFinger: false,
        // pagination: {
        //   el: "#pp-reactions-pagination",
        //   // dynamicBullets: true,
        //   type: "progressbar",
        // },
        // navigation: {
        //   nextEl: ".swiper_btn.next",
        //   prevEl: ".swiper_btn.prev",
        // },
        allowTouchMove: false,
        // loop: true,
        centeredSlides: true,
        // initialSlide: 1,
        spaceBetween: 8,
        slidesPerView: "auto",
        // slidesPerView: 1,
        // breakpoints: {
        //   0: {
        //     slidesPerView: 1.1,
        //     spaceBetween: "14px",
        //   },
        //   768: {
        //     slidesPerView: 1.1,
        //     spaceBetween: "-250px",
        //   },
        //   991: {
        //     slidesPerView: 1.25,
        //     spaceBetween: "-350px",
        //   },
        // },
      }
    );
    setTimeout(() => {
      resource_card_swiper.slideTo(0);
      // case_study_swiper.slideTo(0);
    }, 100);

    function updateSliderUI_whenTransitionStart() {
      let current_slide_index = resource_card_swiper.activeIndex;
      const current_slide_order = current_slide_index + 1;

      if (!current_slide_index) {
        current_slide_index = 0;
      }
      // setTimeout(() => {
      current_bullet_swiper.slideTo(current_slide_index);
      // }, 30);

      current_swiper_bullets.removeClass("is_active");
      current_swiper_bullets.eq(current_slide_index).addClass("is_active");
      // console.log(current_slide_order, total_distance_need_to_move);
      // if (total_bullets > 3) {
      current_swiper_bullets.removeClass("in_range_1");
      current_swiper_bullets.removeClass("in_range_2");

      if (current_slide_index >= 2) {
        current_swiper_bullets
          .eq(current_slide_index - 2)
          .addClass("in_range_1");
      }
      current_swiper_bullets.eq(current_slide_index + 2).addClass("in_range_1");
      if (current_slide_index >= 3) {
        current_swiper_bullets
          .eq(current_slide_index - 3)
          .addClass("in_range_2");
      }
      current_swiper_bullets.eq(current_slide_index + 3).addClass("in_range_2");
    }
    resource_card_swiper.on("slideChangeTransitionStart", () => {
      updateSliderUI_whenTransitionStart();
    });
    ///markerhere
  });
}

function g_play_video(video_src, video_screen_ele) {
  const iframe_component = video_screen_ele.find("iframe");

  if (video_src.includes("iframe")) {
    video_src = $(`${video_src}`).attr("src");
    console.log("Iframe case");
  }
  if (!video_src) {
    video_src = "https://www.youtube.com/embed/E4RXZIps4cc?si=gXSjgSuD298pfyHv";
    console.log("no video_src found");
  }

  console.log(video_src);

  iframe_component.attr("src", video_src);
  //Youtube
  if (video_src.includes("youtube")) {
    console.log("youtube case");
    video_screen_ele.find("[v_platform='vimeo']").hide();
    video_screen_ele.find("[v_platform='youtube']").show();
  }
  //Vimeo
  if (video_src.includes("vimeo")) {
    console.log("vimeo case");
    video_screen_ele.find("[v_platform='youtube']").hide();
    video_screen_ele.find("[v_platform='vimeo']").show();
    setTimeout(() => {
      const script = document.createElement("script");
      script.src = "https://player.vimeo.com/api/player.js";
      script.async = true; // Optional: Load the script asynchronously
      document.head.appendChild(script); // Append the script to the document
    }, 10); // 3
  }
}

function g_stop_video() {
  const iframe_component = $("iframe[v_platform]");
  iframe_component.attr("src", "");
}

const video_screen = $(".video_screen");

function openVideoScreenSrc(src) {
  g_play_video(src, video_screen);
  //   video_screen.addClass("is_active");
  gsap.to(".video_screen", {
    opacity: 1,
    pointerEvents: "auto",
  });

  lenis.stop();
}
function closeVideoScreenSrc() {
  const iframe_component = video_screen.find("iframe");
  //Youtube
  //   video_screen.removeClass("is_active");
  gsap.to(".video_screen", {
    opacity: 0,
    pointerEvents: "none",
  });
  iframe_component.attr("src", "");
  lenis.start();
}

function video_section() {
  $(".video_screen:not(#main_ele)");
  $(".page_wrap").prepend($(".video_screen#main_ele"));

  $("[video_section]").each(function (index) {
    const video_section = $(this);

    const open_btn = video_section.find(
      "[video_play_btn], .brand_benefits_video_wrapper"
    );
    const video_screen_close_btn = video_screen.find(
      ".video_screen_close_btn, .video_screen_bg"
    );

    const iframe_src = video_section.find("[video_src]").attr("video_src");
    gsap.set(video_section, {
      zIndex: 5,
    });
    // console.log("iframe_src", iframe_src);

    open_btn.on("click", function () {
      openVideoScreenSrc(iframe_src);
    });
    video_screen_close_btn.on("click", function () {
      closeVideoScreenSrc();
    });
  });
}

function init_page() {
  gsap.to(".page_wrap", {
    opacity: 1,
    duration: 1.5,
    delay: 0.5,
  });

  gsap.fromTo(
    ".gradient.hero_ver",
    { scale: 0.75 },
    {
      scale: 1.2,
      duration: 2,
      repeat: -1,
      yoyo: true,
      ease: Power0.easeNone,
    }
  );
}

function initTooltipPosition() {
  $("[text-split-target='tooltip']").each(function () {
    const magicWords = $(this).find(".magic-word");
    if (magicWords.length) {
      const target_word = magicWords.eq(magicWords.length - 1);
      const target_tooltip = $(this)
        .closest("div")
        .find(".grid_card_tooltip_wrap");
      // gsap.set(target_word, {
      //   backgroundColor: "blue",
      // });
      target_word.append(target_tooltip);
      gsap.set(target_tooltip, {
        top: currentViewPort() === "desktop" ? "0.45rem" : "15%",
        right: "-1.25rem",
      });
    }
  });

  // grid_card_tooltip_wrap
}

// function loadContent(url, targetSelector, contentSelector, callback) {
//   // Check if targetSelector is a jQuery object, otherwise convert it to one
//   var target =
//     targetSelector instanceof jQuery ? targetSelector : $(targetSelector);

//   $.get(url, function (data) {
//     target.append($(contentSelector, data));
//     if (typeof callback === "function") {
//       callback(); // Call the callback function after content is loaded
//     }
//   });
// }

function loadContent(url, targetSelector, contentSelector, callback) {
  // Check if targetSelector is a jQuery object, otherwise convert it to one
  var target =
    targetSelector instanceof jQuery ? targetSelector : $(targetSelector);

  $.get(url, function (data) {
    var content = $(contentSelector, data); // Select the content from the fetched data
    // console.log(content);
    if (content.length) {
      // Check if the contentSelector exists
      target.append(content);
      if (typeof callback === "function") {
        callback(); // Call the callback function after content is loaded
      }
    } else {
      console.warn("ContentSelector not found:", contentSelector);
    }
  });
}

function setUpLinksWithTrackingUTM() {
  const currentPath = window.location.pathname;

  // Determine the utm_source dynamically based on the page
  const pageName = currentPath.split("/").filter(Boolean).pop() || "homepage";
  const utmSource = currentPath.includes("/brand/")
    ? "branded page"
    : pageName.replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());

  // Extract the franchise name if "brand/" is in the path
  let franchiseName = null;
  if (currentPath.includes("/brand/")) {
    const pathSegments = currentPath.split("/");
    const brandIndex = pathSegments.indexOf("brand");
    if (brandIndex !== -1 && pathSegments[brandIndex + 1]) {
      franchiseName = pathSegments[brandIndex + 1]
        .replace(/-/g, " ")
        .split(" ")
        .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
        .join(" ");
    }
  }

  $("a").each(function () {
    // return;
    const currentLinkEle = $(this);
    const ctaLink = currentLinkEle.attr("href");
    currentLinkEle.attr("is_markeed", "true");

    // Skip links that do not contain "select-franchise"
    if (!ctaLink.includes("select-franchise")) {
      return;
    }

    // Check if the link already has utm_source or franchise parameters
    const urlParams = new URLSearchParams(ctaLink.split("?")[1]);

    if (urlParams.has("utm_source") || urlParams.has("franchise")) {
      // console.log("testing", ctaLink);
      // Apply this ctaLink to all links containing "select-franchise"
      $("a").each(function () {
        const linkEle = $(this);
        const linkHref = linkEle.attr("href");

        if (linkHref.includes("select-franchise")) {
          // linkEle.attr("href", ctaLink); // Apply the ctaLink
          linkEle.attr("target", "_blank"); // Open in a new tab
        }
      });

      // Break the loop
      return false;
    }

    // Determine the separator based on existing query parameters
    const separator = ctaLink.includes("?") ? "&" : "?";

    // Construct the new href dynamically
    let newHref = `${ctaLink}${separator}utm_source=${encodeURIComponent(
      utmSource
    )}`;
    if (franchiseName) {
      newHref += `&franchise=${encodeURIComponent(franchiseName)}`;
    }

    // Escape `&` as `&amp;` for proper HTML usage
    newHref = newHref.replace(/&/g, "&amp;");

    currentLinkEle.attr("href", newHref);

    // Open links with "select-franchise" in a new tab
    currentLinkEle.attr("target", "_blank");
  });
}

// function setUpLinksWithTrackingUTM() {
//   const currentPath = window.location.pathname;

//   // Determine the utm_source dynamically based on the page
//   const pageName = currentPath.split("/").filter(Boolean).pop() || "homepage";
//   const utmSource = currentPath.includes("/brand/")
//     ? "branded page"
//     : pageName.replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());

//   // Extract the franchise name if "brand/" is in the path
//   let franchiseName = null;
//   if (currentPath.includes("/brand/")) {
//     const pathSegments = currentPath.split("/");
//     const brandIndex = pathSegments.indexOf("brand");
//     if (brandIndex !== -1 && pathSegments[brandIndex + 1]) {
//       franchiseName = pathSegments[brandIndex + 1]
//         .replace(/-/g, " ")
//         .split(" ")
//         .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
//         .join(" ");
//     }
//   }

//   $("a").each(function () {
//     const currentLinkEle = $(this);
//     const ctaLink = currentLinkEle.attr("href");

//     // Skip links that do not contain "select-franchise"
//     if (!ctaLink.includes("select-franchise")) {
//       return;
//     }

//     // Check if the link already has utm_source or franchise parameters
//     const urlParams = new URLSearchParams(ctaLink.split("?")[1]);
//     if (urlParams.has("utm_source") || urlParams.has("franchise")) {
//       return;
//     }

//     // Determine the separator based on existing query parameters
//     const separator = ctaLink.includes("?") ? "&" : "?";

//     // Construct the new href dynamically
//     let newHref = `${ctaLink}${separator}utm_source=${encodeURIComponent(
//       utmSource
//     )}`;
//     if (franchiseName) {
//       newHref += `&franchise=${encodeURIComponent(franchiseName)}`;
//     }

//     // Escape `&` as `&amp;` for proper HTML usage
//     newHref = newHref.replace(/&/g, "&amp;");

//     currentLinkEle.attr("href", newHref);

//     // Open links with "select-franchise" in a new tab
//     currentLinkEle.attr("target", "_blank");
//   });
// }

function setFontSizeAutomaticallySwiperHeading() {
  $(".case_study_swiper_section .case-study-slide").each(function () {
    const current_heading = $(this).find("h2");

    let totalWords = 0;
    let words = current_heading.text().trim().split(/\s+/);

    // Add the number of words in this h2 to the total count
    totalWords += words.length;

    if (totalWords > 15) {
      if (currentViewPort() === "desktop") {
        gsap.set(current_heading, {
          fontSize: "3.25em",
          maxWidth: "14em",
        });
      }
      if (currentViewPort() === "tablet") {
        gsap.set(current_heading, {
          fontSize: "3.25em",
          maxWidth: "14em",
        });
      }
      if (currentViewPort() === "mobile") {
        gsap.set(current_heading, {
          fontSize: "1.5rem",
          maxWidth: "14em",
        });
      }
    }
    if (totalWords > 25) {
      if (currentViewPort() === "desktop") {
        gsap.set(current_heading, {
          fontSize: "2.5em",
          maxWidth: "20em",
        });
      }
      if (currentViewPort() === "tablet") {
        gsap.set(current_heading, {
          fontSize: "2.5em",
          maxWidth: "20em",
        });
      }
      if (currentViewPort() === "mobile") {
        gsap.set(current_heading, {
          fontSize: "1.15rem",
          maxWidth: "20em",
        });
      }
    }
    if (totalWords > 35) {
      if (currentViewPort() === "desktop") {
        gsap.set(current_heading, {
          fontSize: "2.15em",
          maxWidth: "21.75em",
        });
      }
      if (currentViewPort() === "tablet") {
        gsap.set(current_heading, {
          fontSize: "2.15em",
          maxWidth: "20em",
        });
      }
      if (currentViewPort() === "mobile") {
        gsap.set(current_heading, {
          fontSize: "1rem",
          maxWidth: "20em",
        });
      }
    }
    if (totalWords > 55) {
      if (currentViewPort() === "desktop") {
        gsap.set(current_heading, {
          fontSize: "1.75em",
          maxWidth: "23.5em",
        });
      }
      if (currentViewPort() === "tablet") {
        gsap.set(current_heading, {
          fontSize: "1.75em",
          maxWidth: "20em",
        });
      }
      if (currentViewPort() === "mobile") {
        gsap.set(current_heading, {
          fontSize: "0.85rem",
          maxWidth: "20em",
        });
      }
    }

    // console.log(
    //   current_heading.text(),
    //   "Total words in all h2 tags:",
    //   totalWords
    // );
  });
}

function setFontSizeAutomaticallyHeading() {
  $(".automatically_set_font_size").each(function () {
    const current_heading = $(this);

    let totalWords = 0;
    let words = current_heading.text().trim().split(/\s+/);

    // Add the number of words in this h2 to the total count
    totalWords += words.length;

    if (totalWords > 15) {
      if (currentViewPort() === "desktop") {
        gsap.set(current_heading, {
          fontSize: "2.625rem",
          maxWidth: "14em",
        });
      }
      if (currentViewPort() === "tablet") {
        gsap.set(current_heading, {
          fontSize: "1.5em",
          maxWidth: "14em",
        });
      }
      if (currentViewPort() === "mobile") {
        gsap.set(current_heading, {
          fontSize: "1.5rem",
          maxWidth: "14em",
        });
      }
    }
    if (totalWords > 25) {
      if (currentViewPort() === "desktop") {
        gsap.set(current_heading, {
          fontSize: "2.5rem",
          maxWidth: "20em",
        });
      }
      if (currentViewPort() === "tablet") {
        gsap.set(current_heading, {
          fontSize: "1.5em",
          maxWidth: "14em",
        });
      }
      if (currentViewPort() === "mobile") {
        gsap.set(current_heading, {
          fontSize: "1.5rem",
          maxWidth: "14em",
        });
      }
    }
    if (totalWords > 35) {
      if (currentViewPort() === "desktop") {
        gsap.set(current_heading, {
          fontSize: "2rem",
          maxWidth: "21.75em",
        });
      }
      if (currentViewPort() === "tablet") {
        gsap.set(current_heading, {
          fontSize: "1.5em",
          maxWidth: "14em",
        });
      }
      if (currentViewPort() === "mobile") {
        gsap.set(current_heading, {
          fontSize: "1.5rem",
          maxWidth: "14em",
        });
      }
    }
    if (totalWords > 55) {
      if (currentViewPort() === "desktop") {
        gsap.set(current_heading, {
          fontSize: "1.75rem",
          maxWidth: "23.5em",
        });
      }
      if (currentViewPort() === "tablet") {
        gsap.set(current_heading, {
          fontSize: "1.35em",
          maxWidth: "14em",
        });
      }
      if (currentViewPort() === "mobile") {
        gsap.set(current_heading, {
          fontSize: "1.25rem",
          maxWidth: "14em",
        });
      }
    }

    // console.log(
    //   current_heading.text(),
    //   "Total words in all h2 tags:",
    //   totalWords
    // );
  });
}

// function loadCaseStudySliderGroup() {
//   $(".testimonial_group_wrapper").each(function () {
//     const curent_testimonial_group_wrapper = $(this);
//     curent_testimonial_group_wrapper.html("");

//     const target = curent_testimonial_group_wrapper.attr(
//       "target_testimonial_group"
//     );

//     const url_path = "/testimonial-group/" + target;
//     loadContent(
//       `${url_path}`,
//       curent_testimonial_group_wrapper,
//       ".section.case_study_swiper_section.load_target",
//       function () {
//         // console.log("Content loaded for the testimonial slider");
//         case_study_slider_can_load = true;
//       }
//     );
//     // console.log(target, "target");
//   });
// }
function loadCaseStudySliderGroup() {
  $(".testimonial_group_wrapper").each(function () {
    const curent_testimonial_group_wrapper = $(this);
    curent_testimonial_group_wrapper.html("");

    const target = curent_testimonial_group_wrapper.attr(
      "target_testimonial_group"
    );

    const url_path = "/testimonial-group/" + target;
    loadContent(
      `${url_path}`,
      curent_testimonial_group_wrapper,
      ".section.case_study_swiper_section.load_target",
      function () {
        // console.log("Content loaded for the testimonial slider");
        case_study_slider_can_load = true;
      }
    );

    // console.log(target, "target");
  });
}
function loadResourceGroup() {
  $(".reources_group_wrapper").each(function () {
    const current_group_wrapper = $(this);
    current_group_wrapper.html("");

    const target = current_group_wrapper.attr("target_resource_group");

    const url_path = "/resource-groups/" + target;
    loadContent(
      `${url_path}`,
      current_group_wrapper,
      ".section#resource_group_section",
      function () {
        // console.log("Content loaded for the testimonial slider");
        case_study_slider_can_load = true;
      }
    );
    // console.log(target, "target");
  });
}

function video_modal() {
  function openBioScreen(id) {
    closeBioScreen();
    lenis.stop();
    gsap.set(
      `.video_modal_cms_wrapper .video_modal_cms_item[card_id="${id}"]`,
      {
        display: "flex",
      }
    );

    gsap.timeline().to(".video_modal_cms_wrapper", {
      opacity: 1,
      pointerEvents: "auto",
      duration: 0.75,
    });
  }
  function closeBioScreen() {
    gsap.set(".video_modal_cms_wrapper .video_modal_cms_item", {
      display: "none",
    });
    g_stop_video();
    lenis.start();
    gsap.timeline().to(".video_modal_cms_wrapper", {
      opacity: 0,
      pointerEvents: "none",
    });
  }

  // $(".resource_card_swiper_slide").on("click", function () {
  //   const current_video_wrapper = $(this);
  //   const video_src = current_video_wrapper.attr("video_src");
  //   openVideoScreenSrc(video_src);
  //   console.log("clicked, video played", video_src);
  //   g_play_video(video_src, current_video_wrapper);
  // });
  $(".resource_video_card,.resource_card_swiper_slide").on(
    "click",
    function (index) {
      const current_card = $(this);
      const id = current_card.attr("card_id");
      openBioScreen(id);
    }
  );
  $(".video_modal_close,.video_modal_card_bg").on("click", function (index) {
    closeBioScreen();
  });
}

function loadTagsForBlogCard(url) {
  $(
    `.blog_card[slug],
    .grid_card[slug]`
  ).each(function () {
    const current_card = $(this);
    const tags_loaded = current_card.attr("tags_loaded");
    if (tags_loaded === "true") {
      return;
    }
    current_card.attr("tags_loaded", "true");
    const card_slug = current_card.attr("slug");

    const target_tag_container = current_card.find(".tag_wrapper");

    const card_url_path = "/resources/" + card_slug;
    // console.log(card_url_path);
    loadContent(
      `${card_url_path}`,
      target_tag_container,
      ".post_tag_wrapper#card_tags",
      function () {
        // console.log("Content loaded for the top slider");
      }
    );
  });

  // post_tag_wrapper
}

function resources_video_modal() {
  $(".video_modal_video_part.video_part").on("click", function () {
    const current_video_wrapper = $(this);
    const video_src = current_video_wrapper.attr("video_src");
    console.log("clicked, video played", video_src);
    g_play_video(video_src, current_video_wrapper);
  });
}

function form_input() {
  $(".contact_section").each(function () {
    const current_form_wrapper = $(this);

    current_form_wrapper.attr("result_showing", "false");

    const current_field_wrappers = current_form_wrapper.find(
      ".form_field_wrapper"
    );
    const input_eles = current_form_wrapper.find("input[type], textarea");

    current_field_wrappers.each(function (index) {
      const current_field_wrapper = $(this);
      const id = "form_field_wrapper_" + index;
      current_field_wrapper.attr("id", id);
      const current_input = current_field_wrapper.find("input[type], textarea");

      $(document).on("click", function (event) {
        if (!$(event.target).closest(`#${id}`).length) {
          if (current_input.val()) {
            current_field_wrapper.attr("is_active", "true");
          } else {
            current_field_wrapper.attr("is_active", "false");
          }
        }
      });

      current_field_wrapper.on("click", function () {
        current_field_wrapper.attr("is_active", "true");
      });
    });

    input_eles.on("input", function () {
      //   this.value = this.value.replace(/[^0-9]/g, ""); // Remove non-numeric characters
    });

    input_eles.on("input", function () {
      checking_input_error();
    });

    function checking_input_error() {
      input_eles.each(function () {
        const current_input = $(this);
        const field_wrapper = current_input.closest(".form_field_wrapper");
        if (current_input.val()) {
          field_wrapper.attr("is_error", "false");
        } else {
          field_wrapper.attr("is_error", "true");
          error_happening = true;
        }
      });
    }
  });

  $(".contact_form_wrapper").each(function () {
    const f_button = $(this).find(".main_button");
    const r_button = $(this).find("input[type='submit']");
    f_button.on("click", function () {
      r_button.click();
    });
  });
}

setTimeout(() => {
  case_study_slider_can_load = true;
}, 3000);

loadCaseStudySliderGroup();
loadResourceGroup();
$("document").ready(function () {
  init_page();
  initAnimationSetup();
  initNav();

  //Globall components
  Faq_Component();
  ClientLogoSection();
  ApplicationSection();
  form_input();

  initTooltipPosition();
  setFontSizeAutomaticallyHeading();

  video_section();

  // setTimeout(() => {
  setUpLinksWithTrackingUTM();
  // }, 500);
  setTimeout(() => {
    loadTagsForBlogCard();
    loanTable_section();
    // console.log("triggered");
  }, 1000);

  if (currentViewPort() === "desktop") {
  }

  let case_study_slider_interval = setInterval(() => {
    // console.log("Case study slider interval triggered.");
    testimonial_swiper_component();
    setFontSizeAutomaticallySwiperHeading();
    if (case_study_slider_triggered) {
      clearInterval(case_study_slider_interval);
    }
  }, 1000);

  setTimeout(() => {
    Resource_card_w_swiper_component();
    video_modal();
    resources_video_modal();
  }, 2000);

  $(window).scroll(function () {
    //check if section is on screen after scroll
  });
});