CROSSFADE_WAIT = 5000;
CROSSFADE_DURATION = 1000;
CROSSFADE_FPS = 30;

crossfadeQueue = new Array();

function crossfade(id)
{
	var element = document.getElementById( id );
	
	crossfadeQueue.push( element );
	
	if( crossfadeQueue.length == 2 )
		waitForNext();
}

function waitForNext()
{
	setTimeout( nextElement, CROSSFADE_WAIT );
}

function nextElement()
{
	var oldElement = crossfadeQueue[0];
	crossfadeQueue.shift();
	crossfadeQueue.push(oldElement);
	
	var newElement = crossfadeQueue[0];
	
	for( var n=0; n<crossfadeQueue.length; n++ )
	{
		var element = crossfadeQueue[n];
		
		if( element == oldElement )
			setAlpha( element, 1 );
		else
			setAlpha( element, 0 );
	}
	
	oldElement.style.zIndex=1;
	newElement.style.zIndex=2;
	
	crossFadeStart = new Date()-0;
	updateIntervalId = setInterval( updateCrossfade, 1000 / CROSSFADE_FPS );
	
}

function updateCrossfade()
{
	var crossFadeProgress = Math.min( 1, (new Date() - crossFadeStart) / CROSSFADE_DURATION );
	
	var element = crossfadeQueue[0];
	
	setAlpha( element, crossFadeProgress );
	
	if( crossFadeProgress == 1 )
	{
		clearInterval( updateIntervalId );
		waitForNext();
	}
}

function setAlpha( element, alpha )
{
	element.style.display = alpha ? 'block':'none';

	if (element.style.MozOpacity!=null)
		element.style.MozOpacity = alpha;
	else if (element.style.opacity!=null)
		element.style.opacity = alpha;
	else if (element.style.filter!=null)
		element.style.filter = "alpha(opacity="+Math.floor(100*alpha)+")";
}