/*
Script: ImagePreview.js
	Contains <ImagePreview>

Author:
	Alan Roemen

Class: ImagePreview
	A javascript image viewer

Options:
	imgBase: If links wrap images set to true, else set to false. Default: true
	baseURL: Base directory for script. Default: false
	scriptName: Name of javascript file. Default: 'slidingtabs'
	className: CSS class name for script. Set to false for no CSS. Default: 'SlidingTabs'
	offsets: Container Offsets. Default: {x: 0, y: 0}
	containerPadding: Container animated padding. Default: 10
	draggable: Makes containers draggable if true. Default: true
	hideClickOff: Limits to 1 active container and closes container when clicking outside container. Default: true
	showEffect: options for effect used to animate the sliding, see Fx.Base in mootools docs. Default: duration: 300 // half a second
	hideEffect: options for effect used to animate the sliding, see Fx.Base in mootools docs. Default: duration: 300 // half a second
*/

var ImagePreview=new Class({options:{imgBase:true,baseURL:false,scriptName:"imagepreview",className:"ImagePreview",offsets:{x:0,y:0},containerPadding:10,draggable:true,hideClickOff:true,showEffect:{duration:300},hideEffect:{duration:300}},initialize:function(A,B){this.links=document.getElements("a[rel="+A+"]");this.setOptions(B);if(!this.options.baseURL){var D=document.getElementsByTagName("script");for(var C=0;C<D.length;C++){if(D[C].src&&(D[C].src.indexOf(this.options.scriptName+".js")!=-1)){var E=D[C].src;this.options.baseURL=E.substring(0,E.lastIndexOf("/"));break}}this.documentBasePath=document.location.href;if(this.documentBasePath.indexOf("?")!=-1){this.documentBasePath=this.documentBasePath.substring(0,this.documentBasePath.indexOf("?"))}this.documentBasePath=this.documentBasePath.substring(0,this.documentBasePath.lastIndexOf("/"));if(this.options.baseURL.indexOf("://")==-1&&this.options.baseURL.charAt(0)!="/"){this.options.baseURL=this.documentBasePath+"/"+this.options.baseURL}}if(this.options.className!==false){new Asset.css(this.options.baseURL+"/"+this.options.scriptName+".css",{id:"style"})}this.start.delay(300,this);this.mouseActive=false},start:function(){this.images=new Array();this.links.each(function(C,B){var D=new Image();D.src=C.href;C.addClass(this.options.className);C.addEvent("click",function(E){E=new Event(E).stop();this.show(B)}.bindWithEvent(this));var A={link:C,image:D,container:false,coords:false};if(this.options.imgBase){A.sImage=C.getElement("img");A.origSize=C.getElement("img").getSize().size}this.images.push(A)}.bind(this));this.container=new Element("div",{"class":this.options.className,"styles":{"position":"absolute","overflow":"hidden","display":"inline","padding":"0","margin":"0"}})},getTempSize:function(C){var B,A=$(C).clone();A.removeProperty("style");A.setStyle("visibility","hidden");A.inject(document.body);B=A.getSize().size;A.remove();return B},drag:function(A){new Drag.Move(this.images[A].container,{onDrag:(function(){this.mouseActive=true}.bind(this))})},show:function(E){this.active=E;var A=this.images[E];var C=this.images[E].image;var B=this.getTempSize(C);A.container=this.container.clone();C.injectInside(A.container);C.setStyles({width:(this.options.imgBase?A.origSize.x:20),height:(this.options.imgBase?A.origSize.y:20)});var D=(this.options.imgBase?A.sImage.getPosition():A.link.getPosition());if(this.options.imgBase){A.link.setStyle("visibility","hidden")}A.container.setStyles({"left":D.x+this.options.offsets.x,"top":D.y+this.options.offsets.y});A.container.inject($$("body")[0]);this.images[E].coords=A.container.getCoordinates();A.container.addEvent("click",function(F){F=new Event(F).stop();if(!this.mouseActive){this.hide(E)}this.mouseActive=false}.bindWithEvent(this));this.fx=new Fx.Styles(C,this.options.showEffect);this.fx.start({"padding":[0,this.options.containerPadding],"width":B.x,"height":B.y});if(this.options.draggable){this.drag(E)}if(this.options.hideClickOff){this.clickOff("show",E)}},hide:function(C){if(this.options.hideClickOff){this.clickOff("hide")}var A=this.images[C];var B=this.images[C].sImage;this.fx=new Fx.Styles(A.container,this.options.hideEffect);this.fx2=new Fx.Styles(A.container.getElement("img"),this.options.hideEffect);this.fx.start({"top":A.coords.top,"left":A.coords.left,"width":(this.options.imgBase?A.origSize.x:0),"height":(this.options.imgBase?A.origSize.y:0)}).chain(function(){this.remove(C)}.bind(this));this.fx2.start({"padding":0,"width":(this.options.imgBase?A.origSize.x:0),"height":(this.options.imgBase?A.origSize.y:0)})},remove:function(B){if(this.options.imgBase){this.images[B].link.setStyle("visibility","visible")}var A=(function(){this.images[B].container.remove();this.images[B].container=false}).bind(this);A.delay(50,this)},clickOff:function(A,B){if(!this.clickOffDiv){this.clickOffDiv=new Element("div",{"class":"clickoff","styles":{"display":"none"},"events":{"click":(function(C){C=new Event(C).stop();this.hide(this.active)}).bindWithEvent(this)}}).inject(document.body);if(window.ie6){this.clickoffDiv.setStyle("position","absolute")}}if(A=="show"){this.clickOffDiv.setStyle("display","block")}else{if(A=="hide"){this.clickOffDiv.setStyle("display","none")}}}});ImagePreview.implement(new Options,new Events)