// JavaScript Document
$(function() {
	var options = { 
		beforeSubmit : valider,
		type : "POST",
		url: 'include/traitement-frm-contact.php', 
		success:    function(data) { 
			if(!data)
			{
				$('#message-ok').html("<p class='important'>Votre mail a &eacute;t&eacute; envoy&eacute; avec succ&egrave;s !</p>")  
				.hide()  
				.fadeIn(2000);
				$('#frm-contact').resetForm();
			}
			else
			{
				alert(data);
			}
		} 
	};
	function valider()
	{
		$("#loading").ajaxStart(function(){
		   $(this).fadeIn(500);
		 });
		$("#loading").ajaxStop(function(){
		   $(this).fadeOut(200);
		 });
		return $("#frm-contact").valid()
	} 
	
	$('#frm-contact').ajaxForm(options); 					
	
	//centrer le contenu par défaut (A FAIRE ---->>>>>> gérer le resize et les margin auto)
		$('.scrollContainer div.panel').css('width',screen.width);
		var marge = ( screen.width - 980 ) / 2;
		$('.content').css('margin-left', marge);
		$('.wrapper').css('margin-left', marge);
	  
	//On baisse l'opacité du carré coloré du contact pr voir le visuel de fond en transparence
	$("#contact div.approche").css('opacity',0.9);
	
	//~~~~~~~~~~~~~~~~~~~~~--->>>>>>Ouverture des panneau de contenu lors du clic sur une rubrique (prestation, reférences...)
	
	//ouverture d'un panneau vers la droite -->>
	$('.ouvre-panneau-right').click(function(event) {
		event.preventDefault();//désactive le comportement du lien par défaut
		var quelPanneau = $(this).attr('rel');
		var $panneau = $("#"+quelPanneau);
		
		if($panneau.attr('class') != "panneau-right actif")
		{
			//si un panneau droit etait ouvert, on le referme et on ouvre celui demandé
			$('.current').removeClass('current');
			//on donne la class current a l'element cliqué (pour afficher la puce "fleche" a droite)
			$(this).addClass('current');
			if($('.actif').attr('class') == "panneau-right actif")
			{
				$('.actif').removeClass('actif').animate({left : -675},400,ouvrePanneauRight($panneau),500);
			}
			else
			{
				$('.actif').removeClass('actif').animate({right : -685},400,ouvrePanneauRight($panneau),500);
			}
		}
	});
	
	//Panneau qui slide vers la gauche <<--
	$('.ouvre-panneau-left').click(function(event) {
		event.preventDefault();
		var quelPanneau = $(this).attr('rel');
		var $panneau = $("#"+quelPanneau);
		
		if($panneau.attr('class') != "panneau-left actif")
		{
			//si un panneau gauche etait ouvert, on le referme et on ouvre celui demandé
			$('.current').removeClass('current');
			//on donne la class current a l'element cliqué (pour afficher la puce "fleche" a droite)
			$(this).addClass('current');
			if($('.actif').attr('class') == "panneau-left actif")
			{
				$('.actif').removeClass('actif').animate({right : -685},400,ouvrePanneauLeft($panneau),500);
			}
			else
			{
				$('.actif').removeClass('actif').animate({left : -675},400,ouvrePanneauLeft($panneau),500);
			}
		}
	});
	
	
	function ouvrePanneauRight(panneau)
	{
			panneau.show().animate({left: 0 });
			panneau.addClass('actif');
	}
	
	//fermeture du panneau si clic sur "fermer"
	$('.btn-fermer-panneau-right').click(function(evt){
		evt.preventDefault();
		$('.current').removeClass('current');
		$(this).parent().removeClass('actif').animate({left : -675},600);			
	});	
	
	function ouvrePanneauLeft(panneau)
	{
			panneau.show().animate({right: 0 });
			panneau.addClass('actif');
	}
	
	//fermeture du panneau si clic sur "fermer"
	$('.btn-fermer-panneau-left').click(function(evt){
		evt.preventDefault();
		$('.current').removeClass('current');
		$(this).parent().removeClass('actif').animate({right : -685},600);			
	});	

	
	
	
	//~~~~~~~~~~~~~~~~~~~~~~~~~~~-->>>>>>>>> RollOver sur les item du menu
	$("ul#navigation span").css("opacity","0");
	// on mouse over 
	$("ul#navigation span").hover(function () {
		// animate opacity to full
		$(this).stop().animate({
			opacity: 1
		}, "medium");
	},
	// rollOut sur les tiems du menu	
	function () {
		// on met l'opacité a 0
		$(this).stop().animate({
			opacity: 0
		}, "slow");
	});
	
	//----------->>>>>>>>>>>>>>>>>>>>>>>>> menu communication références <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
	
	//lors du clic sur un item du menu, on ouvre les références correspondantes (id visuelle, presse, signalétique...)
	$('.active-ref.com').click(function(event){
		event.preventDefault();
		$('.com-actif').removeClass('com-actif');
		$(this).addClass('com-actif');
		$('.fadeIn').hide();
		
		var quelRef = $(this).attr('rel');
		var ref     = $('#'+quelRef);
		ref.fadeIn('slow');
		ref.addClass('fadeIn');
	});	
	
	//lors du clic sur un item du menu formation, on ouvre le texte correspondant
	$('.active-ref.formation').click(function(event){
		event.preventDefault();
		$('.formation-actif').removeClass('formation-actif');
		$(this).addClass('formation-actif');
		$('.fadeIn').hide();
		
		var quelRef = $(this).attr('rel');
		var ref     = $('#'+quelRef);
		ref.fadeIn('slow');
		ref.addClass('fadeIn');
	});	
	
});