$(function() {

function htmlEncode(value){
	return $('<div/>').text(value).html();
}

function htmlDecode(value){
	return $('<div/>').html(value).text();
}
  function getPageScrollChildren(){
    if( $("#entry > div.inner")[0] ){
      return $("#entry > div.inner").children();
    }
    return $("body #container > div#base").children();
  }

  function getPageScrollTop(){
    return $(window).scrollTop();
  }

  function getViewportBottom(){
    return getPageScrollTop() + $(window).height();
  }

  function getGroundTop(target){
    return target.offset().top;
  }

  function getGroundScrollTarget(target, offset){
    offset = typeof offset == "number" ? offset : 0;
    return getGroundTop(target) + offset;
  }

  function getViewportTop(target){
    if( !target || !target[0] ){
      return 0;
    }
    return target[0].getBoundingClientRect().top;
  }

  class_active($("body").attr("data-directory"));

  function ajax_load_more(href, target, parent){
    if( typeof load_more_request != "undefined" ){
      load_more_request.abort();
    }
    load_more_request = $.ajax({
      url: href,
      dataType: "html",
      success:
        function(data){
          target.children("li.load_more").remove();
          var get_elm = $('div.index > ul > *', $('<div>').prepend(data));
          target.append(get_elm);

          window.initLazyFadeImages(get_elm);
          window_resize();
        },
      error:
        function(XMLHttpRequest, textStatus, errorThrown){
          parent.removeClass("loading");
          parent.children(".spinner").remove();
        }
    });
  }

  function class_active(directory){
    var slsh_to_ub = directory.replace( /\//g, "_" );
    $("#navi nav li").removeClass("active");
    $("#navi nav li").removeClass("p_active");
    if( $(".class_" + slsh_to_ub + " a")[0] ){
      var target_nav = $(".class_" + slsh_to_ub + " a");
      target_nav.parent("li").removeClass("over");
      target_nav.parent("li").addClass("active");
      target_nav.closest("li.parent").removeClass("over");
      target_nav.closest("li.parent").addClass("p_active");
    }
    $("div.navi_menu_bar > nav > ul > li.over.on").removeClass("on");
  }

  function scrollto(val){
    $("html, body").stop().animate({
      scrollTop: val
    }, 1000, "easeOutQuint");
  }


  if( "scrollRestoration" in window.history ){
    window.history.scrollRestoration = "auto";
  }

  // 通常のサイト内リンクはブラウザ標準のページ遷移に任せる。

  $(document).on("click", "div.index > ul > li.load_more > a.ajax_load_more", function(){
    var href = $(this).attr("href");
    var target = $(this).closest("ul");
    var parent = $(this).parent();
    if( parent.hasClass("loading") ){
      return false;
    }
    parent.addClass("loading");
    parent.append('<div class="spinner">loading</div>');

    ajax_load_more(href, target, parent);
    return false;
  });


  window.paging_init = function( page ){

    var page_wrapper = $("body.about div.body.page_wrapper");

    if( page_wrapper[0] ){
      if( ! page_wrapper.hasClass("active") ){
        console.log('paging_init');

        var page_num = page_wrapper.children("div.wrapper.page[data-page]").length;
        if( page_num > 1 ){
          page_wrapper.addClass("normal");
          page_wrapper.next('div.paging').append('<ol></ol>')
          var ol_elm = page_wrapper.next('div.paging').find("ol");
          for (var i = 0;  i < page_num;  i++) {
            console.log(i+"/"+page_num);
            var set_page_num = i+1;
            ol_elm.append('<li class="p_'+set_page_num+'"><a href="#p/'+set_page_num+'">'+set_page_num+'</a></li>');
          }
        }else{
          page_wrapper.addClass("single");
        }
        page_wrapper.addClass("active");
      }

      if( page ){
        page_change_to(page,page_wrapper);
      }else{
        page_change_to(1,page_wrapper);
      }

    }
  }
  function page_change_to(page,page_wrapper){
    console.log('page:'+page);
    page_wrapper.attr("data-page_now",page);
    page_wrapper.find("div.wrapper.page[data-page]").removeClass("active");
    page_wrapper.find("div.wrapper.page[data-page]").eq(page-1).addClass("active");
    var paging_wrapper = page_wrapper.next(".paging");
    paging_wrapper.find("li").removeClass("active");
    paging_wrapper.find("li").eq(page-1).addClass("active");
  }

  window.hashchange_action = function( hash ){
    var hash_arr = hash.split("#p/");
    var hash = hash_arr[1];
    if( $("body.about div.body.page_wrapper")[0] ){
      if( hash != "" ){
        console.log(hash);
        paging_init( hash );
      }
    }

  }

  $(window).hashchange( function(){
    var hash = location.hash;
    if( hash.indexOf( "#p/" ) != -1 ){
      hashchange_action( hash );
      scrollto(0);
    }else{
      if( $("body.about div.body.page_wrapper.normal.active")[0] ){
        hashchange_action( "#p/1" );
        scrollto(0);
      }
    }
  })

  if( location.hash.indexOf("#p/") != -1 ){
    hashchange_action(location.hash);
  }

  function scroll_trigger() {
    if( $(".scroll_trigger:not(.action)")[0] ){
      $(".scroll_trigger:not(.action)").each(function(i){
        var target = $(this);
        var position = getGroundTop(target);
        var move_y = +(position - scroll_val);

        var in_position = position + window_height/3;
        var window_bottom_position = getViewportBottom();
        if(in_position < window_bottom_position){
          target.addClass('action');

          if( target.find(".index")[0] ){
            var target_index = target.find(".index");
            // setTimeout(function(){
            //   // thm_random_fade_start( target_index );
            // },200);
          }
          if( target.find(".textillate_wrapper")[0] ){
            var target_textillate = target.find(".textillate_wrapper");
            textillate( target_textillate, 600 );
          }
        }
      });
    }
  }
  function textillate(wrapper,speed) {
    if( wrapper.find("span")[0] ){
      wrapper.addClass("textillate");
      wrapper.find("span").each(function(i){
        // $(this).delay(speed*i).queue(function() {
        //   $(this).addClass("show");
        // });

        $(this).delay(speed*i).queue(function() {
          $(this).textillate({ in: {
            effect: 'fadeIn',
            delay: 50
          } }).dequeue();
        });
      });
    }
  }

  function thm_random_fade_start( target_index ){
    var target_thms = target_index.find("ul > li.thm:not(.show)");
    thm_random_fade( target_thms, 200 );
  }
  function thm_random_fade( targets, delay ){
    var target_num = targets.length;
    var random_i = Math.floor(Math.random()*target_num);

    $(targets[random_i]).addClass("show");
    targets.splice(random_i,1);
    if (target_num > 0) {
      setTimeout(function(){
        thm_random_fade( targets, delay );
      },delay);
    } else {
      return false;
    }
  }

  var document_height = $(document).height();
  var content_height = get_total_height(getPageScrollChildren());
  if( $("html.touch_device")[0] ){
    if( window.innerHeight > window.innerWidth ){
      var window_height = $(window).height();
    }else{
      var window_height = $(window).height();
    }
  }else{
    var window_height = window.innerHeight ? window.innerHeight: $(window).height();
  }
  var window_width = $(window).width();
  var window_ratio = window_height / window_width;
  var scroll_val = getPageScrollTop();
  function base_scroll() {
    scroll_trigger();

    scroll_val = getPageScrollTop();

    // console.log(scroll_val+window_height+"｜"+content_height);
    if( scroll_val+window_height > content_height - 100 ){
      $("html").addClass("scrolled")
      $("html").addClass("scrollend")
    }else if( scroll_val < 100 ){
      $("html").removeClass("scrolled")
      $("html").removeClass("scrollend")
    }else if( scroll_val >= 100 && scroll_val+window_height < content_height - 100 ){
      $("html").addClass("scrolled")
      $("html").removeClass("scrollend")
    }else{
      $("html").addClass("scrolled")
      $("html").addClass("scrollend")
    }

    if( $("article#root > article#top > div.inner.fv_wrap div.fv > div.obj_wrap")[0] ){
      if( scroll_val < window_height*1.5 ){
        $("article#root > article#top > div.inner.fv_wrap div.fv > div.obj_wrap").css({
          "transform": "matrix(1, 0, 0, 1, 0, "+ (scroll_val/5) +")"
        });
      }
    }

    if( $("div#header_sub > div.bg > div.img > img")[0] ){
      if( scroll_val < window_height*1.5 ){
        $("div#header_sub > div.bg > div.img > img").each(function(){
          $(this).css({
            "transform": "matrix(1, 0, 0, 1, 0, "+ (scroll_val/4) +")"
          });
        });
      }
    }

    var top_parallax_images = $("div.img.top_parallax_base > img.parallax");
    if( top_parallax_images[0] && scroll_val < window_height*1.5 ){
      top_parallax_images.each(function(){
        $(this).css({
          "transform": "matrix(1, 0, 0, 1, 0, "+ (scroll_val/4) +")"
        });
      });
    }

    var viewport_parallax_images = $("img.parallax").not(top_parallax_images);
    if( viewport_parallax_images[0] ){
      var window_center_y = window_height/2;
      viewport_parallax_images.each(function(){
        var target = $(this);
        var wrapper = $(this).parent();
        if( target.height() <= wrapper.height() ){
          target.css({"height": "120%" });
        }
        var wrapper_y = getViewportTop(wrapper);
        var wrapper_center_y = wrapper_y + wrapper.height()/2;
        var distance = window_center_y - wrapper_center_y;
        var parallax_height = wrapper.height();
        var img_height = target.height();
        var val = img_height-parallax_height;
        var move_y = Math.round((val/window_height)*distance*1000)/1000;
        target.css({"transform": "matrix(1, 0, 0, 1, 0, "+ move_y +")"});
      });
    }

    if( $("div.navi_menu_bar > nav > ul > li.over.on")[0] ){
      $("div.navi_menu_bar > nav > ul > li.over.on").removeClass("on");
    }

  }
  function window_resize() {
    document_height = $(document).height();
    content_height = get_total_height(getPageScrollChildren());
    if( $("html.touch_device")[0] ){
      if( window.innerHeight > window.innerWidth ){
        window_height = $(window).height();
      }else{
        window_height = $(window).height();
      }
    }else{
      window_height = window.innerHeight ? window.innerHeight: $(window).height();
    }

    window_width = $(window).width();
    window_ratio = window_height / window_width;

    if( window_ratio > 1 ){
      $("html").removeClass("horizontal");
      $("html").addClass("portrait");
    }else{
      $("html").removeClass("portrait");
      $("html").addClass("horizontal");
    }
    if( window_ratio < 0.6 ){
      $("html").addClass("panorama");
    }else{
      $("html").removeClass("panorama");
    }

    if( $("div.slide > ul")[0] ){
      var wrapper_ratio = $("div.slide > ul").height() / $("div.slide > ul").width();
      $("div.slide > ul li.cell").each(function(){
        var target_li = $(this);
        var target_img = $(this).find("div.img > img");
        target_img.imagesLoaded(function(){
          target_img.addClass("loaded");
          var img_ratio = target_img.height() / target_img.width();

          target_li.removeClass("horizontal vertical");
          if( wrapper_ratio < img_ratio ){
            target_li.addClass("vertical");
          }else{
            target_li.addClass("horizontal");
          }
        });
      });
    }

    if( $("div.slide.concept > ul")[0] ){
      var wrapper_ratio = $("div.slide.concept > ul").height() / $("div.slide.concept > ul").width();
      $("div.slide.concept > ul li.cell").each(function(){
        var target_li = $(this);
        var target_img = $(this).find("div.img > img");
        target_img.imagesLoaded(function(){
          target_img.addClass("loaded");
          var img_ratio = target_img.height() / target_img.width();

          target_li.removeClass("horizontal vertical");
          if( wrapper_ratio < img_ratio ){
            target_li.addClass("vertical");
          }else{
            target_li.addClass("horizontal");
          }
        });
      });
    }

    base_scroll();
  }
  var scroll_flug = true;
  $(window).on("scroll.main",function(){
    setTimeout(function(){
      scroll_flug = true;
    }, 10);
    if(scroll_flug){
      scroll_flug = false;
      base_scroll();
    }
  });

  $(window).bind("resize", window_resize);

  function selectorEscape(val){
    return val.replace(/\//g, '\\/');
  }

  function load_iframe(){
    $("iframe.preload:not('.loaded')").each(function(){
      $(this).load(function(){
        $(this).addClass("loaded");
      });
    });
  }
  load_iframe();

  window.initLazyFadeImages = function(){
    var scope = arguments.length > 0 ? $(arguments[0]) : $(document);
    var target_images = scope.filter("img.lazy_fade:not('.loaded')").add(
      scope.find("img.lazy_fade:not('.loaded')")
    );

    target_images.each(function(){
      var target_img = $(this);
      var show_img = function(){
        target_img.addClass("loaded");
      };

      if( this.complete ){
        show_img();
      }else{
        target_img.one("load.lazy_fade error.lazy_fade", show_img);
      }
    });
  };
  window.initLazyFadeImages();

  window.initHeroMedia = function(){
    var scope = arguments.length > 0 ? arguments[0] : document;
    var target_heroes = scope.querySelectorAll("[data-hero]");

    Array.prototype.forEach.call(target_heroes, function(hero){
      if( hero.getAttribute("data-hero-initialized") == "true" ){
        return;
      }
      hero.setAttribute("data-hero-initialized", "true");

      var show_ui = function(){
        hero.classList.add("is-ui-ready");
      };
      if( window.requestAnimationFrame ){
        window.requestAnimationFrame(function(){
          window.requestAnimationFrame(show_ui);
        });
      }else{
        setTimeout(show_ui, 20);
      }

      var media = hero.querySelector("[data-hero-media]");
      if( !media ){
        return;
      }

      var images = Array.prototype.slice.call(media.querySelectorAll("img"));
      var animated_images = Array.prototype.slice.call(
        media.querySelectorAll("img[data-hero-animation-src]")
      );
      var animation_preloads = animated_images.map(function(image){
        var source = image.getAttribute("data-hero-animation-src");
        var preload = new Image();
        preload.decoding = "async";
        preload.src = source;
        return {
          target: image,
          preload: preload,
          source: source,
          ready: false
        };
      });
      var revealed = false;
      var reveal_scheduled = false;
      var start_animation = function(animation){
        if(
          !animation.ready
          || animation.target.classList.contains("is-unavailable")
          || animation.target.getAttribute("data-hero-animation-started") == "true"
        ){
          return;
        }
        animation.target.src = animation.source;
        animation.target.setAttribute(
          "data-hero-animation-started",
          "true"
        );
      };
      var hide_unavailable_images = function(include_pending){
        images.forEach(function(image){
          var pending = !image.complete;
          var failed = image.complete && !image.naturalWidth;
          if( failed || (include_pending && pending) ){
            image.classList.add("is-unavailable");
          }
        });
      };
      var fallback_timer = setTimeout(function(){
        hide_unavailable_images(true);
        reveal_media();
      }, 3000);
      var reveal_media = function(){
        if( revealed || reveal_scheduled ){
          return;
        }
        reveal_scheduled = true;
        clearTimeout(fallback_timer);
        var show_media = function(){
          if( revealed ){
            return;
          }
          revealed = true;
          animation_preloads.forEach(function(animation){
            start_animation(animation);
          });
          media.classList.add("is-ready");
        };
        if( window.requestAnimationFrame ){
          window.requestAnimationFrame(function(){
            window.requestAnimationFrame(show_media);
          });
        }else{
          setTimeout(show_media, 20);
        }
      };

      if( !window.Promise ){
        return;
      }

      var wait_for_image = function(image){
        return new Promise(function(resolve){
          var decode_image = function(){
            if( image.decode ){
              image.decode().then(resolve).catch(resolve);
            }else{
              resolve();
            }
          };

          if( image.complete ){
            decode_image();
            return;
          }

          image.addEventListener("load", decode_image, { once: true });
          image.addEventListener("error", resolve, { once: true });
        });
      };

      var wait_for_animation = function(animation){
        return wait_for_image(animation.preload).then(function(){
          animation.ready = animation.preload.naturalWidth > 0;
          if( revealed ){
            start_animation(animation);
          }
        });
      };
      var pending_images = images.map(wait_for_image);
      var pending_animations = animation_preloads.map(wait_for_animation);

      Promise.all(pending_images.concat(pending_animations)).then(function(){
        hide_unavailable_images(false);
        reveal_media();
      });
    });
  };
  window.initHeroMedia();

  $(window).bind('load', function() {
    // window_resize();

    var navigation_entries = window.performance && window.performance.getEntriesByType
      ? window.performance.getEntriesByType("navigation")
      : [];
    var is_history_navigation =
      (navigation_entries.length > 0 && navigation_entries[0].type == "back_forward") ||
      (window.performance && window.performance.navigation && window.performance.navigation.type == 2);
    if( !is_history_navigation && $("body #container > div#base article.ground")[0] ){
      var target = $("#" + selectorEscape($("body").attr("data-scroll")));
      if( target[0] ){
        var val = getGroundScrollTarget(target, 10);
        scrollto(val);
      }
    }

    $("html").addClass("start");
  });

  function rnd(n){
    return Math.floor(Math.random()*(n+1));
  }
  function slide_switch(target_wrapper, past_target, next_target, slide_interval) {
    var next_id = next_target.attr("id");
    target_wrapper.children("ul.dots").find("li").removeClass("active");
    var next_dot = target_wrapper.find("."+next_id).addClass("active");

    if( past_target != "" ){
      past_target.addClass("pending active");
    }
    img_url = next_target.find("div.img").attr("data-img-url");
    next_target.find("div.slide.img > img").imagesLoaded(function(){
      next_target.addClass("active");
      if( past_target != "" ){
        setTimeout(function(){
          past_target.removeClass("pending active");
        },500);
      }
    });
    next_target.find("div.slide.img > img").attr("src", img_url);
  }
  function slide_repeat(target_wrapper, slide_interval ) {
    set_slide_interval = slide_interval;

    console.log(set_slide_interval);
    var max_num = target_wrapper.find("ul.carousel > li.cell").length;
    if( typeof timerId_slide != "undefined" ){
      clearTimeout(timerId_slide);
    }
    timerId_slide = setTimeout(function(){
      if( max_num > 1 ){
        var past_target = target_wrapper.find("ul.carousel > li.cell.active");
        var next_target = "";
        if( past_target.next("li")[0] ){
          next_target = past_target.next("li");
          // slide_switch(target_wrapper, past_target, next_target, slide_interval);
        }else{
          next_target = target_wrapper.find("ul.carousel > li.cell").first();
        }
        slide_switch(target_wrapper, past_target, next_target, slide_interval);
      }else{
        clearTimeout(timerId_slide);
      }
    }, set_slide_interval );
  }

  window.slide_start = function( target_wrapper, slide_interval ){
    if(typeof slide_interval === 'undefined') slide_interval = 8000;

    // audio_init();

    target_wrapper.addClass("active");
    target_wrapper.append('<ul class="dots"></ul>');
    target_wrapper.find("ul.carousel > li.cell").each(function(i){
      var set_class = $(this).attr("id");
      target_wrapper.children("ul.dots").append('<li class="'+set_class+'"></li>');
    });

    var max_num = target_wrapper.find("ul.carousel > li.cell").length;
    // var first_target = target_wrapper.find("ul.carousel > li.cell").eq(rnd(max_num-1));
    var first_target = target_wrapper.find("ul.carousel > li.cell").eq(0);
    var img_url = first_target.find("div.img").attr("data-img-url");
    first_target.find("div.slide.img > img").imagesLoaded(function(){
      slide_switch(target_wrapper, "", first_target, slide_interval);
      slide_repeat(target_wrapper, slide_interval);
    });
    first_target.find("div.slide.img > img").attr("src", img_url);

    target_wrapper.children("ul.dots").find("li").click(function(){
      if( !$(this).hasClass("active") ){
        var past_target = target_wrapper.find("ul.carousel > li.cell.active");
        var next_target = target_wrapper.find("ul.carousel > li.cell#"+$(this).attr("class"));
        slide_switch(target_wrapper, past_target, next_target, slide_interval);
      }
    })
  }

  $(document).on("click", "div.list.faq > div.media_list > dl > dt.over", function() {
    $(this).next("dd").slideToggle();
    return false;
  });

  function get_total_height(elms) {
    var total_height = 0;
    elms.each(function(i){
      var height = $(this).outerHeight(true);
      total_height += height;
    });
    return total_height;
  }





});