function SlideShow(name,startrow,images,imgprefix){
	this.name = name;						// Name of the current instance, so it can reference itself
	this.images = images;					// Array that contains all image paths, so we can load image only when display that slide
	this.imgprefix = imgprefix;				// The prefix used to identify different images
	this.current_slide_index = startrow-1;	// The index of the slide we are currently on
	this.auto_transition_delay = 5;			// The number of seconds in between flips
	this.transition_time = 20;				// The number of milliseconds it takes to transition between slides
	this.slides = new Array();				// An array of slide IDs
	this.transition_interval = null;		// The interval object for auto flipping
	this.is_paused = false;					// Is the slide show paused
	this.resume_timeout = null;				// The timeout object for resuming after a pause
	this.started = false;					// The flag to determine if transition is required
	
	// Public function to sleep for a specified number of seconds.
	// Calls auto_transition() on resume.
	this.sleep =
	function( time ){
		this.is_paused = true;
		clearTimeout(this.resume_timeout);
		this.resume_timeout = setTimeout(this.name + ".auto_transition()", time * 1000 );
	};
	
	// Private function to increment the slide index by a 
	// certain amount and refresh the display.
	this.increment = 
	function( amount ){
		var oldIndex = this.current_slide_index;
		this.current_slide_index += amount;
		if( this.current_slide_index >= this.slides.length ) this.current_slide_index = 0;
		if( this.current_slide_index < 0 ) this.current_slide_index = this.slides.length-1;
		if( oldIndex != this.current_slide_index && !(oldIndex == startrow-2 && this.started == false))
		{
			this.started = true;
			
			// Load image if not loaded yet
			var tmpIndex = this.current_slide_index + 1;
			if (this.images != undefined)
			{
				if (this.images[tmpIndex]["IsLoaded"] == false)
				{
					this.images[tmpIndex]["IsLoaded"] = true;
					document.getElementById(this.imgprefix + tmpIndex).src = this.images[tmpIndex]["ImageName"];
				}
			}
			
			swap_layers(this.slides[oldIndex],this.slides[this.current_slide_index],this.transition_time,this.slides);
		}
	};
	
	// Public function to add a slide ID to the array
	this.add_slide = 
	function( name ){
		this.slides[this.slides.length] = name;
	};
	
	// Public function to start auto transition
	this.auto_transition = 
	function(){
		this.is_paused = false;
		this.next_slide();
		this.transition_interval = setInterval(this.name + ".next_slide()", this.auto_transition_delay * 1000 );
	};
	
	// Private function used by auto_transition()
	this.next_slide = 
	function(){
		if( !this.is_paused ){
			this.increment(1);
		}else{
			clearInterval( this.transition_interval );
		}
	};
	
	this.pause =
	function(){
		if (this.is_paused){
			this.is_paused = false;
			this.transition_interval = setInterval(this.name + ".next_slide()", this.auto_transition_delay * 1000 );
		}else{
			this.is_paused = true;
			clearInterval( this.transition_interval );
		}
	};
	
	// Public function to go to the next slide
	this.next = 
	function(){
		this.increment(1);
		//this.is_paused = true;
		clearInterval( this.transition_interval );
		setTimeout(this.name + ".auto_transition()", 7000);
	};
	
	// Public function to go to the previous slide
	this.prev = 
	function(){
		this.increment(-1);
		//this.is_paused = true;
		clearInterval( this.transition_interval );
		setTimeout(this.name + ".auto_transition()", 7000);
	};
	
	// Public function to just to slide #n
	this.goto = 
	function(position){
		this.increment(position - this.current_slide_index - 1);
	}
}

// Utility function to swap layers by adjusting their opacity. Swap counter if exists
function swap_layers( id_out, id_in, time, slides ){
	var speed = Math.round(time / 100);
	var timer = 0;
	
	for( var i=0; i<slides.length; i++ ){
		if(document.getElementById(slides[i] + "_page")){
			document.getElementById(slides[i] + "_page").className = "";
		}
	}
	
	if( id_out != null ){
		setTimeout("changeOpac(" + 100 + ",'" + id_out + "')",(timer * speed));
		for( var i=100; i>=0; i-- ){
			setTimeout("changeOpac(" + i + ",'" + id_out + "')",(timer * speed));
			timer++;
		}
		setTimeout("document.getElementById('" + id_out + "').className = 'hideLayer';",(timer * speed));
	}
	
	if( id_in != null ){
		setTimeout("document.getElementById('" + id_in + "').className = 'showLayer';",(timer * speed));
		if(document.getElementById(id_in + "_page")){
			setTimeout("document.getElementById('" + id_in + "_page').className = 'current';",(timer * speed));
		}
		for( var i=0; i<=100; i++ ){
			setTimeout("changeOpac(" + i + ",'" + id_in + "')",(timer * speed));
			timer++;
		}
	}
}

// Utility function to change the opacity of an element.
// Works across different browsers.
function changeOpac(opacity, id) {
	var object = document.getElementById(id).style;
	object.opacity = (opacity / 100);
	object.MozOpacity = (opacity / 100);
	object.KhtmlOpacity = (opacity / 100);
	object.filter = "alpha(opacity=" + opacity + ")";
}
