// set the starting image.
var i = 0;			

// The array of div names which will hold the images.
var image_slide = new Array('image-1', 'image-2', 'image-3');

// The number of images in the array.
var NumOfImages = image_slide.length;
	
// The time to wait before moving to the next image. Set to 4 seconds by default.
var fade_wait = 4000;

// duration of crossfade
var fade_duration = 1.5;

// show a counter (good for debug)
var use_counter = false;

// show start/ pause buttons
var use_startpause = false;

// stop slideshow after control pushed
var stopaftercontrol = false;

// slide next?
var slidecontrol = true;

// width neccessary for slide only
var iViewerWidth = 500;

//var bSwitchedToSlide = false;

// The Fade Function
function SwapImage(x,y) {
	$(image_slide[x]).appear({ duration: fade_duration });
	$(image_slide[y]).fade({duration: fade_duration});
}

// The Slide Function
function SlideImage(show, hide){
	
	var iImageEnd = iViewerWidth;
	var iArrEnd = NumOfImages-1;

	if( (show < hide && !(show == 0 && hide == iArrEnd) ) || (hide == 0 && show == iArrEnd) ){
		iImageEnd = (-1*iViewerWidth);
	}
	$(image_slide[hide]).setStyle({left:'0px'});
	$(image_slide[show]).setStyle({display:'', left:(-1*iImageEnd)+'px'});

	new Effect.Move(image_slide[hide], { x: iImageEnd, y: 0, afterFinish:function(effect){effect.element.setStyle({display: 'none', left:'0px'})} });
	new Effect.Move(image_slide[show], { x: 0, y: 0, mode: 'absolute'});
}

// the onload event handler that starts the fading.
function StartSlideShow(wait, duration) {
	if( parseFloat(wait) > 0 ) fade_wait = parseFloat(wait)*1000;
	if( parseFloat(duration) > 0 ) fade_duration = parseFloat(duration);
	// this variable defines how many slides there are
	var iCountSlides = $$("#image-container .fade-box").length;
	
	if( !isNaN(iCountSlides) ){
		image_slide = new Array();
		for(var iC=0; iC<iCountSlides; iC++ ){
			image_slide[iC] = 'image-'+parseInt(iC+1);
		}
		NumOfImages = iCountSlides;
	}

	play = setInterval('Play()',fade_wait);
	
	if( use_startpause ){
		$('PlayButton').hide();
		$('PauseButton').appear({ duration: 0});
	}

	if( use_counter ) updatecounter();						
}

function Play() {
	var imageShow, imageHide;

	imageShow = i+1;
	imageHide = i;
	
	if (imageShow == NumOfImages) {
		SwapImage(0,imageHide);	
		i = 0;					
	} else {
		SwapImage(imageShow,imageHide);			
		i++;
	}
	
	var textIn = i+1 + ' of ' + NumOfImages;
	if( use_counter ) updatecounter();
}

function Stop () {
	clearInterval(play);
	if( use_startpause ){			
		$('PlayButton').appear({ duration: 0});
		$('PauseButton').hide();
	}
}

function GoNext() {
	clearInterval(play);

	if( use_startpause ){
		$('PlayButton').appear({ duration: 0});
		$('PauseButton').hide();
	}
	
	var imageHide;
	i++;
	imageHide = i-1;

	if( i == NumOfImages ) i = 0;
	
	if( slidecontrol ){
		SlideImage(i, imageHide);
	}
	else{
		SwapImage(i, imageHide);
	}

	if( use_counter ) updatecounter();
	//
	if( !stopaftercontrol ) StartSlideShow();
}

function GoPrevious() {
	clearInterval(play);

	if( use_startpause ){
		$('PlayButton').appear({ duration: 0});
		$('PauseButton').hide();
	}

	var imageHide;
	i--;
	imageHide = i+1;
	
	if( i < 0 ) i = NumOfImages-1;

	if( slidecontrol ){
		SlideImage(i, imageHide);
	}
	else{
		SwapImage(i, imageHide);
	}
	
	if( use_counter ) updatecounter();

	if( !stopaftercontrol ) StartSlideShow();
}

function updatecounter() {
	var textIn = i+1 + ' of ' + NumOfImages;
	$('Counter').innerHTML = textIn;
}