// select an image and highlight its parent <li>
function selectImage(elm, idx) {
	// if there's no main image just do the footer part
	if(!document.images["main"]) {
		var o = document.getElementById("footer_" + idx);

		if(o) o.innerHTML = elm.getAttribute("alt");

		return;
	}

	if(currentElm != null) currentElm.className = "";

	currentElm = elm.parentNode.parentNode;
	currentElm.className = "selected";

	elm.blur();

	var src = elm.src.replace("thumbs/", "");

	// update the positioning of the newly selected image
	for(var i = 0; i < images.length; i++) {
		if(images[i].src == src) {
			currentPos = i;
			updateImage();
			break;
		}
	}
}

// change to next or go to first if at end
function nextImage() {
	if(!document.images["main"]) return;

	if(++currentPos == images.length) {
		currentPos = 0;
	}

	updateImage();
	resetSelected();
}

// change to previous or go to last if at 0
function previousImage() {
	if(!document.images["main"]) return;

	if(currentPos-- == 0) {
		currentPos = images.length - 1;
	}

	updateImage();
	resetSelected();
}

// update the current image, the numeric position text, and the title text display
function updateImage() {
	document.images["main"].src = images[currentPos].src;
	document.images["main"].title = titles[currentPos];
	document.getElementById("index").innerHTML = currentPos + 1;
	document.getElementById("glassType").innerHTML = titles[currentPos];
}

// reset the selected <li>
function resetSelected() {
	if(currentElm != null) {
		currentElm.className = "";
		currentElm = null;
	}
}

// load up an image with the supplied path and return it
function loadImage(src) {
	var i = new Image();

	i.src = src;

	return i;
}

// set the image by the hash key
function setImageBykey(key) {
	if(!hash[key]) return;

	for(var i = 0; i < images.length; i++) {
		if(images[i].src == hash[key]) {
			currentPos = i;
			updateImage();
			break;
		}
	}
}

var currentElm = null; // the currently selected <li>
var currentPos = 0;    // the position of the displayed image in the array