/*
* top.js
*
**************************************/

var imgs = [];
imgs[0] = new Image(); imgs[0].src = "/images/cloud_001.gif";
imgs[1] = new Image(); imgs[1].src = "/images/cloud_004.gif";
imgs[2] = new Image(); imgs[2].src = "/images/cloud_002.gif";
imgs[3] = new Image(); imgs[3].src = "/images/cloud_003.gif";
imgs[4] = new Image(); imgs[4].src = "/images/bird01.gif";
imgs[5] = new Image(); imgs[5].src = "/images/bird02.gif";
imgs[6] = new Image(); imgs[6].src = "/images/img-rainbow.png";
imgs[7] = new Image(); imgs[7].src = "/images/img-harty.png";
imgs[8] = new Image(); imgs[8].src = "/images/link-regist-off.png";
imgs[9] = new Image(); imgs[9].src = "/images/link-dic-off.png";
imgs[10] = new Image(); imgs[10].src = "/images/img-flower_01.png";
imgs[11] = new Image(); imgs[11].src = "/images/link-test-off.png";
imgs[12] = new Image(); imgs[12].src = "/images/balloon_001.gif";
imgs[13] = new Image(); imgs[13].src = "/images/balloon_002.gif";
imgs[14] = new Image(); imgs[14].src = "/images/balloon_003.gif";
imgs[15] = new Image(); imgs[15].src = "/images/link-opinion-off.png";
imgs[16] = new Image(); imgs[16].src = "/images/img-supported.png";
imgs[17] = new Image(); imgs[17].src = "/images/logo-01.png";
imgs[18] = new Image(); imgs[18].src = "/images/bg-top.jpg";
imgs[19] = new Image(); imgs[19].src = "/images/img-earth.png";

$(document).ready(function(){
	setElement();
	window.onresize = setElement;
	
	startAnim();
});

function startAnim(){
	var DULATION = 2000;
	var sum = 0;
	for(i=0; i<=19; i++){
		sum += imgs[i].complete;
	}
	if(sum == 20){
		$("#earthBlock").animate({top: "139px"}, DULATION, "easeOutExpo");
		$("#outerCloud").delay(200).animate({top: "0px"}, DULATION, "easeOutExpo");
		$("#innerCloud").delay(200).animate({top: "0px"}, DULATION, "easeOutExpo", function(){
			animRainbow();
			animCloud4();
		});
		$("#frontElement1").animate({top: "0px"}, DULATION, "easeOutExpo", function(){
			animHarty();
			animNew();
			animVersion();
			animRibbon();
		});
		$("#frontElement2").animate({top: "60px"}, DULATION, "easeOutExpo");
	} else {
		setTimeout(startAnim, 250);
	}
}

function setElement() {
	var innerWidth = $.browser.msie ? document.documentElement.clientWidth : window.innerWidth;
	var innerHeight = $.browser.msie ? document.documentElement.clientHeight : window.innerHeight;
	var winWidth = innerWidth > document.body.offsetWidth ? innerWidth : document.body.offsetWidth;
	var winHeight = innerHeight > document.body.offsetHeight ? innerHeight : document.body.offsetHeight;
	var pageOffset = $.browser.msie ? document.documentElement.scrollTop : window.pageYOffset;
	
	if(winWidth < 960) {
		$("#earthBlock").css("width", "960px");
		$("#outerCloud").css("width", "960px");
	} else {
		$("#earthBlock").css("width", winWidth + "px");
		$("#outerCloud").css("width", winWidth + "px");
	}
	var cloud1Left = (winWidth - 960) / 2 -80;
	$("#cloud1").css("left", cloud1Left + "px");
	var cloud4Right = (winWidth - 960) / 2 -133;
	$("#cloud4").css("right", cloud4Right + "px");
}

function animRibbon(){
	$("h1 .icon").delay(2000).animate({top: "105px"}, 150, "linear", function(){
		$("h1 .icon").animate({top: "110px"}, 900, "easeOutElastic", function(){
			animRibbon();
		});
	});
}

function animNew(){
	$("#dic .icon").delay(3000).animate({top: "29px"}, 150, "linear", function(){
		$("#dic .icon").animate({top: "34px"}, 150, "linear", function(){
			$("#dic .icon").animate({top: "29px"}, 150, "linear", function(){
				$("#dic .icon").animate({top: "34px"}, 150, "linear", function(){
					animNew();
				});
			});
		});
	});
}

function animVersion(){
	$("#test .icon").delay(2800).animate({top: "-10px"}, 150, "linear", function(){
		$("#test .icon").animate({top: "-5px"}, 150, "linear", function(){
			$("#test .icon").animate({top: "-10px"}, 150, "linear", function(){
				$("#test .icon").animate({top: "-5px"}, 150, "linear", function(){
					animVersion();
				});
			});
		});
	});
}

function animHarty(){
	$("#harty").animate({top: "47px"}, 1000, "linear", function(){
		$("#harty").animate({top: "52px"}, 1000, "linear", function(){
			animHarty();
		});
	});
}

function animRainbow(){
	$("#rainbow").fadeIn(3000, function(){
		$("#rainbow").fadeOut(3000, function(){
			animRainbow();
		});
	});
}

function animCloud4(){
	$("#cloud4").animate({top: "222px"}, 1000, "linear", function(){
		$("#cloud4").animate({top: "227px"}, 1000, "linear", function(){
			animCloud4();
		});
	});
}