$(function () {
  // スマフォの最大幅
  var MAX_SP_WIDTH = 767;
  var MAX_TAB_WIDTH = 1024;
  var MAX_PC_WIDTH = 1440;

  // ハンバーガーメニューのリンク
  var links = document.querySelectorAll(".header-menu-link");

  // メニューリンクをクリック時にメニューを閉じる
  Array.prototype.forEach.call(links, function (e) {
    e.addEventListener("click", toggleMenu, false);
  });

  // Slickの初期設定
  function sliderSetting() {
    var width = $(window).width();

    // スマフォ・タブレットのみ適用
    if (width <= MAX_TAB_WIDTH) {
      var slidesToShow = width <= MAX_SP_WIDTH ? 1 : 2;
      $(".slider").not(".slick-initialized").slick({
        dots: true,
        arrows: false,
        slidesToShow: slidesToShow,
      });
    } else {
      $(".slide.slick-initialized").slick("unslick");
    }

    // スマフォ・タブレットの場合とPCの場合で切替
    var slidesToShowCount = width <= MAX_TAB_WIDTH ? 1 : 3;
    $(".slider-all").not(".slick-initialized").slick({
      arrows: false,
      autoplay: true,
      adaptiveHeight: true,
      slidesToShow: slidesToShowCount,
      dots: true,
      dotsClass: "slide-dots" //ここでclass名を変更する（デフォルトはslick-dots）
    });

    var slider = $('.slide-advantage').slick({
      infinite: false,
      speed: 300,
      dots: true,
      dotsClass: "slide-dots" //ここでclass名を変更する（デフォルトはslick-dots）
    });

    $('input[name="tab_item"]').change(function() {
      slider.slick('setPosition');
    });
  }

  sliderSetting();

  $(window).resize(function () {
    sliderSetting();
  });

  if (document.querySelector(".header-outlined")) {
    setScrollEvent();
    toggleHeaderStyle();
  }

  if (document.querySelector(".header-lp-outlined")) {
    setScrollEventLpOnlineEvent();
    toggleHeaderStyleLpOnlineEvent();
  }

  if (document.querySelector(".header-renewal-outlined")) {
    setScrollEventRenewal();
    toggleHeaderStyleRenewal();
  }

  var feature = document.getElementById("feature");
  if (feature) {
    // LPのトップへ戻るボタンを設定
    var waypoint = new Waypoint({
      element: feature,
      handler: function (direction) {
        if (direction === "down") {
          document.querySelector(".footer-pagetop").classList.add("active");
        } else {
          document.querySelector(".footer-pagetop").classList.remove("active");
        }
      },
    });
  }
});

/**
 * ハンバーガーメニューのオープン・クローズ
 */
function toggleMenu() {
  document.querySelector(".header-menu").classList.toggle("active");
  document.querySelector(".header-menu-box").classList.toggle("active");
  document.querySelector(".header-menu-mask").classList.toggle("active");

  if (isSpHeaderMenuActive()) {
    removeOutlineStyle();
  } else {
    toggleHeaderStyle();
  }
}

/**
 * SPのハンバーガーメニューが開いているか判定
 */
function isSpHeaderMenuActive() {
  return document.querySelector(".header-menu").classList.contains("active");
}

/**
 * スクロールされた場合に発火するイベントを設定
 */
function setScrollEvent() {
  var timeoutId = null;

  window.addEventListener("scroll", function () {
    // setTimeout()がセットされている または SPのハンバーガーメニューが開いている場合
    if (timeoutId || isSpHeaderMenuActive()) {
      return;
    }

    timeoutId = setTimeout(function () {
      timeoutId = null;
      toggleHeaderStyle();
    }, 200);
  });
}

/**
 * 一定量スクロールされた場合にヘッダーのスタイルを変更
 */
function toggleHeaderStyle() {
  if (isScrolled()) {
    removeOutlineStyle();
  } else {
    addOutlineStyle();
  }
}

/**
 * ユーザーがヘッダーの高さ以上ページをスクロールしたか判定
 */
