/**************************************/
/***** Additional Images w/ Zoom ******/
/**************************************/

function AdditionalImages(_id, _uniqueid, _display, _settings, _defaults, _popup){

	// set on instantiation
	this.Id = _id;
	this.UniqueId = _uniqueid;

	// display configuration
	this.ThumbBorderWidth = _display.ThumbBorderWidth;
	this.ThumbContainerWidth = _display.ThumbContainerWidth;
	this.RibbonSize = _display.RibbonSize;
	this.PreviousButtonImageSrc = _display.PreviousButtonImageSrc;
	this.PreviousButtonImageWidth = _display.PreviousButtonImageWidth;
	this.PreviousButtonDisabledImageSrc = _display.PreviousButtonDisabledImageSrc;
	this.NextButtonImageSrc = _display.NextButtonImageSrc;
	this.NextButtonImageWidth = _display.NextButtonImageWidth;
	this.NextButtonDisabledImageSrc = _display.NextButtonDisabledImageSrc;
	this.ZoomBoxImageSrc = _display.ZoomBoxImageSrc;
	this.ZoomBoxBorder = _display.ZoomBoxBorder;
	
	// settings	
	this.MainImageCode = _settings.MainImageCode;
	this.ThumbImageCode = _settings.ThumbImageCode;
	this.ZoomImageCode = _settings.ZoomImageCode;
	this.PopupImageCode = _settings.PopupImageCode;
	this.AdditionalMainImageCode = _settings.AdditionalMainImageCode;
	this.AdditionalThumbImageCode = _settings.AdditionalThumbImageCode;
	this.AdditionalZoomImageCode = _settings.AdditionalZoomImageCode;
	this.AdditionalPopupImageCode = _settings.AdditionalPopupImageCode;
	this.ZoomSlideDistance = _settings.ZoomSlideDistance;
	this.StartHidingZoomIn = Math.round(_settings.StartHidingZoomIn*1000);
	this.ShowCaptions = _settings.ShowCaptions;
	this.LoadRelations = _settings.LoadRelations;
	this.LoadFirstImage = _settings.LoadFirstImage;

	// internal variables
	this.DisableZoom = true;
	this.Images = [];
	this.TotalImages = 0;
	this.ActualImages = [];
	this.TotalActualImages = 0;
	this.CurrentImage = 0;
	this.MaxLeft = 0;
	this.CurrentPos = 0;
	this.PreviousEnd = true;
	this.NextEnd = false;
	this.DefaultCodes = [];
	this.Defaults = [];
	this.ScrollingRibbon = false;
	this.Attempts = 0;
	this.MaxAttempts = 5;
	this.Loaded = false;
	this.Loading = false;
	
	// zoom internal
	this.Appeared = false;
	this.DoneWithZoomer = true;
	this.ZoomHider;
	this.SliderOpened = false;
	this.Sliding = false;
	this.ZoomSetupComplete = false;
	
	// special dimensions / zoom scale
	this.MainImageDefaults = {Width: 0, Height: 0};
	this.ZoomImageDefaults = {Width: 0, Height: 0};
	this.ZoomBoxDefaults = {Width: 0, Height: 0};
	this.ZoomBoxScale = {X: 0, Y: 0};

	// image size defaults
	this.setImageDefaults(_defaults);

	// zoomed image
	this.ZoomedImage = {
		MainImage: {Width: 0, Height: 0}, 
		ZoomImage: {Width: 0, Height: 0},
		ParentCoords: {left: 0, top: 0}
	}
	
	// popup variables
	this.PopupWidth = _popup.PopupWidth;
	this.PopupHeight = _popup.PopupHeight;
	this.PopupTop = _popup.PopupTop;
	this.PopupLeft = _popup.PopupLeft;
	this.PopupCenterVertically = _popup.PopupCenterVertically;
	this.PopupCenterHorizontally = _popup.PopupCenterHorizontally;
	this.PopupFullScreen = _popup.PopupFullScreen;
	
}

function AdditionalImage(){
	this.Alt = "";
	this.VariantCodes = [];
	this.Variants = [];
	
}

