//This script written by Joel Wires, March of 2008 with the help and parts from from Paul Avery, www.peejavery.com.  Check out www.w3schools for more on writing your own scripts.

//The array for the photos in the gallery are to be in the html file before the link to this file.

var img_preload = new Array(); //image preloader, from Paul Avery
for (i=0;i<theGallery.length;i++) {
  img_preload[i] = new Image();
  img_preload[i].src = theGallery[i];
}

var picNum = 0;	//which item in the array starting with 0
var curPic = theGallery[picNum]; //current file displayed
var totalPics = theGallery.length - 1; //determines the number of files in the array
var theDiv;
var thePic;
var theSpeed = 1; //speed in milliseconds
var theInterval = 5; //interval at which the opacity is decreased
var theOpacity = 100; //starting opacity

function changeOpacity(){
	thePic.style.filter = 'alpha(opacity=' + theOpacity + ')'; //sets the opacity for mozilla browsers
	thePic.style.opacity = theOpacity / 100;	//sets the opacity for IE and others
	if(theOpacity >= 1){
		setTimeout("changeOpacity()", theSpeed); //creates the fade loop
		theOpacity = theOpacity - theInterval;
	}
	else{
		theOpacity = 100 //resets the opacity for the next pic
		thePic.src = curPic; //changes the source of the front pic
		thePic.style.filter = 'alpha(opacity= 100)'; //changes the new pic to 100% opacity in Mozilla browsers
		thePic.style.opacity = '1'; //changes the new pic to 100% opacity in IE and others
	}
}

function next(){
	thePic = document.getElementById('thePic');
	theDiv = document.getElementById('theDiv');
	if(picNum < totalPics){picNum++} //gets the array number for the next array item
	else{picNum = 0} //goes back to the first pic in the array
	curPic = theGallery[picNum]; //selects the new array item
	theDiv.style.backgroundImage = 'url(' + curPic + ')'; //first changes the background of the div
	changeOpacity();
}

function previous(){
	thePic = document.getElementById('thePic');
	theDiv = document.getElementById('theDiv');
	if(picNum > 0){picNum--} //gets the array number for the previous array item
	else{picNum = totalPics} //set the array item to the last one
	curPic = theGallery[picNum]; //selects the new array item
	theDiv.style.backgroundImage = 'url(' + curPic + ')';  //first changes the background of the div
	changeOpacity();
}