// Build gmap object
imageSwap = {
	// Stores id of map div
	container:'imageSwap',
	thumbnailClass:'thumbnails',
	largeImageID:'product-image',
	largeImagePath:'primary_large_img',
	
	// Instatiate object (checks for DOM support)
	init:function()
	{

		// Check to see if W3C DOM is available - if not terminate script
		// If required objects are available, hide js alert and show update form
		if(!document.getElementById || !document.createTextNode){return;}
		
		// Define mapcontainer
		var container = document.getElementById(imageSwap.container);
		// If the page contains the map container, dynamically remove the hde class and load the map
		if(container)
		{
			//alert('container exists');
			var _thunbnail = helper.getElementsByClass(imageSwap.thumbnailClass, container);
			for(var i=0; i<_thunbnail.length; i++)
			{
				helper.addEvent(_thunbnail[i],'click',imageSwap.swapImage,false);
			}
		}
	},
	swapImage:function(e) {
	
		var image = helper.getTarget(e);
		var largeImage = document.getElementById(imageSwap.largeImageID);
		var _slug =  image.getAttribute("src").split('/');
		var replacement_image = "/images/"+imageSwap.largeImagePath+"/"+_slug[3];
		largeImage.setAttribute("src", replacement_image);
		return;
	}
}
// addEvent is a method used to sort of stack functions up after the page has loaded.
// On this page this method is watching the window and waiting till its loaded.
// After which the gmap.init object is initialized
helper.addEvent(window, 'load', imageSwap.init, false);