AdditionalImages.prototype.setImageDefaults = function(_defaults){
	// setup defaults - last element of defaults array is empty, so skipped
	for(var i=0; i<_defaults.length-1; i++){
		this.DefaultCodes.push(_defaults[i].Code);
		this.Defaults.push({Width: _defaults[i].Width, Height: _defaults[i].Height});
	}
	
	// set special default dimensions
	
	// set main image dimensions
	var mainImageCode = this.getMainImageCode(0);
	var mainDefaultImage = this.getImageDefault(mainImageCode);
	this.MainImageDefaults.Width = mainDefaultImage.Width;
	this.MainImageDefaults.Height = mainDefaultImage.Height;
	this.MainImageDefaults.HalfWidth = Math.round(mainDefaultImage.Width/2);
	this.MainImageDefaults.HalfHeight = Math.round(mainDefaultImage.Height/2);
	
	// set zoom image dimensions
	var zoomImageCode = this.getZoomImageCode(0);
	var zoomDefaultImage = this.getImageDefault(zoomImageCode);
	this.ZoomImageDefaults.Width = zoomDefaultImage.Width;
	this.ZoomImageDefaults.Height = zoomDefaultImage.Height;
	
	// set zoom box dimensions
	this.ZoomBoxDefaults.Width = Math.round((mainDefaultImage.Width/zoomDefaultImage.Width)*mainDefaultImage.Width);
	this.ZoomBoxDefaults.Height = Math.round((mainDefaultImage.Height/zoomDefaultImage.Height)*mainDefaultImage.Height);
	this.ZoomBoxDefaults.HalfWidth = Math.round(this.ZoomBoxDefaults.Width/2);
	this.ZoomBoxDefaults.HalfHeight = Math.round(this.ZoomBoxDefaults.Height/2);
	
	// get zoom box scale
	this.ZoomBoxScale.X = Math.round(zoomDefaultImage.Width/mainDefaultImage.Width);
	this.ZoomBoxScale.Y = Math.round(zoomDefaultImage.Height/mainDefaultImage.Height);
	
}

AdditionalImages.prototype.getImageDefault = function(_code){
	var imgCodeIndex = this.DefaultCodes.indexOf(_code);
	return this.Defaults[imgCodeIndex];
}

AdditionalImages.prototype.addImage = function(_alt, _variants){
	var anImage = new AdditionalImage;
	anImage.Alt = _alt;
	// setup variants
	for(var i=0; i<_variants.length-1; i++){
		anImage.VariantCodes.push(_variants[i].Code);
		anImage.Variants.push({Src: _variants[i].Src, Width: _variants[i].Width, Height: _variants[i].Height});
	}
	this.Images[this.TotalImages] = anImage;
	this.TotalImages += 1;
}

AdditionalImages.prototype.getMainImage = function(_index){
	var imgCodeIndex = this.Images[_index].VariantCodes.indexOf(this.getMainImageCode(_index));
	return this.Images[_index].Variants[imgCodeIndex];
}

AdditionalImages.prototype.getActualMainImage = function(_index){
	var imgCodeIndex = this.ActualImages[_index].VariantCodes.indexOf(this.getMainImageCode(_index));
	return this.ActualImages[_index].Variants[imgCodeIndex];
}

AdditionalImages.prototype.getMainImageCode = function(_index){
	if(_index > 0 && this.LoadRelations){
		return this.AdditionalMainImageCode;
	}else{
		return this.MainImageCode;
	}
}

AdditionalImages.prototype.getThumbImage = function(_index){
	var imgCodeIndex = this.Images[_index].VariantCodes.indexOf(this.getThumbImageCode(_index));
	return this.Images[_index].Variants[imgCodeIndex];
}

AdditionalImages.prototype.getActualThumbImage = function(_index){
	var imgCodeIndex = this.ActualImages[_index].VariantCodes.indexOf(this.getThumbImageCode(_index));
	return this.ActualImages[_index].Variants[imgCodeIndex];
}

AdditionalImages.prototype.getThumbImageCode = function(_index){
	if(_index > 0 && this.LoadRelations){
		return this.AdditionalThumbImageCode;
	}else{
		return this.ThumbImageCode;
	}
}

AdditionalImages.prototype.getZoomImage = function(_index){
	var imgCodeIndex = this.Images[_index].VariantCodes.indexOf(this.getZoomImageCode(_index));
	return this.Images[_index].Variants[imgCodeIndex];
}

AdditionalImages.prototype.getActualZoomImage = function(_index){
	var imgCodeIndex = this.ActualImages[_index].VariantCodes.indexOf(this.getZoomImageCode(_index));
	return this.ActualImages[_index].Variants[imgCodeIndex];
}

