var thumbSet = 1;
var thumbSetOld = 0;
var paginatorShown = false;
var global_xmlID;

function list(photoID){

    
    	var url = "assets/photoGallery/photoGallery.php";

	var pars = "photoID=" + photoID + "&xmlID=" + global_xmlID;
				new Ajax(url, {
					method: 'get',
					postBody: pars,
					onComplete: handleResponse
				}).request();
				
				
}

function getThumbs(nextThumbSet){
    var urlConect = "http://thenationstriathlon.com/assets/photoGallery/pg-" + global_xmlID + ".xml";
	if(nextThumbSet == 0){
		nextThumbSet = thumbSet-1;
	}else if(nextThumbSet == 100){
		nextThumbSet = thumbSet+1;
	}

   thumbSet = nextThumbSet;
    
        	var url = "assets/photoGallery/pg-" + global_xmlID + ".xml";

	var pars = "";
				new Ajax(url, {
					method: 'get',
					postBody: pars,
					onComplete: printThumbs
				}).request();
				
				
}
 
function handleResponse(response){

	var responseOutput = document.getElementById("photoViewer");
	
	//var photogallery = response.xhr.responseXML.getElementsByTagName('photogallery');
	
	var photogallery = response;
	
	//var photogalleryArray = photogallery.split("<src>");
	
	//var photogalleryArray2 = photogalleryArray[1].split("</src>");
	

	var output = "";
	var title = '';
	//var src = photogalleryArray2[0];
	var src = photogallery;
/*	
	photogallery[0].getElementsByTagName('image')[0].getElementsByTagName('title')[0].firstChild.nodeValue;
	var src = photogallery[0].getElementsByTagName('image')[0].getElementsByTagName('src')[0].firstChild.nodeValue;
*/

	output = '<img src="http://thenationstriathlon.com/assets/images/photoGallery/' + global_xmlID + '/' + src + '" height="377" alt="' + title + '" />';
	
	responseOutput.innerHTML = output;
}

function printThumbs(response){

	var responseOutput = document.getElementById("photoThumbs");
	var thumbgallery = response;
	
	var thumbgalleryArray = thumbgallery.split("<image>");

	var output = "";
	var thumbLength = thumbgalleryArray.length;
	var thumbSets = parseInt(thumbLength/12)+1;
	

	var thumbRemain = thumbLength % 12;
	var thumbStart = (thumbSet * 12) - 12;
	var maxLnks;
	
	
		
	if(thumbRemain == 0){
		thumbSets--;
		thumbRemain = 12;
	}
	
	// ==================== print out the thumbnails
	if(thumbSet >= thumbSets){
		maxLnks = thumbRemain;
	}else{
		maxLnks = 13;
	}

	
	for(var i=1; i<maxLnks; i++){
	var num = parseInt(i+thumbStart);
	

	var thumbArray1 = thumbgalleryArray[num].split("<thumb>");
	
	var thumbArray  = thumbArray1[1].split("</thumb>");
		var src = thumbArray[0];
		var imgNum = num -1;
		output += '<a href="javascript:list(' + imgNum + ');" ';
		if(i == 6 || i == 12){
			output += 'style="margin-right:0px;" ';
		}
		output += '><img src="http://thenationstriathlon.com/assets/images/photoGallery/' + global_xmlID + '/thumbs/' + src + '" width="86" height="59" /></a>';
	}
	responseOutput.innerHTML = output;
	
	// ==================== print out the paginator one time
	if(paginatorShown == false){
		paginatorShown = true;
		var pageOutput = document.getElementById("paginator");
		var output = "";

		output += '<li><a id="lnk-prev" href="javascript:getThumbs(0);">prev</a></li>';	
		
		for(i=0; i<thumbSets; i++){
			var num = i+1;
			output += '<li><a id="page' + num + '"';
			output += ' href="javascript:getThumbs(' + num + ');">' + num + '</a></li>';
		}
		output += '<li><a id="lnk-next" href="javascript:getThumbs(100);">next</a></li>';
		pageOutput.innerHTML = output;
	}
	
	// ==================== highlight active page number
	var activeThumb = 'page' + thumbSet;
	document.getElementById(activeThumb).className = 'active';
	if(thumbSetOld >= 1 && thumbSetOld != thumbSet){
		var inactiveThumb = 'page' + thumbSetOld;
		document.getElementById(inactiveThumb).className = '';
	}
	thumbSetOld = thumbSet;
	
	// ==================== hide next or prev button if at first or last page
	
	document.getElementById('lnk-prev').style.display = 'block';
	document.getElementById('lnk-next').style.display = 'block';
	if(thumbSet == 1){
		document.getElementById('lnk-prev').style.display = 'none';
	}else if(thumbSet == thumbSets){
		document.getElementById('lnk-next').style.display = 'none';
	}	
	if(thumbSets == 1){
		document.getElementById('lnk-next').style.display = 'none';
	}	
}