// JavaScript Document
	// gallerybox v01.5
	// Ailantd & Additive Works 
	// www.ailantd.com & www.additiveworks.com

	// OJO !!!!! Esta es una versión modificada especial para fandi. NO USAR!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! <------------------------------ !!!!!!!! LEER AQUI !!!!!!
	
	// Gallerybox()
	//------------------------------------------------------------
	//
	// METODOS
	//------------------------------------------------------------
	//
	//------------------------------------------------------------
	function CGallerybox( oDiv , nId )
	{		
		this._nSpeed 			= 0.1 ;		// Scroll speed controler
		this._nMarginRight 		= 6 ;		// Separation bettween images
	
		this._nId 				= nId ;		// Id
		this._oDiv 				= oDiv;		// Main gallerybox div
		this._nWidth2;						// Main div width / 2
		this._nHeight;						// Main div height

		this._oNext;						// Next button div
		this._oPrev;						// Prev button div
		this._oLink;						// To link button div

		this._oContainer;					// Container div
		this._nX ;							// Container div left position
		this._nNextX ;						// Container div next left position

		this._voPictures = [] ;				// Picture objects
		this._nCurrentItemId ;				// To whre is moving the set
		this._bMoving 			= false;	// If the set is moving
		
		var that 				= this;		// Fix for callbacks
		this._timer ;
		
		//------------------------------------------
		// METODOS
		//------------------------------------------

		// AUTOANIMATE
		//
		//-------------------------------------------------
		this.Autoanimate = function()
		{
			//alert( that._bMoving ) ;
			if( !that._bMoving )
			{
				that.GoNext() ;
			}
		}

		this.ResetAutoanimate = function()
		{
			//alert("jus");
			if( that._voPictures.length > 1 )
			{
				that._timer = clearTimeout( that._timer ) ;
				that._timer = setTimeout( that.Autoanimate , 5000 ) ;
			}
		}

		// STOP ANIMATE
		//
		//-------------------------------------------------		
		this.StopAnimate = function()
		{
			that._timer = clearTimeout( that._timer ) ;
		}		
		
		// CREATE
		//
		//-------------------------------------------------
		this.Create = function()
		{
			this._nWidth2 = Math.round( this._oDiv.offsetWidth * 0.5 ) ;
			this._nHeight = this._oDiv.offsetHeight ;
			
			var auxSum = 0
			var auxH ;
			var vImg = this._oDiv.getElementsByTagName( "img" ) ;
			for ( var i=0 ; i<vImg.length ; i++ )
			{
				if( parseInt( vImg[i].height ) > this._nHeight )
				{
					auxH = 0 ;
				}
				else
				{	
					auxH = Math.floor( ( this._nHeight - parseInt( vImg[i].height ) ) * 0.5 ) ;
				}
				
				this._voPictures[i] = new CGalItem( this,
												   	i,
													vImg[i].width, vImg[i].height,
													auxSum,	auxH,
													vImg[i].src, vImg[i].title,	vImg[i].alt, vImg[i].getAttribute("data-urlLink") ) ;
				auxSum = ( parseInt( auxSum + vImg[i].width ) + this._nMarginRight ) ;				
			}

			this._oDiv.innerHTML = "" ;

			this._oContainer = document.createElement( "div" ) ;
			this._oContainer.className = "GalleryboxContainer" ;
			this._oContainer.style.position = "absolute" ;
			this._nNextX = this._nX = 0 ;
			this._oContainer.style.left = this._nX + "px" ;
			this._oDiv.appendChild( this._oContainer ) ;
			var nlength = this._voPictures.length ;
			for ( var i=0 ; i<nlength ; i++ )
			{
				this._voPictures[i].Create();
			}

			this._oNext = document.createElement( "div" ) ;
			this._oNext.className = "GalleryboxNext" ;
			this._oDiv.appendChild( this._oNext ) ;

			this._oPrev = document.createElement( "div" ) ;
			this._oPrev.className = "GalleryboxPrev" ;
			this._oDiv.appendChild( this._oPrev ) ;

			this._oLink = document.createElement( "div" ) ;
			this._oLink.className = "GalleryboxLink" ;
			this._oDiv.appendChild( this._oLink ) ;

			// NOT SHOWING ARROWS IF ONLY 1 IMAGE
			if( this._voPictures.length <= 1 )
			{
				this._oPrev.style.display ="none" ;
				this._oNext.style.display ="none" ;
				this._oLink.style.display ="none" ;
			}

			this._oNext.onclick = this.GoNext;
			this._oPrev.onclick = this.GoPrev;
			this._oLink.onclick = this.GoLink;

			this._voPictures[0].onClick();
			//this._voPictures[0].Show();
			this.CheckLinkButton() ;
			
			// KEY EVENTS
			document.onkeydown = this.HandleOnKeydown;

			
			this.ResetAutoanimate();
		}

		// HANDLE KEY DOWN
		//
		//-------------------------------------------------	
		this.HandleOnKeydown = function(e)
		{
			var myevent = window.event ? window.event : e ;
			switch ( myevent.keyCode )
			{
				case 37:
					that.GoPrev();
					break;
				case 39:
					that.GoNext();
					break;
			}
		}

		// CHECK LINK BUTTON
		//
		//-------------------------------------------------	
		this.CheckLinkButton = function()
		{
			//alert( that._voPictures[ that._nCurrentItemId ]._sTitle ) ;
			if( that._voPictures[ that._nCurrentItemId ]._sUrl == "" )
				that._oLink.style.display = "none" ;
			else
				that._oLink.style.display = "block" ;			
		}
		
		// GO PREV
		//
		//-------------------------------------------------		
		this.GoPrev = function()
		{
			that.ResetAutoanimate() ;
			if( that._nCurrentItemId > 0 )
				 that._voPictures[ that._nCurrentItemId - 1 ].onClick() ;
			else
				 that._voPictures[ that._voPictures.length -1 ].onClick() ;

			// SHOW/HIDE link button:
			that.CheckLinkButton() ;
		}

		// GO CURRENT
		//
		//-------------------------------------------------		
		this.GoCurrent = function()
		{
			that.ResetAutoanimate() ;
			that._voPictures[ that._nCurrentItemId ].onClick() ;
		}
		
		// GO NEXT
		//
		//-------------------------------------------------		
		this.GoNext = function()
		{
			that.ResetAutoanimate() ;
			if( that._voPictures.length > that._nCurrentItemId + 1 )
				that._voPictures[ that._nCurrentItemId + 1 ].onClick() ;
			else
				that._voPictures[0].onClick() ;
			
			// SHOW/HIDE link button:
			that.CheckLinkButton() ;
		}

		// GO LINK
		//
		//-------------------------------------------------		
		this.GoLink = function()
		{
			that.StopAnimate() ;
			window.location = that._voPictures[ that._nCurrentItemId ]._sUrl ;
		}

		// RESET
		//
		//-------------------------------------------------		
		this.Reset = function()
		{
			this._nWidth2 = Math.floor( this._oDiv.offsetWidth * 0.5 ) ;	// Main div width / 2
			this._nHeight = this._oDiv.offsetHeight;		// Main div height
		}
		
		// ANIMATE
		//
		//-------------------------------------------------		
		this.Animate = function( nId , nWidth2 )
		{
			that._nCurrentItemId = nId;
			if( that._voPictures.length >= nId )
			{
				that._nNextX = -( parseInt( that._voPictures[nId]._nLeft ) ) + that._nWidth2 - nWidth2;
				if( !that._bMoving )
				{
					that.Handle( "onFrame" , that.Move );
					that._bMoving = true;
				}
			}
		}

		// MOVE
		//
		//-------------------------------------------------		
		this.Move = function()
		{
			that._nX = parseInt( InterpolateAB( that._nX , that._nNextX , that._nSpeed ) ) ;
			if( that._nX == that._nNextX )
			{
				that.UnHandle( "onFrame" , that.Move ) ;
				//that._voPictures[that._nMovingId].Show();
				that._bMoving = false ;
			}
			that._oContainer.style.left = that._nX + "px" ;

			//document.title = that._nX + " " + that._bMoving ;
		}

		// HANDLE
		//
		//-------------------------------------------------		
		this.Handle = function( sEvent , oFunction )
		{
			if( !oEvent.HasEvent( sEvent , oFunction ) ) oEvent.Handle( sEvent , oFunction );
		}
	
		// UN HANDLE
		//
		//-------------------------------------------------		
		this.UnHandle = function( sEvent , oFunction )
		{
			oEvent.UnHandle( sEvent , oFunction );
		}
	}
	

	//------------------------------------------------------------
	//
	// CGAL ITEM
	//------------------------------------------------------------
	//
	//------------------------------------------------------------
	function CGalItem( oFhaterGal , nId ,  sWidth , sHeight , nLeft , nTop , sBackgroundImage , sTitle , sAlt , sUrl )
	{
		this._oFhaterGal = oFhaterGal;
		this._oDivFhater;
		this._oDiv;
		this._oDivInfo;
		this._oDivPrev;
		this._oDivNext;
		this._nId = nId;
		this._sBackgroundImage = sBackgroundImage;
		this._nWidth = sWidth;
		this._nHeight = sHeight;
		this._nTop = nTop;
		this._nLeft = nLeft;
		this._bBack = false;
		this._sUrl = sUrl ;
		this._sAlt = sAlt ;
		this._sTitle = sTitle ;
			
		var that = this;
		
		//------------------------------------------
		// METODOS
		//------------------------------------------
		
		// CREATE
		//
		//-------------------------------------------------
		this.Create = function()
		{
			this._oDivFhater = this._oFhaterGal._oContainer ;
		
			this._oDiv = document.createElement( "div" );
			this._oDiv.className = "GalleryboxItem" ;
			this._oDiv.style.position = "absolute";
			this._oDiv.style.width = this._nWidth  + "px";
			this._oDiv.style.height = this._nHeight + "px";
			this._oDiv.style.top = this._nTop  + "px";
			this._oDiv.style.left = this._nLeft + "px";
			

			this._oDivFhater.appendChild( this._oDiv );
			
			this._oDiv.onclick = this.onClick;
			//this._oDiv.onmouseover = that.onmouseOver;
			//this._oDiv.onmouseout = that.onMouseOut;

			this._oDivInfo = document.createElement( "div" );
			this._oDivInfo.className = "GalleryboxItemInfo";
			this._oDiv.appendChild( this._oDivInfo ) ;
	/*
			this._oDivPrev = document.createElement( "div" );
			this._oDivPrev.className = "GalleryboxItemPrev";
			this._oDiv.appendChild( this._oDivPrev );
			this._oDivPrev.onclick = this._oFhaterGal.GoPrev;

			this._oDivNext = document.createElement( "div" ) ;
			this._oDivNext.className = "GalleryboxItemNext";
			this._oDiv.appendChild( this._oDivNext );
			this._oDivNext.onclick = this._oFhaterGal.GoNext;
	*/	
			var myInfo = "" ;
			if( this._sTitle != "" ) myInfo = "\<span style\=\"font-size\:14px\; font-weight\:bold\;\">" + this._sTitle + "</span>" ;
			if( this._sTitle != "" && this._sAlt != "" ) myInfo += "<br />" ;
			if( this._sAlt != "" ) myInfo += "<span>" + this._sAlt + "</span>" ;
			
			this._oDivInfo.innerHTML = myInfo ;
			if( this._sTitle == "" ) this._oDivInfo.style.display = "none" ;
			this.Show() ;
			
			//this.Handle( "onItemClick" , that.Hide );
			
		}		

		// ON MOUSE OVER
		//
		//-------------------------------------------------		
		this.onmouseOver = function()
		{
			if( that._bBack ) that._oDivInfo.style.display = "block" ;
		}

		// ON MOUSE OUT
		//
		//-------------------------------------------------		
		this.onMouseOut = function()
		{
			that._oDivInfo.style.display = "none" ;
		}

		// ON CLICK
		//
		//-------------------------------------------------		
		this.onClick = function()
		{	
			//PauseItems();
			//that.Hide();
			//oEvent.Throw( "onItemClick" ) ;
			that._oFhaterGal.Animate( that._nId , parseInt( that._nWidth * 0.5 ) ) ;
			//that._oDiv.style.backgroundColor = "#FFF" ;
		}

		// SWAP
		//
		//-------------------------------------------------		
		this.Swap = function()
		{
			if( that._bBack )
			{ 
				that.Show();
			}
			else
			{
				that.Hide();
			}
			that._bBack = !that._bBack 
		}

		// SHOW
		//
		//-------------------------------------------------		
		this.Show = function()
		{
			this._bBack = true ;
			//that._oDiv.style.backgroundColor = "#FFF" ;
			that._oDiv.style.backgroundImage = "url("+ this._sBackgroundImage +")" ;
		}

		// Hide
		//
		//-------------------------------------------------		
		this.Hide = function()
		{
			this._bBack = false ;
			//that._oDiv.style.background = "" ;
			//that._oDiv.style.backgroundColor = "" ;
		}

		// HANDLE
		//
		//-------------------------------------------------		
		this.Handle = function( sEvent , oFunction )
		{
			if( !oEvent.HasEvent( sEvent , oFunction ) )
			{
				oEvent.Handle( sEvent , oFunction ) ;
			}
		}
	
		// UN HANDLE
		//
		//-------------------------------------------------		
		this.UnHandle = function( sEvent , oFunction )
		{
			oEvent.UnHandle( sEvent , oFunction ) ;
		}		
	}
	
	// Scrollbox Array
	// All Scrollbox detected in the page are stored in this array
	//------------------------------------------------------------
	var vGallerybox = new Array() ;

	// Scrollbox Array
	// Events that fire functions in all the Scrollbox in vScrollbox array
	//------------------------------------------------------------
	window.onresize = GalleryboxReset ;
	//document.onmouseup = GalleryboxStopDrag ;
	
	// ScrollboxReset  - Scrollbox recalculate its shape
	function GalleryboxReset()
	{
		for( var i=0 ; i<vGallerybox.length; i++ ){ vGallerybox[i].Reset() ; }
	}
	
	// ScrollboxDragOff - Scrollbox stop dragging
	//function GalleryboxStopDrag()
	//{
		//for( var i=0 ; i<vGallerybox.length; i++ ){ vGallerybox[i].StopDrag() ; }
	//}

	// initGallerybox()
	// Function goes through div tags looking for class="gallerybox".
	//------------------------------------------------------------
	function initGallerybox()
	{
		var vClass = [] ;
		
		// Delete old scrolls;
		for( var i = 0 ; i<vGallerybox.length ; i++ )
		{
			delete vScrollbox[i] ;
		}
		vGallerybox.splice( 0 , vGallerybox.length ) ;
		
		// Create new Scrolls
		if ( !document.getElementsByTagName ) return ;
		var vDivs = document.getElementsByTagName( "div" ) ;
		for ( var i=0 ; i<vDivs.length ; i++ )
		{
			var oDiv = vDivs[i] ;
			if( oDiv.getAttribute("class") ) // AQUI HAY ALGO RARO, SIN ESTA LINEA FUNCIONA EN LOCAL Y FALLA ONLINE
			{
				vClass = oDiv.getAttribute("class").split(" ") ;
				if ( vClass[0] == "Gallerybox")
				{
					vGallerybox[ vGallerybox.length ] = new CGallerybox( oDiv , vGallerybox.length ) ;
					vGallerybox[ vGallerybox.length - 1 ].Create() ;
				}
			}
		}		
	}
	
	// GalleryboxAddLoadEvent()
	// Adds event to window.onload without overwriting currently assigned onload functions.
	// Function found at Simon Willison's weblog - http://simon.incutio.com/
	//------------------------------------------------------------
	function GalleryboxAddLoadEvent( func )
	{
		var oldonload = window.onload ;
		if ( typeof window.onload != 'function' )
		{
			window.onload = func ;
		}
		else
		{
			window.onload = function()
			{
				oldonload() ;
				func() ;
			}
		}
	}

	//------------------------------------------------------------
	GalleryboxAddLoadEvent( initGallerybox ) ;	// run initScrollbox onLoad