addLoadListener(initPopups);
addLoadListener(initPaging);
var altMainImage, MainImage;

function initPopups(){
	
	if (document.getElementById) {
		
		//attach a click event to all of the thumbnails which will make the hyperlink appear as the large image
		if (document.getElementById("galleryThumbs")){
			
			//add the rollover to the main image
			//attachEventListener(document.getElementById("photo"), "mouseover", rollO, false);
			//attachEventListener(document.getElementById("photo"), "mouseout", rollO, false);
			
			//get the thumbail hyperlinks	
			Thumbnails = document.getElementById("galleryThumbs").getElementsByTagName("a");
			ThumbnailImages = document.getElementById("galleryThumbs").getElementsByTagName("img");
			
			//immediately set the large image as the first gallery image
			newImage = "url("+Thumbnails[0]+")";
			MainImage = Thumbnails[0];
			altImage = Thumbnails[0].getAttribute("althref");
			if ( altImage.length > 15 ) {
				altMainImage  = altImage;
			} else {
				altMainImage  = MainImage;
			}
			document.getElementById("photo").style.backgroundImage = newImage;
			
			//add the onclick listener to all the hyperlinks
			for (i=0;  i <= Thumbnails.length; i++){	
				attachEventListener(Thumbnails[i], "click", popUp, false);
				attachEventListener(Thumbnails[i], "mouseover", fadeGalImg, false);
				attachEventListener(Thumbnails[i], "mouseout", unFadeGalImg, false);
			}						
			
		}		
	}
	
}


function initPaging(){
	
	if (document.getElementById) {
		
		// attached paging click events if paging is required
		if (document.getElementById("galleryNavigation")) {
		
		PagingTargets = document.getElementById("galleryNavigation").getElementsByTagName("a");
		for (i=0;  i <= PagingTargets.length; i++){	
			attachEventListener(PagingTargets[i], "click", pageNow, false);
			}
		}
		
	}
	
}

function popUp(event){
	stopDefaultAction(event);
	callingElement = getCallingElement(event,"a");
	callingElementId = getCallingElement(event,"img").id;
	altImage = getCallingElement(event,"a").getAttribute("althref");
	
	// set the main image
	MainImage = callingElement;
	
	if ( altImage.length > 15 ) {
		altMainImage  = altImage;
	} else {
		altMainImage  = callingElement;
	}
	
	if( getEventType(event) == "mouseover" )	{
		newImage = 'url('+altMainImage+')';
	} else {
		newImage = 'url('+MainImage+')';
	}
	
	document.getElementById("photo").style.backgroundImage = newImage;	
}

function rollO(event){

	if( getEventType(event) == "mouseover" )	{
		newImage = 'url('+altMainImage+')';
	} else {
		newImage = 'url('+MainImage+')';
	}
	document.getElementById("photo").style.backgroundImage = newImage;	
}

function pageNow(event){
	stopDefaultAction(event);
	callingElement = getCallingElement(event,"a");
	var offset = (((callingElement.innerHTML*15)-15));
	document.getElementById("offset").value = offset;
	document.getElementById("frmPaging").submit();
}

function fadeGalImg(event) {
	
	var activatedImage = getCallingElement(event,"img").id;
	var images = document.getElementById("galleryThumbs").getElementsByTagName("img");

	for (i=0;  i <= images.length; i++){	
	
		if (images[i]) {
			if (images[i].id != activatedImage) {
				doFade(images[i].id);
			}
		}
	}
}

function unFadeGalImg(event) {
	
	var activatedImage = getCallingElement(event,"img").id;
	var images = document.getElementById("galleryThumbs").getElementsByTagName("img");

	for (i=0;  i <= images.length; i++){	
		
		if (images[i]) {
			if (images[i].id != activatedImage) {
				doUnFade(images[i].id);
			}
		}
		
	}
}