AdditionalImages.prototype.getZoomImageCode = function(_index){
	if(_index > 0 && this.LoadRelations){
		return this.AdditionalZoomImageCode;
	}else{
		return this.ZoomImageCode;
	}
}

AdditionalImages.prototype.getPopupImage = function(_index){
	var imgCodeIndex = this.Images[_index].VariantCodes.indexOf(this.getPopupImageCode(_index));
	return this.Images[_index].Variants[imgCodeIndex];
}

AdditionalImages.prototype.getActualPopupImage = function(_index){
	var imgCodeIndex = this.ActualImages[_index].VariantCodes.indexOf(this.getPopupImageCode(_index));
	return this.ActualImages[_index].Variants[imgCodeIndex];
}

AdditionalImages.prototype.getPopupImageCode = function(_index){
	if(_index > 0 && this.LoadRelations){
		return this.AdditionalPopupImageCode;
	}else{
		return this.PopupImageCode;
	}
}

AdditionalImages.prototype.loadImages = function(){
		
			//alert(1);

	if(!this.Loading && !this.Loaded){
		this.Loading = true;

		this.Attempts += 1;
		
			//alert(2);
			//alert(this.Id);

		// make sure the container element is there
		if($('ImageRibbon' + this.Id)){
		
			//alert(3);
		
			// setup some defaults
			this.CurrentImage = 0;
			this.CurrentPos = 0;
			this.PreviousEnd = true;
			this.NextEnd = false;

			/*****************
			/** BUILDS THE FOLLOWING STRUCTURE

				<table cellpadding="0" cellspacing="0" border="0" height="#">
					<tbody>
						<tr>
							<td><span class="RibbonImage RibbonImage#"><a href="#" onclick="return AdditionalImages.loadThisImage(0, #);"><img src="/images/ribbon_image_1.jpg" alt="Ribbon Image 1" border="0" /></a></span></td>
							<td><span class="RibbonImage RibbonImage#"><a href="#" onclick="return AdditionalImages.loadThisImage(1, #);"><img src="/images/ribbon_image_2.jpg" alt="Ribbon Image 2" border="0" /></a></span></td>
							<td><span class="RibbonImage RibbonImage#"><a href="#" onclick="return AdditionalImages.loadThisImage(2, #);"><img src="/images/ribbon_image_3.jpg" alt="Ribbon Image 3" border="0" /></a></span></td>
							<td><span class="RibbonImage RibbonImage#"><a href="#" onclick="return AdditionalImages.loadThisImage(3, #);"><img src="/images/ribbon_image_4.jpg" alt="Ribbon Image 4" border="0" /></a></span></td>
							<td><span class="RibbonImage RibbonImage#"><a href="#" onclick="return AdditionalImages.loadThisImage(4, #);"><img src="/images/ribbon_image_5.jpg" alt="Ribbon Image 5" border="0" /></a></span></td>
							<td><span class="RibbonImage RibbonImage#"><a href="#" onclick="return AdditionalImages.loadThisImage(5, #);"><img src="/images/ribbon_image_6.jpg" alt="Ribbon Image 6" border="0" /></a></span></td>
							<td><span class="RibbonImage RibbonImage#"><a href="#" onclick="return AdditionalImages.loadThisImage(6, #);"><img src="/images/ribbon_image_7.jpg" alt="Ribbon Image 7" border="0" /></a></span></td>
							<td><span class="RibbonImage RibbonImage#"><a href="#" onclick="return AdditionalImages.loadThisImage(7, #);"><img src="/images/ribbon_image_8.jpg" alt="Ribbon Image 8" border="0" /></a></span></td>
						</tr>
					</tbody>
				</table>
				
			********************/

			var table = Builder.node('table', {
				cellpadding: "0", 
				cellspacing: "0", 
				border: "0"
			});
			table = $(table);

			var tbody = Builder.node('tbody');
			tbody = $(tbody);
			table.appendChild(tbody);
			
			var tr = Builder.node('tr');
			tr = $(tr);
			tbody.appendChild(tr);
			
			for(i=0; i<this.Images.length;i++){
				var mainImage = this.getMainImage(i);
				var thumbImage = this.getThumbImage(i);
				if(mainImage != "" && thumbImage != ""){
				
					this.ActualImages.push(this.Images[i]);
					this.TotalActualImages += 1;
					
					var td = Builder.node('td', {
						width: this.ThumbContainerWidth,
						align: "center"
					});
					td = $(td);
					tr.appendChild(td);
					
					var div = Builder.node('div', {
						className: "RibbonImage RibbonImage" + this.Id
					});
					div = $(div);
					td.appendChild(div);
					
					var a = Builder.node('a', {
						href: "#", 
						onclick: "return AdditionalImages" + this.UniqueId + ".loadThisImage(" + i + ");" 
					});
					a = $(a);
					div.appendChild(a);
					
					var altText = this.ActualImages[this.ActualImages.length-1].Alt
					
					if(thumbImage.Height > 0){
						var img = Builder.node('img', {
							src: thumbImage.Src, 
							alt: altText,
							width: thumbImage.Width,
							height: thumbImage.Height, 
							border: "0"
						});
					}else{
						var img = Builder.node('img', {
							src: thumbImage.Src, 
							alt: altText,
							width: thumbImage.Width, 
							border: "0"
						});
					}
					img = $(img);
					a.appendChild(img);
					
					if(this.ShowCaptions){
					
						var innerdiv = Builder.node('div', {
							className: "RibbonCaption"
						});
						innerdiv = $(innerdiv);
						innerdiv.update(altText);
						a.appendChild(innerdiv);
					
					}
					
				}
				
			}

			if(this.ActualImages.length > 0){
			
				this.MaxLeft = (((this.ActualImages.length-this.RibbonSize)*this.ThumbContainerWidth)*-1);
			
				$(table).setStyle({
					width: (this.ActualImages.length*this.ThumbContainerWidth) + 'px', 
					// this assumes that the default sizes for the thumbs are the same, so use the 0 index image dimension for the thumb height
					// TODO: could detect the highest instead?
					height: (this.getImageDefault(this.getThumbImageCode(0)).Height+(this.ThumbBorderWidth*2)) + 'px'
				});
			
				$('ImageRibbon' + this.Id).insert(table);
			
				//alert($('ImageRibbon' + this.Id).innerHTML);

				this.loadPrevImage();
				this.loadNextImage();
				this.loadBaseImage();
			
			}
			
		}else if(this.Images.length == 1){
		
			this.ActualImages.push(this.Images[0]);
			this.loadBaseImage();
			
		}
		
		this.Loading = false;
		
	}
}

