$(function () {
  // ---------------------- 초기 로딩 ----------------------
  custom_cursor();
  $("body").addClass("on");
  $(".mainslide").addClass("on");
  mo_effect();
  value();






// ---------------------- Slick 슬라이더 ----------------------

// pc에서 4개 롤링
  $('.lo_pc4').slick({
    infinite: true,
    slidesToShow:4,
    slidesToScroll: 1,
    arrows: true,
    dots: true,
    autoplay: false,
    responsive: [
	  { breakpoint: 1440, settings: { slidesToShow: 3 } },
      { breakpoint: 1024, settings: { slidesToShow: 2 } },
      { breakpoint: 767, settings: { slidesToShow: 1 } }
    ]
  });






// 고매출 행진 슬라이드
$('.gall_money').slick({
  // 중앙 크게 + 양옆 잘림
  slidesToShow: 3,
  arrows: true,
  dots: true,

  // 자동 롤링
  autoplay: true,
  autoplaySpeed: 2000,

  // 마우스/손가락 제어
  draggable: true,
  swipe: true,
  touchMove: true,

  // 건드린 후에도 자동 계속
  pauseOnHover: false,
  pauseOnFocus: false,
  pauseOnDotsHover: false,

  infinite: true,

  responsive: [
    { breakpoint: 1440, settings: { slidesToShow: 3, centerPadding: '80px' } },
    { breakpoint: 1024, settings: { slidesToShow: 1, centerPadding: '180px' } },
    { breakpoint: 767,  settings: { slidesToShow: 1, centerPadding: '70px'  } },
	{ breakpoint: 450,  settings: { slidesToShow: 1, centerPadding: '0px'  } }
  ]
});










$('.gall_review1').slick({
  infinite: true,

  slidesToShow:4,
  slidesToScroll: 1,

  speed: 3000,
  cssEase: 'linear',

  autoplay: true,
  autoplaySpeed: 0,
  pauseOnHover: false,
  pauseOnFocus: false,
  pauseOnDotsHover: false,

  draggable: true,
  swipe: true,
  touchMove: true,

  arrows: false,
  dots: false,

  waitForAnimate: false,
  accessibility: false,

  // ✅ PC 기본값: 세로 슬라이드
  vertical: true,
  verticalSwiping: true,

responsive: [
  {
    breakpoint: 1024,   // 모바일/태블릿
    settings: {
      vertical: false,
      verticalSwiping: false,
      slidesToShow:4,
      rtl: false        // ✅ 좌 → 우
    }
  },
  {
    breakpoint: 767,
    settings: {
      vertical: false,
      verticalSwiping: false,
      slidesToShow:3,
      rtl: false        // ✅ 좌 → 우
    }
  }
]
});


$('.gall_review2').slick({
  infinite: true,

  slidesToShow:4,
  slidesToScroll: 1,

  speed: 3000,
  cssEase: 'linear',

  autoplay: true,
  autoplaySpeed: 0,
  pauseOnHover: false,
  pauseOnFocus: false,
  pauseOnDotsHover: false,

  draggable: true,
  swipe: true,
  touchMove: true,

  arrows: false,
  dots: false,


  waitForAnimate: false,
  accessibility: false,

  // ✅ PC 기본값: 세로 슬라이드
  vertical: true,
  verticalSwiping: true,

responsive: [
  {
    breakpoint: 1024,   // 모바일/태블릿
    settings: {
      vertical: false,
      verticalSwiping: false,
      slidesToShow:4,
      rtl: false        // ✅ 좌 → 우
    }
  },
  {
    breakpoint: 767,
    settings: {
      vertical: false,
      verticalSwiping: false,
      slidesToShow:3,
      rtl: false        // ✅ 좌 → 우
    }
  }
]
});






$('.yt-thumb').on('click', function(){
  var videoId = $(this).data('video');
  $('#ytFrame').attr(
    'src',
    'https://www.youtube.com/embed/' + videoId + '?autoplay=1&rel=0&controls=1'
  );
  $('#ytPopup').fadeIn();
});

// 닫기
$('.yt-close, #ytPopup').on('click', function(e){
  if(e.target !== this) return;
  $('#ytPopup').fadeOut(function(){
    $('#ytFrame').attr('src',''); // 재생 정지
  });
});





  // 슬라이드 재생/정지 버튼 공통 처리
  $('.pause').click(function () {
    $(this).siblings("div, ul").slick('slickPause');
    $(this).hide().siblings(".play").show();
  });

  $('.play').click(function () {
    $(this).siblings("div, ul").slick('slickPlay');
    $(this).hide().siblings(".pause").show();
  });

  // 슬라이더 위치 조정 시 함수 연결 (value 효과용)
  $('.gall_mbgtxt, .menu_big, .menu_row1').on('setPosition', function () {
    value();
  });



// ---------------------- 메인롤링배너 ----------------------
// ---------------------- 메인롤링배너 ----------------------
var mainSwiper = new Swiper('.mainslide', {
  effect: "fade",
  speed: 800,

  loop: true, // ✅ loop 켜기(번호/롤링 안정)

  autoplay: {
    delay: 5000,
    disableOnInteraction: false,
  },

  allowTouchMove: true,
  simulateTouch: true,
  grabCursor: true,
  touchStartPreventDefault: false,

  pagination: {
    el: '.main_pagination',
    clickable: true,
  },

  navigation: {
    nextEl: '.main_next',
    prevEl: '.main_prev',
  }, // ✅ 여기 콤마 필수!!

  on: {
    init: function () {
      updateSlideNum(this);
    },
    slideChange: function () {
      updateSlideNum(this);
    }
  }
});

// ✅ 현재/전체 숫자 업데이트 함수
function updateSlideNum(swiper) {
  var current = swiper.realIndex + 1;

  // ✅ 전체 슬라이드 수(복제슬라이드 제외)
  var total = document.querySelectorAll('.mainslide .swiper-slide:not(.swiper-slide-duplicate)').length;

  var curEl = document.querySelector('.slide_num .current');
  var totalEl = document.querySelector('.slide_num .total');

  if (curEl) curEl.textContent = current < 10 ? '0' + current : current;
  if (totalEl) totalEl.textContent = total < 10 ? '0' + total : total;
}



 // ---------------------- 매자장안내 롤링----------------------
  new Swiper('.store_slide', {
    slidesPerView: 'auto',
    autoplay: true,
    speed: 1000,
    pagination: {
      el: '.store_pagination',
      type: 'progressbar',
    },
  });


  // 텍스트 흐름 애니메이션 시작
  $('.txt_bg_wrap').show();
  textAniTop();
});




