$(document).ready(function(){
	var currentPosition_nouveaute = 0;
	var currentPosition_promotion = 0;
	var slideWidth = 560;
	var slides_nouveaute = $('.slides_nouveautes');
	var slides_promotion = $('.slides_promotions');
	var numberOfSlides_nouveaute = slides_nouveaute.length;
	var numberOfSlides_promotion = slides_promotion.length;

	// Supprime la scrollbar en JS
	$('#slidesContainer').css('overflow', 'hidden');
	$('#slidesContainer_promotion').css('overflow', 'hidden');

	slides_nouveaute
	.wrapAll('<div id="slideInner"></div>')
	// on met tous les slides en float:left pour qu'il s'affichent de manière horizontale
	.css({
		'float' : 'left',
		'width' : slideWidth
	});

	slides_promotion
	.wrapAll('<div id="slideInner_promotion"></div>')
	// on met tous les slides en float:left pour qu'il s'affichent de manière horizontale
	.css({
		'float' : 'left',
		'width' : slideWidth
	});

	// La longueur de #slideInner équivaut à la somme de la longueur de tous les slides
	$('#slideInner').css('width', slideWidth * numberOfSlides_nouveaute);
	$('#slideInner_promotion').css('width', slideWidth * numberOfSlides_promotion);

	// Cache la flèche de gauche au début
	manageControls(currentPosition_nouveaute, '');
	manageControls(currentPosition_promotion, '_promotion');

	// crée un écouteur pour l'évènement de type clic sur les div qui ont la classe .control
	$('.control').bind('click', function(){
			// Determine une nouvelle position
			currentPosition_nouveaute = ($(this).attr('id')=='rightControl') ? currentPosition_nouveaute+1 : currentPosition_nouveaute-1;

			//Cache ou montre les flèches
			manageControls(currentPosition_nouveaute, '');
			// Move slideInner using margin-left
			$('#slideInner').animate({
				'marginLeft' : slideWidth*(-currentPosition_nouveaute)
			});
	});

	$('.control_promotion').bind('click', function(){
			// Determine une nouvelle position
			currentPosition_promotion = ($(this).attr('id')=='rightControl_promotion') ? currentPosition_promotion+1 : currentPosition_promotion-1;

			//Cache ou montre les flèches
			manageControls(currentPosition_promotion, '_promotion');
			// Move slideInner using margin-left
			$('#slideInner_promotion').animate({
				'marginLeft' : slideWidth*(-currentPosition_promotion)
			});
	});

	// manageControls: Cache ou montre les flèches de contrôles en fonction de la position
	function manageControls(position, type){
		// Hide left arrow if position is first slide
		if(position==0){
			$('#leftControl'+type).hide()
		}
		else{
			$('#leftControl'+type).show()
		}
		// Hide right arrow if position is last slide
		if (type == '') {
			if(position==numberOfSlides_nouveaute-1){ $('#rightControl'+type).hide() }
			else{ $('#rightControl'+type).show() }
		}
		else {
			if(position==numberOfSlides_promotion-1){ $('#rightControl'+type).hide() }
			else{ $('#rightControl'+type).show() }
		}
	}
});