AdditionalImages.prototype.reloadImages = function(){
	if(!this.Loading){
		this.Loaded = false;
		this.loadImages();
	}
}

AdditionalImages.prototype.loadBaseImage = function(){

	var imgMAINIMAGE = $("ProductImage" + this.Id);
	var mainImage = this.getActualMainImage(0);
	if(imgMAINIMAGE && mainImage != ""){
	
		if(this.LoadFirstImage){
			
			// loads this images zoom image too
			this.loadThisImage(0);
		
		}else{
		
			// set the default zoom (no zoom)
			this.DisableZoom = true;
			
			// check for zoom region and zoom image
			var imgZOOMIMAGE = $("ZoomRegion" + this.Id);
			var zoomImage = this.getActualZoomImage(0);
			if(imgZOOMIMAGE && zoomImage != "" && zoomImage.Src != ""){
				
				this.showHideLinks("show");
				
				this.setupZoomImage(0);
				
				this.DisableZoom = false;
				
			}else{
				
				this.showHideLinks("hide");
				
				// just reposition image
				this.repositionImage(mainImage);
		
			}
		
		}
		
		this.Loaded = true;
	}
}

AdditionalImages.prototype.showHideLinks = function(_what){
	if(_what == "show"){
		if($('ClickToZoom' + this.Id)){
			$('ClickToZoom' + this.Id).removeClassName('DeactivateClickToZoomMsg');
		}
		if($('ViewLarger' + this.Id)){
			$('ViewLarger' + this.Id).removeClassName('DeactivateViewLargerLink');
			$('ViewLarger' + this.Id).observe('click', popupZoomImage);
		}
	}else{
		if($('ClickToZoom' + this.Id)){
			$('ClickToZoom' + this.Id).addClassName('DeactivateClickToZoomMsg');
		}
		if($('ViewLarger' + this.Id)){
			$('ViewLarger' + this.Id).addClassName('DeactivateViewLargerLink');
			$('ViewLarger' + this.Id).observe('click', doZoomNothing);
		}
	}
}

