/**
 * TopItems
 */
var TopItems = function () {
	var C_POS1 = [
	      [380, 410, 441, 469, 497, 528, 558, 585, 616, 646, 672, 702, 726, 753, 777, 804]
	    , [380, 413, 445, 471, 499, 529, 555, 577, 605, 637, 668, 696, 728, 755, 781, 805]
	];
	var $_element = $("#motiv-moon");
	var $_elementF = $("#motiv-moonflag");
	var $_elementT = $("#motiv-moon-text");
//	var that = this;
	
	/**
	 * init
	 */
	var init = function () {
//		_pos = {x: parseInt($_element.css("marginLeft")), y: parseInt($_element.css("marginTop")) };
		$_elementF.css("display", "none");
		$_elementT.css("display", "none");
	};

	var _aisatsuCount = 0;
	
	/**
	 * animateAisatsu
	 */
	var animateAisatsuLine = function (lineIndex) {
		var num2 = function (value) {
			var str = "00" + value;
			return str.substr(str.length-2);
		};

		var count = 0;
		var cpos = C_POS1[lineIndex];
		var animateionCompleted = function () {
			if (++count < cpos.length) return;
			
			switch (++_aisatsuCount) {
			case 1:
				animateAisatsuLine(1);
				break;
			case 2:
				$("#motivAisatsuMizuhiki").css("display", "block");
				$("#motivAisatsuYear").css("display", "block");
				$("#motivAisatsuLogo").css("display", "block");
				setTimeout(animateMoon, 1200);
				break;
			}
		};
		
		for (var index=0; index < cpos.length; index++) {
			var selname = "#motivAisatsuC" + (lineIndex+1) + "-" + num2(index+1);
			var $element = $(selname);
			var px2 = cpos[index];
			var delay = 1000 + (index * 35);
//			var px1 = 300 + Math.floor( Math.random() * 860 );
//			var px1 = 334 + ((799 - 334) / 2);
//			var px1 = 334 + (_index-1) * 10;
			var px1 = 334;

			
			$element.css({opacity: 0, left: (px1+"px"), display: "block"});
			$element.animate({left: (px2+"px")}, delay).animate({opacity: 1}, (delay-50), "linear", animateionCompleted);
/*
			if ((__browserInfo.isMSIE) && (__browserInfo.version <= 7)) {
				$element.css({left: (px1+"px"), display: "block"});
				$element.animate({left: (px2+"px")}, delay, "linear", animateionCompleted);
			}
			else {
				$element.css({opacity: 0, left: (px1+"px"), display: "block"});
				$element.animate({left: (px2+"px")}, delay).animate({opacity: 1}, (delay-50), "linear", animateionCompleted);
			}
*/			
			/*
			$element.animate({left: (px2+"px")}, delay);
			$element.animate({opacity: 1}, (delay-50), "linear", function () {
				if (++count < cpos.length) return;
				
				switch (++_aisatsuCount) {
				case 1:
					animateAisatsuLine(1);
					break;
				case 2:
					$("#motivAisatsuLogo").css("display", "block");
					$("#motivAisatsuMizuhiki").css("display", "block");
					setTimeout(animateMoon, 1200);
					break;
				}
			});
			*/
		}
	};
	
	/**
	 * animateAisatsu
	 */
	var animateAisatsu = function () {
		animateAisatsuLine(0);
	};
	
	/**
	 * animateMoon
	 */
	var animateMoon = function () {
		var fPy = -200;
		var fTargetY = parseInt($_elementF.css("top"));
		
		var targetY = parseInt($_element.css("top"));
		var py = targetY - 10;
		
		$_elementF.css({top: (fPy+"px"), display: "block"});
		$_elementF.animate({top: (fTargetY+"px")}, 400, "easeOutElastic");
		
		// Notify quake
		jQuery(window).trigger(new NengaEvent('notifyQuake'));

		$_element.css("top", (py+"px"));
		setTimeout(function () {
			$_elementT.css("display", "block");
			$_element.animate({top: (targetY+"px")}, 300, "easeOutBounce");
			$("#motiv-moon-tenugui").css("display", "block");
			
			// topItemsAnimateionCompleted
			jQuery(window).trigger(new NengaEvent('topItemsAnimateionCompleted'));
		}, 100);
	};
	
	
	/**
	 * animate
	 */
	this.animate = function (b) {
		if (b) {
			animateAisatsu();
		}
		else {
			$_elementF.css("display", "block");
			$_elementT.css("display", "block");
			$("#motiv-moon-tenugui").css("display", "block");
			
		}
	};
	
	

	init();
};

// #