var elemIndex = new Array();
var startOffset = 20;
var len = $('div.cards').length - 1;
var w = 0;
var h = 0;
var inProcess = false;
var cardDim = new Array(650, 365);
var curID = $('div.cards').length - 1;
var animationInterval = 500;
var distanceBetweenCards = 10;

$(window).load(function() {
	var totalheight = 0;
	w = $('div.rotatingCards').width();
	h = $('div.rotatingCards').height();

	$('div.cards').each(function() {
		index = $('div.cards').index(this);

		if(totalheight > 0) { offsetheight = totalheight - (index * distanceBetweenCards); }
		else { offsetheight = 0; }

		var ratio = 1 - ((len - index) * .05);

		newwidth = cardDim[0] * ratio;
		newheight = cardDim[1] * ratio;

		$('img', this).css({ 'width' : newwidth + 'px', 'height' : newheight + 'px' });

		$(this).css({
			'top' : startOffset - offsetheight + 'px',
			'left' : ((w - newwidth) / 2) + 'px',
			'display' : 'block',
			'z-index' : index+1
		});

		elemIndex[index] = index;
		totalheight += cardDim[1];
	});
});

function next() {
	if(inProcess) { return false; }

	inProcess = true;

	$elem = $('div.cards:eq('+curID+')');

	$elem.css('z-index', len*100); //make sure it's on top.
	$elem.animate({ 'left' : $('div.rotatingCards').width() + 'px' }, animationInterval); //animate to the right.

	for(c = len; c >= 0; c--) {
		if(c == curID) { continue; }

		elemIndex[c]++;

		if(elemIndex[c] > len) { elemIndex[c] = 0; }

		var ratio = 1 - ((len - elemIndex[c]) * .05);

		$('div.cards:eq('+c+') img').animate({
			'width' : (cardDim[0] * ratio) + 'px',
			'height' : (cardDim[1] * ratio) + 'px'
		}, animationInterval);

		$('div.cards:eq('+c+')').animate({
			'top' : parseInt($('div.cards:eq('+c+')').css('top')) + distanceBetweenCards + 'px',
			'left' : ((w - cardDim[0] * ratio) / 2) + 'px'
		}, animationInterval).css('z-index', elemIndex[c] + 1);
	}

	$elem.animate({
		'top' : parseInt($('div.cards:eq('+curID+')').css('top')) - (len*distanceBetweenCards) + 'px',
		'left' : ((w - cardDim[0] * (1 - (len * .05))) / 2) + 'px'
	}, animationInterval);

	setTimeout("$elem.css('z-index', 1)", animationInterval);

	$('img', $elem).animate({ 'width' : cardDim[0] * (1 - (len * .05)) + 'px', 'height' : cardDim[1] * (1 - (len * .05)) + 'px' }, animationInterval);

	elemIndex[curID] = 0;
	curID--;
	if(curID < 0) { curID = len; }

	setTimeout("inProcess = false;", animationInterval*2);
}

function prev() {
	if(inProcess) { return false; }

	inProcess = true;

	if(curID == 0) { var newID = curID + 1; }
	else {
		var newID = curID + 1;
		if(newID > len) { newID = 0; }
	}

	$elem = $('div.cards:eq('+newID+')');

	$elem.css('z-index', 0); //make sure it's on bottom.
	$elem.animate({ 'left' : '-' + $('div.rotatingCards').width() + 'px' }, animationInterval); //animate to the left.

	for(c = 0; c <= len; c++) {
		if(c == newID) { continue; }

		elemIndex[c]--;

		if(elemIndex[c] < 0) { elemIndex[c] = len; }

		var ratio = 1 - ((len - elemIndex[c]) * .05);

		$('div.cards:eq('+c+') img').animate({
			'width' : (cardDim[0] * ratio) + 'px',
			'height' : (cardDim[1] * ratio) + 'px'
		}, animationInterval);

		$('div.cards:eq('+c+')').animate({
			'top' : parseInt($('div.cards:eq('+c+')').css('top')) - distanceBetweenCards + 'px',
			'left' : ((w - cardDim[0] * ratio) / 2) + 'px'
		}, animationInterval).css('z-index', elemIndex[c] + 1);
	}

	$elem.animate({
		'top' : parseInt($('div.cards:eq('+newID+')').css('top')) + (len*distanceBetweenCards) + 'px',
		'left' : ((w - cardDim[0]) / 2) + 'px'
	}, animationInterval);

	setTimeout("$elem.css('z-index', "+(len+1)+");", animationInterval);

	$('img', $elem).animate({ 'width' : cardDim[0] + 'px', 'height' : cardDim[1] + 'px' }, animationInterval);

	elemIndex[newID] = len;
	curID++;
	if(curID > len) { curID = 0; }

	setTimeout("inProcess = false;", animationInterval*2);

}

setInterval('next()', 5000);