$(document).ready(function () {
  newProdEffect();
  magnificPop();
  newProdclick();
  newsubTab();
  ActiveSwiper();
});


var newSwiper = new Swiper('.newProdli', {
  // loop: true,
  // loopFillGroupWithBlank: true,
  slidesPerView: 2,
  spaceBetween: 0,
  slidesPerGroup: 2,
  pagination: {
    el: '.swiper-pagination',
    clickable: true,
  },
  navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',
  },


  breakpoints: {
    600: {
      slidesPerView: 2,
      spaceBetween: 0,
      slidesPerGroup: 2,
    },
    768: {
      slidesPerView: 3,
      spaceBetween: 0,
      slidesPerGroup: 3,
    },
    1024: {
      slidesPerView: 4,
      spaceBetween: 0,
      slidesPerGroup: 4,
    },
  },
});


//sub-wrap
var subTabSwiper = new Swiper('.sub-list-btn-wrap', {
  slidesPerView: 'auto',
  spaceBetween: 0,
  observer: true,
  observeParents: true,
});


//¼­ºê½º¿ÍÀÌÆÛ È°¼ºÈ­
var newProdLi = $('.newProdli li');
function newsubTab() {
  $('.next-li').click(function () {
    console.log($('.newProdli .swiper-slide-active').attr('aria-label'));
    newSwiper.slideTo(7, 600);
  });


  $('.next-sec-li').click(function () {
    console.log($('.newProdli .swiper-slide-active').attr('aria-label'));
    newSwiper.slideTo(8, 600);
  });
}


function ActiveSwiper() {
  if (windowWidth < 766) {
    newProdLi.each(function (index) {
      if ($(this).hasClass('on')) {
        newSwiper.slideTo(index, 600); // ÇØ´ç À妽º·Î ½½¶óÀ̵å À̵¿
        return false; // 'on' Ŭ·¡½º¸¦ °¡Áø ù ¹ø° ½½¶óÀ̵常 ãÀ¸¸é µÇ¹Ç·Î ¼øȸ¸¦ Á¾·á
      }
    });
  }
}


// ½ºÅ©·Ñ º¯È­ À̺¥Æ®
var listBtn = $('#new-prod-btn li');
var listOn = $('#new-prod-btn li').hasClass('on');
var listBtnA = $('#new-prod-btn li a');
var listFirst = $('#new-prod-btn li:first-child').index();
var listLast = $('#new-prod-btn li:last-child').index();
var listIndex;
var windowWidth = $(window).width();


function newProdEffect() {
  $(window).scroll(function () {
    console.log(`listFirst`, listFirst);
    console.log(`listLast`, listLast);
    var newPage = $(document).scrollTop();
    for (let i = 0; i < $('section').length; i++) {
      console.log(`i`, i);


      //section ³ôÀÌ
      let sectionTop = $('section').eq(i).offset().top;
      //sectionTop + section ³ôÀÌ = sectionBottom
      let sectionBottom = sectionTop + $('section').eq(i).outerHeight();
      let windowHeight = $(window).height();
      let scrollBottom = $('.new-prod-detail-wrap').height() - windowHeight;


      if (listBtn.eq(i).hasClass('on') == true) {
        subTabSwiper.slideTo(i, 600);
      }


      //À¥
      if (1560 <= windowWidth) {
        // } // À¥ ÀÚµ¿ ½½¶óÀ̵å
        if (newPage > sectionTop - 450 && sectionBottom - 450 >= newPage) {
          listBtn.removeClass('on');
          listBtn.eq(i).addClass('on');
        } //e:: ¹öÆ° Ŭ·¡½º ºÙÀ̱â


        //e:: ½º¿ÍÀÌÆÛ À̵¿
      } //e:: ˴


      //³ëÆ®ºÏ
      else if (windowWidth < 1560 && windowWidth > 768) {
        if (newPage > sectionTop - 400 && sectionBottom - 400 >= newPage) {
          listBtn.removeClass('on');
          listBtn.eq(i).addClass('on');
        } //e:: ¹öÆ° Ŭ·¡½º ºÙÀ̱â
      }


      //¸ð¹ÙÀÏ
      else if (windowWidth < 768) {
        if (newPage > sectionTop - 400 && sectionBottom - 400 >= newPage) {
          listBtn.removeClass('on');
          listBtn.eq(i).addClass('on');
        } //e:: ¹öÆ° Ŭ·¡½º ºÙÀ̱â
      }
    } //e:: for
  }); //e:: scroll
}


//À¥
// if (1560 <= windowWidth) {
//   if (newPage > sectionTop - 450 && scrollBottom - 450 >= newPage) {
//     listBtn.removeClass('on');
//     listBtn.eq(i).addClass('on');
//   } else {
//     listBtn.removeClass('on');
//   }


//   if (newPage >= scrollBottom) {
//     listBtn.eq(i).removeClass('on');
//     listBtn.eq(i + 1).addClass('on');
//   }
// }


//³ëÆ®ºÏ
//     else if (windowWidth < 1560) {
//       // if (newPage > sec02Height - 400 && sec03Height - 400 >= newPage) {
//       //   listBtn.removeClass('on');
//       //   listBtn.eq(0).addClass('on');
//       // } else if (newPage > sec03Height - 400 && sec04Height - 400 >= newPage) {
//       //   listBtn.removeClass('on');
//       //   listBtn.eq(1).addClass('on');
//       // } else if (newPage > sec04Height - 400 && sec05Height - 400 >= newPage) {
//       //   listBtn.removeClass('on');
//       //   listBtn.eq(2).addClass('on');
//       //   //swiper
//       //   subTabSwiper.slideTo(1, 500);
//       // } else if (newPage > sec05Height - 400 && sec06Height - 400 >= newPage) {
//       //   listBtn.removeClass('on');
//       //   listBtn.eq(3).addClass('on');
//       // } else if (newPage > sec06Height - 400 && sec07Height - 400 >= newPage) {
//       //   listBtn.removeClass('on');
//       //   listBtn.eq(4).addClass('on');
//       // } else if (newPage > sec07Height - 400 && sec08Height - 400 >= newPage) {
//       //   listBtn.removeClass('on');
//       //   listBtn.eq(5).addClass('on');
//       //   // swiper
//       //   subTabSwiper.slideTo(5, 500);
//       // } else if (newPage > sec08Height - 400 && sec09Height - 400 >= newPage) {
//       //   listBtn.removeClass('on');
//       //   listBtn.eq(6).addClass('on');
//       // } else if (newPage > sec09Height - 400) {
//       //   listBtn.removeClass('on');
//       //   listBtn.eq(7).addClass('on');
//       // } else {
//       //   listBtn.removeClass('on');
//       // }
//     }
//   });
// }


function newProdclick() {
  $(listBtnA).click(function (e) {
    e.preventDefault();
    // ˴
    if (1560 <= windowWidth) {
      $('html,body').animate(
        {
          scrollTop: $(this.hash).offset().top - 300,
        },
        600
      );
      console.log(`À¥ÀÔ´Ï´Ù.`);
    }
    //³ëÆ®ºÏ
    else if (windowWidth < 1560) {
      console.log(`³ëÆ®ºÏÀÔ´Ï´Ù.`);
      $('html,body').animate(
        {
          scrollTop: $(this.hash).offset().top - 350,
        },
        400
      );
    }
  });
}


function magnificPop() {
  $('.magnific').magnificPopup({
    type: 'image',
  });
}