var ImageZoom = new Class({
	Implements: [Options,Events],
	options : {
		img 		: $('test'),
		fullImg		: false,
		transition  : "Quint:in:out",
		duration	: 300,
		overlay		: true,
		loader		: "js/ajax-loader.gif",
		onFail      : $empty
	},	
	
	initialize : function(options)
	{
		this.setOptions(options);
		if(!this.options.fullImg){this.options.fullImg = this.options.img.get("src");}
		this.makeLoader();
		this.options.img.addEvent("click", this.loadImage.bind(this));
		this.coordinates = this.options.img.getCoordinates();
		this.getSizeBody();
		if(this.options.overlay)
			this.overlay = new BodyOverlay({opacity:0.8,onClick:function(e){this.close(e)}.bind(this)});
		window.addEvent("resize", this.getSizeBody.bind(this));
	},
	makeLoader : function()
	{
		this.loader = new Element("div");
		this.loader.copySize(this.options.img);
		this.loader.setStyle("background", "url("+this.options.loader+") center no-repeat");
	},
	getSizeBody : function()
	{
		this.sizeBody = $(document.body).getSize();
		this.coordinates = this.options.img.getCoordinates();
	},
	loadImage : function(e)
	{
		e.preventDefault().stopPropagation();
		if(!this.image)
		{
			this.loader.injectOver(this.options.img);
			this.image = new Asset.image(this.options.fullImg, {"class": 'zoomImage', onload: this.imageZoom.bind(this, [e]), onerror:this.error.bind(this)});
			this.image.addEvent("click", this.close.bind(this));
		}
		else
			this.imageZoom(e);
			
	},
	error : function()
	{
		this.loader = this.loader.dispose();
		this.image = false;
		this.fireEvent("onFail", [this.options.fullImg], 50);
	},
	imageZoom : function(e)
	{
		this.loader = this.loader.dispose();
		this.originalWidth = this.image.get("width");
		this.originalHeight = this.image.get("height");
		this.image.copySize(this.options.img);
		this.image.injectOver(this.options.img);
		this.image.set("morph",{transition:this.options.transition, duration:this.options.duration});
		this.image.morph({width : this.originalWidth+"px",height:this.originalHeight+"px",top:this.getTop()+"px",left:this.getLeft()+"px"});
		if(this.overlay)
			this.overlay.show();
	},
	close : function()
	{
		if(this.overlay)
			this.overlay.hide();
		this.image.set("morph",{transition:this.options.transition, duration:this.options.duration,onComplete:function(){ this.image = this.image.dispose() }.bind(this)})
		this.image.morph({width  : this.coordinates.width+"px",height : this.coordinates.height+"px",top:this.coordinates.top,left:this.coordinates.left});
	},
	getTop : function()
	{
		return  window.getScrollTop() + (window.getHeight() / 5);
	},
	getLeft : function()
	{
		return (this.sizeBody.x-this.originalWidth)/2;
	}
});

Element.implement({
	copySize : function(element)
	{
		var dimensions = element.getSize();
        this.setStyles({width:dimensions.x+"px", height: dimensions.y+"px"});
	},
	injectOver : function(element)
	{
		position = element.getPosition();
		this.setStyles({position:"absolute",top:position.y+"px",left:position.x+"px", "z-index":1000});
		this.inject(document.body,"bottom");
	}
});