com.ydso.modules.slideShow = function( moduleId )
{
	var busy 			= false;
	var _self			= this;													// Self reference for timer callback

	var galleryImages	= new Array();
	var currentImage	= 0;
	var countImages		= 0;
	var tweenPhoto;
	var container		= document.getElementById( "moduleSlideShow" + moduleId );
	var tweenEffect;
	var tweenEffectTime;
	var thumbEnabled	= false;
	var easing;   //<---- wordt nog niet gebruikt
	var tweenDescription;
	var slideshowDescription;
	var slideThumbs = {};
	var timeout;
	var autoTimer;
	
	
	var begin;
	var finish;
	
	var primary;				// contains the primary image container
	var secondary;
	
	var imageA;
	var imageB;

	this.init = function( xml )
	{
		/**
		 * Load configuration from XML file
		 */
		var tweenWidth			= parseInt( xml.getElementsByTagName("width")[0].childNodes[0].nodeValue );
		var tweenHeight			= parseInt( xml.getElementsByTagName("height")[0].childNodes[0].nodeValue );
		var tweenControls		= xml.getElementsByTagName("controls")[0].childNodes[0].nodeValue;
		var tweenAutoscroll		= xml.getElementsByTagName("autoscroll")[0].childNodes[0].nodeValue;
		tweenDescription		= parseInt( xml.getElementsByTagName("description")[0].childNodes[0].nodeValue );
		tweenEffect				= xml.getElementsByTagName("effect")[0].childNodes[0].nodeValue;
		tweenEffectTime			= parseInt( xml.getElementsByTagName("effectTime")[0].childNodes[0].nodeValue );
		easing					= xml.getElementsByTagName("animation")[0].childNodes[0].nodeValue;
		timeout					= xml.getElementsByTagName("timeout")[0].childNodes[0].nodeValue;
		var tweenImages			= xml.getElementsByTagName("image");
		var shuffle				= ( xml.getElementsByTagName("random")[0].childNodes[0].nodeValue == "0" ) ? false : true;
		thumbEnabled			= ( xml.getElementsByTagName("thumbnails")[0].childNodes[0].nodeValue == "0" ) ? false : true;
		var thumbWidth			= xml.getElementsByTagName("thumb_width")[0].childNodes[0].nodeValue;
		var thumbHeight			= xml.getElementsByTagName("thumb_height")[0].childNodes[0].nodeValue;
		
		
		/**
		 * 
		 */
		container.className			= "slideshow";
		container.style.position	= "relative";
		container.style.height		= tweenHeight + "px";
		container.style.width		= tweenWidth + "px";

		/**
		 * Create a mask for the images so they don't overlap with the controls or other elements
		 */
		imageMask					= document.createElement( "div" );
		imageMask.className			= "slideshowImageContainer";
		imageMask.style.position 	= "absolute";
		imageMask.style.overflow	= "hidden";
		imageMask.style.height		= tweenHeight + "px";
		imageMask.style.width		= tweenWidth + "px";
		
		/**
		 * Mask for rounded corners or something like that
		 */
		containerMask					= document.createElement( "div" );
		containerMask.className			= "mask";
		containerMask.style.position 	= "absolute";
		containerMask.style.overflow	= "hidden";
		containerMask.style.height		= tweenHeight + "px";
		containerMask.style.width		= tweenWidth + "px";
		
		/**
		 * 
		 */
		if ( thumbEnabled == true )
		{
			thumbnails						= document.createElement( "div" );
			thumbnails.className			= "thumbnails";
			thumbnails.style.position 		= "absolute";
		}
		

		
		/**
		 * Create two images, one for the current image, one for the next
		 */
		imageA 						= document.createElement( "img" );
		imageA.className			= "slideshowImage";
		imageA.style.position 		= "absolute";
		imageA.style.height			= tweenHeight + "px";
		imageA.style.width			= tweenWidth + "px";
		
		imageB 						= document.createElement( "img" );
		imageB.className			= "slideshowImage";
		imageB.style.position 		= "absolute";
		imageB.style.height			= tweenHeight + "px";
		imageB.style.width			= tweenWidth + "px";
		

		/**
		 * Get all images from the xml and put all data in an array
		 */
		countImages				= tweenImages.length;
	
	
		for ( var i = 0; i < countImages; i++ )
		{
			galleryImages[i] = {};
			galleryImages[i].url = tweenImages[i].getElementsByTagName("url")[0].childNodes[0].nodeValue;
			galleryImages[i].txt = tweenImages[i].getElementsByTagName("description")[0].childNodes[0].nodeValue;
			galleryImages[i].img = new Image();
			
			if ( thumbEnabled == true )
			{
				var thumbnail = document.createElement( "img" );
				thumbnail.setAttribute( "src", tweenImages[i].getElementsByTagName("thumb")[0].childNodes[0].nodeValue );
				thumbnail.setAttribute( "slide", i );
				thumbnail.style.width	= thumbWidth + "px";
				thumbnail.style.height	= thumbHeight + "px";
				thumbnail.style.cursor	= "pointer";
				
				thumbnail.onclick 		= function()
				{
					_self.gotoSlide( this.getAttribute( 'slide' ) ); 
				};
				
				thumbnail.setActive	= function()
				{
					this.className += " active";
				};
				
				thumbnail.setInActive	= function()
				{
					this.className = this.className.replace(new RegExp(" active\\b"), "");
				};

				thumbnails.appendChild( thumbnail );
				
				slideThumbs[i] = thumbnail;
			}
			
		}

		
		/**
		 * 
		 */
		if ( shuffle == true )
		{
			var tempImages = [];
			
			for ( var i = 0; i < countImages; i++ )
			{
				tempImages.push( galleryImages.splice( Math.random() * galleryImages.length, 1 )[0] );
			}
			
			galleryImages = tempImages;
			tempImages = null;
		}
		
		
		if ( thumbnail == true )
		{
			galleryImages[0].setActive();
		}
		
		/**
		 * Set the default values
		 */
		imageA.src				= galleryImages[0].url;
		primary					= imageA;
		secondary				= imageB;
		
		/**
		 * Set easing function
		 */
		switch ( easing )
		{
			case 'linear':
				easing = com.ydso.easing.linear;
				break;
				
			case 'outBack':
				easing = com.ydso.easing.outBack;
				break;
				
			case 'inElastic':
				easing = com.ydso.easing.inElastic;
				break;
				
			case 'backInCubic':
				easing = com.ydso.easing.backInCubic;
				break;
				
			case 'outBackCubic':
				easing = com.ydso.easing.outBackCubic;
				break;
		}
		
		/**
		 * Set tween start and end points
		 */
		switch ( tweenEffect )
		{
			case 'x':
				finish	= tweenWidth;
				new com.ydso.transitions.Tween( secondary, tweenEffect, com.ydso.easing.linear, 0, -finish, 50 );
				break;
			
			case 'y':
				finish	= tweenHeight;
				new com.ydso.transitions.Tween( secondary, tweenEffect, com.ydso.easing.linear, 0, -finish, 50 );
				break;
				
			case 'alpha':
				finish	= 1;
				new com.ydso.transitions.Tween( secondary, tweenEffect, com.ydso.easing.linear, 1, 0, 50 );
				break;
		}
		
		
		if ( tweenDescription == 1 )
		{
			slideshowDescription				= document.createElement( "div" );
			slideshowDescription.className		= "slideshowDescription";
			slideshowDescription.style.position	= "absolute";
			slideshowDescription.innerHTML		= galleryImages[0].txt;
			
			container.appendChild( slideshowDescription );
		}
		
		if ( tweenAutoscroll == 1 )
		{
			autoTimer = setInterval ( function() { _self.btnNextClick(); }, timeout );
		}

		if ( tweenControls == 1 )
		{
			var controlContainer 			= document.createElement( "div" );
			controlContainer.className		= "slideshowControls";
			controlContainer.style.position	= "absolute";
			controlContainer.style.height	= tweenHeight + "px";
			controlContainer.style.width	= tweenWidth + "px";
		
			var btnNext 					= document.createElement( "div" );
			btnNext.style.position			= "absolute";
			btnNext.style.cursor			= "pointer";
			btnNext.className 				= 'slideshowNextSlide';
			btnNext.onclick 				= function() { _self.btnNextClick(); };
			
			var btnBack 					= document.createElement( "div" );
			btnBack.style.position			= "absolute";
			btnBack.style.cursor			= "pointer";
			btnBack.className 				= 'slideshowPreviousSlide';
			btnBack.onclick 				= function() { _self.btnBackClick(); };
			
			
			controlContainer.appendChild( btnNext );
			controlContainer.appendChild( btnBack );
			
			/**
			 * Fade in/out when you move over the buttons
			 *
			 * tween 							= new com.ydso.transitions.Tween( slideshowControls, 'alpha', com.ydso.easing.linear, 1, 0.4, 1000 );
			 * slideshowControls.onmouseover	= function() { tween = new com.ydso.transitions.Tween( slideshowControls, 'alpha', com.ydso.easing.linear, 0.4, 1, 100); };
			 * slideshowControls.onmouseout		= function() { tween = new com.ydso.transitions.Tween( slideshowControls, 'alpha', com.ydso.easing.linear, 1, 0.4, 100); };
			*/
		}
		
		/**
		 * Append all components to the container
		 */
		imageMask.appendChild( imageA );
		imageMask.appendChild( imageB );
		
		container.appendChild( imageMask );
		container.appendChild( containerMask );
		
		if ( tweenControls == 1 )
		{
			container.appendChild( controlContainer );
		}
		

		if ( thumbEnabled == true )
		{
			container.appendChild( thumbnails );
		}
	}
	
	/**
	 * Next button click eventHandler
	 */
	this.btnNextClick = function ()
	{
		var next = currentImage + 1;
	
		if ( next > countImages - 1 )
		{
			next = 0;
		}
		
		this.gotoSlide( next );
	}
	
	/**
	 * Back button click eventHandler
	 */
	this.btnBackClick = function ()
	{
		var next = currentImage - 1;
	
		if ( next < 0 )
		{
			next = countImages - 1;
		}
		
		this.gotoSlide( next );
	}
	
	/**
	 * Goto slide by index
	 */
	this.gotoSlide = function ( value )
	{
		if ( !busy )
		{
			busy = true;
			
			if ( thumbEnabled == true )
			{
				slideThumbs[currentImage].setInActive();
			}
			
			clearInterval( autoTimer );
			autoTimer = setInterval ( function() { _self.btnNextClick(); }, timeout );
			
			if ( tweenEffect != 'alpha' )
			{
				if ( value < currentImage )
				{
					primaryStart	= 0;
					primaryEnd 		= -finish;
					secondaryStart	= finish;
					secondaryEnd 	= 0;
				}
				else
				{
					primaryStart	= 0;
					primaryEnd 		= finish;
					secondaryStart	= -finish;
					secondaryEnd 	= 0;
				}
			}
			else
			{
				primaryStart	= 1;
				primaryEnd 		= 0;
				secondaryStart	= 0;
				secondaryEnd 	= 1;
			}
	
			currentImage = value;
			
			if ( thumbEnabled == true )
			{
				slideThumbs[currentImage].setActive();
			}
			
			galleryImages[currentImage].img.src		= galleryImages[currentImage].url;
			galleryImages[currentImage].img.onload	= function()
			{
				secondary.src = galleryImages[currentImage].img.src;
				
				
				
				new com.ydso.transitions.Tween( primary, tweenEffect, easing, primaryStart, primaryEnd, tweenEffectTime );
				new com.ydso.transitions.Tween( secondary, tweenEffect, easing, secondaryStart, secondaryEnd, tweenEffectTime, _self.tweenOutComplete );
				
				if ( tweenDescription )
				{
					new com.ydso.transitions.Tween( slideshowDescription, 'alpha', com.ydso.easing.outBackCubic, 1, 0, tweenEffectTime / 2, _self.changeDescription );
				}
			};
		}
	}

	this.tweenOutComplete = function ()
	{
		if ( primary == imageA )
		{
			primary = imageB;
			secondary = imageA;
		}
		else
		{
			primary = imageA;
			secondary = imageB;	
		}
		
		busy = false;
	}
	
	this.changeDescription = function ()
	{
		slideshowDescription.innerHTML = galleryImages[currentImage].txt;
		new com.ydso.transitions.Tween( slideshowDescription, 'alpha', com.ydso.easing.outBackCubic, 0, 1, tweenEffectTime / 2 );
	}
	
	var request = new com.ydso.net.HTTPRequest();
	request.url			= "/var/cache/" + moduleId + ".xml";
	request.callback	= _self.init
	request.mode		= "XML";
	request.send();
};