var thumbnailContainer;
var mainImageIndex;
var mainImageLeftLink;
var mainImageRightLink;

function addEvent(el, eType, fn, uC) {
	try {
		if (el.addEventListener) {
			el.addEventListener(eType, fn, uC);
			return true;
		} else if (el.attachEvent) {
			return el.attachEvent('on' + eType, fn);
		} else {
			el['on' + eType] = fn;
		}
	}
	catch(err) {}
} 

function insertThumbnails()
{
	try {
		thumbnailContainer = document.getElementById("jstThumbnailContainer");
	
		loadXMLDoc("images/thumb1.jpg");
		
		mainImageLeftLink = document.getElementById("jstMainImageLeft");
		mainImageRightLink = document.getElementById("jstMainImageRight");
		mainImageCloseLink = document.getElementById("jstMainImageClose");
		
		addEvent(mainImageLeftLink, "click", previousImage, false);
		addEvent(mainImageRightLink, "click", nextImage, false);
		addEvent(mainImageCloseLink, "click", hideMainImageArea, false);
	}
	catch(err) {}
}

function previousImage()
{
	var image = document.getElementById("jstImage");
	
	if (mainImageIndex != 1)
	{
		image.src = "images/main"+(mainImageIndex*1-1)+".jpg";
		mainImageIndex--;
	}
	else 
	{
		image.src = "images/main"+(imageCount*1-1)+".jpg";
		mainImageIndex = (imageCount*1-1);
	}
	return false;
}
function nextImage()
{
	var image = document.getElementById("jstImage");

	if (mainImageIndex != (imageCount*1-1))
	{
		image.src = "images/main"+(mainImageIndex*1+1)+".jpg";
		mainImageIndex++;
	}
	else 
	{
		image.src = "images/main1.jpg";
		mainImageIndex = 1;
	}
	
	return false;
}

function getSourceElement(e)
{
	var srcElement;     // this function is passed the browser specific mouse event
	if (e.target) 
	{         
		srcElement = e.target;     
	} 
	else if (e.srcElement) 
	{
		srcElement = e.srcElement;
	}
	return srcElement;
}

function showMainImageArea(e)
{
	var imageSelected = getSourceElement(e).parentNode.id.substring(8);
	
	var imageArea = document.getElementById("jstFullImage");
	imageArea.style.display = "block";
	
	var image = document.getElementById("jstImage");
	image.src = "images/main"+imageSelected+".jpg";
	mainImageIndex = imageSelected;
	
	if (navigator.appName == "Microsoft Internet Explorer")
	{
		return false;
	}
		
	e.preventDefault();
	e.cancelBubble=true;
	e.returnValue=false;
    e.stopPropagation();
}
function hideMainImageArea(e)
{
	var imageArea = document.getElementById("jstFullImage");
	imageArea.style.display = "none";
	
	if (navigator.appName == "Microsoft Internet Explorer")
		return false;
		
	e.preventDefault();
	e.cancelBubble=true;
	e.returnValue=false;
    e.stopPropagation();
}

var req;
var imageCount = 1;

function loadXMLDoc(url) {
	try {
		req = false;
		
	    // branch for native XMLHttpRequest object
	    if(window.XMLHttpRequest) {
		try {
				req = new XMLHttpRequest();
		} catch(e) {
				req = false;
		}
		
	    // branch for IE/Windows ActiveX version
	    } else if(window.ActiveXObject) {
		try {
			req = new ActiveXObject("Msxml2.XMLHTTP");
		} catch(e) {
			try {
				req = new ActiveXObject("Microsoft.XMLHTTP");
			} catch(e) {
				req = false;
			}
			}
	    }
		if(req) {
			req.onreadystatechange = processReqChange;
			req.open("GET", url, true);
			req.send("");
		}
	} catch (e) {}	
}

function processReqChange() {
	try {
	    // only if req shows "loaded"
	    if (req.readyState == 4) {
		// only if "OK"
		if (req.status == 200) {
		    imageCount++;
		    loadXMLDoc("images/thumb"+imageCount+".jpg");
		} else if (req.status == 404) {
			addImages();
		} else {
		    alert("There was a problem retrieving image data:\n" +
			req.statusText);
		}
	    }
	} catch (e) {}	
}

function addImages()
{
	try {
		// we now know how many files are available so start populating the div

		for (var i=1; i<imageCount; i++)
		{
			thumbnailContainer.innerHTML += "<div class=\"imageContainer\"><a id=\"jstImage"+i+"\" href=\"images/main"+i+".jpg\"><img src=\"images/thumb"+i+".jpg\" /></a></div>";
		}

		for (var i=1; i<50; i++)
		{
			var imageLink = document.getElementById("jstImage"+i);

			if (imageLink)
			{
				addEvent(imageLink, "click", showMainImageArea, false);
			}
			else break;
		}

		/*  DOM TAGS AREN'T COMPLIANT!!!!
		for (var i=1; i<imageCount; i++)
		{
			var divContainer = document.createElement('div');
			divContainer.setAttribute("class", "imageContainer");

			var imageLink = document.createElement('a');
			imageLink.setAttribute("href","/main"+i+".jpg");

			var newImage = document.createElement('img');
			newImage.setAttribute("src","/thumb"+i+".jpg");

			imageLink.appendChild(newImage);
			divContainer.appendChild(imageLink);
			thumbnailContainer.appendChild(divContainer);
		}
		*/


		loadingContainer = document.getElementById("jstLoading");
		loadingContainer.style.display = "none";
	} catch (e) {}	
}