// Gestion du diaporama en javascript / Jquery
// http://jquery.com/


// ================================
// Nombre d'images pour le diaporama
var _nombreImages = 8;
// ================================

// Lorsque tout le HTML du document a bien été chargé
$(document).ready(function() {


		// Initialisation d'une variable comptant les 
		var _compteurImages = 1;
		afficheImage();
		
		// Avance d'une image
		// -----------------------------
		function avance(){
			// On incrémente le compteur d'images
			_compteurImages = _compteurImages + 1;
			// Si on dépasse le nombre d'images, on revient à l'image 1
			if( _compteurImages > _nombreImages){
				_compteurImages = 1;
			}
		}
		
		// Recule d'une image
		// -----------------------------
		function recule(){
			// On incrémente le compteur d'images
			_compteurImages = _compteurImages - 1;
			// Si on dépasse le nombre d'images, on revient à l'image 1
			if( _compteurImages < 1){
				_compteurImages = _nombreImages;
			}
		}
		
		// Affiche l'image
		// -----------------------------
		function afficheImage(){
			// On reconstruit le code HTML de la prochaine image
			var nouvelleImage = '<img src="reportage/irak/image' + _compteurImages + '.jpg />';
			// On charge la nouvelle image dans la div diaporama
			$('#diaporama').html( nouvelleImage );
			// numéro de l'image
			$('p.numero').text("photographie " + _compteurImages + " sur " + _nombreImages );
			return false;
		}
		
		
		// ================================================================
		// Lorsque l'on clique sur la div portant l'id "diaporama"
		// ================================================================
          $('#diaporama').click(
			function(){
				avance();
				afficheImage();
				
			}
		  );
		  
		  
		// ================================================================
		// Lorsque l'on clique sur le lien suivant
		// ================================================================
		$('a#next').click(
			function(){
				avance();
				afficheImage();
			}
		);
		
		// ================================================================
		// Lorsque l'on clique sur le lien précédent
		// ================================================================
		$('a#previous').click(
			function(){
				recule();
				afficheImage();
			}
		);
		
		// ================================================================
		// Lorsque l'on clique sur le lien première
		// ================================================================
		$('a#first').click(
			function(){
				_compteurImages = 1;
				afficheImage();
			}
		);
		
		// ================================================================
		// Lorsque l'on clique sur le lien dernière
		// ================================================================
		$('a#last').click(
			function(){
				_compteurImages = _nombreImages;
				afficheImage();
			}
		);
		  

});