Object.extend(Event, {
	wheel:function (event){
		var delta = 0;
		if (!event) event = window.event;
		if (event.wheelDelta) {
			delta = event.wheelDelta/120; 
			if (window.opera) delta = -delta;
		} else if (event.detail) { delta = -event.detail/3;	}
		return Math.round(delta); //Safari Round
	}
});

Demensions = function(width, height){
	this.Width=width;
	this.Height=height;
}
Position = function(posX,posY){
	this.X=posX;
	this.Y=posY;
}

ImageZoom = function() {
	this.setup = function(mainImgId,mainImgDivId,mainImgZoomUpId,mainImgZoomDownId,mainImgMoveLeftId,mainImgMoveRightId,mainImgMoveUpId,mainImgMoveDownId, imgLoadingCoverId){
		
		this._moveSizePx=25;//how far to move the image on move link clicks
		this._maxThumbDemensions;		

		this._reducedImgDemensions;
		this._containerDemensions;
	
		this._clickPosition;
		this._imgPosition;
		
		this._mainImg=$(mainImgId);//main big image
		this._mainImgDiv=$(mainImgDivId);//main image container
		this._mainImgZoomUp=$(mainImgZoomUpId);//zoom up button
		this._mainImgZoomDown=$(mainImgZoomDownId);//zoom down button

		this._mainImgMoveLeft=$(mainImgMoveLeftId);//zoom up button
		this._mainImgMoveRight=$(mainImgMoveRightId);//zoom down button
		this._mainImgMoveUp=$(mainImgMoveUpId);//zoom up button
		this._mainImgMoveDown=$(mainImgMoveDownId);//zoom down button
		this._mainImg.style.left=0+"px";
		this._mainImg.style.top=0+"px";
		this._containerDemensions=new Demensions(ImageZoom.RemovePX(this._mainImgDiv.style.width),ImageZoom.RemovePX(this._mainImgDiv.style.height));
		this._loadingDiv=$(imgLoadingCoverId);
		if(this._loadingDiv==null){
			this._loadingDiv= new Element('div', { 
				'class': 'ImageZoomImgCoverDiv', 
				'style':'text-align:center; vertical-align:middle; position:absolute; background-color:white;'}).update('...L o a d i n g...');
			$$("body")[0].appendChild(this._loadingDiv);
		}
		this._loadingDiv.style.width=this._containerDemensions.Width + 'px';
		this._loadingDiv.style.height=this._containerDemensions.Height + 'px';		
		this._loadingDiv.style.left=(Element.positionedOffset(this._mainImgDiv).left+1)+'px';
		this._loadingDiv.style.top=(Element.positionedOffset(this._mainImgDiv).top+1)+'px';	
		this._loadingDiv.show();	
	
	
		//this.loadImageComplete();				
		if(this._mainImg.complete){
			this.loadImageComplete();			
		}else{
			this._mainImgLoadCache=this.loadImageComplete.bindAsEventListener(this);
			Element.observe(this._mainImg,"load",this._mainImgLoadCache);
		}		
	}
	
	//function wich setups the control when the image is loaded
	this.loadImageComplete = function(e){	
		this._loadingDiv.hide();
		this._zoomWidthIncrease;
		this._zoomHeightIncrease;
		

		this._originalImgDemensions=new Demensions(this._mainImg.width,this._mainImg.height);
		this._maxImageDemensions = new Demensions(Math.ceil(this._mainImg.width*1.5),Math.ceil(this._mainImg.width*1.5));
		this._reducedImgDemensions=new Demensions(this._mainImg.width,this._mainImg.height);
				
		this.resetImageToFithContainer();		
		this.determineZoomIncreases();

		this._mainImgOnMouseDownCache=this.dragImageStart.bindAsEventListener(this);
		this._mainImgOnMouseMoveCache=this.dragImage.bindAsEventListener(this);
		this._mainImgMouseUpCache=this.clearDragImage.bindAsEventListener(this);
		this._mainImgZoomUpCache=this.zoomImageUp.bindAsEventListener(this);
		this._mainImgZoomDownCache=this.zoomImageDown.bindAsEventListener(this);

		this._mainImgMoveUpCache=this.moveImageUp.bindAsEventListener(this);
		this._mainImgMoveDownCache=this.moveImageDown.bindAsEventListener(this);
		this._mainImgMoveLeftCache=this.moveImageLeft.bindAsEventListener(this);
		this._mainImgMoveRightCache=this.moveImageRight.bindAsEventListener(this);

		this._mainImgMouseWheelCache=this.handleMouseWheel.bindAsEventListener(this);

		Element.observe(this._mainImg,"mousedown",this._mainImgOnMouseDownCache);
		Event.observe(this._mainImg, "mousewheel", this._mainImgMouseWheelCache);
		Event.observe(this._mainImg, "DOMMouseScroll", this._mainImgMouseWheelCache); // Firefox

		Element.observe(this._mainImgZoomUp,"click",this._mainImgZoomUpCache);
		Element.observe(this._mainImgZoomDown,"click",this._mainImgZoomDownCache);

		Element.observe(this._mainImgMoveUp,"click",this._mainImgMoveUpCache);
		Element.observe(this._mainImgMoveDown,"click",this._mainImgMoveDownCache);
		Element.observe(this._mainImgMoveLeft,"click",this._mainImgMoveLeftCache);
		Element.observe(this._mainImgMoveRight,"click",this._mainImgMoveRightCache);
		
	}
	
	this.resetImageToFithContainer = function(e){
		if(this._originalImgDemensions.Width<this._containerDemensions.Width && this._originalImgDemensions.Height<this._containerDemensions.Height){
				var k1 = this._containerDemensions.Width/this._originalImgDemensions.Width;
				var k2 = this._containerDemensions.Height/this._originalImgDemensions.Height;
				var k = k1>k2?k1:k2;				
				this._reducedImgDemensions.Height=Math.floor(this._originalImgDemensions.Height*k);			
				this._reducedImgDemensions.Width=Math.floor(this._originalImgDemensions.Width*k);	
		}else if(this._originalImgDemensions.Width>this._containerDemensions.Width && this._originalImgDemensions.Height>this._containerDemensions.Height){
				var k1 = this._containerDemensions.Width/this._originalImgDemensions.Width;
				var k2 = this._containerDemensions.Height/this._originalImgDemensions.Height;
				var k = k1>k2?k1:k2;				
				this._reducedImgDemensions.Height=Math.floor(this._originalImgDemensions.Height*k);			
				this._reducedImgDemensions.Width=Math.floor(this._originalImgDemensions.Width*k);	
		}else	if(this._originalImgDemensions.Width<this._containerDemensions.Width){
			var k = this._containerDemensions.Width/this._originalImgDemensions.Width;			
			this._reducedImgDemensions.Height=Math.floor(this._originalImgDemensions.Height*k);			
			this._reducedImgDemensions.Width=Math.floor(this._originalImgDemensions.Width*k);			
		}	else if(this._originalImgDemensions.Height<this._containerDemensions.Height){
			var k = this._containerDemensions.Height/this._originalImgDemensions.Height;
			this._reducedImgDemensions.Height=Math.floor(this._originalImgDemensions.Height*k);			
			this._reducedImgDemensions.Width=Math.floor(this._originalImgDemensions.Width*k);			
		}else	if(this._originalImgDemensions.Width>this._containerDemensions.Width){
			var k = this._containerDemensions.Width/this._originalImgDemensions.Width;
			this._reducedImgDemensions.Width=Math.floor(this._originalImgDemensions.Width*k);
			this._reducedImgDemensions.Height=Math.floor(this._originalImgDemensions.Height*k);			
		}		else if(this._originalImgDemensions.Height>this._containerDemensions.Height){
			var k = this._containerDemensions.Height/this._originalImgDemensions.Height;
			this._reducedImgDemensions.Height=Math.floor(this._originalImgDemensions.Height*k);
			this._reducedImgDemensions.Width=Math.floor(this._originalImgDemensions.Width*k);		
		}
		this._mainImg.width=this._reducedImgDemensions.Width;
		this._mainImg.height=this._reducedImgDemensions.Height;
	}
	
	//Function that will fire when the user clicks on the image
	this.dragImageStart = function(e)
	{		
		if(e.preventDefault) {  e.preventDefault(); }
		//Determine where on the image the initial x/y position is
		this._imgPosition=new Position(ImageZoom.RemovePX(this._mainImg.style.left),ImageZoom.RemovePX(this._mainImg.style.top));
		//Set wher the user initially clicked
		this._clickPosition =new Position(Event.pointerX(e),Event.pointerY(e));	

		//Set up the div tags mouse move event, mouse up event, and mouse out events
		Element.observe(this._mainImg,"mousemove",this._mainImgOnMouseMoveCache);
		Element.observe(this._mainImg,"mouseup",this._mainImgMouseUpCache);
		Element.observe(document,"mouseup",this._mainImgMouseUpCache);			
		return false;		
	}
	this.dragImage = function(e){
		if(e.preventDefault) {  e.preventDefault(); }
		var position = new Position();
		//Get the user's X, Y mouse coordinates
		var mousePos=new Position(Event.pointerX(e),Event.pointerY(e));
		//Get how far the mouse has moved from the initial click point
		mousePos.X = this._clickPosition.X - mousePos.X;
		mousePos.Y = this._clickPosition.Y - mousePos.Y;
		//Set the new x/y position
		position.X = 1 - (mousePos.X - this._imgPosition.X);
		position.Y = 1 - (mousePos.Y - this._imgPosition.Y);		
		//move the image
		this.checkMoveImage(position);		
		return false;	
	}

	this.moveImageUp = function(e){
		if(e.preventDefault) {  e.preventDefault(); }
		this._imgPosition=new Position(ImageZoom.RemovePX(this._mainImg.style.left),ImageZoom.RemovePX(this._mainImg.style.top));
		var position = new Position(this._imgPosition.X, this._imgPosition.Y+this._moveSizePx);
		this.checkMoveImage(position);		
		return false;			
	}
	this.moveImageDown = function(e){
		if(e.preventDefault) {  e.preventDefault(); }
		this._imgPosition=new Position(ImageZoom.RemovePX(this._mainImg.style.left),ImageZoom.RemovePX(this._mainImg.style.top));
		var position = new Position(this._imgPosition.X, this._imgPosition.Y-this._moveSizePx);
		this.checkMoveImage(position);		
		return false;	
	}
	this.moveImageLeft = function(e){
		if(e.preventDefault) {  e.preventDefault(); }
		this._imgPosition=new Position(ImageZoom.RemovePX(this._mainImg.style.left),ImageZoom.RemovePX(this._mainImg.style.top));
		var position = new Position(this._imgPosition.X+this._moveSizePx, this._imgPosition.Y);
		this.checkMoveImage(position);		
		return false;
	}
	this.moveImageRight = function(e){
		if(e.preventDefault) {  e.preventDefault(); }
		this._imgPosition=new Position(ImageZoom.RemovePX(this._mainImg.style.left),ImageZoom.RemovePX(this._mainImg.style.top));
		var position = new Position(this._imgPosition.X-this._moveSizePx, this._imgPosition.Y);
		this.checkMoveImage(position);		
		return false;
	}

	this.clearDragImage = function(e){
		if(e.preventDefault) {  e.preventDefault(); }
		//Clear out all the drag events
		Element.stopObserving(this._mainImg,"mousemove",this._mainImgOnMouseMoveCache);
		Element.stopObserving(this._mainImg,"mouseout",this._mainImgMouseUpCache);
		Element.stopObserving(this._mainImg,"mouseup",this._mainImgMouseUpCache);
		Element.stopObserving(document,"mouseup",this._mainImgMouseUpCache);
		return false;
	}
	this.clearAll = function(){
		Element.stopObserving(this._mainImg,"load",this._mainImgLoadCache);
		Element.stopObserving(this._mainImg, "mousewheel", this._mainImgMouseWheelCache);
		Element.stopObserving(this._mainImg, "DOMMouseScroll", this._mainImgMouseWheelCache); // Firefox
		Element.stopObserving(this._mainImg,"mousemove",this._mainImgOnMouseMoveCache);
		Element.stopObserving(this._mainImg,"mouseout",this._mainImgMouseUpCache);
		Element.stopObserving(this._mainImg,"mouseup",this._mainImgMouseUpCache);
		Element.stopObserving(document,"mouseup",this._mainImgMouseUpCache);
		Element.stopObserving(this._mainImgZoomUp,"click",this._mainImgZoomUpCache);
		Element.stopObserving(this._mainImgZoomDown,"click",this._mainImgZoomDownCache);
	}
	
	//static functions
	//Check the values before moving the image
	this.checkMoveImage = function(position)
	{	
		ImageZoom.Debug("checkMoveImage Move to --> X:"+position.X+" Y:"+position.Y);
		if (position != null && position.X!=null)
		{
			//X cannot be greater than zero
			if (position.X > 0)
			{
				position.X = 0;
			}		
			if ((Math.abs(position.X))+this._containerDemensions.Width >  this._reducedImgDemensions.Width)
			{
				position.X = 0-(this._reducedImgDemensions.Width-this._containerDemensions.Width);
			}		
		}	
		if (position != null && position.Y != null)
		{
			//Y cannot be greater than zero
			if (position.Y > 0)
			{
				position.Y = 0;
			}		
			if ((Math.abs(position.Y))+this._containerDemensions.Height >   this._reducedImgDemensions.Height)
			{
				position.Y =  0-(this._reducedImgDemensions.Height-this._containerDemensions.Height);
			}
		}	
		//Move the image
		this.moveImage(position, true)		
		return false;
	}
	//Function that will actually move the image
	this.moveImage = function(position,doMoveThumb){

		if(position!=null){
			if (position.X <= 0)
			{
					ImageZoom.Debug("--> X:"+position.X);
				 this._mainImg.style.left=position.X+"px";
			}
			if (position.Y <= 0)
			{
					ImageZoom.Debug("-->  Y:"+position.Y);
				 this._mainImg.style.top=position.Y+"px";
			}
			if (doMoveThumb == true)
			{
				//ChangeThumbDiv(RemovePX(this._mainImg.style.left), RemovePX(this._mainImg.style.top));
			}
		}
		return false;
	}

	//function that will handle when the mouse wheel is moved up or down
	this.handleMouseWheel = function(e)	{
		if(e.preventDefault) {  e.preventDefault(); }
		this.zoomImage(!(Event.wheel(e) < 0));
		return false;
	}


	this.zoomImageUp = function(e){
		if(e.preventDefault) {  e.preventDefault(); }
		this.zoomImage(true);
		return false;
	}
	
	this.zoomImageDown = function(e){
		if(e.preventDefault) {  e.preventDefault(); }
		this.zoomImage(false);
		return false;
	}

	this.zoomImage = function(doZoomImage)
	{
		var imgPosition=new Position(ImageZoom.RemovePX(this._mainImg.style.left),ImageZoom.RemovePX(this._mainImg.style.top));		

		var dXMid = (Math.abs(imgPosition.X) + (ImageZoom.RemovePX(this._containerDemensions.Width) / 2));
		var dYMid = (Math.abs(imgPosition.Y) + (ImageZoom.RemovePX(this._containerDemensions.Height) / 2));
		var dXPer = (dXMid / this._mainImg.width);
		var dYPer = (dYMid / this._mainImg.height);
		
		if (doZoomImage == true)
		{
			if ((this._mainImg.width + this._zoomWidthIncrease) <= (this._maxImageDemensions.Width))
			{
				imgPosition.X = imgPosition.X - Math.ceil(dXPer * this._zoomWidthIncrease);
				imgPosition.Y = imgPosition.Y - Math.ceil(dYPer * this._zoomHeightIncrease);
				this._mainImg.width = this._mainImg.width +  this._zoomWidthIncrease;
				this._mainImg.height = this._mainImg.height + this._zoomHeightIncrease;
			}
		}
		else
		{
			if ((this._mainImg.width - this._zoomWidthIncrease) >= ( this._containerDemensions.Width))
			{
				imgPosition.X = imgPosition.X + Math.ceil(dXPer *  this._zoomWidthIncrease);
				imgPosition.Y = imgPosition.Y + Math.ceil(dYPer * this._zoomHeightIncrease);
				this._mainImg.width = this._mainImg.width -  this._zoomWidthIncrease;
				this._mainImg.height = this._mainImg.height - this._zoomHeightIncrease;	
			}
			else
			{
				//This should never happen.  If it does then reset the image
				imgPosition.X = 0;
				imgPosition.Y = 0;
				this.resetImageToFithContainer();
			}
		}
		this._reducedImgDemensions.Width=this._mainImg.width;
		this._reducedImgDemensions.Height=this._mainImg.height;
		//SetThumbnailSize();		
		this.checkMoveImage(imgPosition);			
		return false;
	}

	//Method that will determine how much the code should zoom in on a picture
	this.determineZoomIncreases = function()
	{
		if (this._originalImgDemensions.Width > this._maxImageDemensions)
		{
			this._zoomWidthIncrease = Math.floor((this._originalImgDemensions.Width - this._mainImg.width) / 2);
			this._zoomHeightIncrease = Math.floor((this._originalImgDemensions.Height - this._mainImg.height) / 2);
			
			if ((this._zoomWidthIncrease / this._originalImgDemensions.Width) < .20)
			{
				this._zoomWidthIncrease = Math.floor(.20 * this._originalImgDemensions.Width);
			}
			
			if ((this._zoomHeightIncrease / this._originalImgDemensions.Height) < .20)
			{
				this._zoomHeightIncrease = Math.floor(.20 * this._originalImgDemensions.Height);
			}
		}
		else
		{
			this._zoomWidthIncrease = Math.floor(.20 * this._originalImgDemensions.Width);
			this._zoomHeightIncrease = Math.floor(.20 * this._originalImgDemensions.Height);
		}
	}

ImageZoom.RemovePX = function(value)
	{
		var tempString = new String(value);
		var result;		
		//tempString = value;
		if (tempString.indexOf('px', 0) > 0)
		{
			result = tempString.replace('px', '');
		}
		else
		{
			result = tempString.replace('pt', '');
		}
		
		if (result != '')
		{
			result = Math.floor(result);
		}
		else
		{
			result = 0;
		}		
		return result;
	}
	ImageZoom.Debug = function(info) {
		if($('debugConsole')){
			$('debugConsole').value+=info+"\n";
		}
	}
}