//pabin slideshow
//TODO document the idea behind it once it is further along

//sadly required to implement timer related stuff due to the non-oo nature of JS timers :(
//NOTE: there are slicker solutions out there to the timer problem - I'm under the gun, 
//so I'm going to make it bootleg :)

//converts version strings to numbers for easy comparison
//hijacked from scriptaculous
/*
function convertVersionString(versionString){
  var r = versionString.split('.');
  return parseInt(r[0])*100000 + parseInt(r[1])*1000 + parseInt(r[2]);
}

if(typeof Scriptaculous == 'undefined' || convertVersionString(Scriptaculous.Version) < '1.8.1')
{
	alert("Scriptaculous version 1.8.1 or greater is required for the slideshow to work properly")
}
*/

var _secret_global_array = new Array()
function slideshow(slide_div, control_div)
{
	//store the new slideshow in the global array of slideshows
	_secret_global_array.length = _secret_global_array.length+1
	_secret_global_array[_secret_global_array.length-1] = this
	this._global_position = _secret_global_array.length-1
	
	//------------------------
	//content areas passed by user
	
	//div in which to display "slides"
	this.slide_div = slide_div
	//alert(slide_div)
	
	//div in which to display "controls"
	this.control_div = control_div
	//------------------------
	
	//------------------------
	//slide show control variables
	
	//speed fo the slideshow, default to 5 seconds
	this.interval_time = 5000
	
	//counter to control current slide
	this.current_slide = 0
	
	//flag to control whether the show is stopped or not
	this.stopped = true
	
	//ID of the interval set by the start function, required to stop the slideshow
	this.timeout_id = null
	//------------------------
	
	//array of arrays in which to hold slides and their corresponding controls
	this.content = new Array()
	
	//TODO here!
	//function to add new content to the slideshow
	this.add_content = 
	function(slide, control)
	{
		//add new slot for content, place it in there
		this.content.length = this.content.length + 1		
		this.content[this.content.length-1] = new Array(slide, control)
		
		//set the slide and control to point to each other
		control.setAttribute("controlid",this.content.length-1)
		slide.setAttribute("slideid",this.content.length-1)
		
		//set pointers back to the slideshow object
		control.slideshow = this
		slide.slideshow = this
		
		//add JS event handlers to control
		control.onmouseover = 
		function()
		{
			//alert("boo")
			this.slideshow.stop_show()
			this.slideshow.hide_slide(this.slideshow.current_slide)
			//alert(this.getAttribute("controlid"))
			this.slideshow.current_slide = this.getAttribute("controlid")*1
			this.slideshow.show_slide(this.slideshow.current_slide)
		}
		
		control.onmouseout = 
		function()
		{
			this.slideshow.start_show()
		}
		
		//slide events
		slide.onmouseover = 
		function()
		{
			//alert("boo")
			this.slideshow.stop_show()
			this.slideshow.hide_slide(this.slideshow.current_slide)
			//alert(this.getAttribute("controlid"))
			this.slideshow.current_slide = this.getAttribute("slideid")*1
			this.slideshow.show_slide(this.slideshow.current_slide)
		}
		
		slide.onmouseout = 
		function()
		{
			this.slideshow.start_show()
		}

		
		//move the slide and the control to the appropriate divs
		this.slide_div.appendChild(slide)
		this.control_div.appendChild(control)
		
		//make the slide invisible
		this.hide_slide(this.content.length-1)
	}
	
	//-------------------------
	//slideshow control functions
	this.start_show = 
	function()
	{
		//if there is nothing to show, let the user know
		if(this.content.length == 0)
		{
			this.slide_div.appendChild(document.createTextNode('There is no content in this slideshow :('))
			return
		}
		
		//start the show
		this.stopped = false
		
		//show the first slide
		this.show_slide(this.current_slide)
		
		//go to next slide
		this.timeout_id = setTimeout("_secret_global_array["+this._global_position+"].next_slide()",this.interval_time)
	}
	
	this.stop_show = 
	function()
	{
		//stop the show
		this.stopped = true
		
		//clear the timer
		clearTimeout(this.timeout_id)
	}
	
	//move to the next slide, reset timer if the show isn't stopped
	this.next_slide = 
	function()
	{
		//alert(this.content.length)
		//hide current slide
		this.hide_slide(this.current_slide)
		
		//increment current slide
		this.current_slide = this.current_slide + 1
		
		//check to see whether the counter is out of bounds - if so, reset
		if(this.current_slide >= this.content.length)
		{
			this.current_slide = 0
		}
		
		//show next slide
		this.show_slide(this.current_slide)
		
		//if not stopped, reset timer to show next slide
		if(! this.stopped)
		{
			clearTimeout(this.timeout_id)
			this.timeout_id = setTimeout("_secret_global_array["+this._global_position+"].next_slide()",this.interval_time)
		}
	}
	
	this.previous_slide =
	function()
	{
		//make current slide go away
		this.hide_slide(this.current_slide)
		
		this.current_slide = this.current_slide - 1
		
		//check to see whether the counter is out of bounds - if so, reset
		if(this.current_slide < 0)
		{
			this.current_slide = this.content.length-1
		}
		
		//show next slide
		this.show_slide(this.current_slide)
		
		//if not stopped, reset timer to show next slide
		if(!this.stopped)
		{
			clearTimeout(this.timeout_id)
			this.timeout_id = setTimeout("_secret_global_array["+this._global_position+"].next_slide()",this.interval_time)
		}
	}
	
	this.hide_slide =
	function(slide_id)
	{
		//make current slide invisible - TODO add effects?
		//NOTE element 0 is the slide
		//alert(this.content[this.current_slide][0])

		//use an effect to make the slid fade out, then make it disappear
		this.content[slide_id][0].style.display = "none"
		
		//change the css class of the relevant control
		this.content[slide_id][1].setAttribute("class", "slide_inactive")
		this.content[slide_id][1].setAttribute("className", "slide_inactive")
	}
	
	this.show_slide = 
	function(slide_id)
	{		
		//alert(this.content[this.current_slide][0])
		//display the slide
		this.content[slide_id][0].style.display = "block"
		
		//change the class of the control
		this.content[slide_id][1].setAttribute("class", "slide_active")
		this.content[slide_id][1].setAttribute("className", "slide_active")
	}
	//-------------------------
}