window.onscroll = function() {scrollFunction()};

function scrollFunction() {
  var scrollTop = document.body.scrollTop ? document.body.scrollTop : document.documentElement.scrollTop;
  if (document.body.scrollTop > 0 || document.documentElement.scrollTop > 0) {
    $('#menu_wrapper').addClass('fixed-menu');
    $('.main_menu').css('height', 80-scrollTop);

    
  } else {
    $('#menu_wrapper').removeClass('fixed-menu');
  }
}

$(document).ready(function(){

  
  
  // product detail

  var product_main_slider = $('#product_main .image ul').slick({
    autoplay: true,
    infinite: false,
    slidesToScroll: 1,
    slidesToShow: 1,
    arrows: false,
    dots: false,
    asNavFor: '#product_main .thumbs ul',
  });
  
  $('#product_main .thumbs ul').slick({
    //autoplay: true,
    infinite: false,
    slidesToShow: 5,
    slidesToScroll: 5,
    asNavFor: '#product_main .image ul',
    dots: false,
    focusOnSelect: true,
    variableWidth: true
  });
  
  // Remove active class from all thumbnail slides
  $('.slider-nav-thumbnails .slick-slide').removeClass('slick-active');
  
  // Set active class to first thumbnail slides
  $('.slider-nav-thumbnails .slick-slide').eq(0).addClass('slick-active');
  
  // On before slide change match active thumbnail to current slide
  $('#product_main .image ul').on('beforeChange', function (event, slick, currentSlide, nextSlide) {
    var mySlideNumber = nextSlide;
    $('#product_main .thumbs ul').removeClass('slick-active');
    $('#product_main .thumbs ul').eq(mySlideNumber).addClass('slick-active');
  });

  function jumpFirst() {
    setTimeout(function() {
      product_main_slider.slick("slickGoTo", 0);
    },2000);
  }

  $('#product_main .image ul').on('afterChange', function(event, slick, currentSlide) {
    const _last = slick.slideCount - slick.options.slidesToShow
  
    
    if (_last === currentSlide) {console.log(currentSlide);
     
      product_main_slider.slick('slickPause')
        setTimeout(() => {
          product_main_slider.slick('slickGoTo', 0, false)
          product_main_slider.slick('slickPlay')
          setTimeout(() => {
            product_main_slider.slick('refresh')
          }, product_main_slider.slick('slickGetOption', 'speed'));
        }, 7000);
      }
    
  })

});