//Scroll Animations
const observer = new IntersectionObserver((entries) => {
    entries.forEach((entry) => {
      // console.log(entry);
      if (entry.isIntersecting) {
        entry.target.classList.add('animations-show-item');
        observer.unobserve(entry.target);
      } else {
        entry.target.classList.remove('animations-show-item');
      }
    });
  });
  
  const hiddenElements = document.querySelectorAll('.animations-hidden-item');
  hiddenElements.forEach((el) => observer.observe(el));

jQuery('document').ready(function(){

  var owl = jQuery('.slider-right .owl-carousel');
    owl.owlCarousel({
    margin:0,
    nav: false,
    autoplay : true,
    lazyLoad: true,
    autoplayTimeout: 3000,
    loop: false,
    dots:true,
    navText : ['<span class="dashicons dashicons-arrow-left-alt2"></span>','<span class="dashicons dashicons-arrow-right-alt2"></span> '],
    responsive: {
      0: {
        items: 1,
        nav: false
      },
      600: {
        items: 1
      },
      1000: {
        items: 1
      }
    },
    autoplayHoverPause : true,
    mouseDrag: true
  });

  var owl = jQuery('.our-projects .owl-carousel');
    owl.owlCarousel({
    margin:25,
    nav: true,
    autoplay : true,
    lazyLoad: true,
    autoplayTimeout: 3000,
    loop: true,
    dots:false,
    navText : ['<span class="dashicons dashicons-arrow-left-alt2"></span>','<span class="dashicons dashicons-arrow-right-alt2"></span> '],
    responsive: {
      0: {
        items: 1,
        nav: false
      },
      600: {
        items: 2
      },
      1000: {
        items: 4
      }
    },
    autoplayHoverPause : true,
    mouseDrag: true
  });

  var owl = jQuery('.our-services .owl-carousel');
    owl.owlCarousel({
    margin: 25,
    nav: true,
    autoplay : true,
    lazyLoad: true,
    autoplayTimeout: 3000,
    loop: true,
    dots:false,
    navText : ['<span class="dashicons dashicons-arrow-left-alt2"></span>','<span class="dashicons dashicons-arrow-right-alt2"></span> '],
    responsive: {
      0: {
        items: 1,
        nav: false
      },
      600: {
        items: 2
      },
      1000: {
        items: 4
      }
    },
    autoplayHoverPause : true,
    mouseDrag: true
  });
 var defaultTotalItems = jQuery('.slide-box .owl-stage-outer .owl-stage').find('.owl-item').length;
    jQuery('h2#active-count').html('01/0' + defaultTotalItems );
    
     if(document.getElementById("slider-right")) {   // Select the node that will be observed for mutations
     const targetNode = document.getElementById("slider-right");
 
     // Options for the observer (which mutations to observe)
     const config = { attributes: true, childList: true, subtree: true };
 
     // Callback function to execute when mutations are observed
     const callback = (mutationList, observer) => {
      
       for (const mutation of mutationList) {
        if (mutation.type === "attributes") {
           var count = jQuery('.slide-box .owl-stage-outer .owl-stage');
           var newCount = '0' + count;
           var totalItems = jQuery('.slide-box .owl-stage-outer .owl-stage').find('.owl-item').length;
           var activeItem = jQuery('.slide-box .owl-stage-outer .owl-stage').children('.active').index() + 1;
           if ( activeItem < 10 ) {
               activeItem = "0" + activeItem;
           }

           jQuery('h2#active-count').html(activeItem + '/0' + totalItems )
         }
       }
     };
 
     // Create an observer instance linked to the callback function
     const observer = new MutationObserver(callback);
 
     // Start observing the target node for configured mutations
     observer.observe(targetNode, config);
   }
});
