/*===================================================================
** LinkDev Usage (Ahmed Waly):
-----------------
Used in EHTN Project for the follwoing components:
- Photo Library (Printouts)
Note: Used in compatibility with Mootools version v1.2.1
These files used in the component:
- slideshow.js
- mootools121.js
- lightbox.js
** Also i modified it to split the sent title (if sent) by :: and 
show its [0] index Caption area, [1] index as date, and the [2] index in description area.
===================================================================*/


// Lightbox 1.6, Extended version of Slimbox with some fixes for Mootools 1.2 by Aeron Glemann. Copyright (c) 2007 Samuel Birch <http://phatfusion.net>, MIT Style License.

var Lightbox = new Class(
{
	Implements:
		[Events,Options],
		options:
			{resizeDuration:400,
			resizeTransition:Fx.Transitions.Sine.easeInOut,
			initialWidth:250,
			initialHeight:250,
			animateCaption:
				{In:true,Out:true},
				showControls:true,
				showNumbers:true,
				descriptions:true,
				opacity:0.8,
				onClose:$empty,
				onOpen:$empty}
			,initialize:function(A)
			{
				this.setOptions(A);
				this.options.container=document.body;
				this.anchors=[];
				$$("a[rel]").each(
					function(C)
					{
						if(C.rel.test(/^lightbox/i))
						{
							C.onclick=this.click.pass(C,this);
							this.anchors.push(C)
						}
					}
					,
					this);
				this.eventPosition=this.position.bind(this);
				this.overlay=new Element("div").set("id","lbOverlay").inject(this.options.container);
				this.center=new Element("div").set("id","lbCenter").setStyles
				(
					{
						width:this.options.initialWidth+"px",
						height:this.options.initialHeight+"px",
						marginLeft:"-"+(this.options.initialWidth/2)+"px",
						display:"none"
					}
				).inject(this.options.container);
				this.image=new Element("div").set("id","lbImage").inject(this.center);
				this.overlay.setStyle("display","none");
				this.bottomContainer=new Element("div").set("id","lbBottomContainer").setStyle
				("display","none").inject(this.options.container);
				this.bottom=new Element("div").set("id","lbBottom").inject(this.bottomContainer);
				if(this.options.showControls)
				{
					this.controlDiv=new Element("div").set("id","lbControls").inject(this.bottom)
				}
				else
				{
					this.controlDiv=this.image
				}
				this.prevLink=new Element("a").setProperties({id:"lbPrevLink",href:"#"}).setStyle("display","none").inject(this.controlDiv);
				this.nextLink=this.prevLink.clone().set("id","lbNextLink").inject(this.controlDiv);
				this.prevLink.onclick=this.previous.bind(this);
				this.nextLink.onclick=this.next.bind(this);
				//this.closeButton=new Element("a").setProperties({id:"lbCloseLink",href:"#"}).inject(this.bottom);
				//this.closeButton.onclick=this.overlay.onclick=this.close.bind(this);
				this.caption=new Element("div").set("id","lbCaption").inject(this.bottom);
				if(this.options.descriptions!=false)
				{
					this.options.descriptions=$$(this.options.descriptions);
					this.description=new Element("div").set("id","lbDescription").inject(this.bottom)
				}
				if(this.options.showNumbers)
				{
					this.number=new Element("div").set("id","lbNumber").inject(this.bottom)
				}
				this.closeDiv=new Element("div").set("id","divClose").inject(this.bottom)
				this.closeButton=new Element("a").setProperties({id:"lbCloseLink",href:"#"}).inject(this.closeDiv);
				this.closeButton.onclick=this.overlay.onclick=this.close.bind(this);
				
				new Element("div").setStyle("clear","both").inject(this.bottom);
				var B=this.nextEffect.bind(this);
				this.fx=
				{
					overlay:new Fx.Tween
					(
						this.overlay,
						"opacity",
						{duration:500}
					),
					resize:new Fx.Morph
					(
						this.center,
						{
							duration:this.options.resizeDuration,
							transition:this.options.resizeTransition,
							onComplete:B
						}
					),
					image:new Fx.Tween(this.image,"opacity",{duration:500,onComplete:B}),
					bottom:new Fx.Tween
					(
						this.bottom,"margin-top",
						{duration:400,onComplete:B}
					)
				};
				this.overlay.fade("hide");
				this.preloadPrev=new Image();
				this.preloadNext=new Image();
				return this
			},
			click:function(D)
			{
				if(this.options.descriptions!=false)
				{
					this.options.descriptions.each
					(
						function(F,E)
						{
							if(F.hasClass(D.id))
							{this.linkLoc=E}
						},
						this
					)
				}
				if(D.rel.length==8)
				{
					return this.show(D.href,D.title)
				}
				var C,B,A=[];
				this.anchors.each
				(
					function(E)
					{
						if(E.rel==D.rel)
						{
							for(C=0;C<A.length;C++)
							{
								if(A[C][0]==E.href)
								{break}
							}
							if(C==A.length)
							{
								A.push([E.href,E.title]);
								if(E.href==D.href)
								{B=C}
							}
						}
					},
					this
				);
				return this.open(A,B)
			},
			show:function(A,B)
			{
				return this.open([[A,B]],0)
			},
			open:function(A,B)
			{
				this.images=A;
				this.position();
				this.setup(true);
				this.top=window.getScrollTop()+(window.getHeight()/15);
				this.window={};
				this.window.height=window.getScrollHeight();
				this.window.width=window.getScrollWidth();
				this.window.top=window.getScrollTop();
				this.window.left=window.getScrollLeft();
				this.center.setStyles({top:this.top+"px",display:""});				
				this.overlay.fade(this.options.opacity);
				this.overlay.setStyle("display","block");
				this.fireEvent("onOpen");
				return this.changeImage(B)
			},
			position:function()
			{
				if(this.options.container==document.body)
				{
					var B=window.getScrollHeight()+"px";
					var A=window.getScrollWidth()+"px";
					this.overlay.setStyles
					(
						{top:"0px",height:B,width:A}
					)
				}
				else
				{
					var C=this.options.container.getCoordinates();
					this.overlay.setStyles
					(
						{top:C.top+"px",height:C.height+"px",left:C.left+"px",width:C.width+"px"}
					)
				}
			},
			setup:function(A)
			{
				var C=$A(document.getElementsByTagName("object"));
				if(window.ie)
				{
					C.extend(document.getElementsByTagName("select"))
				}
				C.each
				(
					function(D)
					{
						D.style.visibility=A?"hidden":""
					}
				);
				var B=A?"addEvent":"removeEvent";
				window[B]("scroll",this.eventPosition)[B]("resize",this.eventPosition);
				this.step=0
			},
			previous:function()
			{
				this.linkLoc--;
				return this.changeImage(this.activeImage-1)},
				next:function()
				{
					this.linkLoc++;
					return this.changeImage(this.activeImage+1)},
					changeImage:function(A)
					{
						if(this.step||(A<0)||(A>=this.images.length))
						{
							return false
						}
						this.step=1;
						this.activeImage=A;
						if(this.options.animateCaption.In&&this.bottom.offsetHeight)
						{
							this.prevLink.style.display=this.nextLink.style.display="none";
							this.bottom.set
							(
								"tween",
								{duration:300,onComplete:this.loadImage.bind(this)}
							).tween("margin-top",-this.bottom.offsetHeight)
						}
						else
						{
							this.bottomContainer.style.display=this.prevLink.style.display=this.nextLink.style.display="block";
							this.loadImage()
						}
						this.image.fade("hide");
						this.center.className="lbLoading";
						return false
					},
					loadImage:function()
					{
						this.preload=new Image();
						this.preload.onload=this.nextEffect.bind(this);
						this.preload.src=this.images[this.activeImage][0]
					},
					nextEffect:function()
					{
						switch(this.step++)
						{
							case 1:
								this.center.className="";
								this.image.style.backgroundImage="url("+this.images[this.activeImage][0]+")";
								this.image.style.width=this.bottom.style.width=this.preload.width+"px";
								if(this.options.showControls)
								{
									this.image.style.height=this.preload.height+"px"
								}
								else
								{
									this.image.style.height=this.prevLink.style.height=this.nextLink.style.height=this.preload.height+"px"
								}
								
								/////////////////////////////////////////////////////
								// Modified By Ahmed Waly to split title into Caption and description based on <br /> as separator
								var desciption = this.images[this.activeImage][1]||"";
								var desciptionLines = desciption.split("::");
								this.caption.set("html", desciptionLines[0]);
								this.description.set("html", desciptionLines[1] + "<br />" + desciptionLines[2]);
								////////////////////////////////////////////////////////
								
								if(this.options.descriptions!=false)
								{
									if(this.description.getFirst())
									{
										this.description.getFirst().remove()
									}
									var B=this.options.descriptions[this.linkLoc].clone();
									B.setStyle("display","block").inject(this.description)
								}
								if(this.options.showNumbers)
								{
									this.number.set("html",(this.images.length==1)?"":"Image "+(this.activeImage+1)+" of "+this.images.length)
								}
								if(this.activeImage)
								{
									this.preloadPrev.src=this.images[this.activeImage-1][0]
								}
								if(this.activeImage!=(this.images.length-1))
								{
									this.preloadNext.src=this.images[this.activeImage+1][0]
								}
								if(this.center.clientHeight!=this.image.offsetHeight)
								{
									this.fx.resize.start
									(
										{height:this.image.offsetHeight}
									);
									break
								}
								this.step++;
							case 2:
								if(this.center.clientWidth!=this.image.offsetWidth)
								{
									this.fx.resize.start
									(
										{width:this.image.offsetWidth,marginLeft:-this.image.offsetWidth/2}
									);
									break
								}
								this.step++;
							case 3:
								this.bottomContainer.setStyles
								(
									{
										top:(this.top+this.center.clientHeight)+"px",
										//height:"50px",
										marginLeft:this.center.style.marginLeft,
										display:""
									}
								);
								this.image.fade("in");
								var A=this.caption.getStyle("height").toInt();
								if(this.options.descriptions!=false)
								{
									A+=this.description.getStyle("height").toInt()
								}
								if(this.options.showControls)
								{
									A+=this.controlDiv.getStyle("height").toInt()
								}
								if(this.options.showNumbers)
								{
									A+=this.number.getStyle("height").toInt()
								}
								var C=(A-(this.closeButton.getStyle("height").toInt()*2));
								if(C<0)
								{C=0}
								//C=40;
								this.closeButton.setStyle("marginTop",C+"px");
								if(this.activeImage!=0)
								{
									this.prevLink.style.display=""
								}
								if(this.activeImage!=(this.images.length-1))
								{
									this.nextLink.style.display=""
								}
								break;
							case 4:
								if(this.options.animateCaption.Out)
								{
									this.fx.bottom.set
									(-this.bottom.offsetHeight);
									this.bottomContainer.style.height="";
									this.fx.bottom.start(0);
									break
								}
								this.bottomContainer.style.height="";
							case 5:
								this.step=0
						}
					},
					close:function()
					{
						if(this.step<0)
						{return }
						this.step=-1;
						if(this.preload)
						{
							this.preload.onload=$empty;
							this.preload=null
						}
						for(var A in this.fx)
						{
							this.fx[A].cancel()
						}
						this.center.style.display=this.bottomContainer.style.display="none";
						this.overlay.fade("out");
						this.setup.pass(false,this);
						this.overlay.setStyles
						(
							{
								height:this.window.height+"px",
								width:this.window.width+"px"
							}
						);
						this.fireEvent("onClose");
						return false
					}
				}
			);
				