$(document).ready(function() {
	
	$("#topnav li").prepend("<span></span>"); //Throws an empty span tag right before the a tag

	$("#topnav li").each(function() { //For each list item...
		var linkText = $(this).find("a").html(); //Find the text inside of the <a> tag
		$(this).find("span").show().html(linkText); //Add the text in the <span> tag
	}); 

	$("#topnav li").hover(function() {	//On hover...
		$(this).find("span").stop().animate({
			marginTop: "-40" //Find the <span> tag and move it up 40 pixels
		}, 250);
	} , function() { //On hover out...
		$(this).find("span").stop().animate({
			marginTop: "0"  //Move the <span> back to its original state (0px)
		}, 250);
	});

});

//Fonction chargé au OnChange sur une province. 
//Chargement de la liste des ville contenues dans la province.

function check_province(form) {
	//Récupère la langue actuelle du site 	
	var texte = get_lang();

	//Au changement d'une province, efface les données enfants
	$("#ville").remove();
	$("#groupe").remove();
	$("#magasin").remove();
	
	//Value de l'élément sélectionné
	var id_province = $('#selectProvince :selected').val();
	//Conteneur de l'élément sélectionné
	var div_province = $("#province");
	
	//Envoi de l'id de la province à PHP qui va récupérer les villes qui en font partie.
	$.get("http://www.fairebel.be/squelettes/ajax/charger_villes.php",{id:id_province},
		function(data){
			//Affiche un nouveau select contenant la liste des villes faisant partie de la province sélectionné
			div_province.after('<div id="ville"><label for="ville"><span class="label"> '+ texte.ville +'  :</span><select id="selectVille" name="ville" onChange="check_ville(this.form);"><option id="select_ville" value="1">' + texte.select_ville + '</option></select></label></div>');
			var item = data.split(";");					
			for(i=0; i<item.length-1; i++) {				
				var ville = (item[i].split("_"));
				$("#select_ville").after('<option value="'+ville[0]+'">'+ville[1]+'</option>');
			}			
		}
	)
}


//Fonction chargé au OnChange sur une ville. 
//Chargement de la liste des groupes de magasin présents dans la ville

function check_ville(form) {
	//Récupère la langue actuelle du site 	
	var texte = get_lang();
	
	//Au changement d'une ville, efface les données enfants
	$("#groupe").remove();
	$("#magasin").remove();
	
	//Value de l'élément sélectionné
	var id_ville = $('#selectVille :selected').val();	
	//Conteneur de l'élément sélectionné
	var div_ville = $("#ville");

	//Envoi de l'id de la ville à PHP qui va récupérer les groupes de magasins qui en font partie.
	$.get("http://www.fairebel.be/squelettes/ajax/charger_groupes.php",{id:id_ville},
		function(data){
			//Affiche un nouveau select contenant la liste des groupes de magasins faisant partie de la ville sélectionné
			div_ville.after('<div id="groupe"><label for="groupe"><span class="label">' + texte.groupe + ' :</span><select id="selectGroupe" name="groupe" onChange="check_groupe(this.form);"><option id="select_groupe" value="1">' + texte.select_groupe + '</option></select></label></div>');
			var item = data.split(";");					
			for(i=0; i<item.length-1; i++) {				
				var groupe = (item[i].split("_"));
				$("#select_groupe").after('<option value="'+groupe[0]+'">'+groupe[1]+'</option>');
			}			
		}
	)
}

//Fonction chargé au OnChange sur un groupe. 
//Chargement de la liste des magasins faisant partie du groupe sélectionné.

function check_groupe(form) {
	//Récupère la langue actuelle du site 	
	var texte = get_lang();

	//Au changement d'un groupe, efface les données enfants
	$("#magasin").remove();
	
	//Value de l'élément sélectionné
	var id_groupe = $('#selectGroupe :selected').val();	
	//Value de la ville sélectionnée
	var id_ville = $('#selectVille :selected').val();
	//Conteneur de l'élément sélectionné
	var div_groupe = $("#groupe");

	//Envoi de l'id du groupe de magasins à PHP qui va récupérer les magasins qui en font partie
	$.get("http://www.fairebel.be/squelettes/ajax/charger_magasins.php",{id:id_groupe, ville:id_ville},
		function(data){
			//Affiche un nouveau select contenant la liste des magasins faisant partie du groupe sélectionné
			div_groupe.after('<div id="magasin"><h3 id="select_magasin">' + texte.points + '</h3></div>');
			var item = data.split(";");					
			for(i=0; i<item.length-1; i++) {				
				var magasin = (item[i].split("_"));
				$("#select_magasin").after('<p>'+magasin[1]+'</p>');
			}		
		}
	)
}

// Fonciton qui récupère la langue actuelle du site et qui définit les traductions pour le système de recherche des points de vente
function get_lang() {
	var lang = $('html').attr('lang');
	//alert(lang);
	
	if(lang == 'fr') {
		var texte =
		{trouver_point:'Trouver votre point de vente',
		province:'Province',
		select_province:'Sélectionner une province',
		ville:'Ville',
		select_ville:'Sélectionner une ville',
		groupe:'Groupe',
		select_groupe:'Sélectionner un groupe',
		points:'Points de vente'
		};
	} 

	if (lang == 'nl') {
		var texte =
		{trouver_point:'Vind uw verkooppunt',
		province:'Provincie',
		select_province:'Selecteer een provincie',
		ville:'Plaats',
		select_ville:'Selecteer een plaats',
		groupe:'Groep',
		select_groupe:'Selecteer een groep',
		points:'Verkooppunten'
		};
	}
	
	if (lang == 'de') {
		var texte =
		{trouver_point:'Ihre Verkaufsstelle finden',
		province:'Provinz',
		select_province:'Eine Provinz auswählen',
		ville:'Stadt',
		select_ville:'Eine Stadt auswählen',
		groupe:'Gruppe',
		select_groupe:'Eine Gruppe auswählen',
		points:'Verkaufsstellen '
		};
	}
	
	return texte;
}