// hamburger
window.onload = function () {
  var nav = document.getElementById('nav-wrapper');
  var hamburger = document.getElementById('js-hamburger');
  var blackBg = document.getElementById('js-black-bg');

  hamburger.addEventListener('click', function () {
      nav.classList.toggle('open');
  });
  blackBg.addEventListener('click', function () {
      nav.classList.remove('open');
  });
};
// When it reaches a certain height, a class is assigned.
$(function () {
  $(window).on("scroll", function () {
    const sliderHeight = $(".mv").height();
    if (sliderHeight - 30 < $(this).scrollTop()) {
      $(".js-header").addClass("headerColorScroll");
    } else {
      $(".js-header").removeClass("headerColorScroll");
    }
  });
});
// This is the source code for the video popup.
(function () {
  if ($(".js-modal-video").length) {
    $(".js-modal-video").modalVideo({
      channel: "youtube",
      youtube: {
        controls: 0,
      },
    });
  }
})();
// When the element is displayed, it animates.
$(window).scroll(function (){
  $(".anime").each(function(){
    var offset = $(this).offset().top;
    var scroll = $(window).scrollTop();
    var wHeight = $(window).height();
    var threshold;

    if (window.matchMedia("(max-width: 768px)").matches) {
      threshold = wHeight / 4;
    } else {
      threshold = wHeight / 3;
    }
    if (scroll > offset - wHeight + threshold){
      $(this).addClass("show");
    }
  });
});