popUpImage = {
	// NOTE: We have to change the CSS slightly because IE doesn't support position:fixed (becasue we now darken the background can lock the window and not allow scrolling
	// *********************** Image Popup properties ************************* //
	// Page section IDs
	boundaryId:'main-bg',
	// Used for the image popup
	hideClass:'hide',
	// Used for the image popup
	linkClassContainer:'link',
	// Link text
	closeLabel : 'Close window',
	openLabel : 'Open window',
	//global parameters
	closelink:null,
	// Container id for popup image (use an array if you need to check multiple containers
	popImageContainer: new Array('zone-images-thumbs', 'pilates-clothing-listing','stationery-table-top'),
	// ID of generated popup image container
	imagePopupID:'popUpImage',
	// File extensions of images. We need this so we can detemine what links are images and what ones arnt
	imageFiles:new Array('jpg','JPG','jpeg', 'JPEG', 'gif', 'tiff', 'png'),
	// Used for the image popup
	// NEW: Overlay div to apply fade to
	divOverlayID:'overlay',
	divOverlayClass:'overlay',
	// *********************** Image Popup properties ************************* //

  	init:function()
	{
		// Get image container
		//var container=document.getElementById(popUpImage.popImageContainer);
		var x;
		var container = new Array();
		for (x in popUpImage.popImageContainer)
		{
			container[x] = document.getElementById(popUpImage.popImageContainer[x]);
			//document.write(mycars[x] + "<br />");
		}
		/* position: absolute; style="position:absolute" */
		// Check to see if image container exists
		if(container)
		{
			// Don't apply transparent background if ie 6
			if(navigator.userAgent.toLowerCase().indexOf('msie 6') == -1) {
				// ++++ NEW: Add overlay div to page (allows us to create a faded background)
				overlay=document.createElement('div');
				overlay.id= popUpImage.divOverlayID;
				document.getElementById(popUpImage.boundaryId).appendChild(overlay);
				// ++++ NEW: Add overlay div to page (allows us to create a faded background)
			}
			// Create div element to store image
		    popUpImage.popunder=document.createElement('div');
		    // Assign id to new div
			popUpImage.popunder.id=popUpImage.imagePopupID;
			// Add hideclass to the new div (containing image)
			helper.cssjs('add',popUpImage.popunder,popUpImage.hideClass);
			// If ie6, apply an additional class to set postion:absolute (doesnt work with fixed)
			if(navigator.userAgent.toLowerCase().indexOf('msie 6') != -1)
				helper.cssjs('add',popUpImage.popunder,'ie6');
			// Add the new div as a child to the main page
			document.getElementById(popUpImage.boundaryId).appendChild(popUpImage.popunder);
			
			/****************** Build close image link ****************************/
			// NEW: Place link in div so we can align it right
			var closeLinkContainer=document.createElement('div');
			closeLinkContainer.setAttribute('class',popUpImage.linkClassContainer);
			// NEW: Place link in div so we can align it right
			// Create link element and assign to variable
// UPDATE: Removed because this was loading 2 'close' links
//			var closeLink=document.createElement('a');
//			// Use the setAttribute method to set the href attribute to '#'
//			closeLink.setAttribute('href','#');
//			// Set text of link
//			closeLink.innerHTML=popUpImage.closeLabel;
//			// Add an event to the link (closewindo event)
//			helper.addEvent(closeLink,'click',popUpImage.closeWin,false);
//			helper.fixSafari(closeLink);
//			closeLinkContainer.appendChild(closeLink);
//			// Apply the new link to the image div so the user can shut the window
//			popUpImage.popunder.appendChild(closeLinkContainer);
// UPDATE: Removed because this was loading 2 'close' links
			// Build links for each image by looping through each link from the 
			// image container
			var l;
			for (l in container)
			{
				if (container[l]!=null) {
					
					var links=container[l].getElementsByTagName('a');	
					// Loop through links and assign the click event with the openwin method
					for(var i=0;i<links.length;i++)
					{
						var parts = links[i].href.split('.');
						
						// Ensure the link is going through to an image
						if(popUpImage.imageFiles.inArray(parts[parts.length-1])) {

							helper.addEvent(links[i],'click',popUpImage.openImageWin,false);	 
						}
					}
				}
				//document.write(mycars[x] + "<br />");
			}
//			var links=container.getElementsByTagName('a');	
//			// Loop through links and assign the click event with the openwin method
//			for(var i=0;i<links.length;i++)
//			{
//				helper.addEvent(links[i],'click',popUpImage.openImageWin,false);
//			}
		}
	},

	// Function used by the popup window to close large image container
	// Note: When we use the addEvent function the event listener function (fp.closeWin)
	// has an object applied which can be used to obtain specific properties
	// e is used to obtain these parameters.
	// A very important one is 'target' (the element that has the eventhandler attatched to it - in this case 'closeLink')
	closeWin:function(e)
	{
		while (popUpImage.popunder.firstChild) 
		{
			popUpImage.popunder.removeChild(popUpImage.popunder.firstChild);
		}
		helper.cssjs('add',popUpImage.popunder,popUpImage.hideClass);
		// To eliminate 'event bubbling' (starts all events for parent elements of the current element?!?!)
		// use the cancelclickk function
		
		// ++++ NEW: Add overlay class to overlay div (faded background)
		overlay= document.getElementById(popUpImage.divOverlayID);
		helper.cssjs('remove',overlay,popUpImage.divOverlayClass);
		// ++++ NEW: Add overlay class to overlay div (faded background)
		helper.cancelClick(e);
	},
	
	// Function thats applied to links to open windows
	openImageWin:function(e)
	{
		var linkElement = helper.getTarget(e);
		// alert(linkElement.parentNode);
		// alert(fp.getTarget(e).href);
		// if there is no image in popup yet, create one.
		if(!popUpImage.popunder.getElementsByTagName('img')[0])
		{
			// NEW: Set overflow style to hidden so the user can't scroll when image is displayed
			//document.body.style.overflow  = "hidden";
			//document.body.scroll="no";
			// +++++++++++++++++++++++++++++++++++++++++++++++++ Close link	
			var closeLinkContainer=document.createElement('div');
			closeLinkContainer.setAttribute('class',popUpImage.linkClassContainer);
			
			var titleSpan=document.createElement('span');
			var textValue = document.createTextNode(linkElement.alt);
			titleSpan.appendChild(textValue);
			closeLinkContainer.appendChild(titleSpan);
			
			// Create link element and assign to variable
			var closeLink=document.createElement('a');
			// Use the setAttribute method to set the href attribute to '#'
			closeLink.setAttribute('href','#');
			// Set text of link
			closeLink.innerHTML=popUpImage.closeLabel;
			// Add an event to the link (closewindo event)
			helper.addEvent(closeLink,'click',popUpImage.closeWin,false);
			helper.fixSafari(closeLink);
			// Apply the new link to the image div so the user can shut the window
			closeLinkContainer.appendChild(closeLink);
			popUpImage.popunder.appendChild(closeLinkContainer);
			// +++++++++++++++++++++++++++++++++++++++++++++++++ Close link	
			// create image element
			var shot=document.createElement('img');
			// Get the link element for the small image using the fp.getTarget function 
			// (we use the link element to obtain the href value which is the source of the image)
			//var bigpic=fp.getTarget(e);
			//shot.setAttribute('src',bigpic.href);
			// set large image src attribute to the href value of the small image link
			shot.setAttribute('src',linkElement.parentNode);
			// Append the image element to the div element (popunderId)
			popUpImage.popunder.appendChild(shot);
			//setTimeout("popUpImage.popunder.appendChild()",1000, shot);
			// Apply close functionality to image
			helper.addEvent(shot,'click',popUpImage.closeWin,false);
			helper.fixSafari(shot);
			//popUpImage.pausecomp(1000);
			
			// Don't apply transparent background if ie 6
			if(navigator.userAgent.toLowerCase().indexOf('msie 6') == -1) {
				// ++++ NEW: Add overlay class to overlay div (faded background)
				overlay= document.getElementById(popUpImage.divOverlayID);
				// overlay.style.height = document.body.offsetHeight+'px';
				//alert(document.documentElement.clientHeight);
				helper.cssjs('add',overlay,popUpImage.divOverlayClass);
				helper.addEvent(overlay,'click',popUpImage.closeWin,false);
				// ++++ NEW: Add overlay class to overlay div (faded background)
			}
		}
		// Remove the fp.hideclss so we can show the large image
		helper.cssjs('remove',popUpImage.popunder,popUpImage.hideClass);
		
		// +++++++++++++++++++++++++++++++++++++++++++++++++ Next image	
/*		var closeLinkContainer=document.createElement('div');
		closeLinkContainer.setAttribute('class',popUpImage.linkClassContainer);
		
		var titleSpan=document.createElement('span');
		var textValue = document.createTextNode(linkElement.alt);
		titleSpan.appendChild(textValue);
		closeLinkContainer.appendChild(titleSpan);
		
		 Create link element and assign to variable
		var closeLink=document.createElement('a');
		 Use the setAttribute method to set the href attribute to '#'
		closeLink.setAttribute('href','#');
		 Set text of link
		closeLink.innerHTML="Next Image";
		 Add an event to the link (closewindo event)
		helper.addEvent(closeLink,'click',popUpImage.closeWin,false);
		helper.fixSafari(closeLink);
		 Apply the new link to the image div so the user can shut the window
		closeLinkContainer.appendChild(closeLink);
		popUpImage.popunder.appendChild(closeLinkContainer);
*/		// +++++++++++++++++++++++++++++++++++++++++++++++++ Next image	
		
		// Stop link from being followed and 'event bubbling' by using the cancelClick() method
		helper.cancelClick(e);
	}
/*	pausecomp:function(millis) 
	{
		var date = new Date();
		var curDate = null;
		
		do { curDate = new Date(); } 
			while(curDate-date < millis);
	} */
	// ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ Popup image
}
// Initialise popup image function (for viewing large image popups)
helper.addEvent(window, 'load', popUpImage.init, false);