$(function () {

     var $status = $('.pagingInfo');
     var $slickElement = $('#main-slider');

     $slickElement.on('init reInit afterChange', function (event, slick, currentSlide, nextSlide) {
         //currentSlide is undefined on init -- set it to 0 in this case (currentSlide is 0 based)
         var i = (currentSlide ? currentSlide : 0) + 1;
         $status.html( "<p>"+ "0" + i +  "</p>" + "<div class='pro_bg'><div class='pro-ani pro-bar '></div></div>" +  "<p>" +"0" + slick.slideCount + "</p>");
     });


     //메인슬라이드
     $slickElement.not('.slick-initialized').slick({
         slide: 'div', //슬라이드 되어야 할 태그 ex) div, li 
         fade: true,
         infinite: true, //무한 반복 옵션  
         slidesToShow: 1, // 한 화면에 보여질 컨텐츠 개수
         slidesToScroll: 1, //스크롤 한번에 움직일 컨텐츠 개수
         speed: 1000, // 다음 버튼 누르고 다음 화면 뜨는데까지 걸리는 시간(ms)
         lazyLoad: 'progressive',
         arrows: true, // 옆으로 이동하는 화살표 표시 여부
         autoplay: true, // 자동 스크롤 사용 여부
         autoplaySpeed: 5000, // 자동 스크롤 시 다음으로 넘어가는데 걸리는 시간 (ms)
         vertical: false, // 세로 방향 슬라이드 옵션
         prevArrow: $(".slick-prev"), // 이전 화살표 모양 설정
         nextArrow: $(".slick-next"), // 다음 화살표 모양 설정
         draggable: true, //드래그 가능 여부 

     });



     let time = 0;
     let interval;
     let timeSet;
     let duration = 5;



     $(".main-slider").on('afterChange', function () {
         time = 0;
         duration = 5;
         $(".pro-bar").addClass('pro-ani');
         $(".pro-ani").css({
             'animation-duration': '5s',
         })
         timeSet = setInterval(function () {
             duration--;
         }, 1000)
     });
     $(".main-slider").on('beforeChange', function () {
         $(".pro-bar").removeClass('pro-ani');
         clearInterval(timeSet);
     });

     $(".main_slide").on('mouseenter', function () {
         interval = setInterval(function () {
             time = time + 1;
         }, 1000)
     })

     $(".main_slide").on('mouseleave ', function () {
         clearInterval(interval);
         $(".pro-ani").css({
             'animation-duration': duration + time + 's',
         })
         duration = duration + time;
         console.log(duration, time)
         time = 0;
     })


    //  메인 풀페이지
     $('.main-wrap').fullpage({

        licenseKey: '0BC6EBF5-8EBD4D79-8598E1DF-A444B358',

        sectionSelector: '.main-section-wrap',

        //options here
        autoScrolling: true,


        menu: '#menu',
        lockAnchors: false,
        anchors:['main-slide', 'maincompany', 'mainbuisness', 'maininfo'],
        navigation: true,
        navigationPosition: 'right',
        navigationTooltips: ['MAIN', 'COMPANY', 'BUISNESS',  'INFOMATION'],
        showActiveTooltip: true,
        slidesNavigation: false,
        slidesNavPosition: 'bottom',
        normalScrollElements: '#header',

        responsiveWidth: 1000,
        scrollBar: true,
        scrollOverflow: false,


    });


    // 환경플랜트
    $(".product_slide").not('.slick-initialized').slick({
        slidesToShow: 3, // 한 화면에 보여질 컨텐츠 개수
        slidesToScroll: 1, //스크롤 한번에 움직일 컨텐츠 개수
        prevArrow: $(".product_slide_prev"),
        nextArrow: $(".product_slide_next"),

        responsive: [ // 반응형 웹 구현 옵션
					{  
						breakpoint: 500, //화면 사이즈 960px
						settings: {
							//위에 옵션이 디폴트 , 여기에 추가하면 그걸로 변경
							slidesToShow: 2
						} 
					}
				]
    });



 })