// JavaScript Document

//To change the slide delay time, change the number of seconds of the timer on the line below.
timer = 5;
slideNum = 1;
slideTotal = 10;

jQuery(document).ready(function() {		
	slideShow();
});

function slideShow() {
	//Set the opacity of all images to 0
	jQuery('#gallery .imagediv').css({opacity: 0.0});
	jQuery('#gallery div.1').css({opacity: 1.0});
	changeImage = setInterval('playSlides()',timer * 1000);
	
	/*
	//Get the first image and display it (set it to full opacity)
	jQuery('#gallery div:first').css({opacity: 1.0});
	
	//Call the gallery function to run the slideshow, 4000 = change to next image after 4 seconds
	changeImage = setInterval('gallery()',timer * 1000);
	*/
}

function playSlides() {
	
	var current = jQuery('#gallery div.show');
	var next = ((current.next().length) ? (current.next()) : jQuery('#gallery div.1'));	
	next.css({opacity: 0.0}).addClass('show').animate({opacity: 1.0}, 1000);
	current.animate({opacity: 0.0}, 1000).removeClass('show');	
	if(slideNum < slideTotal){
		slideNum ++;
	}else{
		slideNum = 1;
	}
}

function gallery() {
	
	//increment the slideNum unless it is equal to the slideTotal in which case it gets set back to 1
	if(slideNum < slideTotal){
		slideNum ++;
	}else{
		slideNum = 1;
	}
	
	//find the current image
	var current = jQuery('#gallery div.show');

	//Get next image, if it reached the end of the slideshow, rotate it back to the first image
	var next = ((current.next().length) ? (current.next()) : jQuery('#gallery div:first'));	
	
	//Set the fade in effect for the next image, show class has higher z-index
	next.css({opacity: 0.0}).addClass('show').animate({opacity: 1.0}, 1000);

	//Hide the current image
	current.animate({opacity: 0.0}, 1000).removeClass('show');
	
}