AdditionalImages.prototype.setupZoomControls = function(){
	if(!this.ZoomSetupComplete){
		var zoombox = Builder.node('div', {
			id: "ZoomBox" + this.Id, 
			style: "display:none;"
		});
		zoombox = $(zoombox);
		$('ZoomProductImage' + this.Id).appendChild(zoombox);
		
		var zoomboximg = Builder.node('img', {
			src: this.ZoomBoxImageSrc, 
			alt: "", 
			border: "0", 
			className: "png",
			width: 100, 
			height: 100
		});
		zoomboximg = $(zoomboximg);
		zoombox.appendChild(zoomboximg);
		
		var iframe = Builder.node('iframe', {
			id: "ZoomRegionBackUp" + this.Id, 
			"frameborder": "0", 
			"marginheight": "0", 
			"marginwidth": "0", 
			"scrolling": "no", 
			src: "about:blank", 
			"hspace": "0", 
			"vspace": "0" 
		});
		iframe = $(iframe);
		$('ZoomImage' + this.Id).appendChild(iframe);

		$('ProductImage' + this.Id).observe('mouseover', getMousePosition);
		$('ProductImage' + this.Id).observe('mousemove', getMousePosition);
		$('ProductImage' + this.Id).observe('click', showZoomImage);
		$('ZoomBox' + this.Id).observe('mouseover', getMousePosition);
		$('ZoomBox' + this.Id).observe('mousemove', getMousePosition);
		$('ZoomBox' + this.Id).observe('mouseout', startHidingZoomer);
		$('ZoomBox' + this.Id).observe('click', showZoomImage);
		this.ZoomSetupComplete = true;
	}
}

AdditionalImages.prototype.loadNextImage = function(){
	var imgNEXTIMG = $("NEXTIMG" + this.Id);
	if(imgNEXTIMG){
		imgNEXTIMG.width = this.NextButtonImageWidth;
		if(this.ActualImages.length <= this.RibbonSize || this.NextEnd == true){
			imgNEXTIMG.src = this.NextButtonDisabledImageSrc;
			imgNEXTIMG.parentNode.className = "Ribbon_NoLink Ribbon_NoLink" + this.Id;
			imgNEXTIMG.parentNode.blur();
		}else{
			imgNEXTIMG.src = this.NextButtonImageSrc;
			imgNEXTIMG.parentNode.className = "";
		}
	}
}

AdditionalImages.prototype.loadPrevImage = function(){
	var imgPREVIMG = $("PREVIMG" + this.Id);
	if(imgPREVIMG){
		imgPREVIMG.width = this.PreviousButtonImageWidth;
		if(this.PreviousEnd){
			imgPREVIMG.src = this.PreviousButtonDisabledImageSrc;
			imgPREVIMG.parentNode.className = "Ribbon_NoLink Ribbon_NoLink" + this.Id;
			imgPREVIMG.parentNode.blur();
		}else{
			imgPREVIMG.src = this.PreviousButtonImageSrc;
			imgPREVIMG.parentNode.className = "";
		}
	}
}

AdditionalImages.prototype.loadThisImage = function(which){
	var imgMAINIMAGE = $("ProductImage" + this.Id);
	if(imgMAINIMAGE){
		if(which>=0 && which<=this.ActualImages.length-1){
			
			var whichImage = this.getActualMainImage(which);
			
			if(whichImage.Height > 0){
				var img = Builder.node('img', {
					src: whichImage.Src, 
					alt: this.ActualImages[which].Alt, 
					width: whichImage.Width, 
					height: whichImage.Height, 
					border: "0"
				});
			}else{
				var img = Builder.node('img', {
					src: whichImage.Src, 
					alt: this.ActualImages[which].Alt, 
					width: whichImage.Width, 
					border: "0"
				});
			}
			img = $(img);
			imgMAINIMAGE.update('');
			imgMAINIMAGE.appendChild(img);
			
			this.CurrentImage = which;
			
			var imgZOOMIMAGE = $("ZoomRegion" + this.Id);
			if(imgZOOMIMAGE){
			
				var zoomImage = this.getActualZoomImage(which);
			
				if(zoomImage == "" || zoomImage.Src == ""){
				
					this.showHideLinks("hide");
			
					// just reposition image
					this.repositionImage(whichImage);
				
					var img = Builder.node('img', {
						src: "/SiteCM3/i/shim.gif", 
						alt: "", 
						border: "0"
					});
					img = $(img);
					imgZOOMIMAGE.update('');
					imgZOOMIMAGE.appendChild(img);
					
					this.DisableZoom = true;
					
				}else{
				
					this.showHideLinks("show");
					
					this.setupZoomImage(which);
					
					if(zoomImage.Height > 0){
						var img = Builder.node('img', {
							src: zoomImage.Src, 
							alt: this.ActualImages[which].Alt, 
							width: zoomImage.Width, 
							height: zoomImage.Height, 
							border: "0"
						});
					}else{
						var img = Builder.node('img', {
							src: zoomImage.Src, 
							alt: this.ActualImages[which].Alt, 
							width: zoomImage.Width, 
							border: "0"
						});
					}
					img = $(img);
					imgZOOMIMAGE.update('');
					imgZOOMIMAGE.appendChild(img);
					
					this.DisableZoom = false;
					
				}
			}else{
				
				this.showHideLinks("hide");
				
				// just reposition image
				this.repositionImage(whichImage);
				
			}
		}
	}
	return false;
}

