// JavaScript Document
var canvasWidth = 1920, canvasHeight = 1080, imageArray = new Array(), animInterval = false, canvasID = false, delay = 1, animTimer = 1, decelerator = 1, decelThreshold = 1, imageCache = [], allLoaded = false;
function getBrowserVersion () {
	var isFirefox = navigator.userAgent.indexOf("Firefox") != -1;
	var isChrome = navigator.userAgent.indexOf("Chrome") != -1;
	var isSafari = navigator.userAgent.indexOf("Safari") != -1 && navigator.userAgent.indexOf("Chrome") == -1;
	var isOpera = navigator.userAgent.indexOf("Opera") != -1;
	var isIE = navigator.userAgent.indexOf("MSIE") != -1;

	var versionSubstr = "";
	
	var browserData = new Array();

	if(isFirefox) {
		browserData[0] = "Firefox";
		versionSubstr = navigator.userAgent.substr(navigator.userAgent.indexOf("Firefox")+8);
	}
	if(isChrome) {
		browserData[0] = "Chrome";
		versionSubstr = navigator.userAgent.substr(navigator.userAgent.indexOf("Chrome")+7);
	}
	if(isSafari || isOpera) {
		browserData[0] = isSafari ? "Safari" : "Opera";
		versionSubstr = navigator.userAgent.substr(navigator.userAgent.indexOf("Version")+8);
	}
	if(isIE) {
		browserData[0] = "IE";
		versionSubstr = navigator.userAgent.substr(navigator.userAgent.indexOf("MSIE")+5);
	}

	browserData[1] = parseInt(versionSubstr.substring(0,versionSubstr.indexOf(".")));
	
	return browserData;
}

function draw() {
	try {
		var ctx = document.getElementById(canvasID).getContext('2d');
	} catch(err) {
		clearInterval(animInterval);
		drawFallback();
		return true;
	}

	ctx.clearRect(0, 0, canvasWidth, canvasHeight);

	if(delay < 0) {
		for(var i = imageArray.length-1; i>=0; i--) {
			animImage(ctx,imageArray[i]);
		}
	} else {
		delay--;
	}

	if(inStasis()) {
		clearInterval(animInterval);
	}
}

function drawFallback() {
	for(var i = imageArray.length-1; i>=0; i--) {
		if(imageArray[i].doReverse) {
			if(imageArray[i].goingUp) {
				$("#"+canvasID).append("<div class='canvas-image' style='width:"+imageArray[i].width+"px;height:"+imageArray[i].height+"px;left:"+imageArray[i].startX+"px;top:"+imageArray[i].startY+"px;background:transparent url("+imageArray[i].source+") no-repeat;' endx='"+imageArray[i].endX+"' endy='"+imageArray[i].endY+"' goingup='true'></div>");
			} else {
				$("#"+canvasID).append("<div class='canvas-image' style='width:"+imageArray[i].width+"px;height:"+imageArray[i].height+"px;left:"+imageArray[i].startX+"px;top:"+imageArray[i].startY+"px;background:transparent url("+imageArray[i].source+") no-repeat;' endx='"+imageArray[i].endX+"' endy='"+(parseInt(imageArray[i].endY)+20)+"' goingup='false'></div>");
			}
		} else {
			$("#"+canvasID).append("<div class='canvas-splash' style='width:"+imageArray[i].width+"px;height:"+imageArray[i].height+"px;left:"+imageArray[i].startX+"px;top:"+imageArray[i].startY+"px;background:transparent url("+imageArray[i].source+") no-repeat;' endx='"+imageArray[i].endX+"' endy='"+(parseInt(imageArray[i].endY)-10)+"'></div>");
		}
	}

	$(".canvas-image,.canvas-splash").show();

	$(".canvas-image").each(function() {
		if($(this).attr("goingup") == "true") {
			$(this).animate({left:$(this).attr("endx")+"px",top:$(this).attr("endy")+"px"},700).animate({top:"+=5"},300);
		} else {
			$(this).animate({left:$(this).attr("endx")+"px",top:$(this).attr("endy")+"px"},700).animate({top:"-=45"},300);
		}
	});
	$(".canvas-splash").each(function() {
		$(this).animate({left:$(this).attr("endx")+"px",top:$(this).attr("endy")+"px"},1000);
	});

}

