$(document).ready(function() {

	$(".programs-content").hide(); //Hide all content
	$("#programs-tabs div:first").addClass("on").show(); //Activate first tab
	$(".programs-content:first").show(); //Show first tab content

	
	$("#programs-tabs div").click(function() {

		$("#programs-tabs div").removeClass("on"); //Remove any "active" class
		$(this).addClass("on"); //Add "active" class to selected tab
		$(".programs-content").hide(); //Hide all tab content

		var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
		activeTab = activeTab.substring(activeTab.lastIndexOf('#'));
		$(activeTab).show(); //Fade in the active ID content
		return false;
	});
	
	theRotator();
	// $(function() {
		// $(".tx-anetprojinvestaccueil-pi1").jCarouselLite({
			// auto: 800,
			// speed: 1000,
			// visible: 1,
			// circular: true
		// });
	// });

	
	//page detail programme
	var src_origine = '';
	$(".vignettes li").mouseover(function() {
		src_origine = $(this).children("div").children("img").attr('src');
		$("#image img").attr('src',src_origine);   
		$("#image img").attr('height','221');
	});
	$(".vignettes li").mouseout(function() {
		src_zoom = $("#original img").attr('src');
		
		$("#image img").attr('src',src_zoom);   
		$("#image img").attr('height','221');
	});
});

function theRotator() {
	//Set the opacity of all images to 0
	$('div#main-left ol > li').css({opacity: 0.0});
	
	//Get the first image and display it (gets set to full opacity)
	$('div#main-left ol > li:first').css({opacity: 1.0});
	
	//Call the rotator function to run the slideshow, 6000 = change to next image after 6 seconds
	setInterval('rotate()',5000);

}

function rotate() {

	//Get the first image
	var current = ($('div#main-left ol > li.show')? $('div#main-left ol > li.show') : $('div#main-left ol > li:first'));
	
	//Get next image, when it reaches the end, rotate it back to the first image
	var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#main-left ol > li:first') :current.next()) : $('div#main-left ol > li:first'));
	
	//Set the fade in effect for the next image, the show class has higher z-index
	next.css({opacity: 0.0})
	
	.addClass('show')
	.animate({opacity: 1.0}, 1000);
	
	//Hide the current image
	current.animate({opacity: 0.0}, 1000)
	
	.removeClass('show');
};
