function envoyerMarque(selectId,ModelId)
				{   	 	
                     //Exécution du script PHP avec Ajax  
					var selectValue = document.getElementById(selectId).options[document.getElementById(selectId).selectedIndex].value;
                    
					$.get("pages/sql/listemodeles.php", {idmarque:selectValue}, function success(data)
					 {
						afficherSelect(data,ModelId);
					 });  
					 				       
                } 
				
function envoyerModele(brandId,selectId,VersionId)
				{   	 	
                     //Exécution du script PHP avec Ajax  			
					var selectValue = document.getElementById(selectId).options[document.getElementById(selectId).selectedIndex].value;
                    var brandValue = document.getElementById(brandId).options[document.getElementById(brandId).selectedIndex].value;
					
					$.get("pages/sql/listeversions.php", {idversion:selectValue,idbrand:brandValue}, function success(data)
					 {
						afficherSelect(data,VersionId);
					 });  					 
                       
                } 
				 
function afficherSelect(data,id)
{
	$(id).html(data);
}


	
function initListingHome()
{
	if(document.getElementById("brand-selector-dropdown1")!=null)
	{
		document.getElementById("sltCountCompare").selectedIndex=1;
		
		$('#sltCountCompare').trigger('change');
		for(i=1;i<=8;i++)
		{
			document.getElementById("brand-selector-dropdown"+i).selectedIndex=0;
			document.getElementById("version-selector-dropdown"+i).selectedIndex=0;
		}
		
		//initialisation
		document.getElementById("pourcVille").selectedIndex = 3;
		document.getElementById("pourcRoute").selectedIndex = 4;
		document.getElementById("pourcAutoRoute").selectedIndex = 3;
	}
}
	