// ---------------------- 커스텀 커서 ----------------------
function custom_cursor() {
  if ($('html').hasClass('mobile') || $('html').hasClass('ie10')) return;
  $('body').mousemove(function (e) {
    TweenMax.to($('#custom_cursor, #custom_cursor_text'), 1.3, {
      x: e.clientX,
      y: e.clientY,
      ease: Power3.easeOut
    });
  });
}





// ---------------------- 브랜드 value 효과 ----------------------
function value() {
  $(".value_section .con_box li").on("mouseenter", function () {
    $(".value_section .con_box li").removeClass('active');
    $(this).addClass('active');
  });

  $(".value_section .con_box li").each(function (index, item) {
    var bg_num = index + 1;
    $(item).on("mouseenter", function () {
      $(".value_img .bg_box").removeClass("active");
      $(".value_img .bg_box_0" + bg_num).addClass("active");
      $(".value_section .tab_box .tabMenu li").removeClass("active");
      $(".value_section .tab_box .tabMenu .tab_menu_0" + bg_num).addClass("active");
    });
  });

  $(".value_section .tab_box .tabMenu li").click(function () {
    var activeTab = $(this).attr("data-tabNumb");
    $(".value_section .tab_box .tabMenu li").removeClass("active");
    $(this).addClass("active");
    $(".value_section .con_box li").removeClass("active");
    $("#" + activeTab).addClass("active");
    $(".value_img .bg_box").removeClass("active");
    $("#" + activeTab + "_bg").addClass("active");
  });
}

function mo_effect() {
  setTimeout(function () {
    $(".value_section .con_box li:first-of-type").addClass("mo_active");
    $(".value_section .value_img .bg_box:first-of-type").addClass("mo_active");
  }, 200);
}

function textAniTop() {
  $(".txt_top").stop().css({ right: 0 });
  $(".txt_top").animate({
    right: '-=1800px',
  }, 25000, 'linear', function () {
    textAniTop();
  });
}






document.addEventListener('DOMContentLoaded', () => {
  const cursor = document.getElementById('custom_cursor');
  let mouseX = 0, mouseY = 0;
  let currentX = 0, currentY = 0;
  const speed = 0.1;

  document.addEventListener('mousemove', (e) => {
    mouseX = e.clientX;
    mouseY = e.clientY;
  });

  function animate() {
    currentX += (mouseX - currentX) * speed;
    currentY += (mouseY - currentY) * speed;
    cursor.style.left = `${currentX}px`;
    cursor.style.top = `${currentY}px`;
    requestAnimationFrame(animate);
  }

  animate();
});