var $i=0;
var $CarouselWidth;
var $ListItemWidth;
var $ListWidth;
var $nbListItem;
var btnNext;
var btnPrev;
var $ListEndPos;

 $(document).ready(function() {
/*renseignement des variables récurrentes*/ 
$CarouselWidth = $(".carrouselwrap").width();
$nbListItem = $(".carrouselwrap ul li").size();
$ListItemWidth =  $(".carrouselwrap ul li").outerWidth();
$(".carrouselwrap ul").width($nbListItem*$ListItemWidth);
$ListWidth = $(".carrouselwrap ul").outerWidth();
btnNext = $(".carrousel p.next");
btnPrev = $(".carrousel p.prev");
MovingDistance = $ListItemWidth * 3;



$ListEndPos = $CarouselWidth - $ListWidth;

/* verifions la validité des boutons avant de commencer*/
ButtonStatus();

/* update automatique du cadre principal*/
update_interval = setInterval(automaticUpdate,8000);

$(".main_part a").click(function () {
	 	clearInterval(update_interval);
	 });
/*action lorsque l'on clique les boutons precedent et suivant du carrousel*/
$(".carrousel p.prev").click(function(){
	clearInterval(update_interval);
	update_interval = setInterval(automaticUpdate,8000);
	moveRight();
	});
$(".carrousel p.next").click(moveLeft);


/*action quand on clic sur un item de la liste*/

$(".carrouselwrap ul li").hover(function(){
	/* on centre le carrousel sur l'item actif */
			/*var itemPos= $(this).position();
			var x = itemPos.left;
			var centerCarousel = $CarouselWidth/2;
			var itemCenterPos = x + ($ListItemWidth/2);
			var clickPos = centerCarousel - itemCenterPos;
				if (clickPos >= 0) {
					$(".carrouselwrap ul").animate({left:0},500,ButtonStatus);
					}
				else if (clickPos <= $ListEndPos) {
					$(".carrouselwrap ul").animate({left:$ListEndPos},500,ButtonStatus);
					}
				else {
					$(".carrouselwrap ul").animate({left:clickPos},500,ButtonStatus);
					}*/
			
	active($(this));
	
	clearInterval(update_interval);
	/*update_interval = setInterval(automaticUpdate,8000);*/
	return false
	},function(){update_interval = setInterval(automaticUpdate,8000);});
});

	/* calcul des positions de la liste a chaque action*/
	function ListPosition(choix) {
		var $ListLeftPosInt = parseInt($(".carrouselwrap ul").css("left"));
		var $ListRightPosInt = parseInt($(".carrouselwrap ul").css("right"));
			switch(choix){
			case "listleftpos":
			return $ListLeftPosInt;
			break;
			case "listrightpos":
			return $ListRightPosInt;
			break;
			default:
			return [$ListLeftPosInt,$ListRightPosInt];
			break;
			}
		}
	
	/* on verifie la liste peut aller plus loin d'un coté ou de l'autre, et on active ou désactive les boutons correspondant*/
	function ButtonStatus() {
		if ((ListPosition('listleftpos') >= 0)&&(ListPosition('listrightpos') >= 0)) {
		btnPrev.addClass("inactive");
		btnNext.addClass("inactive");
		}
		else if ((ListPosition('listleftpos') >= 0)||(ListPosition('listrightpos') >= 0)){
			if (ListPosition('listleftpos') >= 0) {
				btnPrev.addClass("inactive");
				btnNext.removeClass("inactive");
			}
			else {
				btnNext.addClass("inactive");
				btnPrev.removeClass("inactive");
			}
		}
		else {
		btnPrev.removeClass("inactive");
		btnNext.removeClass("inactive");
		}
}

	/* On bouge la liste ver la droite*/
		function moveRight() {
		var $newListLeftPos = ListPosition('listleftpos') + MovingDistance;
		if ($newListLeftPos >= 0) {
			$(".carrouselwrap ul").animate({left:0},750,ButtonStatus);
			}
		else {
			$(".carrouselwrap ul").animate({left:$newListLeftPos},1000,ButtonStatus);
		}
	}
	/* On bouge la liste ver la gauche*/
		function moveLeft() {
		var $newListLeftPos = ListPosition('listleftpos') - MovingDistance;

		if ($newListLeftPos < $ListEndPos) {
			$(".carrouselwrap ul").animate({left:$ListEndPos},750,ButtonStatus);
			}
			else {
			$(".carrouselwrap ul").animate({left:$newListLeftPos},1000,ButtonStatus);
			}
		}



	/*si la class est "active"*/
	function active(activeItem) {
		/** on récupere toutes les information de l'item a afficher dans le cadre ppal **/
			var imgAlt = activeItem.find('img').attr("alt"); //Get Alt Tag of Image
			var aHref = activeItem.find('a').attr("href"); //Get Alt Tag of Image
			var imgUrl = activeItem.find('span.bigimage').html(); //Get Main Image URL
			var imgDesc = activeItem.find('.block').html();  //Get HTML of the "block" container
			var itemH3 = activeItem.find('.block h3 a').attr("title");  //Get HTML of the "block" container
			
			var mainPart = $(".main_part.front");
			var nextMainPart =  $(".main_part.back");
			//var imgDescHeight = $(".main_part").find('.block').height(); //Find the height of the "block"
			
			
			/* si l'item etait déja actif on ne fait rien, sinon on l'active on rempli le cadre principal*/
			if (activeItem.is(".active")) { 
				return false;
				}
			else {
				// on met a jour le cadre principal
				nextMainPart.find('a').css("background-image", "url("+imgUrl+"?l=300&h=300)");
				nextMainPart.find('img').attr({alt: imgAlt});
				nextMainPart.find('.infos').html(imgDesc);
				nextMainPart.find('.infos h3 a').html(itemH3);
				nextMainPart.find('a').attr({href: aHref});
				mainPart.fadeOut(400, function(){
					mainPart.removeClass("front");
					nextMainPart.addClass("front").removeClass("back");
					mainPart.addClass("back").fadeIn(0);});

				// on active l'item
				$(".carrousel ul li").removeClass("active");
				activeItem.addClass("active");
				}
	}

	/* on change d'item actif tout seul*/
	function automaticUpdate() {
		var ItemActif = $(".carrouselwrap ul li.active");
		if (ItemActif.is(".carrousel ul li:last-child")){
		active($(".carrousel ul li:first"));
		}
		else{
		var nextItem = ItemActif.next();
		active(nextItem);
		}
	}



