$(document).ready(function () {
  SecondscrollEvent();
  secondtabClick();
  mobiletabSwiper();
});



var secondSection01 = $('#second-sec-01').offset().top;
var secondSection02 = $('#second-sec-02').offset().top;
var secondSection03 = $('#second-sec-03').offset().top;
var secondSection04 = $('#second-sec-04').offset().top;



var secondBtn = $('#second-prod-tab li');
var secondBtnA = $('#second-prod-tab li a');
var windowWidth = $(window).width();
var headerHeight = $('.header-container').outerHeight();
var navHeight = $('.nav-tab-container').outerHeight();



var height01 = headerHeight + navHeight;
for (let i = 0; i < $('section').length; i++) {
  console.log(`i`, i);
  var secHeight = $('section').eq(i).outerHeight();
  var innerHeight = $('section').eq(i).height();
}
var padHeight = secHeight - innerHeight;
var minor = height01 + padHeight;
function SecondscrollEvent() {
  $(window).scroll(function () {
    var secondPage = $(window).scrollTop();
    console.log(`secHeight`, secHeight);
    console.log(`innerHeight`, innerHeight);
    console.log(`padHeight`, padHeight);
    console.log(`secondPage`, secondPage);
    console.log(`minor `, minor);



    console.log(`secondSection01`, secondSection01);
    console.log(`secondSection02`, secondSection02);
    console.log(`secondSection03`, secondSection03);
    console.log(`secondSection04`, secondSection04);



    // s:: scroll-evetn
    if (secondPage < secondSection02 - minor) {
      secondBtn.removeClass('on');
      secondBtn.eq(1).addClass('on');
    } else if (secondSection02 - minor + 1 < secondPage && secondSection03 - minor > secondPage) {
      secondBtn.removeClass('on');
      secondBtn.eq(2).addClass('on');
    } else if (secondSection03 - minor + 1 < secondPage && secondSection04 - minor > secondPage) {
      secondBtn.removeClass('on');
      secondBtn.eq(3).addClass('on');
    } else if (secondSection04 - minor + 1 < secondPage) {
      secondBtn.removeClass('on');
      secondBtn.eq(4).addClass('on');
    } else {
      secondBtn.removeClass('on');
    }
    // e:: scroll-evetn
    // if (windowWidth > 1024) {
    //   if (secondPage < secondSection02 - minor) {
    //     secondBtn.removeClass('on');
    //     secondBtn.eq(1).addClass('on');
    //   } else if (secondSection02 - minor < secondPage && secondSection03 - minor >= secondPage) {
    //     secondBtn.removeClass('on');
    //     secondBtn.eq(2).addClass('on');
    //   } else if (secondSection03 - minor < secondPage && secondSection04 - minor >= secondPage) {
    //     secondBtn.removeClass('on');
    //     secondBtn.eq(3).addClass('on');
    //   } else if (secondSection04 - minor < secondPage) {
    //     secondBtn.removeClass('on');
    //     secondBtn.eq(4).addClass('on');
    //   } else {
    //     secondBtn.removeClass('on');
    //   }
    // } //web
    // else if (windowWidth > 768 && windowWidth < 1024) {
    //   // s:: scroll-evetn
    //   if (secondPage < secondSection02 - 300) {
    //     secondBtn.removeClass('on');
    //     secondBtn.eq(1).addClass('on');
    //   } else if (secondSection02 - 300 < secondPage && secondSection03 - 300 >= secondPage) {
    //     secondBtn.removeClass('on');
    //     secondBtn.eq(2).addClass('on');
    //   } else if (secondSection03 - 300 < secondPage && secondSection04 - 300 >= secondPage) {
    //     secondBtn.removeClass('on');
    //     secondBtn.eq(3).addClass('on');
    //   } else if (secondSection04 - 300 < secondPage) {
    //     secondBtn.removeClass('on');
    //     secondBtn.eq(4).addClass('on');
    //   } else {
    //     secondBtn.removeClass('on');
    //   }
    //   // e:: scroll-evetn
    // } //tablet
  }); //secondscrollEvent
}



function secondtabClick() {
  secondBtnA.click(function (e) {
    e.preventDefault();
    console.log('¼¼ÄÁµåÅÇÀÌ ¿Ö½ÇÇàµÉ±î');
    secondBtn.removeClass('on');
    $(this).addClass('on');



    // console.log(`windowWidth`, windowWidth);
    if (windowWidth > 1024) {
      $('html,body').animate(
        {
          scrollTop: $(this.hash).offset().top,
        },
        // 1000
        600
      );
    } else if (windowWidth < 1024 && windowWidth > 320) {
      $('html,body').animate(
        {
          scrollTop: $(this.hash).offset().top - minor,
        },
        // 1000
        400
      );
    }
  });
}



var mobileSwiper = new Swiper('.mobile-second-swiper', {
  slidesPerView: 2,
  spaceBetween: 0,
  observer: true,
  observeParents: true,
});



function mobiletabSwiper() {
  var mobileTab = $('.mobile-second-swiper li');
  var mobileTabA = $('.mobile-second-swiper li a');
  mobileTabA.click(function (e) {
    mobileTab.removeClass('on');
    $(this).parent().addClass('on');
    console.log(`Ŭ¸¯ÀßµÊ!`);
    e.preventDefault();
    for (let count = 0; count < mobileTab.length; count++) {
      console.log(`count`, count);


      if (mobileTab.eq(count).hasClass('on') == true) {
        mobileSwiper.slideTo(count, 400);
      } else {
        console.log(`Ŭ·¡½º¾ÈºÙ¾î¤Ð¤Ð`);
        console.log(`mobileTab.eq(count)`, $(this).eq(count));
      }
    }
  });
}