const pageBody = document.getElementsByTagName("BODY")[0];

// AOS Animation Initializ
AOS.init();



// Menu Toggler Start
const menuToggle = document.querySelector('.menu-toggle');
const siteNavigation = document.querySelector('.main-navigation');

menuToggle.addEventListener('click', () => {
  const isOpened = menuToggle.getAttribute('aria-expanded') === "true";
  if (isOpened ? closeMenu() : openMenu());
});

function openMenu() {
  menuToggle.setAttribute('aria-expanded', "true");
  siteNavigation.setAttribute('data-state', "opened");
  pageBody.classList.add("no-scroll");
}
function closeMenu() {
  menuToggle.setAttribute('aria-expanded', "false");
  siteNavigation.setAttribute('data-state', "closing");

  siteNavigation.addEventListener('animationend', () => {
    siteNavigation.setAttribute('data-state', "closed");
  }, { once: true })

  pageBody.classList.remove("no-scroll");
}
// Menu Toggler End

// Toggling Submenu on Mobile Start
const menuWrapper = document.querySelector(".navbar");
const hasCollapsible = document.querySelectorAll(".has-submenu");

// Collapsible Menu
if ($(window).width() < 991) {
  hasCollapsible.forEach(function (e) {
    e.addEventListener("click", function () {
      e.classList.toggle("active");

      // Close Other Collapsible
      hasCollapsible.forEach(function (otherCollapsible) {
        if (otherCollapsible !== e) {
          otherCollapsible.classList.remove("active");
        }
      });
    });
  });
}


// Add Class on Header OnScroll
const header = document.querySelector('.header')

// OnScroll event handler
const onScroll = () => {

  // Get scroll value
  const scroll = document.documentElement.scrollTop

  // If scroll value is more than 0 - add class
  if (scroll > 10) {
    header.classList.add("is-scrolled");
  } else {
    header.classList.remove("is-scrolled")
  }
}

// Use the function
window.addEventListener('scroll', onScroll)


// Back to Top JS Start

var btn = $('.back-to-top');

$(window).scroll(function () {
  if ($(window).scrollTop() > 300) {
    btn.addClass('show');
  } else {
    btn.removeClass('show');
  }
});

btn.on('click', function (e) {
  e.preventDefault();
  $('html, body').animate({ scrollTop: 0 }, '300');
});

// Services Slider Start
$('.services-slider').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  autoplay: true,
  autoplaySpeed: 10000,
  dots: true,
  arrows: false,
  mobileFirst: true,
});

// Featured Product Slider
$('.fet-prodject-slider').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  autoplay: true,
  autoplaySpeed: 12000,
  mobileFirst: true,
  arrows: true,
  responsive: [
    {
      breakpoint: 1024,
      settings: {
        slidesToShow: 3
      }
    },
    {
      breakpoint: 767,
      settings: {
        slidesToShow: 2
      }
    }
  ]
});


// Our Clients Slider

$('.slider-for').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  arrows: true,
  fade: true,
  asNavFor: '.slider-nav',
  mobileFirst: true,
});
$('.slider-nav').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  asNavFor: '.slider-for',
  centerPadding: '40px',
  dots: false,
  arrows: false,
  mobileFirst: true,
  rtl: true,
  responsive: [
    {
      breakpoint: 576,
      settings: {
        arrows: false,
        centerMode: false,
        slidesToShow: 2
      }
    },
    {
      breakpoint: 768,
      settings: {
        slidesToShow: 3,
        slidesToScroll: 1,
      }
    }
  ]
});

// What We Offer Slider
$('.w-v-offer-slider').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  autoplay: true,
  autoplaySpeed: 4000,
  arrows: false,
  dots: true,
  fade: true,
  dotsClass: 'slick-dots dots-style-1'
});


// Featured Product Slider
$('.cm-services-slider').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  autoplay: true,
  autoplaySpeed: 12000,
  mobileFirst: true,
  arrows: false,
  responsive: [
    {
      breakpoint: 767,
      settings: {
        slidesToShow: 2
      }
    },
    {
      breakpoint: 991,
      settings: {
        slidesToShow: 3
      }
    }
  ]
});

// Blog Slider
 
$('.blog-slider').slick({
  
  autoplaySpeed: 10000,
  dots: true,
  arrows: false,
  mobileFirst: true,
  dotsClass: 'slick-dots blog-dots'
});



$('.case-study-slide').slick({
  centerMode: true,
  centerPadding: '60px',
  slidesToShow: 5,
  responsive: [
    {
      breakpoint: 768,
      settings: {
        arrows: false,
        centerMode: true,
        centerPadding: '40px',
        slidesToShow: 5
      }
    },
    {
      breakpoint: 480,
      settings: {
        arrows: false,
        centerMode: true,
        centerPadding: '40px',
        slidesToShow: 1
      }
    }
  ]
});



$(document).ready(function(){

 $("#flip").click(function(){

 $("#panel").slideToggle("slow");

 });
 });


 // Past Event Slider
$('.past-event-slider').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  autoplay: true,
  autoplaySpeed: 12000,
  mobileFirst: true,
  arrows: true,
  responsive: [
    {
      breakpoint: 767,
      settings: {
        slidesToShow: 2
      }
    }
  ]
});


$(".modal-toggler").click(function(){

  var isPastEventImage = $(this).hasClass("pastevent-img");

  console.log(isPastEventImage);
  if (isPastEventImage) {
    console.log("checking");
    var pasteventImage = $(this).find('img').attr('src');
    $("#pastevent-image").attr('src', pasteventImage);
    $("#pastevent-section").show();
    $("#contact-form-section").hide();
  } else {
    $("#pastevent-section").hide();
    $("#contact-form-section").show();
  }

  var title = $(this).data('title');
  // var description = $(this).data('description');
  
  // var sanitizedDescription = $('<div>').html(description).text();

  // // var pasteventImage = $(this).find('img').attr('src');
  // // $("#pastevent-image").attr('src', pasteventImage);

  // $("#modal-title").text(title);

  // $("#description-content").text(sanitizedDescription);

  

  var description = $(this).data('description');
var sanitizedDescription = description; // No need to sanitize, preserve the HTML tags

$("#modal-title").text(title);
$("#description-content").html(sanitizedDescription);
  
  $("#demo-modal").toggleClass("show");
  $("html, body").addClass("overflow-hidden");
});

$(".modal__close").click(function(){
  $("#demo-modal").removeClass("show");
  $("html, body").removeClass("overflow-hidden");
});



$(document).ready(function($) {
  var page = 2; // Start with the second page of events
  var container = $('#event-container');
  var button = $('#load-more');

  

  button.on('click', function(e) {
    console.log("working load function");
      e.preventDefault();

      var action;
      if (window.location.pathname === '/past-events/') {
        action = 'load_more_Pastevents';
      } else {
        action = 'load_more_events';
      }

      var data = {
          'action': action,
          'page': page,
      };

      console.log(action);

      $.ajax({
          url: custom_script_vars.ajax_url, // AJAX handler URL
          type: 'POST',
          data: data,
          success: function(response) {
              
              container.after(response);
              page++; // Increment the page number

              if (response.trim() === '') {
                button.hide();
              }
          },
          error: function(errorThrown) {
              console.log(errorThrown);
          }
      });
  });
});
