var cardPlacingOffset=9;
var destinationX = 200;
var destinationY = 200;
var divPrefix = 'card';
var imagePrefix = 'image';
var deckSize = 22;
var urn = new Array(deckSize);
var cards = new Array(	'dwaas','magier','hogepriesteres','keizerin','keizer','hogepriester',
						'geliefden','zegewagen','kracht','kluizenaar','radvanfortuin',
						'gerechtigheid','gehangene','dood','gematigdheid','duivel',
						'toren','ster','maan','zon','oordeel','wereld');
						
var placeHolders = new Array('verleden','heden','toekomst');						
var placeHolderPosition = 0;
var cardMoving = false;

function body_onload()
{
	document.getElementById('verleden_container').value='';
	document.getElementById('heden_container').value='';
	document.getElementById('toekomst_container').value='';
	var urn = new Array(deckSize);
	for (var i = 0; i < deckSize; i++)
	{
		urn[i]=false;
	}
	
	
	
	for (var i = 0; i<deckSize; i++)
	{
		addCard(cardPlacingOffset + (i*18),0,i+1,getCardFromUrn());
	}
}

function getCardFromUrn()
{
	var found = false;
	while (!found)
	{
	   var value = Math.floor(Math.random() * deckSize);
	   if (!urn[value])
	   {
			urn[value]=true;
			found = true;	   	
	   }
	}
	return value;
}

function addCard(xpos,ypos,zindex, id)
{
	var node = document.createElement('div');
	//node.innerHTML='<p>' + id + '</p>';
	node.style.left=xpos;
	node.style.top=ypos;
	node.style.zIndex=zindex;
	node.className='playing_card';
	node.id=divPrefix+id;
	node.onclick = function() {moveCard(divPrefix+id)};
	node.onmouseover = function() {node.style.cursor='pointer'};
	node.onmouseout = function() {node.style.cursor=''};
	node.setAttribute('xposition',xpos)
	node.setAttribute('yposition',ypos)
	node.setAttribute('xvelocity',0);
	node.setAttribute('yvelocity',0);
	node.setAttribute('cardSelected','FALSE');
	var imageNode = document.createElement('img');
	imageNode.setAttribute('src','img/kaart.jpg');
	
	imageNode.id=imagePrefix+id;
	
	node.appendChild(imageNode);
	document.getElementById('card_container').appendChild(node);
	
	
	
	//alert(document.getElementById('card_container').innerHTML);
	
}

function moveCard(divId)
{
	var card = document.getElementById(divId);
	if (cardMoving || placeHolderPosition>2 || card.getAttribute('cardSelected')!='FALSE')
	{
		return false;	
	}
	cardMoving = true;
	window.setTimeout('cardTimer(\''+divId+'\');',5);
}

function getDestinationX()
{
	
	
	var card = document.getElementById(placeHolders[placeHolderPosition]);
	return card.offsetLeft;
}
function getDestinationY()
{
	var card = document.getElementById(placeHolders[placeHolderPosition]);
	return card.offsetTop;
}

function cardTimer(divId)
{
	var reached = true;
	var card = document.getElementById(divId);
	card.setAttribute('cardSelected','TRUE');
	var xpos = parseFloat(card.getAttribute('xposition'),10);
	var ypos = parseFloat(card.getAttribute('yposition'),10);
	var xvelocity = parseFloat(card.getAttribute('xvelocity'),10);
	var yvelocity = parseFloat(card.getAttribute('yvelocity'),10);

	
	if (xvelocity==0)
	{
		destinationX = getDestinationX()
		xvelocity = (destinationX-xpos) /  25;
		card.setAttribute('xvelocity',xvelocity);
	}
	if (yvelocity==0)
	{
		destinationY = getDestinationY()
		yvelocity = (destinationY-ypos) /  25;
		card.setAttribute('yvelocity',yvelocity);
//		alert(xvelocity + ' ' + yvelocity);
	}
	

	if (yvelocity < 0)
	{
		if (ypos > destinationY)
		{
			reached = false;				
			ypos += yvelocity;
		}		
		else
		{
			ypos = destinationY;			
		}
	}
	else if (yvelocity > 0)
	{
		if (ypos < destinationY)
		{
			reached = false;				
			ypos += yvelocity;
		}		
		else
		{
			ypos = destinationY;			
		}		
	}
	else
	{
		ypos = destinationY;					
	}
	card.style.top = Math.round(ypos);
	card.setAttribute('yposition',ypos);			
	if (xvelocity < 0)
	{
		if (xpos > destinationX)
		{
			reached = false;				
			xpos += xvelocity;
		}		
		else
		{
			xpos = destinationX;			
		}
	}
	else if (xvelocity > 0)

	{
		if (xpos < destinationX)
		{
			reached = false;				
			xpos += xvelocity;
		}		
		else
		{
			xpos = destinationX;			
		}		
	}
	else
	{
		xpos = destinationX;			
		
	}
	
	card.style.left = Math.round(xpos);
	card.setAttribute('xposition',xpos);			
		
	if (!reached)
	{
		window.setTimeout('cardTimer(\''+divId+'\');',5);
	}
	else
	{
		
		var cardId = divId.substring(4);
		cardImage = document.getElementById(imagePrefix+cardId);
		cardImage.src=getCardSource(cardId);
		var placeHolder = document.getElementById(placeHolders[placeHolderPosition]+ '_container');
		placeHolder.value = card.id.substring(4);
		
		placeHolderPosition++;
		
		cardMoving = false;
	}
	
}

function getCardSource(cardId)
{
	var cardName = cards[cardId];
	if (cardId.length<2)
		cardId = '0' + cardId;

	return 'img/'+cardId + '-' + cardName + 'kl.gif';
}

function validateForm()
{
	var carderror=false;
	if (document.getElementById('verleden_container').value=='')
	{
		carderror = true;
	}
	if (document.getElementById('heden_container').value=='')
	{
		carderror = true;
	}
	if (document.getElementById('toekomst_container').value=='')
	{
		carderror = true;
	}
	
	if (carderror)
	{
		alert('Niet alle kaarten zijn getrokken.');
		return false;
	}
	else
	{
		return true;
	}
}