var header = {

	// Liste des images de fond à faire défiler
	backgrounds: [
		'/images/energie-1.jpg'
		,'/images/eau_sol-1.jpg'
		,'/images/energie-2.jpg'
		,'/images/eau_sol-2.jpg'
		,'/images/energie-3.jpg'
		,'/images/eau_sol-3.jpg'
	]

	// délai entre chaque rotation
	,delay: 5000

	// vitesse de la rotation entière (ferme + ouvre)
	,speed: 300

	// décalage entre le déclenchement des rotations de chaque bloc
	,interval: 100


	// faire tourner la liste des images de fond suivante
	,rotateBackground: function()
	{
		var bg = header.backgrounds.shift();
		header.backgrounds.push( bg );
	}


	// appliquer l'image de actuelle à un élément
	,applyBackground: function( element )
	{
		if ( element == undefined ) element = this;
		$(element).css('background-image','url('+header.backgrounds[0]+')');
	}


	// plier un élément (demie rotation qui ferme)
	,fold: function( percent )
	{
		header.transform( this, 1-percent, 30*percent );
	}

	// déplier un élément (demie rotation qui ouvre)
	,unfold: function( percent )
	{
		header.transform( this, 1-percent, -30*percent );
	}


	// application css d'une rotation
	,transform: function (element, scale, skew )
	{
		var transform = 'scale(1,'+scale+') skew('+skew+'deg,0deg)';
		$(element).css({
			"transform": transform
			,"-moz-transform": transform
			,"-webkit-transform": transform
			,"-o-transform": transform
			,"-ms-transform": transform
		});
	}
}


$(function()
{
	// application du premier fond !
	header.applyBackground( $("#blocks").find('.block') );

	// déclencheur de rotation
	$("#blocks").bind('flip',function()
	{
		// préparation du prochain fond
		header.rotateBackground();

		// on fait trouner les blocs en décalé
		$(this).find('.block').each(function(i)
		{
			$(this).delay(header.interval*i)
				.animate({fold:1},{duration:header.speed/2,step:header.fold,complete:header.applyBackground})
				.animate({fold:0},{duration:header.speed/2,step:header.unfold,complete:function(){$(this).trigger('done');}})
		});
	});

	// déclencher la prochaine rotation
	$("#blocks").find('.block').last().bind('done',function()
	{
		setTimeout( function() { $("#blocks").trigger('flip'); }, header.delay );
	});


	// préchargement des images
	images = [];
	for( k in header.backgrounds )
	{
		images[k] = new Image(1,1);
		images[k].src = header.backgrounds[k];
	}

	// programmation de la prochaine rotation
	setTimeout( function() { $("#blocks").trigger('flip'); }, header.delay );
});