var animating = false;
var order = 0;
var holder;
var divs;
var howmany;

function addLinks() {

	var e = document.getElementById("next");
	var p = document.getElementById("prev");
	e.onclick = findNext;
	p.onclick = findPrev;
	
	holder = document.getElementById("theList");
	divs = holder.getElementsByTagName("li");
	holder.style.height = divs[0].firstChild.height + "px";
	
	howmany = divs.length;
}

addLoadEvent(addLinks);

function findNext() {
	if (animating != true) {
	if(order == howmany-1) {
		order = 0;
	} else {
		order ++;
	}
	sortDeck();
	
	}
	return false;
}


function findPrev() {
	if (animating != true) {
	if(order == 0) {
		order = howmany-1;
	} else {
		order --;
	}
	sortDeck();
	
	}
	return false;
}

function sortDeck() {
	if (animating != true) {
		animating = true;
		
	//	console.log("The next card is: " + order);
		
		
		
		//Make sure styling right
		setOpacity100(order);
		
		//Get top card
		
		for (var i=0; i < howmany; i++) {
	
			if(divs[i].style.zIndex == 100) {
				var topCard = divs[i].id;
			}
			

		}
		
		var nextCard = document.getElementById(order);
		//set to below the top
		nextCard.style.zIndex = 99;
			
		setOpacity100(topCard);
		//console.log("Current card is: " + topCard);
		changeOpac(topCard, 0, 1);
	}
}

function setOpacity100(elementID) {
	var element = document.getElementById(elementID);
	element.style.opacity = 1;
	element.style.MozOpacity = 1;
	element.style.KhtmlOpacity = 1;
	element.style.display = "block";
	element.style.filter = "alpha(opacity=" + 100 + ")";
	element.alpha = 100;
}

//AnimateElement with ease
function changeOpac(elementID, opacityToFade, interval)
{
	//Get Element
	var element = document.getElementById(elementID);

	if(element.fade)
	{
	  clearTimeout(element.fade);	
	}
	var o = element.alpha;

	if(o == opacityToFade)
	{
		if(opacityToFade == 0)
		{
			element.style.display = "none";
			element.style.zIndex = element.id;
			var oldcard = document.getElementById(order);
			
			oldcard.style.zIndex = 100;
		}
		clearTimeout(element.fade);	
		animating = false;
		return true;
	}
	else
	{
		if(o < opacityToFade)
		{
			var dist = Math.ceil((opacityToFade - o)/10);
			o = o + dist;
		}
		if(o > opacityToFade)
		{
			var dist = Math.ceil((o - opacityToFade)/10);
			o = o - dist;
		}
		element.style.opacity = (o / 100);
		element.style.MozOpacity = (o / 100);
		element.style.KhtmlOpacity = (o / 100);
		element.style.filter = "alpha(opacity=" + o + ")";
		element.alpha = o;
		
		var repeat = "changeOpac('"+elementID+"',"+opacityToFade+","+interval+")";
		element.fade = setTimeout(repeat, interval);
	}
}