// JavaScript Document

$(function(){	reinitialiseScrollPane = function(){
		$('#cadre2').jScrollPane({showArrows:true,scrollbarWidth:10});
	}	
	/********************************************************************************  
								OUVERTURE DE L'INTERFACE
	********************************************************************************/	  
	time=(2000/4);	out=200;	invisible=0;
	$('#photo').prepend("<div id='loader1' class='loader'></div><div id='loader2' class='loader'></div><div id='loader3' class='loader'></div><div id='loader' class='loader'></div>");
	$('#loader1').fadeOut(out);			
	$("#etape1").fadeIn(time, function(){
		$('#cadre2').load('_ajax/gammes_chargement.ajax.php',null,function(){
			evtCadre2();														   
			$('#loader2').fadeOut(out);	
			$("#etape2").fadeIn(time, function(){
				$('#loader3').fadeOut(out);	
				$("#etape3").fadeIn(time, function(){
						changeImage();
				});				   								   
			});	
		});
	});	
	
	/********************************************************************************  
								EVT CADRE 1 (couleurs)
	********************************************************************************/	
	
	$('#cadre1 .fondVignettes').bind('click', function(){
		$('#cadre1 .selected').removeClass('selected');
		$(this).addClass('selected')		
		changeImage(); 
	})
	
	/********************************************************************************  
								FONCTION EVT CADRE 2 (gammes)
	********************************************************************************/	
	
	function  evtCadre2(){
		$('.left_arrow').css('opacity',invisible)	
		$('.right_arrow').each(function(){
				width=0;
				$(this).parents('td:first').prev('TD').children('.lister').children('table').find('td').each(function (){width++;});
				if(width*76<=228) $(this).css('opacity',invisible);
		})
		$('.right_arrow').hover(function(){$(this).attr('src','_images/fleche-D-RO.gif') ;},function(){$(this).attr('src','_images/fleche-D.gif') ;})
		$('.left_arrow').hover(function(){$(this).attr('src','_images/fleche-G-RO.gif') ;},function(){$(this).attr('src','_images/fleche-G.gif') ;})		
		// SCROLL RIGHT
		$('.right_arrow').bind('click', function(){
			width=$(this).parents('td:first').prev('TD').children('.lister').children('table').width();
			
			position=$(this).parents('td:first').prev('TD').children('.lister').children('table').css('left').split('px');
			
			if((Math.round(width)+Math.round(position[0]))>228)$(this).parents('td:first').prev('TD').children('.lister').children('table').animate({left:(position[0]-76)+'px'},100);
			// visibilité des fleches
			
			if((Math.round(width)+Math.round(position[0])-76)<=228)$(this).css('opacity',invisible);
			if(Math.round(position[0])+Math.round(76)>=0)$(this).parents('table:first').find('.left_arrow:first').css('opacity','1');	
		})
		// SCROLL LEFT
		$('.left_arrow').bind('click', function(){
												 
			width=$(this).parents('td:first').next('TD').children('.lister').children('table').width();
			
			position=$(this).parents('td:first').next('TD').children('.lister').children('table').css('left').split('px');
			
			if(position[0]<0)$(this).parents('td:first').next('TD').children('.lister').children('table').animate({left:(Math.round(position[0])+Math.round(76))+'px'},100);
			// visibilité des fleches
			if(Math.round(position[0])+Math.round(76)>=0)$(this).css('opacity',invisible);	
			if((Math.round(width)+Math.round(position[0]))>=228)$(this).parents('table:first').find('.right_arrow:first').css('opacity','1');
		})
		
		$('#cadre2 .fondVignettes').bind('click', function(){
			$('#cadre2 .selected').removeClass('selected');
			$(this).addClass('selected')
			
			changeImage();
		})
		// FUNCTION OUVERTURE / FERMETURE D'UNE GAMME
		$('#cadre2 .gamme_titre').bind('click', function(){
			if($(this).next('.list_tete:hidden').length>0){
				$('.list_tete:visible').slideUp(500).parents('.gamme:first').removeClass('visible');
				$(this).next('.list_tete:first').slideDown(500, function(){}).parents('.gamme:first').addClass('visible');
			}							
		})
	}
	
	/********************************************************************************  
								FONCTION CHANGEMENT D'IMAGES 
	********************************************************************************/	
	
	function changeImage(){
		$('#loader').show();
		$("#modele").fadeOut(500, function(){
			code=$('#cadre1 .selected IMG').attr('rel')+'-'+$('#cadre2 .selected IMG').attr('rel');
			$("#modele").load("_ajax/images_chargement.ajax.php",{ref:code},function(html){
		
				$("#modele").children('IMG').bind('load',function (){$("#modele").fadeIn(500);$('#loader').fadeOut(out);})																		 
			});
			
		})
	}
	
	
	/********************************************************************************  
						EVT AJOUTER AU PANIER
	********************************************************************************/	
	$('#ajouterPanier').bind('click',function(){
		
		code=$('#cadre1 .selected IMG').attr('rel')+'-'+$('#cadre2 .selected IMG').attr('rel');
		
		
		$('BODY').prepend('<div id="ecran"></div>');
		$('#ecran').css('opacity',0.5).fadeIn(500, function(){
			$('#ecran').bind('click',function(){closePopup()});
			$.post('_ajax/ajout_panier.ajax.php',{ref:code},function(response){
				if(response.indexOf('true')!=-1){
					$('BODY').prepend('<div id="popup"><a class="ferme" href="javascript:closePopup()"><img src="_images/fermer.gif" alt="Fermer la fenêtre" border="0" height="13" width="13"/></a><br><br>Votre produit a bien été ajouté au panier : <br>"'+$("#nom").html()+'"<br>Prix : '+$('#prix').html()+' Euros <br><br><br><a href="panier.php">Terminer ma commande</a><br>ou<br><a href="javascript:closePopup()">Créer un nouveau Sacroche</a></div>')
					$('#popup').fadeIn(500)
					 
				}
				else {
					alert("Impossible d'ajouter le produit au panier : "+response)
					closePopup();
				}
			});		
		});
		
	})
	
/********************************************************************************  
					EVT PANIER
********************************************************************************/	
	function panier_animation(){
		$('#panier').one('mouseover', function(){
			 $('#panier').animate({top:'66px'}).animate({top:'36px'}).animate({top:'36px'},2000).animate({top:'53px'},500,'',function(){panier_animation()});
			 
		})
	}
	panier_animation()
	
	
	$('#panier').bind('click', function(){
			document.location.href='panier.php'
	})

})

function closePopup(){
	$('#popup').fadeOut(500, function (){
		$('#ecran').fadeOut(500)
		$('#popup, #ecran').remove();
		ongletPanier()
	})	
}

function ongletPanier(){
	$.get('_ajax/etat_panier.ajax.php',null,function(infos){
		if(infos.indexOf('false')==-1){
			$('#panier').css({display:'block'})
			$('#panier').children('DIV').html(infos);
			 $('#panier').animate({top:'66px'}).animate({top:'36px'}).animate({top:'36px'},2000).animate({top:'53px'},500);
		
		}
	})
	
}