$(function(){
	// Hover menu top
	$('.hover').mouseenter(function(){
			$(this).addClass('is-hover');
		}).mouseleave(function(){
			$(this).removeClass('is-hover');
	});
	
	$(".imgProduit").hover(function () {
		//console.log($(this).children("a").attr("href"));
		$(".imgMain").attr("src", $(this).children("a").attr("href"));
	})
	
	// datepicker
	day		= ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
	dayShort= ['Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam'];
	month 	= ['Janvier', 'Fevrier', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Aout', 'Septembre', 'Octobre', 'Novembre', 'Decembre'];
	
	$(".arrive").datepicker({
		beforeShowDay: disableSpecificWeekDays,
		showOn: "button",
		buttonText: "Choisir : ",
		buttonImage: "/media/ui/img/calendar.png",
		dayNames: day,
		dateFormat: "dd/mm/yy",
		monthNames: month,
		dayNamesMin: dayShort,
		buttonImageOnly: true
	});
	$(".depart").datepicker({
		beforeShowDay: disableSpecificWeekDays,
		showOn: "button",
		buttonText: "Choisir : ",
		buttonImage: "/media/ui/img/calendar.png",
		dayNames: day,
		dateFormat: "dd/mm/yy",
		monthNames: month,
		dayNamesMin: dayShort,
		buttonImageOnly: true
	});
	
	var daysToDisable = [0, 1, 2, 3, 4, 5];
	function disableSpecificWeekDays(date) {
	  	var day = date.getDay();
		for (i = 0; i < daysToDisable.length; i++) {
			if ($.inArray(day, daysToDisable) != -1) {
				return [false];
			}
        }
		return [true];
	}
            
	$(".ui-datepicker-trigger").css("display", "inline-block");

	
	/***************************************************
	 * 		CAROUSSEL
	 * 
	 */

	//move the last list item before the first item. The purpose of this is if the user clicks previous he will be able to see the last item.
	//$('#carousel_ul li:first').before($('#carousel_ul li:last'));

	//when user clicks the image for sliding right
	$('#right_scroll img').click(function() {

		//get the width of the items ( i like making the jquery part dynamic, so if you change the width in the css you won't have o change it here too ) '
		var item_width = $('#carousel_ul li').outerWidth() + 10;

		//calculate the new left indent of the unordered list
		var left_indent = parseInt($('#carousel_ul').css('left')) - item_width;

		//make the sliding effect using jquery's anumate function '
		$('#carousel_ul').animate({
			'left' : left_indent
		}, {
			queue : false,
			duration : 250
		}, function() {

			//get the first list item and put it after the last list item (that's how the infinite effects is made) '
			$('#carousel_ul li:last').after($('#carousel_ul li:first'));

			//and get the left indent to the default -210px
			$('#carousel_ul').css({
				'left' : '-210px'
			});
		});
	});
	//when user clicks the image for sliding left
	$('#left_scroll img').click(function() {

		var item_width = $('#carousel_ul li').outerWidth() + 10;

		/* same as for sliding right except that it's current left indent + the item width (for the sliding right it's - item_width) */
		var left_indent = parseInt($('#carousel_ul').css('left')) + item_width;

		$('#carousel_ul').animate({
			'left' : left_indent
		}, {
			queue : false,
			duration : 250
		}, function() {

			/* when sliding to left we are moving the last item before the first item */
			$('#carousel_ul li:first').before($('#carousel_ul li:last'));

			/* and again, when we make that change we are setting the left indent of our unordered list to the default -210px */
			$('#carousel_ul').css({
				'left' : '-210px'
			});
		});
	});
	
	/*******************************************
	 * 		MODAL IMG
	 * 
	 */
	
	$(function() {
	// a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
	$( "#dialog:ui-dialog" ).dialog( "destroy" );
	
	$(".imgCarou").click(function(e) {
		e.preventDefault();
		var img=$(this).children().attr("href");
	//	console.log($(this));
	//	console.log(img);
	//	console.log( $(img).width() );
		$("#modal").empty().append('<img src="'+img+'"></img>');
			$( "#modal" ).dialog({
				resizable : true,
				modal: true,
				position: [200,100],
				width: 'auto',
				 // pas bouger, auto marche pas pour la largeur
				// on bind l'event de sortie (clic sur ui-widget...)
				open: function (event, ui){
						$(".ui-widget-overlay").bind('click', function(){
							$("#modal").dialog('close'); 
							}); 
						$(".ui-dialog-titlebar").hide();
						$("#modal").live("click", function(){
							$("#modal").dialog("close");
						})
					}
			});

		})
		
	});
	
});

		/*
		 * Rotation du header
		 */
		
	  var ImageArr1 = new Array("/media/ui/img/header/hd1.jpg",
	 							"/media/ui/img/header/hd2.jpg",
	 							"/media/ui/img/header/hd3.jpg",
	 							"/media/ui/img/header/hd4.jpg",
	 							"/media/ui/img/header/hd5.jpg",
	 							"/media/ui/img/header/hd6.jpg",
	 							"/media/ui/img/header/hd7.jpg",
	 							"/media/ui/img/header/hd8.jpg"
	  );
	  var ImageHolder1 = document.getElementById('img-slide');
	  
	  function RotateImages(whichHolder,Start)
	  {
	  	var a = eval("ImageArr"+whichHolder);
	  	var b = eval("ImageHolder"+whichHolder);
	  	if(Start>=a.length)
	  		Start=0;
	  	b.src = a[Start];
	  	window.setTimeout("RotateImages("+whichHolder+","+(Start+1)+")",3500);
	  }

	 RotateImages(1,0);
	 
	 /////////////////////////////////:
	 // HEADER VENTE
	/*  var ImageArrVente1 = new Array("/media/ui/img/header-vente/vh1.jpg",
		 							"/media/ui/img/header-vente/vh2.jpg",
		 							"/media/ui/img/header-vente/vh3.jpg",
		 							"/media/ui/img/header-vente/vh4.jpg",
		 							"/media/ui/img/header-vente/vh5.jpg"
	  );
	  
	  var ImageHolderVente1 = document.getElementById('img-slide-vente');
	  
	  function RotateImages(whichHolderVente,StartVente)
	  {
	  	console.log(whichHolderVente);
	  	var a = eval("ImageArrVente"+whichHolderVente);
	  	console.log(a);
	  	var b = eval("ImageHolderVente"+whichHolderVente);
	  	if(StartVente>=a.length)
	  		StartVente=0;
	  	b.src = a[StartVente];
	  	window.setTimeout("RotateImagesVente("+whichHolderVente+","+(StartVente+1)+")",3500);
	  }

	 RotateImagesVente(1,0);
*/
