var transitionTimeMillis = 1500;

function setTransitionTimeMillis( timeMillis )
{
	if( timeMillis < 1 )
	{
		transitionTimeMillis = 1;
	}
	else
	{
		transitionTimeMillis = timeMillis;
	}
}

var transitionSteps = 40;

function setTransitionSteps( steps )
{
	if( steps < 1 )
	{
		steps = 1;
	}
	else
	{
		transitionSteps = steps;
	}
}

function transition( currentImage, newImage )
{
	if( currentImage == null )
	{
		return;
	}
	var container = currentImage.parentNode;
	var mySteps = transitionSteps;
	var transitionDelta = 1 / mySteps;
	var delay = transitionTimeMillis / 2 / mySteps;
	if( currentImage.src == "" )
	{
		// just do a fade in
		setTimeout( 
			function() { 
				stepTransition( 
					0, 
					mySteps,
					-1,
					transitionDelta,
					delay,
					container,
					currentImage,
					newImage ) },
			delay );	
		return;
	}
	else
	{
		// fade out old and fade in new
		setTimeout( 
			function() { 
				stepTransition( 
					mySteps, 
					mySteps,
					-1,
					transitionDelta,
					delay,
					container,
					currentImage,
					newImage ) },
			delay );	
		return;
	}
}



function stepTransition( index, numSteps, direction, stepDelta, delay, container, currentImage, newImage )
{
	if( index == 0 && direction == -1 )
	{
		setOpacity( newImage, 0 );
		container.replaceChild( newImage, currentImage );
		setTimeout( 
			function() { 
				stepTransition( 
					index - direction, 
					numSteps,
					direction * -1,
					stepDelta,
					delay,
					container,
					newImage,
					newImage ) },
			delay );
		return;
	}
	else if( index >= numSteps && direction == 1 )
	{
		setOpacity( currentImage, 1 );
		return;
	}
	else
	{
		setOpacity( currentImage, index * stepDelta );
		setTimeout( 
			function() { 
				stepTransition( 
					index + direction,					
					numSteps,
					direction,
					stepDelta,
					delay,
					container,
					currentImage,
					newImage ) },
			delay );
		return;					
	}
}

function setOpacity( image, opacity )
{
	image.style.opacity = opacity; // for the standard
	image.style.MozOpacity = opacity; // for firefox
	image.style.KhtmlOpacity = opacity; // for safari
	image.style.filter = 
		'alpha(opacity=' 
		+ Math.abs( opacity * 100 ) 
		+ ')';// for internet explorer
}