// JavaScript Document

$(function(){
	
	
	tImages = ""; // Tableau qui sera rempli en ajax, contient les chemins vers les images de la BD
	numCourant = 0; // Numéro de l'image courante dans le tableau
	largeur_haut = 790;
	largeur_bas = 597;
	vitesse = 400;
	
	imgCourante = 1; // Numéro de l'image courante physique (l'index du li dans le ul#banniere)
	nbImages = $('ul#banniere li').size();
	peutBouger = true;
	
	if( $('ul#banniere').hasClass('haut') ) {
		largeurTotale = largeur_haut;
	}else if( $('ul#banniere').hasClass('bas') ) {
		largeurTotale = largeur_bas;
	}
	
	// Cacher les boutons pour changer d'image au début
	$('#boutonsBanniere button').hide();
	
	// Récupérer la liste d'images dans un ordre aléatoire
	jQuery.get("ajax/banniere.php",{"recupererListe":true},function(e){
	
		tImages = e.split(',');
		
		// Charger la première image quand la page est chargée
		chargerImage(0, false);
		
	});	
	
	verifierBoutons();
	
	$('button#banniereGauche').bind('click',function(){
		
		if(peutBouger) {
			deplacerGauche();
		}
		
	});
	$('button#banniereDroite').bind('click',function(){
		
		if(peutBouger) {
			deplacerDroite();
		}
		
	});
	
	demarrerTimer();
	
});

// Fonction qui charge l'image et qui appelle le déplacement vers la droite après
function chargerImage(num, deplacement) {
	
	$('#boutonsBanniere button').hide();
	$('#chargement').show();
		
	if( $('ul#banniere').hasClass('bas') ) {
		format = "_carre";
	}else {
		format = "_rectangle";
	}
	
	var img = new Image();
	$(img).load(function () {
		
		var a = $('<li></li>');
		var b = $('<a href="'+ tImages[num] +'_complet.png" rel="lightbox" target="_blank" title="portfolio"></a>');
		b.append($(this)).appendTo(a);
		a.appendTo('ul#banniere');
		
		$('#chargement').hide();
		$('#boutonsBanniere button').show();
		
		if(deplacement) {
			var ancienne = $('ul#banniere li:nth-child('+ (imgCourante) +')');
			bougerDroite(ancienne, a);
		}
		  
	}).attr('src', tImages[num] + format + '.png');
	
}

function demarrerTimer() {

	monTimer = window.setInterval(deplacerDroite, 3000);

}

function resetTimer() {

	clearInterval ( monTimer );
	monTimer = window.setInterval(deplacerDroite, 3000);

}

// Vérifier si on peut se déplacer et s'il faut charger l'image
function deplacerDroite() {
	
	// Déplacer seulement s'il y a plus d'une image
	if(tImages.length > 1 && numCourant < tImages.length-1) {
	
		peutBouger = false;
		
		// L'image courante
		var ancienne = $('ul#banniere li:nth-child('+ imgCourante +')');
		
		// La nouvelle image
		var nouvelle = $('ul#banniere li:nth-child('+ (imgCourante+1) +')');
		if(!nouvelle.length) {
			chargerImage(numCourant+1, true);
		}else {
			bougerDroite(ancienne, nouvelle);
		}
		
	}
	
}

function bougerDroite(ancienne, nouvelle) {
	// Animer l'ancienne image
	ancienne.animate({
		'left':'-='+largeurTotale
	},{
		duration:vitesse,
		queue:false
	});
	
	// Animer la nouvelle image
	nouvelle.animate({
		'left':'-='+largeurTotale
	},{
		duration:vitesse,
		queue:false,
		complete:function(){
			
			imgCourante ++;
			numCourant ++;
			peutBouger = true;
			verifierBoutons();
			resetTimer();
			
		}
	});
}

// Vérifier si on peut se déplacer et s'il faut charger l'image
function deplacerGauche() {
	
	// Déplacer seulement s'il y a plus d'une image
	if(tImages.length > 1 && imgCourante > 1) {
	
		peutBouger = false;
		
		// L'image courante
		var ancienne = $('ul#banniere li:nth-child('+ imgCourante +')');
		
		// La nouvelle image
		var nouvelle = $('ul#banniere li:nth-child('+ (imgCourante-1) +')');
		
		bougerGauche(ancienne, nouvelle);
		
	}
	
}

function bougerGauche(ancienne, nouvelle) {
	
	// Animer l'ancienne image
	ancienne.animate({
		'left':'+='+largeurTotale
	},{
		duration:vitesse,
		queue:false
	});
	
	// Animer la nouvelle image
	nouvelle.animate({
		'left':'+='+largeurTotale
	},{
		duration:vitesse,
		queue:false,
		complete:function(){
			
			imgCourante --;
			numCourant --;
			peutBouger = true;
			verifierBoutons();
			resetTimer();
			
		}
	});
	
}

// Vérifier si les boutons sont actifs ou non (début ou fin de la liste)
function verifierBoutons() {

	if(imgCourante == 1) {
		$('button#banniereGauche').attr('disabled','disabled');
	}else {
		$('button#banniereGauche').removeAttr('disabled');
	}
	
	if(imgCourante == tImages.length) {
		$('button#banniereDroite').attr('disabled','disabled');
	}else {
		$('button#banniereDroite').removeAttr('disabled');
	}

}