var tt = new Object();
tt.tipClass = Class.create();
tt.tipClass.prototype = {
	initialize: function (node, direction, distance) {
		this.node = node;
		this.direction = direction;
		this.distance = distance;
		this.node.style.display	= 'none';	//IE will fire, even with opacity = 0;
		this.node.left		= this.node.style.left;
	},
	show: function () {
		this.node.style.zIndex='1';

		this.appearEffect = new Effect.Appear(this.node, {duration: 0.8, to:0.85});
		if (this.direction=='right')
			this.moveEffect = new Effect.MoveBy(this.node, 0, this.distance, {duration: 0.6,transition: Effect.Transitions.reverse});
		else
			this.moveEffect = new Effect.MoveBy(this.node, 0, this.distance, {duration: 0.6});
	},
	hide: function () {
		this.appearEffect.cancel();
		this.moveEffect.cancel();
		this.node.style.zIndex='-1';
		this.node.style.opacity = '0'; 
		this.node.style.filter='alpha(opacity=0)';
		this.node.style.display = 'none';
		this.node.style.left = this.node.left;
	}
}

var effectScale = new Object();
effectScale.init = function(canvas, swapPoint, scaleObjects, originalWidth, originalHeight, scaleFactor, moveByDistance, switchSource, useGet) {
	effectScale.canvas			= canvas;
	effectScale.swapPoint		= swapPoint;
	effectScale.scaleObjects	= scaleObjects;
	effectScale.originalWidth	= originalWidth;
	effectScale.originalHeight	= originalHeight;
	effectScale.scaleFactor		= scaleFactor;
	effectScale.moveByDistance	= moveByDistance;
	effectScale.switchSource	= switchSource;
	effectScale.useGet			= useGet;
	
	effectScale.hasScrollBar	= effectScale.canvas.offsetHeight != effectScale.canvas.scrollHeight;
	effectScale.scaleObjects.each(function(productCell,index){new effectScale.scaleObject(productCell,index)});
}

effectScale.scaleObject = Class.create();

effectScale.scaleObject.prototype = {

	initialize: function (productCell, index) {
       this.productCell 	= productCell;
       this.index			= index+1;
       this.image			= $('productCellImage'+this.index);
       this.imageSrc		= this.image.src;
       if(this.imageSrc == '') return;
       this.infoNode		= $('productCellInfo'+this.index);


           if (this.image.style.left=='')
            this.info = new tt.tipClass(this.infoNode,'right',effectScale.moveByDistance);
           else
            this.info = new tt.tipClass(this.infoNode,'left',effectScale.moveByDistance);

           var allproductCell = $A(this.productCell.getElementsByTagName('*'));
           var allInfo = $A(this.infoNode.getElementsByTagName('*'));
           this.allInnerNodes = allproductCell.concat(this.productCell,allInfo,this.infoNode);
           Event.observe(this.productCell, 'mouseover', this.grow.bindAsEventListener(this));
           Event.observe(this.image, 'mouseout', this.shrink.bindAsEventListener(this));
           Event.observe(this.infoNode, 'mouseout', this.shrink.bindAsEventListener(this));
    },
	
	grow: function(event) {
		var relTarget = (event.fromElement)? event.fromElement:event.relatedTarget;
		if (this.allInnerNodes.any(function(node){return relTarget==node})) {return;}

		// switch source
		if (effectScale.switchSource) {
			// preloaded?
			if (!this.zoomImage) {
				var zoomImage = document.createElement('img');
				if (effectScale.useGet)
					var zoomImageSrc = this.image.src.replace(/[^/]*\?/, 'overviewZoom?');
				else
					var zoomImageSrc = this.image.src.replace(/(\.)[^/]*$/, 'Zoom.jpg');
							
				zoomImage.src = zoomImageSrc;
				// IE does not fire for cached images
				if (zoomImage.height>0) {
					this.zoomImage = zoomImage;
					this.image.src = this.zoomImage.src;
				}
				Event.observe(zoomImage, 'load', function(){
					this.zoomImage = zoomImage;
					this.image.src = this.zoomImage.src;
				}.bind(this));
			}
			else
				this.image.src = this.zoomImage.src;

		}
		
		if (effectScale.hasScrollBar) this.setNewDirection();
		this.productCell.style.zIndex='1';
		this.growEffect = new Effect.Scale(this.image, effectScale.scaleFactor ,{duration:0.3});
		this.info.show();
	},
	
	shrink: function(event) {
		var relTarget = (event.toElement)? event.toElement:event.relatedTarget;
		if (this.allInnerNodes.any(function(node){return relTarget==node})) {return;}

		// switch source
		this.image.src = this.imageSrc;

		this.growEffect.cancel();
		
		this.productCell.style.zIndex='0';
		new Effect.Scale(this.image, 100,{duration:0, scaleMode:{originalWidth: effectScale.originalWidth,originalHeight: effectScale.originalHeight}});
		this.info.hide();
	},
	
	setNewDirection: function () {
		var posWithinVisableArea = effectScale.canvas.scrollTop - this.productCell.offsetTop;
		
		if (posWithinVisableArea < -effectScale.swapPoint)
			{this.image.style.bottom = '0'; this.image.style.top = 'auto';}
		else
			{this.image.style.bottom = 'auto'; this.image.style.top = '0';}
	}
}