window.Webflow ||= [];
window.Webflow.push(() => {
  //console.log("It's test time");

  ScrollTrigger.create({
    start: 'top top',
    end: 'bottom top',
    toggleClass: {
      className: 'is-scrolled',
      targets: '.navbar',
    },
  });

  //tabs-menu
  $('.tabs-menu').each(function () {
    const firstTab = $(this).find('.tab-link:first');
    firstTab.find('.tab-el').closest('.tab-link').addClass('is-active');
    firstTab.siblings().find('.tab-bg').remove();
    const tabBg = firstTab.find('.tab-bg').detach();
    firstTab.closest(this).append(tabBg);

    const firstTabWidth = firstTab.outerWidth();
    tabBg.width(firstTabWidth);
    tabBg.css('left', firstTab.position().left);
    $('.tab-bg').css('display', 'block');

    firstTab.removeClass('is-bg');
  });

  $('.tab-el').click(function () {
    //console.log("Clicked on .tab-el");
    const tab = $(this);
    const tabMenu = tab.closest('.tabs-menu');
    const tabLink = tab.closest('.tab-link');
    const tabBg = tabLink.closest(tabMenu).find('.tab-bg');

    // tab active class and tab-bg
    tabMenu.find('.tab-link').removeClass('is-active');
    tabLink.addClass('is-active');
    const tabWidth = tabLink.outerWidth();
    tabBg.width(tabWidth);
    tabBg.css('left', tabLink.position().left);
  });

  //tabs-menu in product page
  $('.tabs-menu.is-product-pg').each(function () {
    const tabLinks = $(this).find('.tab-link');
    let totalWidth = 0;
    tabLinks.each(function () {
      totalWidth += $(this).outerWidth();
    });
    const tabBg = tabLinks.first().find('.tab-bg-products');
    tabBg.remove();
    const detachedTabBg = tabBg.detach();
    $(this).append(detachedTabBg);
    const widthInPixels = totalWidth; // Assuming the original width is in pixels
    tabBg.css({
      display: 'block',
      left: 'calc(4% - 0.25rem)',
      width: 'calc(' + widthInPixels + 'px + 0.5rem)',
    });
  });

  //if sticky wrap it in sticky
  if ($('.tabs-menu').hasClass('is-sticky')) {
    // Move .tab-bg-sticky out of tab-link and append it to inside of the closest tabs-menu
    $('.tabs-menu').each(function () {
      const closestTabsMenu = $(this);
      const tabLink = closestTabsMenu.find('.tab-link:first');
      const tabBgSticky = tabLink.find('.tab-bg-sticky').detach();

      // Append .tab-bg-sticky to inside of the closest tabs-menu
      closestTabsMenu.append(tabBgSticky);

      // Get all tabs-menu's tab-links outer width and give that size to .tab-bg-sticky
      let tabLinksWidth = 8;
      closestTabsMenu.find('.tab-link').each(function () {
        tabLinksWidth += $(this).outerWidth(true);
      });
      closestTabsMenu.find('.tab-bg-sticky').width(tabLinksWidth);
    });
  }

  ///NAV MENU
  $('.nav-item').on('mouseenter', function () {
    if ($(window).width() > 991) {
      $(this).addClass('is-active');
      $(this).find('.nav-dropdown-list').addClass('is-active');
    }
  });
  $('.nav-item').on('mouseleave', function () {
    if ($(window).width() > 991) {
      $(this).removeClass('is-active');
      $(this).find('.nav-dropdown-list').removeClass('is-active');
    }
  });

  //mobile menu
  $('.navbar-menu-btn').on('click', function () {
    $(this).toggleClass('is-active');
    $('.navbar-menu-wrap').toggleClass('is-active');
  });

  function menuOpen(selector, target, parent) {
    $(selector).on('click', function () {
      if (!$(this).hasClass('is-lang')) {
        if ($(window).width() <= 991) {
          $(this).siblings(target).addClass('is-active');
          $('.menu-back-btn').addClass('is-show');
          //$(this).closest(parent).addClass("nav-hide");
        }
      }
    });
  }
  menuOpen('.nav_link', navList, navListParent);

  const navLink = '.nav-link';
  var navList = '.nav-dropdown-list';
  var navListParent = '.navbar_menu_content_wrap';
  const megaMenuParent = '.nav-dropdown-content';
  const megaMenuList = '.mega-menu-list';
  menuOpen(navLink, navList, navListParent);
  menuOpen(navLink, megaMenuList, megaMenuParent);

  ////////////////Mobile menu back button function starts here
  $('.nav-link.is-lang').on('click', function () {
    const dropdownList = $(this).siblings('.nav-dropdown-list.is-lang');
    if (dropdownList.hasClass('is-active')) {
      dropdownList.removeClass('is-active');
    } else {
      dropdownList.addClass('is-active');
    }
  });
  ////////////////////////////////Mobile menu back button function ends here

  //zoho form placeholder
  $(document).ready(function () {
    $('form[action*="https://crm.zoho.com/"] .zcwf_row').each(function () {
      const labelText = $(this).find('div:first-child label').text();
      $(this).find('input[type="text"], textarea').attr('placeholder', labelText);
      $(this).find('option:first-child').text(labelText);
    });
  });

  //zoho form apply column span css
  $('input[name="Company"], input[type="submit"], select, textarea, submit')
    .closest('.zcwf_row')
    .css({
      'grid-column': '1 / 3',
    });

  //sticky scroll section animation
  gsap.registerPlugin(ScrollTrigger, ScrollToPlugin);

  $('.sticky-scroll-section').each(function (index) {
    const childTriggers = $(this).find('.scroll-item-content');
    const childTargets = $(this).find('.sticky-item');
    const techTabs = $('.tabs-menu.is-tech-pg').find('.tab-link');

    const tabBg = $('.tabs-menu.is-tech-pg').find('.tab-bg');

    // switch active class
    function makeItemActive(index) {
      childTriggers.removeClass('is-active');
      childTargets.removeClass('is-active');
      techTabs.removeClass('is-active');

      childTriggers.eq(index).addClass('is-active');
      childTargets.eq(index).addClass('is-active');
      techTabs.eq(index).addClass('is-active');

      //if tabs-menu for technologies page exists
      if ($('.tabs-menu.is-tech-pg').length > 0) {
        tabBg.width(techTabs.eq(index).outerWidth());
        tabBg.css('left', techTabs.eq(index).position().left);
      }
    }

    techTabs.each(function () {
      tabId = $(this).find('.tab-el-tech').attr('product_name');
      $(this)
        .find('.tab-el-tech')
        .attr('href', '#' + tabId);
    });

    makeItemActive(0);
    // create triggers
    childTriggers.each(function (index) {
      ScrollTrigger.create({
        trigger: $(this),
        start: 'top 70%',
        end: 'bottom 50%',
        markers: false,
        onToggle: (isActive) => {
          if (isActive) {
            makeItemActive(index);
          }
        },
      });
    });
  });

  //accordion
  $('.accordion-open').on('click', function () {
    const accordionWrap = $(this).closest('.accordion-wrap');
    accordionWrap.toggleClass('is-active');
    $('.accordion-wrap').not(accordionWrap).removeClass('is-active');
  });

  //blog rich text form
  const rteForm = $('[rte-form-component]').detach();
  const attrValue = rteForm.attr('rte-form-component');

  $("p:contains('{{')").each(function () {
    const textWithBrackets = $(this)
      .text()
      .match(/{{(.*?)}}/);
    if (textWithBrackets) {
      const attributeValue = textWithBrackets[1].trim();
      if (attributeValue === attrValue) {
        $(this).replaceWith(rteForm.clone());
      }
    }
  });

  $('.rte-form-btn').on('click', function () {
    $(this).closest('.rte-cta-form').addClass('is-active');
    //console.log('click');
  });

  //procurement table header
  $('.tab-el').on('click', function () {
    const tabText = $(this).siblings('.tab-link-text').text();

    const defaultHeader = $('[header]');
    const headerSelector = '[header="' + tabText + '"]';
    const headerElement = $(headerSelector);

    defaultHeader.removeClass('is-first-active');
    defaultHeader.removeClass('is-active');
    headerElement.addClass('is-active');
  });

  //Services page filter
  //If it's a Service filter, hide all filterItem elements based on unchecked checkboxes
  $(".filter-select-option input[type='checkbox']").on('change', function () {
    // Check if the sibling with attribute fs-cmsfilter-field has a value of "service"
    if ($(this).siblings('[fs-cmsfilter-field="service"]').length) {
      const checkboxes = $(this).closest('.filter-select-options').find("input[type='checkbox']");

      const unchecked = checkboxes.filter(':not(:checked)');
      const filterItems = $('[filter_item]');
      // Remove "is-hidden" from all filter items
      filterItems.removeClass('is-hidden');

      if (unchecked.length === checkboxes.length) {
        // All checkboxes are unchecked, so remove "is-hidden" from all filter items
        filterItems.removeClass('is-hidden');
      } else {
        unchecked.each(function () {
          const uncheckedText = $(this).siblings('span').text().toLowerCase();
          const filterItem = $('[filter_item="' + uncheckedText + '"]');
          filterItem.addClass('is-hidden');
        });
      }
    }
  });
  //Hide the section if there are less than 0 listChildren
  $(".filter-select-option input[type='checkbox']").on('change', function () {
    const lists = $('[fs-cmsfilter-element="list"]');
    lists.each(function () {
      const listElement = $(this);
      setTimeout(function () {
        const listChildren = listElement.children().length;
        //console.log(listChildren);

        const section = $('.section-service');
        // Check if the list has children
        if (listChildren > 0) {
          // Find the closest w-dyn-list and show it
          listElement.closest(section).css('display', 'block');
        } else {
          // List has no children
          listElement.closest(section).css('display', 'none');
        }
      }, 200);
    });
  });

  function checkFilterOptions() {
    const filterSelectOptions = $('.filter-select-options');
    filterSelectOptions.each(function () {
      const filterCheckboxes = $(this).find(".filter-select-item input[type='checkbox']");
      const filterSelectBtn = $(this).siblings('.filter-select-btn');
      if (filterCheckboxes.filter(':checked').length > 0) {
        filterSelectBtn.addClass('is-checked');
      } else {
        filterSelectBtn.removeClass('is-checked');
      }
    });
  }

  $('.filter-select-btn').on('click', function () {
    $('.filter-select-wrap').removeClass('is-active');
    $(this).closest('.filter-select-wrap').toggleClass('is-active');
    checkFilterOptions();
  });

  $(document).on('click', function (event) {
    if (!$(event.target).closest('.filter-select-wrap').length) {
      $('.filter-select-wrap').removeClass('is-active');
    }
    checkFilterOptions();
  });

  // //procurement table pagination move
  // $(".table-list").each(function () {
  //   var pagination = $(this).siblings(".pagination-wrap").detach();
  //   //detach tab line
  //   $(".pagination-wrap").closest(".table-content").append(pagination);
  // });

  //process tab line
  if (document.querySelector('.process-tabs')) {
    const lineDistance =
      $('.tab-process:last-child .process-circle-number').offset().left -
      $('.tab-process:first-child .process-circle-number').offset().left;
    //tabs-process
    $('.process-tabs').each(function () {
      const firstTab = $(this).find('.tab-process:first');
      //detach tab line
      const tabLine = firstTab.find('.process-tabs-line').detach();
      firstTab.closest(this).append(tabLine);
      tabLine.css('width', lineDistance + 'px');
    });
  }

  const tabLinkWidth = $('.cms-product-tabs-item:first-child .tab-link').outerWidth();
  $('.tab-bg').width(tabLinkWidth);

  $('.cms-product-tabs-item .tab-link').css('display', 'none');
  $('.tabs-menu.cms-tabs .tab-link').removeClass('is-active');

  //////////////old nav menu
  function menuOpenOld(selector, target) {
    $(selector).on('click', function () {
      if ($(window).width() <= 991) {
        $(target).removeClass('is-active');
        $(this).siblings(target).toggleClass('is-active');
      }
    });
  }
  menuOpenOld('.nav_link', navList);

  $(document).ready(function () {
    // Helper function to get cookie value
    function getCookie(name) {
      const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
      return match ? match[2] : null;
    }

    // Helper function to set cookie with expiration
    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=/';
    }

    // Toggle class on page load if lang cookie is not present
    if (!getCookie('lang')) {
      $('.modal-wrap').toggleClass('is-active');
    }
    // Close modal when .modal-close is clicked
    $('.modal-close').on('click', function () {
      $('.modal-wrap').removeClass('is-active');
    });
    // Close modal when clicking on the backdrop (outside .modal)
    $('.modal-wrap').on('click', function (event) {
      if (!$(event.target).closest('.modal').length) {
        $(this).removeClass('is-active');
      }
    });

    $('.modal .nav-dropdown-link.is-modal, .nav-dropdown-link.lang-toggle').on(
      'click',
      function () {
        const langAttr = $(this).attr('lang');
        if (langAttr) {
          const langValue = langAttr.toLowerCase();
          setCookie('lang', langValue, 14); // Set cookie for 14 days
        }
      }
    );
  });
});