AdditionalImages.prototype.showNext = function(){
	if(!this.ScrollingRibbon){
	
		this.ScrollingRibbon = true;
		
		var offsets = $('ImageRibbon' + this.Id).positionedOffset();
		if(this.MaxLeft < offsets.left){
			this.CurrentPos -= this.ThumbContainerWidth;
			new Effect.Move('ImageRibbon' + this.Id, { x: (this.ThumbContainerWidth*-1), y: 0, mode: 'relative', afterFinish: this.showNextEnd() });
			
		}else{
			this.NextEnd = true;
			this.loadNextImage();
			this.ScrollingRibbon = false;
		}
	
	}
	return false;
}

AdditionalImages.prototype.showNextEnd = function(){
	this.PreviousEnd = false;
	this.loadPrevImage();
	if(this.CurrentPos == this.MaxLeft){
		this.NextEnd = true;
		this.loadNextImage();
	}
	this.ScrollingRibbon = false;
}

AdditionalImages.prototype.showPrevious = function(){
	if(!this.ScrollingRibbon){
	
		this.ScrollingRibbon = true;
		
		var offsets = $('ImageRibbon' + this.Id).positionedOffset();
		if(offsets.left<0){
			this.CurrentPos += this.ThumbContainerWidth;
			new Effect.Move('ImageRibbon' + this.Id, { x: this.ThumbContainerWidth, y: 0, mode: 'relative', afterFinish: this.showPreviousEnd() });
		}else{
			this.PreviousEnd = true;
			this.loadPrevImage();
			this.ScrollingRibbon = false;
		}
	
	}
	return false;
}

AdditionalImages.prototype.showPreviousEnd = function(){
	this.NextEnd = false;
	this.loadNextImage();
	if(this.CurrentPos == 0){
		this.PreviousEnd = true;
		this.loadPrevImage();
	}
	this.ScrollingRibbon = false;
}

var CURRENTLYZOOMED = null;

AdditionalImages.prototype.setupZoomImage = function(_index){
	
	// set controls
	this.setupZoomControls();
	
	// get actual dimensions
	var mainImage = this.getActualMainImage(_index);
	
	// reposition main image
	this.repositionImage(mainImage);
	
	this.ZoomedImage.MainImage.Width = mainImage.Width;
	this.ZoomedImage.MainImage.Height = mainImage.Height;
	var zoomImage = this.getActualZoomImage(_index);
	this.ZoomedImage.ZoomImage.Width = zoomImage.Width;
	this.ZoomedImage.ZoomImage.Height = zoomImage.Height;
	$("ZoomImage" + this.Id).setStyle({
		width: this.MainImageDefaults.Width + "px", 
		height: this.MainImageDefaults.Height + "px"
	});
	$("ZoomRegion" + this.Id).setStyle({
		width: this.MainImageDefaults.Width + "px", 
		height: this.MainImageDefaults.Height + "px"
	});
	$("ZoomBox" + this.Id).setStyle({
		width: this.ZoomBoxDefaults.Width + "px", 
		height: this.ZoomBoxDefaults.Height + "px"
	});
	
	CURRENTLYZOOMED = this;
	
}

