/* functions to do a rollover of the main image */
addLoadListener(initMakeoverImageRollover);

function initMakeoverImageRollover() {
	
	if (document.getElementById("photo")) {
		
				//preload rollover image
				var preLoad = new Image;
				preLoad.src = altMainImage;
				
				//attach listeners for the rollover
				attachEventListener(document.getElementById("photo"), "mouseover", swapMakeoverImage, false);
				attachEventListener(document.getElementById("photo"), "mouseout", swapMakeoverImage, false);
			
			
	}
	
}

function swapMakeoverImage(event) {
	
	if ( altMainImage.length > 15 ) {
	
		imgElement = document.getElementById("photo");
		if( getEventType(event) == "mouseover" )	{
			imgElement.style.backgroundImage = 'url('+altMainImage+')';
		} else {
			imgElement.style.backgroundImage = 'url('+MainImage+')';
		}
	
	}
		
}

// gallery code

addLoadListener(initPopups);
addLoadListener(initPaging);

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")){
			
			//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]+")";
			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 ) {
		//preload the alt image if it exists
		preload = new Image;
		preload.src = altImage;
		altMainImage  = altImage;
	} else {
		altMainImage  = callingElement;
	}
	newImage = "url("+callingElement+")";
	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);
			}
		}
		
	}
}


// this variable tells the logo rollover not to happen in the makeover section
allowLogoRollover = false;

// add a new logo rollover just for the makeover section
addLoadListener(initMoLogoRollovers);

function initMoLogoRollovers() {
	var logo = document.getElementById("logo");
	img1 = new Image();
	img1.src = "/site/images/makeover/logo-portrait-place-over.gif";
	attachEventListener(logo, "mouseover", MoLogoRollover, false);
	attachEventListener(logo, "mouseout", MoLogoRollover, false);
}

function MoLogoRollover(event) {
		if( getEventType(event) == "mouseover" )	
			document.getElementById("logo").src = "/site/images/makeover/logo-portrait-place-over.gif";	
		if( getEventType(event) == "mouseout" )	
			document.getElementById("logo").src = "/site/images/makeover/logo-portrait-place.gif";	
}