/*
	thumbs.js
	Copyright (c) Dan Wright 2008
	http://danwright.info
	
	Requires prototype.js and scriptaculous.js
*/

Effect.ResizeAndPosition = Class.create();
Object.extend(Object.extend(Effect.ResizeAndPosition.prototype, Effect.Base.prototype), {
	initialize: function(element) {
		this.element = $(element)
		var options = Object.extend({
			xShift: 0,
			yShift: 0,
			newWidth: 1,
			newHeight: 1
		}, arguments[1] || {});
		this.start(options);
	},
	
	setup: function() {
		this.restoreAfterFinish = this.options.restoreAfterFinish || false;
		this.elementPositioning = this.element.getStyle('position');
		
		this.originalStyle = {};
		['top','left','width','height','fontSize'].each( function(k) {
			this.originalStyle[k] = this.element.style[k];
		}.bind(this));
		
		this.originalTop = this.element.offsetTop;
		this.originalLeft = this.element.offsetLeft;
		this.originalWidth = this.element.clientWidth;
		this.originalHeight = this.element.clientHeight;
	},
	
	update: function(position) {
		var currentDx = this.options.xShift * position;
		var currentDy = this.options.yShift * position;
		var currentX = this.originalLeft + currentDx;
		var currentY = this.originalTop + currentDy;

		var currentWidth = (this.originalWidth*(1-position) + this.options.newWidth*position);
		var currentHeight = (this.originalHeight*(1-position) + this.options.newHeight*position);

		this.setPositionAndSize(currentDx, currentDy, currentWidth, currentHeight);
		},
		
	finish: function(position) {
		this.setPositionAndSize(this.options.xShift, this.options.yShift,
								this.options.newWidth, this.options.newHeight);
		},
		
	setPositionAndSize: function(x, y, width, height) {
		var d = {};
		d.width = width + 'px';
		d.height = height + 'px';
		if (this.elementPositioning == 'absolute') {
			d.top = this.originalTop - y + 'px';
			d.left = this.originalLeft - x + 'px';
		} else {
			d.top = y + 'px';
			d.left = x + 'px';
		}
		this.element.setStyle(d);
	}
});

var Thumbs = {
	current: null,
	
	finishMagnifyEffect : function(elem)
		{
		elem.effect = null;
		if (!elem.hasClassName('hovered'))
			Thumbs.beginReduceEffect(elem);
		},
	
	finishReduceEffect : function(elem)
		{
		elem.effect = null;
		elem.setStyle(elem.originalStyle);
		if (elem.hasClassName('hovered'))
			Thumbs.beginMagnifyEffect(elem);
		},
		
	beginMagnifyEffect : function(elem)
		{
		if (Thumbs.current != null && Thumbs.current != elem)
			{
			if (Thumbs.current.effect)
				Thumbs.current.effect.cancel();
			Thumbs.beginReduceEffect(Thumbs.current);
			}
		if (null == elem.effect)
			{
			elem.addClassName('hovered');
			var dx = Math.floor((elem.enhancedWidth + 3*elem.widthExtra - elem.clientWidth)/2);
			var dy = Math.floor((elem.enhancedHeight + 3*elem.heightExtra - elem.clientHeight)/2);
			elem.style.zIndex = 150;
			elem.effect = new Effect.ResizeAndPosition(elem, {duration: 0.25, xShift: dx, yShift: dy, 
										newWidth: elem.enhancedWidth, newHeight: elem.enhancedHeight,
										afterFinish: function() { Thumbs.finishMagnifyEffect(elem); } });
			Thumbs.current = elem;
			}
		else if (!elem.hasClassName('hovered'))
			{
			elem.addClassName('hovered');
			elem.effect.cancel();
			if (elem.effect)
				Thumbs.finishReduceEffect(elem);
			}
		},
		
	beginReduceEffect : function(elem)
		{
		if (null == elem.effect)
			{
			if (Thumbs.current == elem)
				Thumbs.current = null;
			elem.removeClassName('hovered');
			elem.style.zIndex = 1;
			elem.effect = new Effect.ResizeAndPosition(elem, {duration: 0.25,
							xShift: Math.ceil((elem.originalWidth+3*elem.widthExtra-elem.clientWidth)/2),
							yShift: Math.ceil((elem.originalHeight+3*elem.heightExtra-elem.clientHeight)/2),
							newWidth: elem.originalWidth, newHeight: elem.originalHeight,
							afterFinish: function () { Thumbs.finishReduceEffect(elem); } });
			}
		else if (elem.hasClassName('hovered'))
			{
			elem.removeClassName('hovered');
			elem.effect.cancel();
			if (elem.effect)
				Thumbs.finishMagnifyEffect(elem);
			}
		},
		
	magnify: function(elem, newWidth, newHeight)
		{
		if (!elem.hasClassName('hovered'))
			{
			if (elem.originalWidth == null)
				{
				elem.originalStyle = {};
				var style = {};
				['width','height','left','top'].each(function (tag) {
						elem.originalStyle[tag] = Element.getStyle(elem,tag);
						style[tag] = parseInt(elem.originalStyle[tag]);
						} );

				elem.widthExtra = elem.clientWidth - style.width;
				elem.heightExtra = elem.clientHeight - style.height;
				if (null == style.height || '' == style.height || 0 == style.height)
					elem.heightExtra = elem.widthExtra;
				
				elem.originalWidth = elem.clientWidth - elem.widthExtra;
				elem.originalHeight = elem.clientHeight - elem.heightExtra;
				elem.enhancedWidth = Number(newWidth);
				elem.enhancedHeight = Number(newHeight);
				elem.originalTop   = elem.offsetTop;
				elem.originalLeft  = elem.offsetLeft;
				}
			Thumbs.beginMagnifyEffect(elem);
			}
		},
	
	reduce: function(elem)
		{
		Thumbs.beginReduceEffect(elem);
		}
	
	};