// JavaScript Document
$(document).ready(function() {	
 
	$(".main_image .desc").show(); //Show Banner
	$(".main_image .block").animate({ opacity: 0.85 }, 1 ); //Set Opacity
 
	//Click and Hover events for thumbnail list
	$(".image_thumb ul li:first").addClass('active'); 


	// Fonction de switch auto
		//runs function on click
		$(".image_thumb ul li").click(function () {
			$active = $(this);
			slideSwitchClick();
		})
		
		.hover(function(){ //Hover effects on list-item
			$(this).addClass('hover'); //Add class "hover" on hover
		}, function() {
			$(this).removeClass('hover'); //Remove class "hover" on hover out
		});




		function slideSwitchTimed() {
			$active = $('.image_thumb ul li.active').next();
			if ( $active.length == 0 ) $active = $('.image_thumb ul li:first'); //goes back to start when finishes
			slideSwitch();
		}

		function slideSwitchClick() {
			slideSwitch();
			clearInterval(playSlideshow);
		}

		//runs function, set timer here
		$(function() {
			playSlideshow = setInterval(function () {
			slideSwitchTimed()}, 6000 );
		});

		//pauses on hover
		
		function slideSwitch() {
			var $prev = $('.image_thumb ul li.active');
			
			
			//Show active list-item
			$prev.removeClass('active');
			$active.addClass('active');

			//Set Variables
			var imgAlt = $active.find('img').attr("alt"); //Get Alt Tag of Image
			var imgTitle = $active.find('a').attr("ref"); //Get Main Image URL
			var imgDesc = $active.find('.block').html(); //Get HTML of the "block" container
			var imgDescHeight = $(".main_image").find('.block').height(); //Find the height of the "block"

			if ($(this).is(".active")) { //If the list item is active/selected, then…
				return false; // Don't click through – Prevents repetitive animations on active/selected list-item
			} else { //If not active then…
			//Animate the Description
			//$(".main_image img").animate({ opacity: 0}, 250 );
			/*$(".main_image .block").animate({ opacity: 0, marginBottom: -imgDescHeight }, 250 , function() {
				$(".main_image .block").html(imgDesc).animate({ opacity: 0.85, marginBottom: "0" }, 250 );
				$(".main_image img").attr({ src: imgTitle , alt: imgAlt}).animate({ opacity: 1}, 250 );
				});
			}*/
			$(".main_image .block").animate({ marginBottom: -imgDescHeight }, 250 , function() {
				$(".main_image .block").html(imgDesc).animate({ marginBottom: "0" }, 250 );
				$(".main_image img").attr({ src: imgTitle , alt: imgAlt}).animate({}, 250 );
				});
			}
			return false;
		}
	
});//Close Function