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

// The array of div names which will hold the images.
var image_slide = new Array('image0', 'image1', 'image2', 'image3', 'image4','image5','image6');

// The number of images in the array.
var NumOfImages = image_slide.length;

// The time to wait before moving to the next image. Set to 3 seconds by default.
var wait = 5000;

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

// the onload event handler that starts the fading.
function StartSlideShow() {
	play = setInterval('Play()',wait);	
   document.getElementById('thumb'+current_slide).className = 'current';						
}

function Play() {
	var imageShow, imageHide;

	imageShow = i+1;
	imageHide = i;
   
	if (imageShow == NumOfImages) {
      imageShow = 0;
		SwapImage(imageShow,imageHide);	
		i = 0;					
	} else {
		SwapImage(imageShow,imageHide);			
		i++;
	}
   
   document.getElementById('thumb'+current_slide).className = 'off';
   document.getElementById('thumb'+imageShow).className = 'current';
      
   current_slide = imageShow;
}

function seek(pos) {
   if(pos!=i){
      clearInterval(play);
      StartSlideShow();

      var imageShow = pos;
      var imageHide = i;
         
      if (imageShow == NumOfImages) {
         imageShow = 0;
         SwapImage(imageShow,imageHide);
         i = 0;					
      } else {
         SwapImage(imageShow,imageHide);
         i = pos;
      }
      
      document.getElementById('thumb'+current_slide).className = 'off';
      document.getElementById('thumb'+pos).className = 'current';
      
      current_slide = pos;
   }
}