jQuery(document).ready(function($){
	
	var timerID;
	
	function slideSwitch() {
	    
		$('#slideshow').each(function(){
      		var $imgs = $('>img', this);

      		if ($imgs.length > 1) {
	    		
	    		var $active = $('>img.active', this);
				
	    		if ( $active.length == 0 ) $active = $('>img:last', this);
				
	    		var $next =  $active.next('img').length ? $active.next('img') : $('>img:first', this);
				
	    		$active.addClass('last-active');
				
				$('#overlay-infos').animate({bottom: -50}, 500, function() {
					$('#overlay-infos').html($next.attr('alt'));
	    		});
				
	    		$('#slideshow li').removeClass('row_active');
	    		$('li#name-'+$next.attr('rel')).addClass('row_active');
				
	    		$next.css({opacity: 0.0})
	    		    .addClass('active')
	    		    .animate({opacity: 1.0}, 1000, function() {
	    		        $active.removeClass('active last-active');
	    		        $('#overlay-infos').animate({bottom: 0}, 500);
	    		    });
	    	}
	    	    
	  	});
	}
	timerID = setInterval( function(){ slideSwitch(); }, 7000 );
	
	// Clique sur un élément
	$('#slideshow li a').click(function(){
		
		clearInterval(timerID);
			
		var $active = $('#slideshow>img.active');
		
		if ( $active.length == 0 ) $active = $('#slideshow>img:last');
		
		//var $next =  $active.next('img').length ? $active.next('img') : $('#slideshow>img:first');
		var $next = $('#slideshow>img[rel='+$(this).attr('rel')+']');
		
		$active.addClass('last-active');
		
		$('#overlay-infos').animate({bottom: -50}, 500, function() {
		    $('#overlay-infos').html($next.attr('alt'));
		});
		
		$('#slideshow li').removeClass('row_active');
		$('li#name-'+$next.attr('rel')).addClass('row_active');
		
		$next.css({opacity: 0.0})
		    .addClass('active')
		    .animate({opacity: 1.0}, 1000, function() {
		        $active.removeClass('active last-active');
		        $('#overlay-infos').animate({bottom: 0}, 500);
		    });
		
		timerID = setInterval( function(){ slideSwitch(); }, 7000 );
		 
		return false;

	});
	
	// Clique sur l'image
	$('#slideshow>img').click(function(){
		var url = $('#slideshow a[rel='+$(this).attr('rel')+']').attr('href');
		window.open(url);
	});
	
	// Navigation clients
	var padding = 60;
	$('.droite').click(function() {
		var limite = $('#slideshow-clients').width() - $('#conteneur-clients').width();
		var position = $('#conteneur-clients').position();
	    if (position.left > limite)
	    	$('#conteneur-clients').animate({
    			left: position.left-padding
  			});
  		return false;
	});
	
	$('.gauche').click(function() {
	    var limite = $('#slideshow-clients').width() - $('#conteneur-clients').width();
		var position = $('#conteneur-clients').position();
	    if (position.left < 0)
	    	$('#conteneur-clients').animate({
    			left: position.left+padding
  			});
  		return false;
	});
	
	function goRight(){ $('.droite').click(); }
	function goLeft(){ $('.gauche').click(); }
	
	var interval = null;
	$('.droite').hover(function() {
  		interval = setInterval(goRight, 500);
	}, function() {
		clearInterval(interval);
	});
	$('.gauche').hover(function() {
  		interval = setInterval(goLeft, 500);
	}, function() {
		clearInterval(interval);
	});
});