var ZEN_LB_Elements = 0
var ZEN_LigthBox 	= function(){}

ZEN_LigthBox.prototype = {

	Ancho		: '',
	Alto		: '',
	Src			: '',
	Dark		: '',
	Cont		: '',
	Titulo		: '',
	TituloTxt	: '',
	Cerrar		: '',
	Loader		: '',
	Style		: '',
	
	
	
	
	Image: function(TituloTxt, Src){

		var Cont 			= 0
		
		this.Style			= 'Image'
		this.TituloTxt		= TituloTxt
		this.Src 			= Src
		
		Imagen				= document.createElement('img');
		Imagen.src			= this.Src
		Imagen.className	= 'ZEN_LB_ImageCont'
		
		this.Build_Dark()
		this.Dark.appendChild(Imagen)
		
		that = this
		
		AN 	 = new ZEN_Animacion()
		AN.FadeIn(that.Dark.id, 70, 10, function callback(){ 

			
			Intervalo = setInterval( function(){ Cont++
			
				if(Imagen.complete || Cont == 20){
				
					clearInterval(Intervalo);
					
					AnchoLimit	= 650;
					AltoLimit	= 450;
				
					that.Ancho 	= Imagen.offsetWidth+22
					that.Alto 	= Imagen.offsetHeight
				
					ImagenAncho = Imagen.offsetWidth
					ImagenAlto 	= Imagen.offsetHeight

					if(that.Ancho < 300 && that.Alto < 200){
						that.Ancho = 322; that.Alto  = 220;	ImagenAncho = 300;
					}				

					if(ImagenAncho > AnchoLimit){
					
						that.Ancho = AnchoLimit+22
						ImagenAncho	= AnchoLimit
						
						Imagen.style.width = ImagenAncho+'px';
						
						ImagenAlto 	= Imagen.offsetHeight
						that.Alto 	= Imagen.offsetHeight
					}


					if(ImagenAlto > AltoLimit){
					
						that.Alto 	= AltoLimit
						ImagenAlto	= AltoLimit
						
						Imagen.style.height = ImagenAlto+'px';
						Imagen.style.width = 'auto';
						
						ImagenAncho = Imagen.offsetWidth
						that.Ancho = Imagen.offsetWidth+22
					}
					
					that.Dark.removeChild(Imagen)
					that.Build_Cont()
					
					Imagen.className = 'ZEN_LB_ImageCont_Show';
					that.Loader.appendChild(Imagen)
					AN.FadeIn(that.Cont.id, 100, 10, 0)
				}
				
			}, 100)
		})	
	},
	
	
	
	
	Ajax: function(Ancho, Alto, TituloTxt, Src){
		
		this.Style		= 'Image'
		this.Ancho 		= Ancho
		this.Alto 		= Alto
		this.TituloTxt	= TituloTxt
		this.Src 		= Src

		this.Build_Dark()
		this.Build_Cont()
		
		new Ajax.Request(this.Src, {
			onSuccess: function(back){
				setInnerHtml(that.Loader.id, back.responseText)
			}
		})
		
		that = this
		AN = new ZEN_Animacion()
		DisplayBlock(that.Dark.id);
		AN.FadeIn(that.Cont.id, 100, 10, 0)

	},

	
	Html: function(Ancho, Alto, TituloTxt, Html){
		
		this.Style		= 'Image'
		this.Ancho 		= Ancho
		this.Alto 		= Alto
		this.TituloTxt	= TituloTxt
		this.Html 		= Html

		this.Build_Dark()
		this.Build_Cont()
		setInnerHtml(this.Loader.id, this.Html)

		that = this
		AN = new ZEN_Animacion()
		DisplayBlock(this.Dark.id);
		AN.FadeIn(that.Cont.id, 100, 10, 0)

	},


	
	/* Build Dark alpha layer */
	Build_Dark: function(){
	
		that					= this
		Dimension 				= getDimension()
		
		
		/* Dark alpha layer Configuration */
		this.Dark				= document.createElement('div')
		this.Dark.id 			= 'ZEN_LB_Element_Dark'
		this.Dark.className 	= 'ZEN_LB_Dark_'+this.Style
		this.Dark.style.height 	= Dimension['HEIGHT_PAGE']+'px'
		this.Dark.style.width  	= '100%'
		
		
		/* Insert Objets */
		InsertarTopOf(this.Dark, getBody())
		
		
		/* Aditional Functions */
		this.Dark.onclick = function(){
			that.Destroy()
		}
	},
	
	
	
	
	/* Build content window with title, close click and loader layer */
	Build_Cont: function(){
	
		that						= this
		ScrollOffSet				= getScrollOffset()
		Dimension 					= getDimension()
		
		/* Content Window Configuration */
		this.Cont					= document.createElement('div')
		this.Cont.id 				= 'ZEN_LB_Element_Cont'
		this.Cont.className 		= 'ZEN_LB_'+this.Style
		this.Cont.style.width  		= this.Ancho+'px'
		this.Cont.style.marginLeft 	= -(this.Ancho/2)+'px'
		this.Cont.style.marginTop 	= ScrollOffSet['Y']-(this.Alto/2)-30+'px'
		
		if(this.Alto > Dimension['HEIGHT_WINDOW']){
			this.Cont.style.marginTop 	= ScrollOffSet['Y']-(Dimension['HEIGHT_WINDOW']/2)+20+'px'
		}
		
	
		/* Div TopBar Configuration */
		this.TopBar					= document.createElement('div')
		this.TopBar.id				= 'ZEN_LB_Element_TopBar'
		this.TopBar.className		= 'ZEN_LB_TopBar'
	
	
		/* Label Title Configuration */
		this.Titulo					= document.createElement('label')
		this.Titulo.id				= 'ZEN_LB_Element_Titulo'
		this.Titulo.className		= 'ZEN_LB_Titulo'
		this.Titulo.innerHTML		= this.TituloTxt
		
		
		/* Label Close Configuration */
		this.Cerrar					= document.createElement('label')
		this.Cerrar.id				= 'ZEN_LB_Element_Cerrar'
		this.Cerrar.className		= 'ZEN_LB_Cerrar'
		this.Cerrar.innerHTML		= 'Cerrar'
		
		
		/* Ajax layer loader Configuration */
		this.Loader					= document.createElement('div')
		this.Loader.id				= 'ZEN_LB_Element_Loader'
		this.Loader.className		= 'ZEN_LB_Loader'
		this.Loader.style.height 	= this.Alto+'px'


		/* Insert Objets */
		InsertarAntesDe(this.Cont, this.Dark)
		InsertarTopOf(this.TopBar, this.Cont)
		InsertarEndOf(this.Titulo, this.TopBar)
		InsertarEndOf(this.Cerrar, this.TopBar)
		InsertarEndOf(this.Loader, this.Cont)

		
		/* Aditional Functions */
		this.Cerrar.onclick = function(){
			that.Destroy()
		}
	},
	


	
	/* Destroy elements */
	Destroy: function(){
	
		that = this
		AN = new ZEN_Animacion()
		AN.FadeOut(that.Cont.id, 1, 10, function callback(){ 
			getBody().removeChild(that.Cont)
			AN.FadeOut(that.Dark.id, 1, 10, function callback(){
				getBody().removeChild(that.Dark)
			
			})
			
		})
		
	}
	
}