function isScrolled() {
  // ヘッダーの高さ
  var headerHeight = 72;
  return $(document).scrollTop() > headerHeight;
}

/**
 * ヘッダーのアウトラインスタイルに変更
 */
function addOutlineStyle() {
  document.querySelector(".header").classList.add("header-outlined");
  document
    .querySelector(".header-nav-contact")
    .classList.remove("btn-outlined-blue");
  document
    .querySelector(".header-nav-contact")
    .classList.add("btn-outlined-white");
}

/**
 * ヘッダーのアウトラインスタイルを解除
 */
function removeOutlineStyle() {
  document.querySelector(".header").classList.remove("header-outlined");
  document
    .querySelector(".header-nav-contact")
    .classList.remove("btn-outlined-white");
  document
    .querySelector(".header-nav-contact")
    .classList.add("btn-outlined-blue");
}

/**
 * スクロールされた場合に発火するイベントを設定
 */
function setScrollEventLpOnlineEvent() {
  var timeoutId = null;

  window.addEventListener("scroll", function () {
    // setTimeout()がセットされている または SPのハンバーガーメニューが開いている場合
    if (timeoutId || isSpHeaderMenuActive()) {
      return;
    }

    timeoutId = setTimeout(function () {
      timeoutId = null;
      toggleHeaderStyleLpOnlineEvent();
    }, 200);
  });
}

/**
 * 一定量スクロールされた場合にヘッダーのスタイルを変更
 */
function toggleHeaderStyleLpOnlineEvent() {
  if (isScrolledLpOnlineEvent()) {
    removeOutlineStyleLpOnlineEvent();
  } else {
    addOutlineStyleLpOnlineEvent();
  }
}

/**
 * ユーザーがヘッダーの高さ以上ページをスクロールしたか判定
 */
function isScrolledLpOnlineEvent() {
  // ヘッダーの高さ
  var headerHeight = 72;
  return $(document).scrollTop() > headerHeight;
}

/**
 * ヘッダーのアウトラインスタイルに変更
 */
function addOutlineStyleLpOnlineEvent() {
  document.querySelector(".header-lp").classList.add("header-lp-outlined");
}

/**
 * ヘッダーのアウトラインスタイルを解除
 */
function removeOutlineStyleLpOnlineEvent() {
  document.querySelector(".header-lp").classList.remove("header-lp-outlined");
}

/**
 * マルケトフォーム読み込み完了後の初期設定
 */
function initMarketoForm() {
  // セレクトボックスを識別するクラスを付与
  $(".mktoFieldWrap:has(select.mktoField)").addClass("marketo-select-field");

  // プライバシーポリシーを識別するクラスを付与
  $(".mktoFormRow:has(a:contains('プライバシーポリシー'))").addClass(
    "marketo-privacy-row"
  );

  // 姓名を識別するクラスを付与
  $(".mktoFormRow").each(function () {
    var num = $(this).find(".mktoFormCol").length;
    if (num === 2) {
      $(this).addClass("marketo-name-row");
    }
  });

  // チェックボックスのリストを識別するクラスを付与（フィールドグループは対象外）
  $(".mktoFormRow > .mktoFieldDescriptor:has(.mktoCheckboxList)").addClass(
    "marketo-checkbox-list"
  );
}

/**
 * ハンバーガーメニューのオープン・クローズ
 */
 function toggleMenuRenewal() {
  document.querySelector(".header-renewal-menu").classList.toggle("active");
  document.querySelector(".header-renewal-menu-box").classList.toggle("active");
  document.querySelector(".header-renewal-menu-mask").classList.toggle("active");

  if (isSpHeaderMenuActiveRenewal()) {
    removeOutlineStyleRenewal();
  } else {
    toggleHeaderStyleRenewal();
  }
}

/**
 * SPのハンバーガーメニューが開いているか判定
 */
function isSpHeaderMenuActiveRenewal() {
  return document.querySelector(".header-renewal-menu").classList.contains("active");
}

