Slideshow =
{

	slides: [],
	current_index: 1,

	initialize: function()
	{

		// Let's loop through all the slides.
		for ( var i = 0; i < 3; i++ )
		{

			// Create a div for this slide.
			Slideshow.slides[i] = $$( 'header' ).create( 'div', { className: 'slide' }, true, '<img src="' + SITE_URL + '/img/header' + (i + 1) + '.jpg" />' );
			var slide = $( Slideshow.slides[i] );

			slide.setStyle( 'opacity', 0.01 );

		}

		// Let's set up the first slide.
		Slideshow.setupSlide( 1 );

	},


	setupSlide: function( slide_id )
	{

		var slide = Slideshow.slides[slide_id];

		slide.setStyle( 'opacity', 0.01 );
		slide.setStyle( 'z-index', 5 );

		// Set the final slide out animation.
		var anim = new Legato_Animation( slide, 1300 );
		anim.controller.opacity.to = 1;
		anim.controller.delay = 4000;
		anim.onFinish = function(){ Slideshow.nextSlide(); };

		// Start the sequence.
		anim.start();

	},


	nextSlide: function()
	{

		if ( Slideshow.current_index == 0 )
			Slideshow.slides[(Slideshow.slides.length - 1)].setStyle( 'z-index', 1 );
		else
			Slideshow.slides[(Slideshow.current_index - 1)].setStyle( 'z-index', 1 );

		var slide = Slideshow.slides[Slideshow.current_index];
		slide.setStyle( 'z-index', 4 );

		// Get the next slide's ID.
		var next_slide = Slideshow.current_index + 1;

		// If this is the last slide in the slideshow, start over again.
		if ( next_slide >= Slideshow.slides.length )
			next_slide = 0;

		// Set the current index to the next slide's ID.
		Slideshow.current_index = next_slide;

		// Now set up the slide to slide in.
		Slideshow.setupSlide( next_slide );

	}

}

Legato_Events_Handler.DOMReady( function(){ Slideshow.initialize(); } );