$('.designer-bannerslider').slick({
  slidesToShow: 1, //預設 1 幻燈片顯示幾張
  slidesToScroll: 1,//預設 1 幻灯片每次滑動幾張
  arrows: true, // 預設 true 左右箭頭是否顯示
  dots: true,
  prevArrow: '<button type="button" class="slick-prev"><div class="slick-arrow-slider d-flex justify-content-center align-items-center" style="width:50px; height:50px;"><img class="arrow-img" style="width: 15px;" src="./img/sec04/arrow-left.png" alt=""><div></button>',
  nextArrow: '<button type="button" class="slick-next"><div class="slick-arrow-slider d-flex justify-content-center align-items-center" style="width:50px; height:50px;"><img class="arrow-img" style="width: 15px;" src="./img/sec04/arrow.png" alt=""><div></button>',
});


$('.designer-bannerslider-mb').slick({
  slidesToShow: 1, //預設 1 幻燈片顯示幾張
  slidesToScroll: 1,//預設 1 幻灯片每次滑動幾張
  arrows: false, // 預設 true 左右箭頭是否顯示
  dots: true,
  prevArrow: '<button type="button" class="slick-prev"><div class="slick-arrow-slider d-flex justify-content-center align-items-center" style="width:50px; height:50px;"><img class="arrow-img" style="width: 15px;" src="./img/sec04/arrow.png" alt=""><div></button>',
  nextArrow: '<button type="button" class="slick-next"><div class="slick-arrow-slider d-flex justify-content-center align-items-center" style="width:50px; height:50px;"><img class="arrow-img" style="width: 15px;" src="./img/sec04/arrow.png" alt=""><div></button>',
});







$('designer-nav').hide();

$(".item-down").click(function () {
  $('.designer-nav').slideToggle();
});

$(".playbutton").click(function () {
  var videosrc = $(this).data("info");
  $('.youtube-video').attr('src', `https://www.youtube.com/embed//${videosrc}?autoplay=1`);
});

$(".btn-close").click(function () {
  $('.youtube-video').attr('src', ``);
});

$('#yt-video').on('hidden.bs.modal', function () {
  $('.youtube-video').attr('src', ``);
});

$('#yt-video-mb').on('hidden.bs.modal', function () {
  $('.youtube-video').attr('src', ``);
});

let videoId = ['XlPxHa9BcKY', 'xc6SNElGDIM', 'xc6SNElGDIM'];

var index = 0;

function getSlideNNext() {
  index++
  if (index == videoId.length) index = 0;
  console.log(videoId[index]);


};

$(".designer-bannerslider2").on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  $('.youtube-video2').each(function () {
    this.contentWindow.postMessage('{"event": "command", "func": "stopVideo", "args": ""}', '*');
  });

});

$(document).on("click", ".slick-next", function (event) {

  getSlideNNext();
  $('.youtube-video2').each(function () {
    this.contentWindow.postMessage('{"event": "command", "func": "stopVideo", "args": ""}', '*');
  });
});

$('#yt-video-mb1').on('hidden.bs.modal', function () {
  $('.youtube-video2').each(function () {
    this.contentWindow.postMessage('{"event": "command", "func": "stopVideo", "args": ""}', '*');
  });
});
$('#yt-video-mb2').on('hidden.bs.modal', function () {
  $('.youtube-video2').each(function () {
    this.contentWindow.postMessage('{"event": "command", "func": "stopVideo", "args": ""}', '*');
  });
});
$('#yt-video-mb3').on('hidden.bs.modal', function () {
  $('.youtube-video2').each(function () {
    this.contentWindow.postMessage('{"event": "command", "func": "stopVideo", "args": ""}', '*');
  });
});

function getSlidePrev() {
  index--
  if (index == -1) index = videoId.length - 1;
  console.log(videoId[index]);

};

$(document).on("click", ".slick-prev", function (event) {

  getSlidePrev();
  $('.youtube-video2').each(function () {
    this.contentWindow.postMessage('{"event": "command", "func": "stopVideo", "args": ""}', '*');
  });

});

$('.designer-bannerslider2').slick({
  slidesToShow: 1, //預設 1 幻燈片顯示幾張
  slidesToScroll: 1,//預設 1 幻灯片每次滑動幾張
  arrows: true, // 預設 true 左右箭頭是否顯示
  dots: true,
  prevArrow: '<button type="button" class="slick-prev""><div class="slick-arrow-slider d-flex justify-content-center align-items-center" style="width:50px; height:50px;"><img class="arrow-img" style="width: 15px;" src="./img/sec04/arrow-left.png" alt=""><div></button>',
  nextArrow: '<button type="button" class="slick-next"><div class="slick-arrow-slider d-flex justify-content-center align-items-center" style="width:50px; height:50px;"><img class="arrow-img" style="width: 15px;" src="./img/sec04/arrow.png" alt=""><div></button>',

});

$(".play-mb").click(function () {
  // $('.modal-box-mb').css('width','100%');
  var videosrc = $(this).data("info");
  var slidenumber = $(this).data("slide");

  console.log(slidenumber);
  console.log(videosrc);

  $('.designer-bannerslider2').slick('slickGoTo', 0);
});


// 手機選單彈跳視窗
$("#menu-box2").hide();
$("#menu-box").hide();

$("#menu-btn1").click(function () {

  $("#menu-box").fadeToggle("slow");
  $("#menu-box2").fadeToggle("slow");

});
$(".link").click(function () {
  $("#menu-box").slideUp("slow", function () {
    $("#menu-box2").slideUp("slow");
    // Animation complete.
  });
});



// var flagX = 0;
// var flagXM = 0;

// function getFlag(){
//   flagX = event.touches[0].pageX;
//   flagXM = flagX;
// }

// function setFlag(){
//   flagXM = event.touches[0].pageX;
// }

// function change(){
//   var range = flagXM - flagX;
//   //如果水平滑動距離小於30，就不切換
//   if(Math.abs(range) < 30){
//       return false;
//   }     
//   var direction = range < 0 ?'next':'prev';
//   $("#carousel-example-generic").carousel(direction);
// }


// function designer_img(){
//   for(var i=1; i<42; i++){
//     let designer_slide_img="";
//     var img_number=i;
//     if (i<10){
//       img_number="0"+i
//     }


//     designer_slide_img=`
//     <div class="carousel-item active">
//     <img src="https://images.hhh.com.tw/uploads/_hcase/designer337_66_'${img_number}'.jpg" class="d-block w-100"
//         alt="...">
//     </div>
//     `
//   }

//   $('.exampleModal3').html(designer_slide_img);


// }
// designer_img();