function Gallery(w,h,showTime,fadeTime)
{
	this.w = w;
	this.h = h;
	this.showTime = showTime;
	this.fadeTime = fadeTime;
	this.intervalTime = 40;
	
	this.nextInterval;
	this.playing = false;
	
	this.i = null;
	this.fadeLevel = 100;
	
	this.gallery = new Array();
	this.add = Gallery_add;
	this.place = Gallery_place;
	this.play = Gallery_play;
	this.pause = Gallery_pause;
	this.next = Gallery_next;
	this.fade = Gallery_fade;
}

function Gallery_add(imgSrc)
{
	var img = new ImageHolder(imgSrc);
	this.gallery.push( img );
}

function Gallery_place()
{
	if ( this.gallery.length > 0 ) 
	{
		this.i = 0;
		this.fadeLevel = 100;
		
		document.write( "<img alt='Back to Home' id='displayArea' onload='isDisplayComplete = true;' src='" + this.gallery[0].src + "' width='" + this.w + "' height='" + this.h + "' style='filter:alpha(opacity=100); position: absolute; z-index: 11;' /></div>" );
		document.write( "<img alt='Back to Home' id='loadingArea' onload='isLoadingAreaComplete = true;' src='images/spacer.gif' width='" + this.w + "' height='" + this.h + "' style='filter:alpha(opacity=100); position: absolute; z-index: 10;' /></div>" );

		document.write( "<div style='width: " + this.w + "px; height: " + this.h + "px'> </div>" );
	}
	else
		document.write( "Gallery Empty" );
}

function Gallery_play()
{
	this.playing = true;
	this.next();
}

function Gallery_pause()
{
	this.playing = false;
	clearTimeout( this.nextInterval );
}

function Gallery_next()
{
	this.i = this.i + 1;
	
	if ( this.i >= this.gallery.length )
		this.i = 0;
	
	isLoadingAreaComplete = false;
	
	document.getElementById( "loadingArea" ).src = this.gallery[this.i].src;
	var self = this;
	this.nextInterval = setTimeout( function(){ self.fade(); }, this.showTime );
}

function Gallery_fade()
{
	var self = this;

	// don't fade until image under is loaded
	if ( !isLoadingAreaComplete )
	{
		this.nextInterval = setTimeout( function(){ self.fade(); }, this.intervalTime );
		return;
	}

	var adjustmentPerPeriod = 100 / ( this.fadeTime/this.intervalTime );
	
	this.fadeLevel = this.fadeLevel - adjustmentPerPeriod;
	
	var fadeElement = document.getElementById( "displayArea" );
	var loadElement = document.getElementById( "loadingArea" );
	
	if ( !setFadeLevel(fadeElement,this.fadeLevel) ) 
		this.fadeLevel = 0;
	
	if ( this.fadeLevel <= 0 )
	{
		// swapping src causes some flickering.  So, lets just swap details
		var tempId = fadeElement.id
		var tempZ = fadeElement.style.zIndex;
		var tempOnLoad = fadeElement.getAttribute("onload");
		
		fadeElement.setAttribute( "id", loadElement.id );
		fadeElement.setAttribute( "onload", loadElement.getAttribute("onload") );
		fadeElement.style.zIndex = loadElement.style.zIndex;
		fadeElement.set
		loadElement.setAttribute( "id", tempId );
		loadElement.setAttribute( "onload", tempOnLoad );
		loadElement.style.zIndex = tempZ;
		
		
		//alert( loadElement.id + ", " + loadElement.style.zIndex );
		
		this.fadeLevel = 100;
		setFadeLevel(fadeElement,this.fadeLevel)
		setFadeLevel(loadElement,this.fadeLevel)
		this.next();
	}
	else
	{
		this.nextInterval = setTimeout( function(){ self.fade(); }, this.intervalTime );
	}
}

function setFadeLevel( fadeElement, level )
{
	if ( typeof fadeElement.style.MozOpacity != "undefined" ) 	
		fadeElement.style.MozOpacity = level / 100;
	else if ( typeof fadeElement.style.opacity != "undefined" ) 		
		fadeElement.style.opacity = level / 100;
	else if ( typeof fadeElement.filters == "object" ) 
		fadeElement.filters.alpha.opacity = level;
	else
		return false;
		
	return true;
}

function ImageHolder(src)
{
	this.src = src;
	this.imageObject = new Image();

	this.loadImage = ImageHolder_loadImage;
}

function ImageHolder_loadImage()
{
	this.imageObject.src = this.src;
}