function animInit() {
	var allLoaded = true;
	var browserVersion = getBrowserVersion();

	for(var i = imageArray.length-1; i>=0; i--) {
		if(!imageArray[i].loaded) {
			allLoaded = false;

			var img = new Image();
			img.src = imageArray[i].source;
			if(browserVersion[0] == "IE" && browserVersion[1] < 9) {
				if(img.complete) {
					setImageInArray(i,img);
/*
					imageArray[i].image = img;
					imageArray[i].loaded = true;
*/
				}
			} else {
				img.onload = setImageInArray(i,img);
			}
		}
	}
	
	if(allLoaded) {
		clearInterval(initInterval);
		animInterval = setInterval(draw,30);

		return true;
	} else {
		return false;
	}
}

function setImageInArray(pos,thisImage) {
	if(thisImage.width > 0 && thisImage.height > 0) {
		imageArray[pos].image = thisImage;
		imageArray[pos].loaded = true;
	}
};


function ImageObject() {
	this.image = false;
	this.source = false;
	this.x = 0.0;
	this.y = 0.0;
	this.startX = 0.0;
	this.startY = 0.0;
	this.endX = 0.0;
	this.endY = 0.0;
	this.rateX = 0.0;
	this.rateY = 0.0;
	this.backupX = false;
	this.backupY = false;
	this.time = parseFloat(animTimer);
	this.distanceX = 0;
	this.distanceY = 0;
	this.traveledX = 0;
	this.traveledY = 0;
	this.directionX = 1;
	this.directionY = 1;
	this.prevX = false;
	this.prevY = false;
	this.doReverse = true;
	this.loaded = false;
	this.width = 0;
	this.height = 0;
	this.goingUp = false;
}

function setImage(imgpath,startX,startY,endX,endY,stopReverse,imgWidth,imgHeight,goingUp) {
	var b = new ImageObject();
	b.source = imgpath;
	b.startX = b.x = parseFloat(startX);
	b.startY = b.y = parseFloat(startY);
	b.endX = parseFloat(endX);
	b.endY = parseFloat(endY);
	b.distanceX = b.endX - b.startX;
	b.distanceY = b.endY - b.startY;
	b.width = imgWidth;
	b.height = imgHeight;
	
	if(b.distanceX != 0.0) {
		b.rateX = b.distanceX / b.time;
		b.directionX = Math.abs(b.distanceX) / b.distanceX;
	} else {
		b.rateX = 0.0;
		b.directionX = 0;
	}
	
	if(b.distanceY != 0.0) {
		b.rateY = b.distanceY / b.time;
		b.directionY = Math.abs(b.distanceY) / b.distanceY;
	} else {
		b.rateY = 0.0;
		b.directionY = 0;
	}
	
	if(stopReverse) {
		b.doReverse = false;
	}
	if(goingUp) {
		b.goingUp = true;
	}

	return b;
}

function animImage(ctx,imageObj) {
	if(imageObj.image) {
		ctx.drawImage(imageObj.image, imageObj.x, imageObj.y);
	} else {
		var img = new Image();
		img.onload = function() {
			imageObj.image = img;
		};
		img.src = imageObj.source;
	}

	imageObj.prevX = imageObj.x;
	imageObj.x += (imageObj.rateX * (imageObj.backupX ? -1 : 1));
	imageObj.traveledX += imageObj.rateX;
	if(imageObj.traveledX / imageObj.distanceX > decelThreshold) {
		imageObj.rateX *= decelerator;
	}
	if(imageObj.doReverse && ((imageObj.directionX == 1 && imageObj.distanceX <= imageObj.traveledX) || (imageObj.directionX == -1 && imageObj.traveledX <= imageObj.distanceX) || imageObj.directionX == 0)) {
		imageObj.backupX = true;
	}
	
	imageObj.prevY = imageObj.y;
	imageObj.y += (imageObj.rateY * (imageObj.backupY ? -1 : 1));
	imageObj.traveledY += imageObj.rateY;
	if(imageObj.traveledY / imageObj.distanceY > decelThreshold) {
		imageObj.rateY *= decelerator;
	}
	if(imageObj.doReverse && ((imageObj.directionY == 1 && imageObj.distanceY <= imageObj.traveledY) || (imageObj.directionY == -1 && imageObj.traveledY <= imageObj.distanceY) || imageObj.directionY == 0)) {
		imageObj.backupY = true;
	}
}

function inStasis() {
	var movement = 0.0;
	for(var i = imageArray.length-1; i>=0; i--) {
		movement += (Math.round(imageArray[i].x*10)/10) - (Math.round(imageArray[i].prevX*10)/10);
		movement += (Math.round(imageArray[i].y*10)/10) - (Math.round(imageArray[i].prevY*10)/10);
	}
	if(movement == 0.0) {
		return true;
	} else {
		return false;
	}
}