/*
 * Copyright Potato Die 2010
 * All rights reserved
 */

var fadeDuur = 2000;	// duur van fade in ms.
var tussentijd = 5000; // Tijd tussen 2 fades in ms. Oftewel de tijd dat een banner staat

var container;
		
function startCrossFadeSeries() 
{
	var level1DOMsupported = document.createElement;
	// Let op dat er geen tekstnodes in mContainer staan
	container = document.getElementById("mContainer");	
	var imageArray = [
	"/images/slides/slide2.jpg", "/images/slides/slide3.jpg", "/images/slides/slide4.jpg", "/images/slides/slide6.jpg"	 ];
	
	if ( !container || !level1DOMsupported || imageArray.length < 1 )
	{
		return;
	}
	
	container.innerHTML = '';
	
	function legKaartjeOpStapel( imgNaam )
	{ 
		var kaartje = document.createElement( 'div' );
		kaartje.className = "mPhoto";
		var afb = document.createElement( "img" );
		afb.src = imgNaam;
		afb.alt = '';		
		kaartje.appendChild ( afb );
		//container.appendChild ( kaartje );
		// Leg hem onderop
		container.insertBefore ( kaartje, container.firstChild );				
	}
	
	// Maak stapel
	for ( var i = imageArray.length - 1; i != -1; i-- )
	{
		legKaartjeOpStapel ( imageArray[i] );
	}

	window.setTimeout ( "crossFadeSeries()", tussentijd);
}
	
var fadeStart;			// begintijdstip van fade
var fading = false;
var verversPeriode = 10;	// Snelheid waarmee beeldscherm wordt ververst in ms. Pakt vaak lager uit.

function crossFadeSeries() 
{
	var nu = new Date();
	var timeout;
	if ( !fading )
	{
		fadeStart = nu.getTime();
		fading = true;
	}

	// Parameter t loopt van 0 naar 1
	var t = ( nu.getTime() - fadeStart ) / fadeDuur;
	
	if ( t < 1 ) // Fade nog gaande
	{
		var dekking = 100 * (1 - t);
		setOpacity ( container.lastChild, dekking );

		timeout = verversPeriode;	
	}
	else // Tijd is om. Fade voltooien:
	{
		var fadedKaartje = container.lastChild;
		container.insertBefore ( fadedKaartje, container.firstChild );		
		setOpacity ( fadedKaartje, 100 );

		fading = false;
	
		// Volgende fade na pauze (tussentijd)
		timeout = tussentijd;
	}

	setTimeout ( "crossFadeSeries()", timeout);
}

function setOpacity ( element, opacity ) 
{
	// In NN / Moz, when opacity is 100, flickering occurs. If the opacity is reduced to 99.99, this does not happen.
	if (opacity == 100 && (navigator.userAgent.indexOf('Gecko') != -1 && navigator.userAgent.indexOf('Safari') == -1)) 
	{
		opacity = 99.99;
	}

	// Set CSS 3, Moz, NN, FF, gecko, Konqueror, Safari
	element.style.opacity = element.style.MozOpacity = element.style.KhtmlOpacity = opacity / 100;

	// Set IE
	element.style.filter = 'alpha(opacity=' + opacity + ')';
}