/**
 * ヘッダーのアウトラインスタイルを解除
 */
 function removeOutlineStyleRenewal() {
  document.querySelector(".header-renewal").classList.remove("header-renewal-outlined");
  document
    .querySelector(".header-renewal-nav-contact")
    .classList.remove("btn-outlined-white");
  document
    .querySelector(".header-renewal-nav-contact")
    .classList.add("btn-outlined-blue");
}

/**
 * スクロールされた場合に発火するイベントを設定
 */
 function setScrollEventRenewal() {
  var timeoutId = null;

  window.addEventListener("scroll", function () {
    // setTimeout()がセットされている または SPのハンバーガーメニューが開いている場合
    if (timeoutId || isSpHeaderMenuActiveRenewal()) {
      return;
    }

    timeoutId = setTimeout(function () {
      timeoutId = null;
      toggleHeaderStyleRenewal();
    }, 200);
  });
}

/**
 * 一定量スクロールされた場合にヘッダーのスタイルを変更
 */
function toggleHeaderStyleRenewal() {
  if (isScrolledRenewal()) {
    removeOutlineStyleRenewal();
  } else {
    addOutlineStyleRenewal();
  }
}

/**
 * ユーザーがヘッダーの高さ以上ページをスクロールしたか判定
 */
function isScrolledRenewal() {
  // ヘッダーの高さ
  var headerHeight = 72;
  return $(document).scrollTop() > headerHeight;
}

/**
 * ヘッダーのアウトラインスタイルに変更
 */
function addOutlineStyleRenewal() {
  document.querySelector(".header-renewal").classList.add("header-renewal-outlined");
  document
    .querySelector(".header-renewal-nav-contact")
    .classList.remove("btn-outlined-blue");
  document
    .querySelector(".header-renewal-nav-contact")
    .classList.add("btn-outlined-white");
}

function openVideo() {
  // 
  // if(window.innerWidth <= 1025) {
  //   return;
  // }

  //初回のみモーダルをすぐ出す判定。flagがモーダル表示のstart_open後に代入される
  // var access = $.cookie('access')
  // if(!access){
  //   flag = true;
  //   $.cookie('access', false);
  // }else{
  //   flag = false  
  // }
  // flag = true;
  // //モーダル表示
  // $(".video-open").modaal({
  //   start_open:flag, // ページロード時に表示するか
  //   overlay_close:true,//モーダル背景クリック時に閉じるか
  //   type: 'video',
  //   background: '#333333', // 背景色
  //   overlay_opacity:0.8, // 透過具合
  //   // fullscreen: 'true',	// フルスクリーンモードにする
  //   // close_aria_label: 'とじる',
  //   before_open:function(){// モーダルが開く前に行う動作
  //     $('html').css('overflow-y','hidden');/*縦スクロールバーを出さない*/
  //   },
  //   after_close:function(){// モーダルが閉じた後に行う動作
  //     $('html').css('overflow-y','scroll');/*縦スクロールバーを出す*/
  //   }
  // });

  // var video = $("video").get(0);
  // video.muted = true;
  // video.play();
  // // // 
  // // var sample = document.getElementsByName('media');
  // // console.log(sample);
  // // sample.setAttribute('sample2', "center");

  // 初回のみモーダルをすぐ出す判定。
  var access = $.cookie('access')
  if(!access){
    $.cookie('access', false);
  }else{
    // return;
  }

  window.onload = function() {
    var popup = document.getElementById('js-popup');
    if(!popup) return;
    popup.classList.add('is-show');

    var blackBg = document.getElementById('js-black-bg');
    var closeBtn = document.getElementById('js-close-btn');

    closePopUp(blackBg);
    closePopUp(closeBtn);

    function closePopUp(elem) {
      if(!elem) return;
      elem.addEventListener('click', function() {
        popup.classList.remove('is-show');
      })
    }
  }
}

// モーダル非表示の際に動画停止
function movplay() {
  var obj = document.getElementById("opening-video");
  obj.pause();
}