AdditionalImages.prototype.repositionImage = function(_main){
	// get adjusted positioning
	var newTop = Math.round((this.MainImageDefaults.Height-_main.Height)/2);
	var newLeft = Math.round((this.MainImageDefaults.Width-_main.Width)/2);
	// set dimensions on elements
	$("ZoomProductImage" + this.Id).setStyle({
		width: _main.Width + "px", 
		height: _main.Height + "px", 
		top: newTop + "px", 
		left: newLeft + "px"
	});
}

/**************************************/
/************ Zoom Events *************/
/**************************************/

function getMousePosition(event){

	if(CURRENTLYZOOMED && CURRENTLYZOOMED.Id > 0 && !CURRENTLYZOOMED.DisableZoom){
		
		CURRENTLYZOOMED.DoneWithZoomer = false;
		window.clearTimeout(CURRENTLYZOOMED.ZoomHider);
		
		var mouseX = Event.pointerX(event);
		var mouseY = Event.pointerY(event);
		
		var parentPosTopLeft = $('ProductImage' + CURRENTLYZOOMED.Id).cumulativeOffset();
		var parentPos = {left: parentPosTopLeft.left, top: parentPosTopLeft.top};
		
		var newPos = {left: (mouseX-(parentPos.left)), top: (mouseY-(parentPos.top))}
		var newZoomPos = {left: ((newPos.left)*CURRENTLYZOOMED.ZoomBoxScale.X), top: ((newPos.top)*CURRENTLYZOOMED.ZoomBoxScale.Y)};
		
		//make sure it stays in box
		
		// left side
		if((newPos.left-CURRENTLYZOOMED.ZoomBoxDefaults.HalfWidth)<0){
			newPos.left = CURRENTLYZOOMED.ZoomBoxDefaults.HalfWidth;
		}
		// right side
		else if((newPos.left+CURRENTLYZOOMED.ZoomBoxDefaults.HalfWidth)>CURRENTLYZOOMED.ZoomedImage.MainImage.Width){
			newPos.left = (CURRENTLYZOOMED.ZoomedImage.MainImage.Width-CURRENTLYZOOMED.ZoomBoxDefaults.HalfWidth);
		}
		
		// top side
		if((newPos.top-CURRENTLYZOOMED.ZoomBoxDefaults.HalfHeight)<0){
			newPos.top = CURRENTLYZOOMED.ZoomBoxDefaults.HalfHeight;
		}
		// bottom side
		else if((newPos.top+CURRENTLYZOOMED.ZoomBoxDefaults.HalfHeight)>CURRENTLYZOOMED.ZoomedImage.MainImage.Height){
			newPos.top = (CURRENTLYZOOMED.ZoomedImage.MainImage.Height-CURRENTLYZOOMED.ZoomBoxDefaults.HalfHeight);
		}
		
		// left side (zoom)
		if((newZoomPos.left-CURRENTLYZOOMED.MainImageDefaults.HalfWidth)<0){
			newZoomPos.left = CURRENTLYZOOMED.MainImageDefaults.HalfWidth;
		}
		// right side (zoom)
		else if((newZoomPos.left+CURRENTLYZOOMED.MainImageDefaults.HalfWidth)>CURRENTLYZOOMED.ZoomedImage.ZoomImage.Width){
			newZoomPos.left = (CURRENTLYZOOMED.ZoomedImage.ZoomImage.Width-CURRENTLYZOOMED.MainImageDefaults.HalfWidth);
		}
		
		// top side (zoom)
		if((newZoomPos.top-CURRENTLYZOOMED.MainImageDefaults.HalfHeight)<0){
			newZoomPos.top = CURRENTLYZOOMED.MainImageDefaults.HalfHeight;
		}
		// bottom side (zoom)
		else if((newZoomPos.top+CURRENTLYZOOMED.MainImageDefaults.HalfHeight)>CURRENTLYZOOMED.ZoomedImage.ZoomImage.Height){
			newZoomPos.top = (CURRENTLYZOOMED.ZoomedImage.ZoomImage.Height-CURRENTLYZOOMED.MainImageDefaults.HalfHeight);
		}
		
		$('ZoomBox' + CURRENTLYZOOMED.Id).setStyle({
			'left': (newPos.left-CURRENTLYZOOMED.ZoomBoxDefaults.HalfWidth) + 'px', 
			'top': (newPos.top-CURRENTLYZOOMED.ZoomBoxDefaults.HalfHeight) + 'px'
		});
		
		$('ZoomRegion' + CURRENTLYZOOMED.Id).setStyle({
			'left': ((newZoomPos.left-CURRENTLYZOOMED.MainImageDefaults.HalfWidth)*-1) + 'px', 
			'top': ((newZoomPos.top-CURRENTLYZOOMED.MainImageDefaults.HalfHeight)*-1) + 'px'
		});
		
		if(!CURRENTLYZOOMED.Appeared){
			CURRENTLYZOOMED.Appeared = true;
			$('ZoomBox' + CURRENTLYZOOMED.Id).show();
		}
	
	}
	
}

