$(function(){

  var $window = $(window);
  var window_w = $window.outerWidth();
  var window_h = $window.outerHeight();

  var originalMainVisual_w = 3888;
  var originalMainVisual_h = 2680;
  var mainVisualAspectRatio = originalMainVisual_h / originalMainVisual_w;
  var windowAspectRatio = window_h / window_w;
  var mainVisualSweetPosition = .6; //メインビジュアルの一番表示したい位置を上からの0〜1の間で指定

  /*==========================================*/
  /* メインビジュアル */
  /*==========================================*/
  var $section_top = $("#section_top");
  var $mainVisual = $(".mainVisual", $section_top);

  /* メインビジュアル部分の高さセット */
  function setMainVisualContainerSize() {
  	$section_top.height(window_h - $section_top.css("borderBottomWidth").replace("px", ""));
  }

  /* メインビジュアルimgのサイズとポジションをセット */
  function setMainVisualImgSize() {
  	if(windowAspectRatio < mainVisualAspectRatio) {
  		//メインビジュアル比率よりもウインドウ比率が小さい
  		var imgElm = $("img", $section_top);
  		var imgW = window_w;
  		var imgH = window_w * mainVisualAspectRatio;

  		imgElm
  			.width(imgW)
  			.height(imgH)
  			.css("top", (imgH - window_h) * mainVisualSweetPosition * -1)
  			.css("marginLeft", (window_w - imgW) / 2);
  	}else{
  		//ウインドウ比率よりもメインビジュアル比率が小さい
  		var imgElm = $("img", $section_top);
  		var imgW = window_h / mainVisualAspectRatio;
  		var imgH = window_h;

  		imgElm
  			.width(imgW)
  			.height(imgH)
  			.css("top", (imgH - window_h) * mainVisualSweetPosition * -1)
  			.css("marginLeft", (window_w - imgW) / 2);
  	}
  }

  /* メインビジュアルにオーバーレイ */
  function setOverlay() {
  	var offset_top = 50;
  	var _this = $(this);

  	if(_this.scrollTop() >= offset_top){
  		$mainVisual.addClass("overlay");
  	}else{
  		$mainVisual.removeClass("overlay");
  	}
  }

  $window.on("scroll", function(){
  	setOverlay();
  });

  function hideLoading(){
  	$("#loading").fadeOut(200);
  }

  function cachetext(){
    $("#section_top h1").addClass('moveText');
}
  /*==========================================*/
  /* 初期化 */
  /*==========================================*/
  function init() {
  	setMainVisualContainerSize();
  	setMainVisualImgSize();
  	setOverlay();			//メインビジュアルのオーバーレイ
  }
  init();

  $window.on({
    "load": function(){
      hideLoading();			//ローディング非表示
      cachetext();
    },
  	"resize": function(){
  		window_w = $window.outerWidth();
  		window_h = $window.outerHeight();
  		windowAspectRatio = window_h / window_w;

  		init();
  	}
  });
});

$(window).scroll(function(){
  var scrollTop = $(this).scrollTop();

  $('.slideup').each(function(i, e){
    var top = $(e).attr('data-scroll-top');
    if (scrollTop > top) {
      $(e).addClass('show');
    }
    else {
      $(e).removeClass('show');
    }
  });
});

var scrollAnimationClass = 'sa';
var scrollAnimationShowClass = 'show';
var triggerMarginDefault = 1300;
var startScrollTop = -240; /* 上からどれくらいのpxで表示させるかの数字 */

var scrollAnimationElm = document.querySelectorAll('.' + scrollAnimationClass);
var scrollAnimationFunc = function() {
  var dataMargin = scrollAnimationClass + '_margin';
  var dataTrigger = scrollAnimationClass + '_trigger';
  var dataDelay = scrollAnimationClass + '_delay';
  for(var i = 0; i < scrollAnimationElm.length; i++) {
    var triggerMargin = triggerMarginDefault;
    var elm = scrollAnimationElm[i];
    var showPos = 0;
    if(elm.dataset[dataMargin] != null) {
      triggerMargin = parseInt(elm.dataset[dataMargin]);
    }
    if(elm.dataset[dataTrigger]) {
      showPos = document.querySelector(elm.dataset[dataTrigger]).getBoundingClientRect().top + triggerMargin;
    } else {
      showPos = elm.getBoundingClientRect().top + triggerMargin;
    }
    if (window.innerHeight > showPos - startScrollTop) {
      var delay = (elm.dataset[dataDelay])? elm.dataset[dataDelay] : 0;
      setTimeout(function(index) {
        scrollAnimationElm[index].classList.add('show');
      }.bind(null, i), delay);
    }
  }
}
window.addEventListener('load', scrollAnimationFunc);
window.addEventListener('scroll', scrollAnimationFunc);