// JavaScript Document

g_fadeCounter 	= 0;		// The index of the image that is being faded out
g_fadeLevel 	= 0;		// The percentage that the first image has been faded
g_fadeInterval 	= 4000;		// The time an image is displayed before the fade begins
g_fadeSpeed 	= 100;		// The duration of the fade in ms
g_switch		= 1;
g_fadeImages = new Array();

function Fade_onload( imageList )
{
	//g_fadeCounter = Math.floor( Math.random()* imageList.length )
	
	var img1 = document.getElementById( 'fade1' );
	//img1.src = imageList[ g_fadeCounter ]; 
	var img2 = document.getElementById( 'fade2' );
	//img2.src = imageList[ g_fadeCounter ]; 
	
	var browser = navigator.appName; 
	
	if( browser == "Microsoft Internet Explorer" ) 
	{
		img1.style.filter="alpha(opacity=100)";
		img2.style.filter="alpha(opacity=0)";
	}
	else if( img1.style.opacity != null )
	{
		img1.style.opacity = 1;
		img2.style.opcaity = 0;
	}
	else
	{
		img1.style.MozOpacity = 1;
		img2.style.MozOpacity = 1;
	}
	
	for( var i = 0; i < imageList.length; i++ )
	{
		// create the images
		g_fadeImages[ i ] = new Image();
		g_fadeImages[ i ].src = imageList[ i ];
	}
	// If there is more than 1 image start the transition process
	if( imageList.length > 1 )
		Fade_wait();
}

function Fade_wait()
{
	var counter = g_fadeCounter + 1;
	if( counter > g_fadeImages.length - 1 )
		counter = 0;
	
	if( g_fadeImages[ counter ].complete )
	{
		setTimeout( "Fade()", g_fadeInterval );	
	}
	else
	{
		setTimeout( "Fade_wait()", 100 );
	}
}

function Fade()
{
	// Get the parent div that contains the images to fade
	var parentDiv = document.getElementById( 'fade' );
	
	var img1 = document.getElementById( 'fade1' );
	var img2 = document.getElementById( 'fade2' );
	if( g_switch == 0 )
	{
		img2 = document.getElementById( 'fade1' );
		img1 = document.getElementById( 'fade2' );
	}
	
	
	// Check whether we have reached the end of the image array, if we have go back to the start
	if( g_fadeCounter > g_fadeImages.length - 1 )
		g_fadeCounter = 0;
	var counter1 = g_fadeCounter;
	
	var counter2 = counter1 + 1;
	if( counter2 > g_fadeImages.length - 1 )
		counter2 = 0;
	
	//img1.src = g_fadeImages[ counter1 ].src;
	img2.src = g_fadeImages[ counter2 ].src;
	
	// Set the new opacity levels of the images
	var opacity1 = 100 - g_fadeLevel;
	if( opacity1 < 0 ) opacity1 = 0;
	
	var opacity2 = g_fadeLevel;
	if( opacity2 > 100 ) opacity2 = 100;
	
	// Perform the fade
	var browser = navigator.appName; 
	if( browser == "Microsoft Internet Explorer" ) 
	{
		// Internet Explorer
		img1.filters.alpha.opacity = opacity1;
		img2.filters.alpha.opacity = opacity2;
	}
	else if( img1.style.opacity != null ) 
	{
		img1.style.opacity = opacity1 / 100;
		img2.style.opacity = opacity2 / 100;
	}
	else
	{
		img1.style.MozOpacity = opacity1 / 100;
		img2.style.MozOpacity = opacity2 / 100;
	}
	
	// Note: If neither of the above conditions are not met then the images won't fade
	
	if( g_fadeLevel >= 100 )
	{
		// The fade is complete
		g_fadeLevel = 0;
		if( g_switch == 0 ) g_switch = 1; else g_switch = 0;
		g_fadeCounter ++;
		setTimeout( "Fade_wait()", 0 );
	}
	else
	{
		// Go to the next level of the fade
		g_fadeLevel += 1;
		setTimeout( "Fade()", g_fadeSpeed / 100 );
	}
}