$(document).ready(function(){ 
	$('.SelectorVersion').change(function()
		{
			var nbreVoitures = document.getElementById("sltCountCompare").options[document.getElementById("sltCountCompare").selectedIndex].value;
			var j=0;
			for (var i = 1; i <= nbreVoitures; i++) 
			{
				if(document.getElementById("version-selector-dropdown"+i).selectedIndex!=0)
					{
						j++;
					}
			}	
			
			if(j==(nbreVoitures))
				{
					$("#route-select").fadeIn('400');
					$("#conduite-select").fadeIn('400');
					$("#validation-select").fadeIn('400');
				}
		}); 
		
	
	initListingHome();
	
	$("input[name$='nbreKilometre']").keyup(
												function(){
															var half = 1/2;
															var dec = (half.toString().match(/,/)) ? ',' : '.';
	
															// Par opposition, on détermine celui qui ne l'est pas.
															var alpha = (dec == '.') ? ',' : '.';

															var field = $(this);
															var valNum = field.val();
															
															/*
															 * On remplace le non séparateur par le séparateur.
															 * Si la chaîne commence par le séparateur, on met un zéro devant.
															 */ 
															valNum = valNum.replace(new RegExp("["+alpha+"]"), dec);
															valNum = valNum.replace(new RegExp("^["+dec+"]"), '0.');
															
															if (valNum != ''){
																/*
																 * Si la chaîne est au format monétaire (9999.99)
																 * alors on ne change rien
																 * sinon on teste si la chaîne comporte d'autres caractères que de 0 à 9 ou le séparateur
																 * alors, s'il la chaîne comporte d'autres caractères, on les supprime
																 * sinon on limite le nombre de décimales à 2
																 */ 
																valNum = (new RegExp("^[0-9]+("+dec+"[0-9]{,2})?$").test.valNum) ? valNum : (valNum.match(new RegExp("[^0-9"+dec+"]"))) ? valNum.replace(new RegExp("[^0-9"+dec+"]","g"),'') : valNum.match(new RegExp("^[0-9]+(["+dec+"][0-9]{0,2})?"))[0];
															}
															
															field.val(valNum);
														}
											);
	$("input[name$='nbreKilometre']").qtip({
								   content: '<b>Saisissez votre kilométrage moyen annuel</b>',
								   style: { 
									  width: 200,
									  padding: 5,
									  background: '#46B0DE',
									  color: 'black',
									  textAlign: 'center',
									  border: {
										 width: 5,
										 radius: 5,
										 color: '#4680C1'
									  },
									  tip: 'leftTop',
									  name: 'dark' // Inherit the rest of the attributes from the preset dark style
								   }
								});
								
	$(".slider1").qtip({
								   content: 
											{
												text:'<b>Réglez votre % de km en Ville.<br/> Attention cette action modifie le % sur Route</b>',
												'font-size': 14
											},
								   style: { 
									  width: 200,
									  padding: 5,
									  background: '#46B0DE',
									  color: 'black',
									  textAlign: 'center',
									  border: {
										 width: 5,
										 radius: 5,
										 color: '#4680C1'
									  },
									  title: { 'font-size': 12 },
									  tip: 'leftTop',
									  name: 'dark' // Inherit the rest of the attributes from the preset dark style
								   }
								});
								
	$(".slider2").qtip({
								   content: '<b>Réglez votre % de km sur Route.<br/> Attention cette action modifie le % sur AutoRoute</b>',
								   style: { 
									  width: 200,
									  padding: 5,
									  background: '#46B0DE',
									  color: 'black',
									  textAlign: 'center',
									  border: {
										 width: 5,
										 radius: 5,
										 color: '#4680C1'
									  },
									  tip: 'leftTop',
									  name: 'dark' // Inherit the rest of the attributes from the preset dark style
								   }
								});
								
	$(".slider3").qtip({
								   content: '<b>Réglez votre % de km sur Autoroute.<br/> Attention cette action modifie le % en Ville</b>',
								   style: { 
									  width: 200,
									  padding: 5,
									  background: '#46B0DE',
									  color: 'black',
									  textAlign: 'center',
									  border: {
										 width: 5,
										 radius: 5,
										 color: '#4680C1'
									  },
									  tip: 'leftTop',
									  name: 'dark' // Inherit the rest of the attributes from the preset dark style
								   }
								});
	 
	 $(".slider1").slider();
	 $(".slider1").slider({ min: 0,  
							max: 100,
							range : "min",
							step : 10,
							value : 30,
							slide: function(event, ui) 
							{
								$(".slidercontent1").html(ui.value + '%');
								document.getElementById("pourcVille").selectedIndex = (ui.value/10);
								var slid2 = $(".slider2").slider("value");
								var slid3 = $(".slider3").slider("value");
								
								var diff = 100 - (ui.value + slid2 + slid3);
								
								
								if((slid2+diff)>=0)
									$(".slider2").slider("value",(slid2+diff));
								else
								{
									$(".slider2").slider("value",0);
									$(".slider3").slider("value",slid2+slid3+diff);
								}
							},
							change : function(event,ui)
							{
								$(".slidercontent1").html(ui.value + '%');
								document.getElementById("pourcVille").selectedIndex = (ui.value/10);
							}});
							
	$(".slidercontent1").html($(".slider1").slider("value") + '%');
	
	$(".pourcVille").click(function() {
			$(".slider1").slider("value", this.selectedIndex + 1);
		});
		

	$(".slider2").slider();
	$(".slider2").slider({ min: 0,  
							max: 100, 
							step : 10,
							value : 40,
							slide: function(event, ui) 
							{
								$(".slidercontent2").html(ui.value + '%');
								document.getElementById("pourcRoute").selectedIndex = (ui.value/10);
								
								var slid1 = $(".slider1").slider("value");
								var slid3 = $(".slider3").slider("value");
								
								var diff = 100 - (ui.value + slid1 + slid3);
								
								if((slid3+diff)>=0)
									$(".slider3").slider("value",(slid3+diff));
								else
								{
									$(".slider3").slider("value",0);
									$(".slider1").slider("value",slid1+slid3+diff);
								}
									
							},
							change : function(event,ui)
							{
								$(".slidercontent2").html(ui.value + '%');
								document.getElementById("pourcRoute").selectedIndex = (ui.value/10);
							}});
							
	$(".slidercontent2").html($(".slider2").slider("value") + '%');
	$(".pourcRoute").click(function() {
			$(".slider1").slider("value", this.selectedIndex + 1);
		});
		
	$(".slider3").slider();
	$(".slider3").slider({ min: 0,  
							max: 100, 
							step : 10,
							value : 30,
							slide: function(event, ui) 
							{
								$(".slidercontent3").html(ui.value + '%');
								document.getElementById("pourcAutoRoute").selectedIndex = (ui.value/10);
								
								var slid1 = $(".slider1").slider("value");
								var slid2 = $(".slider2").slider("value");
								
								var diff = 100 - (ui.value + slid1 + slid2);
								$(".slider1").slider("value",(slid1+diff));
								
								if((slid1+diff)>=0)
									$(".slider1").slider("value",(slid1+diff));
								else
								{
									$(".slider1").slider("value",0);
									$(".slider2").slider("value",slid1+slid2+diff);
								}
							},
							change : function(event,ui)
							{
								$(".slidercontent3").html(ui.value + '%');
								document.getElementById("pourcAutoRoute").selectedIndex = (ui.value/10);
							}});
							
	$(".slidercontent3").html($(".slider3").slider("value") + '%');
	 $(".pourcAutoRoute").click(function() {
			$(".slider1").slider("value", this.selectedIndex + 1);
		});
		
		
	
		
});