// JavaScript Document

var pongInterval = null;

var boundXMin = 0;
var boundXMax = 720;
var boundYMin = 0;
var boundYMax = 405;

var gameInterval = null;
var gameSpeed = 50;
var bg = null;
var g = 4;
var f = 2;
var vX = 0;
var vY = 0;

$(document).ready(function(){
	$(document).keypress(function(e){
		switch(e.which)
		{
			case 119:
				//Up
				jump(30);
				break;
				
			case 115:
				//Down
				moveV('rhino', 4);
				break;
				
			case 100:
				//Right
				vX += 10;
				break;
				
			case 97:
				//Left
				vX -= 10;
				break;
				
			case 32:
				//Spacebar
				//Reset
				setupBoard();
				break;
		}
	});
	
	
});



function clearBoard()
{
	document.getElementById('gameDiv').innerHTML = "";
}

function setupBoard()
{
	clearBoard();
	clearInterval(gameInterval);
	
	//Create BG
	bg = document.createElement('div');
	bg.setAttribute('id', 'bg');
	bg.style.background = "rgba(0, 0, 0, 0.8)";
	bg.style.width = boundXMax - boundXMin+'px';
	bg.style.height = boundYMax - boundYMin+'px';
	bg.style.position = "relative";
	bg.style.top = '3px';
	bg.style.left = '-50px';
	bg.style.zIndex = '1000';
	bg.style.marginLeft = 'auto';
	bg.style.marginRight = 'auto';
	document.getElementById('gameDiv').appendChild(bg);
	
	drawWorld();
	
	$('#tinyRhino').css({ position: "relative", zIndex: "1500" });
}

function drawWorld()
{
	drawRect('rhino', 'bg', 1500, '', 'images/common/tiny_rhino_f.png', 20, 313, 100, 75);
	drawRect('grass', 'bg', 1300, '#009900', '', 0, 375, boundXMax, 30);
	
	gameInterval = setInterval("gameLoop();", gameSpeed);
}

function drawRect(rectId, parentDiv, layer, rectColor, rectImg, rectL, rectT, rectW, rectH)
{
	var newRect = document.createElement('div');
	newRect.style.position = 'absolute';
	newRect.setAttribute('id', rectId);
	newRect.style.zIndex = layer;
	if(rectColor != "")
	{
		newRect.style.backgroundColor = rectColor;
	}
	if(rectImg != "")
	{
		newRect.style.backgroundImage = "url('"+rectImg+"')";
	}
	newRect.style.width = rectW+'px';
	newRect.style.height = rectH+'px';
	newRect.style.top = rectT+'px';
	newRect.style.left = rectL+'px';
	
	document.getElementById(parentDiv).appendChild(newRect);
}

function moveH(divId, distance)
{
	var movDiv = document.getElementById(divId);
	var leftDist = movDiv.style.left;
	leftDist = leftDist.substring(0, leftDist.length-2);
	leftDist = parseInt(leftDist) + parseInt(distance);
	movDiv.style.left = leftDist+'px';
	return leftDist;
}

function moveV(divId, distance)
{
	var movDiv = document.getElementById(divId);
	var topDist = movDiv.style.top;
	topDist = topDist.substring(0, topDist.length-2);
	topDist = parseInt(topDist) + parseInt(distance);
	movDiv.style.top = topDist+'px';
	return topDist;
}

function setX(divId, pos)
{
	var posDiv = document.getElementById(divId);
	posDiv.style.left = pos+'px';
}

function setV(divId, pos)
{
	var posDiv = document.getElementById(divId);
	posDiv.style.top = pos+'px';
}

function jump(speed)
{
	vY = (-1)*speed;
}

function gameLoop()
{
	var rhinoV = moveV('rhino', vY);
	var rhinoH = moveH('rhino', vX);
	vY += g;
	//Apply Friction
	if(vX > 0) { vX -= f; }
	if(vX < 0) { vX += f; }

	if(rhinoV > 313)
	{
		setV('rhino', 313);
		vY = 0;
	}
}