var canvas, stage, exportRoot;
function init() {
	// --- write your JS code here ---
	
	canvas = document.getElementById("canvas");
	images = images||{};
	ss = ss||{};

	var loader = new createjs.LoadQueue(false);
	loader.addEventListener("fileload", handleFileLoad);
	loader.addEventListener("complete", handleComplete);
	loader.loadFile({src:"https://spur.hpplus.jp/fashion/special/a01_gucci1603/tian_atlas_.json?1457316474801", type:"spritesheet", id:"tian_atlas_"}, true);
	loader.loadManifest(lib.properties.manifest);
}

function handleFileLoad(evt) {
	if (evt.item.type == "image") { images[evt.item.id] = evt.result; }
}

function handleComplete(evt) {
	var queue = evt.target;
	ss["tian_atlas_"] = queue.getResult("tian_atlas_");
	exportRoot = new lib.tian();

	stage = new createjs.Stage(canvas);
	stage.addChild(exportRoot);
	stage.update();

	createjs.Ticker.setFPS(lib.properties.fps);
	createjs.Ticker.addEventListener("tick", stage);
}

$(function() {
    var hour = (new Date()).getHours();
if ((0 <= hour && hour <= 5) || (18 <= hour && hour <= 23)) {
        $(".animationArea .bg").addClass("night");
    }
    
    $(window).load(function() {
        init();
    });
    
    $(".outer li").each(function() {
        $(this).find("div").css({opacity:0, backgroundSize:"70%"});
        $(this).show();
    });
    $(".outer a").hover(function() {
        $(this).parent().prev().find("div").stop().animate({backgroundSize:"130%"}, 600);
    }, function() {
        $(this).parent().prev().find("div").stop().animate({backgroundSize:"100%"}, 600);
    });
    
    $(".txtArea li").each(function() {
        $(this).find(".img div").css({opacity:0, backgroundSize:"70%"});
    });
    $(".txtArea li a").hover(function() {
        $(this).parent().prev().find("div").stop().animate({width: 254, height: 360}, 300);
    }, function() {
        $(this).parent().prev().find("div").stop().animate({width: 240, height: 340}, 300);
    });
    
    $(window).scroll(function() {
        if (($(this).scrollTop() > 100) && ($(window).scrollTop()+$(window).height() < ($("footer").offset().top) + 250)){
            $(".tabNavi").fadeIn();
        } else {
            $(".tabNavi").fadeOut();
        }
        
        if (!$(".animationArea").hasClass("animated") && $(window).scrollTop() > $(".animationArea").offset().top + 200 - $(window).height() / 3) {
            $(".animationArea").addClass("animated");
            $(".animationArea .outer li").each(function(i) {
                $(this).find("div").delay(i*100).animate({opacity:1, backgroundSize:"100%"}, 300);
            });
        }
        if (!$(".txtArea ul").hasClass("animated") && $(window).scrollTop() > $(".txtArea ul").offset().top - $(window).height() / 2) {
            $(".txtArea ul").addClass("animated");
            $(".txtArea li").each(function(i) {
                $(this).find(".img div").delay(i*100).animate({opacity:1, backgroundSize:"100%"}, 300);
            });
        }
    });
    $(window).scroll();
});