function showZoomImage(event){
	if(CURRENTLYZOOMED && !CURRENTLYZOOMED.Sliding){
		CURRENTLYZOOMED.Sliding = true;
		if(!CURRENTLYZOOMED.SliderOpened){
			new Effect.Move('ZoomImage_Wrapper' + CURRENTLYZOOMED.Id, { x: CURRENTLYZOOMED.ZoomSlideDistance, y: 0, mode: 'relative' });
			new Effect.Appear('ZoomImage' + CURRENTLYZOOMED.Id, { duration: 1, queue: 'end', afterFinish: function(){CURRENTLYZOOMED.Sliding = false;} });
			CURRENTLYZOOMED.SliderOpened = true;
		}else{
			new Effect.Fade('ZoomImage' + CURRENTLYZOOMED.Id, { duration: 1 });
			new Effect.Move('ZoomImage_Wrapper' + CURRENTLYZOOMED.Id, { x: (CURRENTLYZOOMED.ZoomSlideDistance*-1), y: 0, mode: 'relative', queue: 'end', afterFinish: function(){CURRENTLYZOOMED.Sliding = false;} });
			CURRENTLYZOOMED.SliderOpened = false;
		}
	}
}

function startHidingZoomer(event){
	if(CURRENTLYZOOMED && CURRENTLYZOOMED.Id > 0 && !CURRENTLYZOOMED.DisableZoom){
		CURRENTLYZOOMED.DoneWithZoomer = true;
		CURRENTLYZOOMED.ZoomHider = window.setTimeout("hideZoomer();", CURRENTLYZOOMED.StartHidingZoomIn);
	}
}

function hideZoomer(event){
	if(CURRENTLYZOOMED && CURRENTLYZOOMED.Id > 0 && !CURRENTLYZOOMED.DisableZoom){
		if(CURRENTLYZOOMED.DoneWithZoomer){
			CURRENTLYZOOMED.Appeared = false;
			CURRENTLYZOOMED.DoneWithZoomer = true;
			$('ZoomBox' + CURRENTLYZOOMED.Id).hide();
			if(CURRENTLYZOOMED.SliderOpened){
				showZoomImage(event);
			}
		}
	}
}

function popupZoomImage(event){
	if(CURRENTLYZOOMED){
	
		var width = CURRENTLYZOOMED.PopupWidth;
		var height = CURRENTLYZOOMED.PopupHeight;
		var top = CURRENTLYZOOMED.PopupTop;
		var left = CURRENTLYZOOMED.PopupLeft;

		// update top to center vertically if necessary
		if(CURRENTLYZOOMED.PopupCenterVertically){
			top = (window.screen.height/2) - ((height/2) + 58); // 58 = status bar(25px) and title bar(25px) and browser window borders(4px)
		}

		
		// update left to center horizontally if necessary
		if(CURRENTLYZOOMED.PopupCenterHorizontally){
			left = (window.screen.width/2) - ((width/2) + 8); // 8 = 4px browser window borders
		}
		
		// reset top, left and calculate new width, height for full screen
		if(CURRENTLYZOOMED.PopupFullScreen){
			top = 0;
			left = 0;
			width = window.screen.width - 8; // 8 = 4px browser window borders
			height = window.screen.height - 58; // 58 = status bar(25px) and title bar(25px) and browser window borders(4px)
		}
		
		var newWindow = window.open("/popup_Product.aspx?productid=" + CURRENTLYZOOMED.Id + "&imageindex=" + CURRENTLYZOOMED.CurrentImage + "&unique=" + CURRENTLYZOOMED.UniqueId, "Image_Popup", "scrollbars=yes,menubar=no,toolbar=no,location=no,directories=no,resizable=yes,top=" + top + ",screenY=" + top + ",left=" + left + ",screenX=" + left + ",width=" + width + ",height=" + height);
		self.name = 'imageWindow'
		newWindow.focus()
		return false;
	}
}

function doZoomNothing(event){
	return false;
}