UI.Game = {
	// Initialize Game
	Initialize: function()
	{
		var th = UI.Game;
		
		// Disable Scrolling
		// document.body.addEventListener('touchstart',UI.GUI.PreventScroll,false);
		// document.body.addEventListener('touchmove',UI.GUI.PreventScroll,false);
		
		document.body.addEventListener('touchstart',function(e){ e.preventDefault(); },false);
		document.body.addEventListener('touchmove',function(e){ e.preventDefault(); },false);
	},

	// API to the UI Class
	Update: function(uObj,fromEngine)
	{
		var th = UI.Game;
		for(var x=0;x<uObj.length;x++)
		{
			switch(uObj[x].uType)
			{
				case 'board':
					th.InitBoard(uObj[x]);
					break;
				case 'piece':
					th.pieceUpdates(uObj[x]);
					break;
				default:
					console.log('Unknown Update Type: '+uObj[x].uType);
			}
		}
	},

	// This creates the board on load
	InitBoard: function(uObj)
	{
		var th = UI.Game;
		// Make sure nothing is there and add new board
		th.gameWrapper = document.createElement('div');
		th.gameWrapper.id = 'gameWrapper';

		// Create HTML for Game Board & add touch event listeners
		th.gameBoard = document.createElement('div');
		th.gameBoard.id = 'gameBoard';

		th.gameBoard.addEventListener('touchstart', function(e)
		{
			e.preventDefault();
			var curLoc = UI.Interface.determineLocation(e.touches[0].pageY,e.touches[0].pageX);
			return UI.Interface.touchInit(curLoc[0],curLoc[1]);
		}, false);
		
		th.gameBoard.addEventListener('touchmove', function(e)
		{
			e.preventDefault();
			if(UI.Game.selectMode==true)
			{
				var curLoc = UI.Interface.determineLocation(e.touches[0].pageY,e.touches[0].pageX);
				return UI.Interface.touchMove(curLoc[0],curLoc[1]);
			}
		}, false);

		th.gameBoard.addEventListener('touchend',function(e)
		{
			e.preventDefault();
			if(UI.Game.selectMode==true) return UI.Interface.touchEnd();
		}, false);

		// Create HTML for HUD
		th.gameHud = document.createElement('div');
		th.gameHud.id = 'gameHud';
		
		th.btnNewGame = UI.GUI.Button('newGame');
		
		th.btnNewGame.innerHTML = 'New Game';
		th.btnNewGame.addEventListener('touchend',function()
		{
			return UI.GUI.Dialogue.create({ message:'Do you really want to start a new game?',confirm:'Yes, Please!',cancel:'Nope'},tempFunction2);
		}, false);

		// Create HTML for Score
		th.gameScore = document.createElement('div');
		th.gameScore.id = 'gameScore';
		th.gameScore.innerHTML = 0;

		// Create HTML for piece preview
		th.piecePreview = document.createElement('div');
		th.piecePreview.id = 'piecePreview';

		// Initialize various touch variables
		th.lastTouchX = null;
		th.lastTouchY = null;
		th.lastHovered = null;
		th.initialSelection = null;

		// Selection UI Variables
		th.selectMode = false;
		th.selectInfo = new Object;
		th.touchMode = false;

		// Create and add the drag object
		th.dragObj = document.createElement('div');
		th.dragObj.id = 'dragObj';
		th.dragObj.style.webkitTransform = 'translate(-'+100+'px,-'+100+'px) !important';
		
		// Available Spaces
		th.tempAvailable = document.createElement('div');
		th.tempAvailable.id = 'tempAvailable';

		// UI backend stuff
		// Quick temps
		var oRef = uObj.objects;
		var tempRow = oRef.length;

		th.idCounter = 0;
		th.boardRef = new Array(oRef.length);

		for(var r=0; r<th.boardRef.length;r++)
		{
			th.boardRef[r] = new Array(oRef[r].length);
			for(var c=0; c<th.boardRef[r].length;c++)
			{
				th.boardRef[r][c] = null;

				var tempAvail = document.createElement('img');
				tempAvail.id = 't'+r+c;
				tempAvail.src = UI.Assets.availableImg.src;

				var tempCords = th.convertLocation(r,c);

				tempAvail.style.top = tempCords[0]+'px';
				tempAvail.style.left = tempCords[1]+'px';
				tempAvail.style.visibility = 'hidden';

				th.tempAvailable.appendChild(tempAvail);
			}
		}

		// Add everything to the html
		th.gameWrapper.appendChild(th.gameBoard);
		th.gameWrapper.appendChild(th.dragObj);
		th.gameWrapper.appendChild(th.tempAvailable);
		th.gameHud.appendChild(th.gameScore);
		th.gameHud.appendChild(th.piecePreview);
		th.gameHud.appendChild(th.btnNewGame);
		th.gameWrapper.appendChild(th.gameHud);
		document.body.appendChild(th.gameWrapper);
	},

	pieceUpdates: function(uObj)
	{
		var th = UI.Game;
		// Create shortcut for objects piece
		var els = uObj.objects;

		// Set or reset available spaces
		if(uObj.available) th.updateAvailable(uObj.available);
		else th.updateAvailable(false);

		if(uObj.hud) th.updateHud(uObj.hud);

		// Determine what todo with the utype
		for(var names in els)
		{
			switch(els[names].utype)
			{
				case 'add':
					th.addPiece(els[names]);
					break;
				case 'delete':
					th.deletePiece(els[names]);
					break;
				case 'select':
					th.selectPiece(els[names]);
					break;
				case 'unselect':
					th.unselectPiece(els[names]);
					break;
				case 'move':
					th.movePiece(els[names]);
					break;
				default:
					console.log('don\'t know what to do with this el.utype: '+els[names].utype);
			};
		};

		// Update Preview
		if(uObj.nextColors) th.updatePreview(uObj.nextColors);
	},
	
	addPiece: function(piece)
	{
		var th = UI.Game;
		// Setup boardRef reference and create html for piece, generate unique ID
		var pieceRef = document.createElement('img');
		pieceRef.src = UI.Assets.pieces[piece.color].src;
		pieceRef.id = 'd'+th.idCounter;
		
		th.idCounter++;
		
		// Add animation event listener to piece
		pieceRef.addEventListener('webkitAnimationEnd', function(event)
		{
			return UI.Animation.finished(this,event.animationName);
		}, false);
		
		// Determine the absolute position for the piece
		var tempAbsLoc = th.convertLocation(piece.loc[0],piece.loc[1]);
		
		pieceRef.style.top = tempAbsLoc[0]+'px';
		pieceRef.style.left = tempAbsLoc[1]+'px';
		
		th.gameBoard.appendChild(pieceRef);
		th.boardRef[piece.loc[0]][piece.loc[1]] = pieceRef;
		
		// Check whether the piece needs to animate or not
		if(piece.animate==true) return UI.Animation.add(pieceRef,'show');
		else pieceRef.className='shown';
	},
	
	// Move a piece from one location to another!
	movePiece: function(piece)
	{
		var th = UI.Game;
		// Get variables and value needed to perform move
		var pieceRef = th.boardRef[piece.oldLoc[0]][piece.oldLoc[1]];
		var newPos = th.convertLocation(piece.newLoc[0],piece.newLoc[1]);
		
		th.boardRef[piece.newLoc[0]][piece.newLoc[1]] = pieceRef;
		th.boardRef[piece.oldLoc[0]][piece.oldLoc[1]] = null;
		
		th.selectMode=false;
		th.selectInfo = new Object;
		
		pieceRef.className = 'shown';
		
		pieceRef.style.top = newPos[0]+'px';
		pieceRef.style.left = newPos[1]+'px';
	},
	
	updatePreview: function(previewPieces)
	{
		var th = UI.Game;
		
		th.piecePreview.innerHTML='';
		for(var x=0; x<previewPieces.length; x++)
		{
			var tempPreview = document.createElement('img');
			tempPreview.src = UI.Assets.pieces[previewPieces[x]].src;
			
			th.piecePreview.appendChild(tempPreview);
		}
	},
	
	deletePiece: function(piece)
	{
		var th = UI.Game;
		
		var tempDisc = th.boardRef[piece.loc[0]][piece.loc[1]];
		
		if(piece.animate==true) return UI.Animation.add(tempDisc,'destroy');
		else if(tempDisc) th.gameBoard.removeChild(tempDisc);
	},
	
	selectPiece: function(piece)
	{
		var th = UI.Game;
		
		th.boardRef[piece.loc[0]][piece.loc[1]].className = 'shown selected';
		th.selectMode=true;
		th.selectInfo.row=piece.loc[0];
		th.selectInfo.col=piece.loc[1];
	},
	
	unselectPiece: function(piece)
	{
		var th = UI.Game;
		
		th.boardRef[piece.loc[0]][piece.loc[1]].className = 'shown';
		th.selectMode=false;
		th.selectInfo = new Object;
	},
	
	updateAvailable: function(grid)
	{
		var th = UI.Game;
		
		if(th.tempAvailable.style.visibility=='visible')
		{
			th.tempAvailable.style.visibility='hidden';
			for(var r=0;r<th.boardRef.length;r++)
			{
				for(var c=0;c<th.boardRef[r].length;c++)
				{
					if(th.boardRef[r][c]=='available') th.boardRef[r][c]=null;
					$('t'+r+c).style.visibility='hidden';
				}
			}
		}
		if(grid)
		{
			for(var r=0;r<grid.length;r++)
			{
				for(var c=0;c<grid[r].length;c++)
				{
					if(grid[r][c]['available']==true)
					{
						th.boardRef[r][c]='available';
						$('t'+r+c).style.visibility='visible';
					}
					else $('t'+r+c).style.visibility='hidden';
				}
			}
			th.tempAvailable.style.visibility='visible';
		}
	},
	
	updateHud: function(hud)
	{
		var th = UI.Game;
		
		for(var names in hud)
		{
			switch(names)
			{
				case 'score':
					th.gameScore.innerHTML = hud[names];
					break;
				default:
					console.log('don\'t know what hud element to update: '+names);
			}
		}
	},
	
	// New Convert Location function
	convertLocation: function(x,y){ return [(x*44+5),(y*44+5)]; },
	
	checkPiece: function(x,y)
	{
		var th = UI.Game;
		
		return (th.boardRef[x][y]!=null && th.boardRef[x][y]!='available') ? true : false;
	}
};