$(document).ready(function() {
	
	var click1 = true;
	var click2 = false;
	var click3 = false;
	var click4 = false;
	var click5 = false;
	var click6 = false;
	
	function desactiver(){
		$("#agon").removeClass("active");
		$("#ladyJones").removeClass("active");
		$("#lindsayJones").removeClass("active");
		$("#matsuura").removeClass("active");
		$("#ouf").removeClass("active");
		$("#hieronimus").removeClass("active");
		$("#agonVisu").removeClass("active");
		$("#ladyJonesVisu").removeClass("active");
		$("#lindsayJonesVisu").removeClass("active");
		$("#matsuuraVisu").removeClass("active");
		$("#oufVisu").removeClass("active");
		$("#hieronimusVisu").removeClass("active");
		click1 = false;
		click2 = false;
		click3 = false;
		click4 = false;
		click5 = false;
		click6 = false;
	}
	function desactiverLegende(){
		$("#visualList li a span").removeClass("active");
	}
	function reactiverLegende(){
		if(click1 == true){
			$("#agonVisu span").addClass("active");
		}
		if(click2 == true){
			$("#ladyJonesVisu span").addClass("active");
		}
		if(click3 == true){
			$("#lindsayJonesVisu span").addClass("active");
		}
		if(click4 == true){
			$("#matsuuraVisu span").addClass("active");
		}
		if(click5 == true){
			$("#oufVisu span").addClass("active");
		}
		if(click6 == true){
			$("#hieronimusVisu span").addClass("active");
		}
	}

		
	
	/* apparition des boites et hightlight de la visualList */
	$("#agonVisu a").click(function() {
		desactiver();
		$("#agon").addClass("active");
		$("#agonVisu").addClass("active");
		$("#agonVisu span").addClass("active");
		click1 = true;
	});
	$("#ladyJonesVisu a").click(function() {
		desactiver();
		$("#ladyJones").addClass("active");
		$("#ladyJonesVisu").addClass("active");
		$("#ladyJonesVisu span").addClass("active");
		click2 = true;
	});
	$("#lindsayJonesVisu a").click(function() {
		desactiver();
	   $("#lindsayJones").addClass("active");
	   $("#lindsayJonesVisu").addClass("active");
	   	$("#lindsayJonesVisu span").addClass("active");
		click3 = true;
	});
	$("#matsuuraVisu a").click(function() {
		desactiver();
	   $("#matsuura").addClass("active");
	   $("#matsuuraVisu").addClass("active");
	   	$("#matsuuraVisu span").addClass("active");
		click4 = true;
	});
	$("#oufVisu a").click(function() {
		desactiver();
	   $("#ouf").addClass("active");
	   $("#oufVisu").addClass("active");
	  	$("#oufVisu span").addClass("active");
		click5 = true;
	});
	$("#hieronimusVisu a").click(function() {
		desactiver();
	   $("#hieronimus").addClass("active");
	   $("#hieronimusVisu").addClass("active");
	  	$("#hieronimusVisu span").addClass("active");
		click6 = true;
	});
	
	/* apparition de la légende */
	$("#agonVisu a").hover(
		function(){
			desactiverLegende();
			$("#agonVisu span").addClass("active");
		},
		function(){
			if(click1 == false){
				$("#agonVisu span").removeClass("active");
			}
			reactiverLegende();
		}
	);
	$("#ladyJonesVisu a").hover(
		function(){
			desactiverLegende();
			$("#ladyJonesVisu span").addClass("active");
		},
		function(){
			if(click2 == false){
				$("#ladyJonesVisu span").removeClass("active");
			}
			reactiverLegende();
		}
	);
	$("#lindsayJonesVisu a").hover(
		function(){
			desactiverLegende();
			$("#lindsayJonesVisu span").addClass("active");
		},
		function(){
			if(click3 == false){
				$("#lindsayJonesVisu span").removeClass("active");
			}
			reactiverLegende();
		}
	);
	$("#matsuuraVisu a").hover(
		function(){
			desactiverLegende();
			$("#matsuuraVisu span").addClass("active");
		},
		function(){
			if(click4 == false){
				$("#matsuuraVisu span").removeClass("active");
			}
			reactiverLegende();
		}
	);
	$("#oufVisu a").hover(
		function(){
			desactiverLegende();
			$("#oufVisu span").addClass("active");
		},
		function(){
			if(click5 == false){
				$("#oufVisu span").removeClass("active");
			}
			reactiverLegende();
		}
	);
	$("#hieronimusVisu a").hover(
		function(){
			desactiverLegende();
			$("#hieronimusVisu span").addClass("active");
		},
		function(){
			if(click6 == false){
				$("#hieronimusVisu span").removeClass("active");
			}
			reactiverLegende();
		}
	);
	

});