var currentImage = 0;
var showStart = 0;
var maxShow = 4;

function nextImage() {	
	if(currentImage < imageID.length-1) {
		currentImage++;
		if(currentImage > maxShow-1) {
			showStart++;
			maxShow++;
		}
		else {
			document.getElementById("image_" + (currentImage-showStart)).className = "";
		}
		
		page_load();
	}
}

function prevImage() {
	if(currentImage > 0) {	
		currentImage--;
		if(currentImage < showStart) { 
			showStart--;
			maxShow--;
		}
		else {
			document.getElementById("image_" + ((currentImage - showStart)+2)).className = "";
		}
		
		page_load();
	}
}

function click_image(clickedImage) {
	currentImage = parseInt(clickedImage.name) + showStart;
	page_load();
}
	
function page_load() {
	if(showStart < imageID.length) {
		document.getElementById('image_1').src = imageThumb[showStart];
		document.getElementById('image_1').rel = imageID[showStart];
		document.getElementById("image_1").className = "";
	}
	else document.getElementById('image_1').style.display = "none";
	
	if(showStart+1 < imageID.length) {;
		document.getElementById('image_2').src = imageThumb[showStart+1];
		document.getElementById('image_2').rel = imageID[showStart+1];
		document.getElementById("image_2").className = "";
	}
	else document.getElementById('image_2').style.display = "none";
	
	if(showStart+2 < imageID.length) {
		document.getElementById('image_3').src = imageThumb[showStart+2];
		document.getElementById('image_3').rel = imageID[showStart+2];
		document.getElementById("image_3").className = "";
	}
	else document.getElementById('image_3').style.display = "none";
	
	if(showStart+3 < imageID.length) {
		document.getElementById('image_4').src = imageThumb[showStart+3];
		document.getElementById('image_4').rel = imageID[showStart+3];
		document.getElementById("image_4").className = "";
	}
	else document.getElementById('image_4').style.display = "none";
	
	document.getElementById("image_"+ ((currentImage - showStart)+1)).className = "selectedImage";
	
	englargeImage(document.getElementById("image_"+ ((currentImage - showStart)+1)).rel);
}

function englargeImage(selectedImageID) {
		if(window.ActiveXObject){
			httpObject = new ActiveXObject("Microsoft.XMLHTTP");
		}
		else if(window.XMLHttpRequest){ //Mozilla, Firefox, Opera 8.01, Safari
			httpObject = new XMLHttpRequest(); 
		}
		if (httpObject)
		{
			var now = new Date();
			httpObject.open("GET", "http://" + window.location.host + "/javascript/gallery.ajax.php?control=GetPictureDetails&imageID=" + selectedImageID + "&time=" + now, true);
			httpObject.onreadystatechange = build_image;
			httpObject.send(null);
		}
		else alert("Your browser does not support AJAX");
}

function build_image()
{    
	if(httpObject.readyState == 4 || httpObject.readyState=="complete")
	{
		var _imageDetails = httpObject.responseText.split("~");
		var _imageURL = _imageDetails[0];
		var _imageName = _imageDetails[1];
		var _imageDesc = _imageDetails[2];
		
		document.getElementById("image_feature").src = _imageURL;
		document.getElementById("imageName").innerHTML = "<span class='textheader'>" + _imageName + "</span><br /><span>" + _imageDesc + "</span>";
	}
}