$(document).ready(function()
	{
		
		
		var $to=null;
		var $currentoffrerow=0;
		var $currentoffrecol=0;
		
		function animateOffre(){
			var $nbroffre=nbre_offre;
			var $nbr_pack=nbre_pack;
			var $nbr_last=nbre_last;
			var $tabr=new Array($nbroffre,$nbr_pack,$nbr_last);
			clearTimeout($to);
			$currentoffrecol++;
			if($currentoffrecol>=$tabr[$currentoffrerow]){
				$currentoffrecol=0;
			}
			$("#offres_defil").animate({top:"-"+(105*$currentoffrerow)+"px"},300);
			$("#offres_defil").animate({left:"-"+(250*$currentoffrecol)+"px"},300);
			
			$to=setTimeout(animateOffre,5000);
		}
		$to=setTimeout(animateOffre,5000);
		
		$("#vOffres").click(function(){
			$currentoffrecol=-1;
			$currentoffrerow=0;
			animateOffre();
			return false;
		});
		$("#vPack").click(function(){
			$currentoffrecol=-1;
			$currentoffrerow=1;
			animateOffre();
			return false;
		});
		$("#vLast").click(function(){
			$currentoffrecol=-1;
			$currentoffrerow=2;
			animateOffre();
			return false;
		});
		
		// on donne un id à la première et dernière <li>
		$('#galerie li').first().attr('id', 'premiere');
		$('#galerie li').last().attr('id', 'derniere');
		// application de l'écouteur
		$(".action").click(changeImage);
    	var $element = $('#galerie li').first();
    	// apparition en fondu
    	$element.fadeIn(1000);
		var $t=null;
		function changeImage() {
			// disparition en fondu
			clearTimeout($t);
		    $element.fadeOut(1000); 
		    // click sur le bouton précédent
		    if($(this).attr('id')=="precedent"){
		      if($element.attr('id')=="premiere"){
		        // passage de la première à la dernière <li>
				    $element = $('#galerie li').last();
				  } else {
				    // <li> précédente 
				    $element = $element.prev();
				  }				
			} else {
	    	if($element.attr('id')=="derniere"){
	        // passage de la dernière à la première <li>
			    $element = $('#galerie li').first();
			  } else {
			    // <li> suivante
			    $element = $element.next();
			  }
			}
			$element.fadeIn(1000);
			$t=setTimeout(changeImage,5000);
		}
		$t=setTimeout(changeImage,5000);
		//application d'un style sur les boutons avec jQuery UI, c'est tout ce dont à quoi sert UI ici
	  	
	});