var delay = 8000;  // 1000 = 1 second
var i = 2;
var prev = 0;
var next = 0; 
var paused = false;
var maxSlides = 4
var imgPath = "/../slideshow/"

function playIt() {

   // init first thumbnail overlay
   document.getElementById("thumb1").firstChild.className = "overlay-off";
   document.getElementById("thumb2").firstChild.className = "overlay-on";
   document.getElementById("thumb3").firstChild.className = "overlay-on";   

   // run specified function on interval
   run = setInterval("setNextSlide()", delay);
}


function getNextSlideNum(currSlide){
    var nextSlide = 0;
	
	if (currSlide == maxSlides) {
	  nextSlide = 1;
	} else {
	  nextSlide = currSlide + 1;
	}

 return nextSlide;
}

function getPrevSlideNum(currSlide){
    var prevSlide = 0;
	
	if (currSlide == 1){
	 prevSlide = maxSlides
	} else {
	 prevSlide = currSlide - 1;
	}

 return prevSlide;
}

function setNextSlide() {

  if (document.images) {
  
    // start over at the beginning if at the end
    if (i > maxSlides) {
	  i = 1;
	}
  
    // set previous and next slides
    prev = getPrevSlideNum(i);
	next = getNextSlideNum(i);

	
	//  set main image 
	document.getElementById("slide").src = imgPath + "slide"+i+".jpg";
	
    // remove overlay from current thumbnail, add to next, previous
	var thumbId = "thumb" +  i;
	document.getElementById(thumbId).firstChild.className = "overlay-off";
	var thumbId = "thumb" +  prev;
	document.getElementById(thumbId).firstChild.className = "overlay-on";	
	var thumbId = "thumb" +  next;
	document.getElementById(thumbId).firstChild.className = "overlay-on";	

	
	i++; 
  } 
}

function setSpecificSlide(slideNum){

    // stop the slideshow
    window.clearInterval(run);
   
	//  set main image 
	document.getElementById("slide").src = imgPath + "slide"+slideNum+".jpg";
	
    // remove overlay from current thumbnail, add to next, previous
	var thumbId2 = "thumb" +  slideNum;
	document.getElementById(thumbId2).firstChild.className = "overlay-off";
	var thumbId2 = "thumb" +  getPrevSlideNum(slideNum);
	document.getElementById(thumbId2).firstChild.className = "overlay-on";	
	var thumbId2 = "thumb" +  getNextSlideNum(slideNum);
	document.getElementById(thumbId2).firstChild.className = "overlay-on";	
 
}


function togglePause(){
    if (paused) {
	  paused = false;
	  setSpecificSlide(1);
	  playIt();
	} else {
	 paused = true;
	 window.clearInterval(run);
    }	 
}