// functions below build a sliding gallery
// originally derived from gallery at http://www.gilesrevell.com/
// modified and streamlined by jareda - jaredwilliam.com


// variables to set
x = 0;
xTarget = 0;
currentImage = "";
currentImageAID = "";
selectedImage = "";
move_timeout = null;
scrolling = false;
prevImage = null;
nextImage = null;
loadQueue = new Array();
widths = new Array();
// set the first width as 0
widths[0] = 0;
// space between images (see space in CSS around div.image)
space = 30;
// tell it not to go until its loaded
ready = 0;
// browser check
if (navigator.appName.indexOf("Microsoft")!=-1&&parseInt(navigator.appVersion)>=4) {
	var ie = 1;
	if (window.XMLHttpRequest) {
		// IE 7, mozilla, safari, opera 9
		space = 30;
	} else {
	// IE6, older browsers
		space = 32;
	}
}
else {
	var ie = null;
}

function move() {
	scrolling = true;
	var xDiff = xTarget - x;
	x += xDiff/4;
	document.getElementById("images").style.left = x + "px";
	if (Math.round(xDiff) == 0) {
		window.clearTimeout(move_timeout);
		move_timeout = null;
		scrolling = false;
	} else {
		move_timeout = window.setTimeout("move();",25);
	}
}

function scrollTo() {
	// here, we make sure we don't scroll unless all the images are loaded
	if (ready == 1 || selectedImage == "") {
		// check to make sure the image is called, if not, it's the first image
		if (selectedImage == "") {
			selectedImage = currentImage;
		}
		e = document.getElementById(selectedImage);
		var n = parseInt(e.className);
		xTarget = -widths[n] + ((document.body.offsetWidth/2) - (e.width/2));
		move();
		show(e);
		// set caption to work... 
		document.getElementById(selectedImage + "Caption").style.display = "block";
		// remove arrows
		document.getElementById('arrowL' + n).style.display = "none";
		document.getElementById('arrowR' + n).style.display = "none";
		document.getElementById('imageProgress').style.display = "none";
	}
	else {
		//loadImages();
	}
}

function show(e) {
	if (ie) {
		e.style.visibility="";
	}
	var temp = e.id;
	//e.src = folder + temp;
	var prevID = parseInt(e.className) - 1;
	if (prevID >= 0) {
		prevImage = document.getElementById(images_array[prevID]);
		// hide previous image
		prevImage.style.opacity = 0.05;
		if (ie) {
			prevImage.style.visibility="hidden";
		}
//		prevImage.onmousemove = function() {
//			rollOver(images_array[prevID]);
//		}
		prevCaption = document.getElementById(images_array[prevID] + "Caption");
		prevCaption.style.display = "none";
		document.getElementById("arrowL" + prevID).style.display = "block";
		document.getElementById("arrowR" + prevID).style.display = "block";
		if (ie) {
			document.getElementById("arrowR" + prevID).style.color = "#eeeeee";
		}
		document.getElementById("arrowL" + prevID).style.zIndex = 50;
		document.getElementById("arrowR" + prevID).style.zIndex = 50;
	}
	var nextID = parseInt(e.className) + 1;
	if (nextID < images_array.length) {
		nextImage = document.getElementById(images_array[nextID]);
		nextImage.style.opacity = 0.05;
		if (ie) {
			nextImage.style.visibility="hidden";
		}
//		nextImage.onmousemove = function() {
//			rollOver(images_array[nextID]);
//		}
		nextImage.onFocus = function() {
			rollOver(images_array[nextID]);
		}
		nextCaption = document.getElementById(images_array[nextID] + "Caption");
		nextCaption.style.display = "none";
		document.getElementById("arrowL" + nextID).style.display = "block";
		document.getElementById("arrowR" + nextID).style.display = "block";
		if (ie) {
			document.getElementById("arrowL" + nextID).style.color = "#eeeeee";
		}
		document.getElementById("arrowL" + nextID).style.zIndex = 50;
		document.getElementById("arrowR" + nextID).style.zIndex = 50;
	}
	// set current image 
	currentImage = e.id;
	currentImageAID = parseInt(e.className);
	e.style.opacity = "";
	if (ie) {
		//e.src="";
	}
}

// wrapper functions
function rollPrevious() {
	if (document.getElementById(images_array[currentImageAID - 1]) && ready == 1) {
		rollOver(images_array[currentImageAID - 1]);
	}
}
function rollNext() {
	if (document.getElementById(images_array[currentImageAID + 1]) && ready == 1) {
		rollOver(images_array[currentImageAID + 1]);
	}
}

function rollOver(e) {
	e = document.getElementById(e);
	selectedImage = e.id;
//	if (prevImage != null) prevImage.onmousemove = null;
//	if (nextImage != null) nextImage.onmousemove = null;
	if (ie) {
	  document.getElementById("arrowR" + parseInt(e.className)).style.color = "#999999";
		document.getElementById("arrowL" + parseInt(e.className)).style.color = "#999999";
	}
	if (e.id == currentImage || scrolling == true) {
		var n = parseInt(e.className);
		var currentN = parseInt(document.getElementById(currentImage).className);
		if ( n != (currentN - 1) && n != (currentN + 1)) {
			return false;
		}
	}
	// make the file visible
	//e.src = folder + e.id;
	e.style.opacity = 0.08;
	if (ie) {
		//e.filters.alpha.opacity=50;
	}
}

// wrapper functions
function rollOutPrevious() {
	if (document.getElementById(images_array[currentImageAID - 1]) && ready == 1) {
		rollOut(images_array[currentImageAID - 1]);
	}
}
function rollOutNext() {
	if (document.getElementById(images_array[currentImageAID + 1]) && ready == 1) {
		rollOut(images_array[currentImageAID + 1]);
	}
}

function rollOut(e) {
	e = document.getElementById(e);
//	if (prevImage != null) prevImage.onmousemove = null;
//	if (nextImage != null) nextImage.onmousemove = null;
	if (ie) {
	  document.getElementById("arrowR" + parseInt(e.className)).style.color = "#eeeeee";
		document.getElementById("arrowL" + parseInt(e.className)).style.color = "#eeeeee";
	}
	if (e.id == currentImage || scrolling == true) {
		var n = parseInt(e.className);
		var currentN = parseInt(document.getElementById(currentImage).className);
		if ( n != (currentN - 1) && n != (currentN + 1)) {
			return false;
		}
	}
	e.style.opacity = 0.05;
	if (ie) {
		//e.filters.alpha.opacity=25; 
	}
	var temp = e.id.split("_");
}

function preloadImages() {
	var n = 0;
	var widthsTotal = 0;
	// parse through all the images and ensure that their widths are
	// in the width array
	while (n < images_array.length) {
		// create a new image and then determine its width
		var newImg = new Image();
		newImg.src = folder + images_array[n];
		var theWidth = newImg.width;
		if (!theWidth) {
			theWidth = (document.getElementById('imageDiv' + images_array[n]).style.width.replace(/px/,"")) * 1;
		}
		n++;
		// figure out the width including space
		var thespace = widths[n-1] + theWidth + space;
		// put the width in the array
		widths[n] = thespace;
		widthsTotal = (thespace + widthsTotal);
	}
	// parse through every image - already loaded - and stuff... 
	ready = 1;
	document.getElementById('imageProgress').style.display = "none";
	document.getElementById('imagesOuterA').style.display = "";
}