// JavaScript Document
function Slides()
{
    this.counter = 0;
	this.level = 0;
	this.interval = 5000;
	this.speed = 2000;
	this.increment = 2;
	this.flip = 1;
	this.images = new Array();
	this.play = true;
	
	this.img1 = null;
	this.img2 = null;
	
	this.onload = function( imageList, img1, img2, func )
	{
		// default image ids
		if( !img1 ) img1 = "img1";
		if( !img2 ) img2 = "img2";
		
		this.img1 = document.getElementById( img1 );
		
		if( this.img1 )
		{
			if( !document.getElementById( img2 ) )
			{
				var parent = document.getElementById( img1 ).parentNode;
				var obj = document.createElement( 'img' );
				obj.id = img2;
				obj.src = img1.src;
				obj.alt = img1.alt;
				obj.className = img1.className;
				parent.appendChild( obj );
			}
			this.img2 = document.getElementById( img2 );
			
			this.func = func;
			
			if( navigator.appName == "Microsoft Internet Explorer" ) 
			{
				this.img1.style.filter="alpha(opacity=100)";
				this.img2.style.filter="alpha(opacity=0)";
			}
			else if( this.img1.style.opacity != null )
			{
				this.img1.style.opacity = 1;
				this.img2.style.opacity = 0;
			}
			else
			{
				this.img1.style.MozOpacity = 1;
				this.img2.style.MozOpacity = 0;
			}
			
			// If there is more than 1 image start the transition process
			var length = imageList.length;
			if( length > 1 )
			{
				for( var i = 0; i < length; i++ )
				{
					// create the images
					this.images[ i ] = new Image();
					this.images[ i ].src = imageList[ i ];
				}
				this.img1.src = this.images[ 0 ].src;
				this.img2.src = this.images[ 0 ].src;
				this.wait();
			}
		}
	}
	
	this.wait = function()
	{
		if( this.counter > this.images.length - 1 )
			this.counter = 0;
		
		// user defined function performed at the beginning of each fade
		if( this.func )
		{
			this.func( this.counter );	
		}
		
		// check whether the next image has finised loading
		var counter = this.counter + 1;
		if( counter > this.images.length - 1 )
			counter = 0;
		
		var that = this;
		if( this.images[ counter ].complete )
		{
			// finished loading, now perform the fade
			setTimeout( function() { that.fade(); }, this.interval );	
		}
		else
		{	
			// not finished loading yet, keep waiting...
			setTimeout( function() { that.wait(); }, 100 );
		}
	}
	
	this.fade = function()
	{		
		var that = this;
		if( this.play )
		{
			// check whether it is time to flip the images around
			if( this.flip == 0 )
			{
				var img1 = this.img1.id;
				var img2 = this.img2.id;
				this.img1 = document.getElementById( img2 );
				this.img2 = document.getElementById( img1 );
				this.flip = 1;
			}
			
			var counter = this.counter + 1;
			if( counter > this.images.length - 1 )
				counter = 0;
	
			this.img2.src = this.images[ counter ].src;
			
			// Set the new opacity levels of the images
			var opacity1 = 100 - this.level;
			if( opacity1 < 0 ) opacity1 = 0;
			
			var opacity2 = this.level;
			if( opacity2 > 100 ) opacity2 = 100;
			
			// Perform the fade
			if( navigator.appName == "Microsoft Internet Explorer" ) 
			{
				// Internet Explorer
				this.img1.filters.alpha.opacity = opacity1;
				this.img2.filters.alpha.opacity = opacity2;
			}
			else if( this.img1.style.opacity != null ) 
			{
				this.img1.style.opacity = opacity1 / 100;
				this.img2.style.opacity = opacity2 / 100;
			}
			else
			{
				this.img1.style.MozOpacity = opacity1 / 100;
				this.img2.style.MozOpacity = opacity2 / 100;
			}
			
			// Note: If neither of the above conditions are not met then the images won't fade
			
			
			if( this.level >= 100 )
			{
				// The fade is complete
				this.level = 0;
				this.flip = !this.flip ? 1 : 0;
				this.counter ++;
				setTimeout( function() { that.wait(); }, 0 );
			}
			else
			{
				// Go to the next level of the fade
				this.level += this.increment;
				setTimeout( function() { that.fade(); }, this.speed / ( 100 / this.increment ) );
			}
		}
		else
		{
			setTimeout( function() { that.fade(); }, this.speed / ( 100 / this.increment ) );	
		}
	}
	
	this.resetSlides = function( index )
	{
		if( this.images.length > 1 )
		{			
			var next = index+1;
			if( next >= this.images.length ) next = 0;
			
			this.img1.src = this.images[ index ].src;
			this.img2.src = this.images[ next ].src;
			
			this.counter = index;
			
			if( navigator.appName == "Microsoft Internet Explorer" ) 
			{
				this.img1.style.filter="alpha(opacity=100)";
				this.img2.style.filter="alpha(opacity=0)";
			}
			else if( this.img1.style.opacity != null )
			{
				this.img1.style.opacity = 1;
				this.img2.style.opacity = 0;
			}
			else
			{
				this.img1.style.MozOpacity = 1;
				this.img2.style.MozOpacity = 0;
			}
			
			this.flip = 1;
			this.level = 0;
		}
	}
}