var bandeau = new Class({
  initialize: function(src, titre, legende){
 this.src = src;
 this.titre = titre;
 this.legende = legende;
  }
});
 

var _BANDEAU_DIV_ID = "bandeau_";
var _SLIDESHOW_TIMING = 5000;
var _BANDEAU_RACINE_ID = "banner";
var tab_bandeaux = new Array();
var images_files = new Array();
var bandeaux_loading_count = 0; 
var currentbandeau = -1;

images_files[0] = "img/bandeau_1.png";
tab_bandeaux[0] = new bandeau(images_files[0],'Résidence du cap', 'Résidence du cap'); 
images_files[1] = "img/bandeau_2.png";
tab_bandeaux[1] = new bandeau(images_files[1],'Résidence du cap', 'Résidence du cap');
images_files[2] = "img/bandeau_3.png";
tab_bandeaux[2] = new bandeau(images_files[2],'Résidence du cap', 'Résidence du cap');
images_files[3] = "img/bandeau_4.png";
tab_bandeaux[3] = new bandeau(images_files[3],'Résidence du cap', 'Résidence du cap');
images_files[4] = "img/bandeau_5.png";
tab_bandeaux[4] = new bandeau(images_files[4],'Résidence du cap', 'Résidence du cap');

window.addEvent('domready', function() { 
	var loader = new Asset.images(images_files, { 
	  
		onProgress: function(counter,index) { 
			//Création du conteneur pour le bandeau chargé
			var mydiv = new Element('div', {id:_BANDEAU_DIV_ID+index}).inject($(_BANDEAU_RACINE_ID));
			mydiv.setOpacity(0); //Bandeau invisible par défaut
			
			//Création de l'image
			var myimg = new Element('img',{ src:tab_bandeaux[index].src, 'style':'display:none'}).inject(mydiv);
			  
			bandeaux_loading_count = index+1;
			   
			if (index == 0) {
			   startslideshow();
			   startslideshow.periodical(_SLIDESHOW_TIMING);
			}
		}
	});		

});

var startslideshow = function() {
 if (currentbandeau >= 0) {
  $(_BANDEAU_DIV_ID + currentbandeau).fade(1, 0);
 } else {
  currentbandeau = 0;
 }
 
 if (currentbandeau >= (bandeaux_loading_count-1)) {
  currentbandeau = 0;
 } else {
  currentbandeau++;
 }
 //console.log('Changement pour '+_BANDEAU_DIV_ID + currentbandeau);
 //$(_BANDEAU_DIV_ID + currentbandeau).getElement('div').setStyle('display', '');
 $(_BANDEAU_DIV_ID + currentbandeau).fade(0, 1);
 $$('#'+_BANDEAU_RACINE_ID+' img').setStyle('display', 'block');
}