/******************************************************************************
******************************************************************************
										Fonctions de DOM communes à toutes les pages											
******************************************************************************
******************************************************************************/


/******** openClose() ***********/
//Ferme/ouvre un block
function openClose(obj) {
	var display = getStyleInfo(obj,"display");
	if (display=="none") {
		obj.style.display = "block";
		return true;
	}
	else {
		obj.style.display = "none";
		return false;
	}
}


/********* popUp() ***************/
//Affiche/masque une pop-up
function popUp(obj) {
	//Si je l'ouvre, je masque les selects, sinon je les affiche
	if (openClose(obj)) hideSelectElements();
	else showSelectElements();	
}


/********* hideSelectElements() et showSelectElements()  ***************/
//IE (toujours lui) place les elements <select par dessus tout le reste, ils ne sont pas soumis au zIndex. 
//Je dois donc les masque pour ne pas gener l'affichage des fausses pop-up
function hideSelectElements() {
	initFunction("select", function(obj) { obj.style.visibility = "hidden" });
}
function showSelectElements() {
	initFunction("select", function(obj) { obj.style.visibility = "inherit" });
}


/********* makeInfoAlt() ***********/
//Appliqué sur les élements des formulaires pour afficher leur texte alternatif dans un div sur le coté au survol, pour les formulaires
function makeInfoAlt(obj) {
	//On trouve déjà l'alt, si vide on arrete
	var alt = obj.getAttribute("alt");
	if (alt=="" || alt==undefined) return;	
	
	//ensuite on doit trouver le div où afficher les infos. Il porte l'id info_user_name, info_user_pass, etc
	var divInfo = document.getElementById("info_"+obj.id);
	//Donc au mouseover, on affche le texte dans ce div
	obj.onmouseover = function() {
		divInfo.style.display = "block";
		divInfo.innerHTML = alt;	
	}
	//Au mouseout on masque le div
	obj.onmouseout = function() {
		divInfo.style.display = "none";
	}
}


/******** makeDeleteFile **********/
//Sous les liens (ou miniatures) des fichiers on a un lien [X] Cliquez ici pour supprimer le fichier. En cliquant dessus ca masque l'affichage du fichier et
//passe le champ hidden en vide
function makeDeleteFile(obj) {
	//On demande confirmation au clic
	obj.onclick = function() {
		if (confirm("Etes vous sur de vouloir supprimer ce fichier ?")) {
			//On trouve l'id du fichier (après deleteFile_)
			var id = this.id.substring(11);
			//On masque ce lien là
			this.style.display = "none";
			//On masque le lien/miniature
			document.getElementById("file_"+id).style.display = "none";
			//On passe le champ hidden à vide
			document.getElementById(id+"_hidden").value = "";
			alert("La suppression du fichier ne sera effective qu'une fois que vous aurez validé le formulaire.");
		}
		return false;
	}
}


/********* makeShowTooltip() **********/
//Emulation du tooltip. Si possede la classe "show_tooltip" on créé un élément html avec le title (ou le texte alternatif) au survol
function makeShowTooltip(obj) {
	//je prends le texte dans le title, si vide dans le alt, si rien on s'arrete
	var txt =obj.getAttribute("title");
	if (!txt) txt = obj.getAttribute("alt");
	if (!txt) return;
	//On vire le alt qui va avec maintenant qu'on a amélioré le tooltip
	obj.title = "";
	//On affiche le tootlip au survol
	obj.onmouseover = function() {
		showTooltip(txt, this);		
	}
	//On le masque en partant
	obj.onmouseout = removeTooltip;
}
/************ showTooltip() *************/
function showTooltip(txt,obj,  x, y, width, height) {
	/*
	//Si le tooltip existe, on le fait disparaitre
	if (document.getElementById("tooltip")) removeTooltip();
	
	//On créé un tooltip avec le texte dedans et l'id/classe pour le masquer
	var tooltip = document.createElement("div");
	tooltip.setAttribute("id", "tooltip");
	tooltip.innerHTML = txt;
	*/
	if (txt=="") return;
	var tooltip = document.getElementById("tooltip");
	if (!tooltip) {
		tooltip = document.createElement("div");
		tooltip.setAttribute("id", "tooltip");
	}
	tooltip.innerHTML = txt;
	//On l'affiche
	tooltip.style.visibility = "visible";
	//Si j'ai précisé des dimensions, je redimensionne
	if (width) tooltip.style.width = width+"px";
	if (height) tooltip.style.height = height+"px";
	//On l'ajoute dans le document
	document.getElementById("conteneur").appendChild(tooltip);

	//Coords données, on le mets aux coords
	if (y) tooltip.style.top = y+"px";
	else tooltip.style.top = (getY(obj) - tooltip.offsetHeight)+"px";

	if (x) tooltip.style.left = x+"px";
	else tooltip.style.left = getX(obj)+"px";

}
/******* removeTooltip() ***********/
//On supprime le tooltip
function removeTooltip() {
	var tooltip = document.getElementById("tooltip");
	if (!tooltip) return;
	//On le supprime
	tooltip.style.visibility = "hidden";
}

/********* makeNoSpamMail ************/
//On transforme les span class="noSpam" en lien avec un href="mailto"
function makeNoSpamMail(obj) {
	//On garde le contenu
	var innerHTML = obj.innerHTML;
	//On va prendre l'adresse mail, c'est à dire la suite des innerHTML des <span qui ne sont pas de type spam
	var listSpan = obj.getElementsByTagName("span");
	var mail = "";
	for (i=0;i!=listSpan.length;i++) {
		if (!isOfClass(listSpan[i], "spam")) mail+= listSpan[i].innerHTML
	}

	//On créé donc un lien qui va vers ce mail, avec le mm texte dedans
	var a = document.createElement("a");
	a.href = "mailto:"+mail;
	setClass(a, "noSpam");
	a.innerHTML = innerHTML;
	
	//On l'ajoute à la place du faux lien (juste avant et on vire le lien)
	obj.parentNode.insertBefore(a, obj);
	obj.parentNode.removeChild(obj);
	
}

/********* makeShowCalendar() *********/
//On affiche un calendrier lors du clic sur les liens "Calendrier" d'un formulaire
function makeShowCalendar(obj) {
	obj.onclick = calendarShow;
}


/********* makeAutoEmpty() ***********/
//On vide les champs de texte lors du focus
function makeAutoEmpty(obj) {
	obj.onfocus = function() {
		obj.value = "";
		setClass(obj, obj.className.replace("baseStyle", ""));
	}
	
}

/********* makeConfirmLink() ********/
//Appliqué sur les liens de suppression par exemple, demande confirmation (texte title) avant de suivre le lien
function makeConfirmLink(obj) {
	//Si pas de question, on zappe
	if (obj.title=="" || obj.title==undefined) return;
	obj.onclick = function() {
		return confirm(this.title);
	}
}

/******** makeFirstFocus() *********/
//Mets le focus sur l'élément de formulaire possedant un tabindex=1
function makeFirstFocus(obj) {
	var forms = getElementsBySelector("input,select,textarea,radio,checkbox", obj);
	for (i=0;i!=forms.length;i++) if (forms[i].getAttribute("tabindex") && forms[i].getAttribute("tabindex")==1) forms[i].focus();
}


/********* makeAutoSelect() ***********/
//on selectionne tout au focus
function makeAutoSelect(obj) {
	obj.onfocus = obj.select
}


/********** makeZoom() **********/
function makeZoom(obj) {
	obj.onclick = zoomShow;
}
/**********  zoomShow() *******/
//On affiche une image en grand format au milieu de l'écran
function zoomShow() {
	//On créé un div pour le zoom
	var div = document.getElementById("zoom");
	//S'il existe déjà, on le supprime
	if (div) div.parentNode.removeChild(div);
	//On le créé ensuite (on ne réutilise pas le même pour les cas où il y a plusieurs zooms par page)
	div = document.createElement("div");
	div.setAttribute("id", "zoom");
		
	//On crée un lien "fermer"
	var fermer = document.createElement("a");
	setClass(fermer, "fermer");
	fermer.innerHTML = "Fermer";
	fermer.href = "#";
	fermer.onclick = function() { openClose(div); return false; };
	div.appendChild(fermer);
	
	//On mets l'image dedans
	var img = document.createElement("img");
	img.alt = this.alt;
	//On le mets un peu à partir du haut
	div.style.top = "120px";
			
	//On centre le div une fois l'image chargée (sinon il trouve pas le width correct)
	img.onload = function() {
		//On le mets au milieu (on prends la largeur de la page divisée par deux moins la moitié de sa largeur )
		var pageWidth = getPageWidth(); //Largeur de la page
		//On peut pas trouver la largeur du div avec IE (il mets "auto") on prends donc juste la largeur de l'image
		var divWidth = getStyleInfo(div, "width");
		if (divWidth=="auto") {
			this.style.pixelWidth; //Bizarrement... Rien que de faire appel à cette ligne me permet d'avoir le résultat de getStyleInfo(img, "width"). 
			//Sans cette ligne je n'ai rien du tout (IE), il doit donner un layout... je sais pas...
			divWidth = img.offsetWidth;
		}
		else divWidth = divWidth.removePx();
		//On le place donc au centre !	
		div.style.left = ((pageWidth/2) - (divWidth/2)) + "px"
		return;
	}
		
	
	//Le grand format est de la forme XXXX_full.jpg
	//On dit où chercher (Ie le charge à ce moment là, même s'il n'est pas mis dans le DOM)
	var dotPosition = this.src.lastIndexOf(".");
	var ext = this.src.substring(dotPosition);
	img.src = this.src.substring(0, dotPosition) + "_full"+ext;
	//img.src = this.src.substring(0, hyphenPosition) + "-full" + this.src.substring(hyphenPosition);
	
	//On ferme le fenetre en cliquant sur l'image
	img.onclick = function() { openClose(div) }
	
	//On ajoute l'image au div
	div.appendChild(img);
	//On ajoute le div à la page
	document.getElementsByTagName("body")[0].appendChild(div);	
	
}


/*********** makeFormShowHidden() **************/
//Selon que je choisisse texte, fichier, site, auteur, ouvrage ou rubrique, j'affiche un deuxieme champ différent
function makeFormShowHidden(obj) {
	//Le select possede une liste d'options (texte, fichier, site, auteur, ouvrage, parent par exemple
	//Son nom est item_type
	//Il est suivi d'une liste de div intitulés id="div_item_type_texte", id="div_item_type_fichier"
	//On va donc rendre ca automatique quelque soit le select et les div, du moment qu'ils suivent la mm logique
	
	//On commence par enlever les noeuds vides
	removeEmptyTextNodesChild(obj);
	
	//Puis on affiche que celui qui est selectionné
	formShowHidden.call(obj);
}
/******** formShowHidden() ***********/
function formShowHidden() {
	//je cache tout
	formHideOthers(this);
	//J'affiche celui qui est selectionné
	var div = document.getElementById("div_"+this.name+"_"+this.value);
	if (div) div.style.display = "block";
	//Et je fais la même chose quand je change
	this.onchange =formShowHidden;
}

/********* formHideOthers ***********/
function formHideOthers(obj) {
	//On va masquer tout les divs qui correspondent à chaque valeur du select
	//(Exemple div_item_type_texte si le select s'appelle item_type et sa valeur est texte)
	var div;
	for (i = 0; i!=obj.childNodes.length;i++) {
		//Si le div existe, on le masque
		div = document.getElementById("div_"+obj.name+"_"+obj.childNodes[i].value);
		if (div) div.style.display = "none";
	}
}

/*********** makeOpenFieldset **************/
//On ouvre ferme les fieldset facultatif des formulaires en cliquant sur leur label
function makeOpenFieldset(obj) {
	obj.onclick = openFieldset;
}
/*********** openFieldset **************/
function openFieldset() {
	var fieldset = document.getElementById(this.href.substr(this.href.indexOf("#")+1));
	if (fieldset) openClose(fieldset);
	return false;	
}




/*******************************************
********************************************
	Fonctions de DOM particulières à certaines pages 
********************************************
*******************************************/

/********** makeOpenSubMenu **************/
function makeOpenSubMenu(obj) {
	//On fait ouvrir le sous-menu quand je passe le curseur dessus
	obj.onmouseover = openSubMenu;
	obj.onmouseout = launchTimeOutCloseSubMenu;
	removeEmptyTextNodesChild(obj.parentNode);
}

//******** openSubMenu **************/
function openSubMenu() {
	//On trouve la profondeur, pour diféfrents cas
	var depth = getSubMenuDepth.call(this);
	//On ferme les autres menus complétement quand on passe sur les tetes de sections
	if (depth==0) {
		subMenuDoNotClose = false;
		closeSubMenu();
	}
	
	//On indique que je suis bien sur le menu, donc qu'il ne faut pas le fermer
	subMenuDoNotClose = true;
	//On ferme tout les sous-menus si je suis au niveau 1 de profondeur (sections les plus grandes)
	if (depth==1) closeAllSubMenus();
	
	//on ouvre le sous menu, c'est à dire le ul qui suit
	var subMenu = this.nextSibling;
	if (subMenu) subMenu.style.display = "block";
}

//******** launchTimeOutCloseSubMenu *******/
function launchTimeOutCloseSubMenu() {
	//On indiquer avoir quitté le menu, que c'est possible de le fermer
	subMenuDoNotClose = false;
	//On va tester dans 600ms si je dois fermer ou non le menu
	//Si un timeout est déjà lancé, on l'arrete pour le relancer, pour éviter que plusieurs se lancent en meme temps
	if (typeof(timeoutCloseSubMenu)=="number") clearTimeout(timeoutCloseSubMenu);
	timeoutCloseSubMenu = setTimeout(closeSubMenu, 600);
}

//********** closeSubMenu **************/
function closeSubMenu() {
	//On ferme le sous menu si on en a le droit
	if (subMenuDoNotClose) return;
	//On ferme tout les menus (et sous-menus)
	closeAllSubMenus();
	var subMenus = getElementsBySelector("#menu ul");
	for (var i=0;i!=subMenus.length;i++) {
		subMenus[i].style.display = "none";
	}	
}

//********* closeAllSubMenus ***********/
function closeAllSubMenus() {
	//je ferme tout les sous-sous menus
	var subSubMenus = getElementsBySelector("#menu ul ul");
	for (var i=0;i!=subSubMenus.length;i++) {
		subSubMenus[i].style.display = "none";
	}
}

//******** getSubMenuDepth *************/
function getSubMenuDepth() {
	//On calcule le niveau du sous menu, c'est à dire le nombre de ul a traverser pour remonter jusqu'à #menu
	var pointer = this;
	var depth = 0;
	while (pointer.id!="menu") {
		if (pointer.nodeName=="UL") depth++;
		pointer = pointer.parentNode;
	}
	return depth;
}


/*********** makeOpenFaq *************/
function makeOpenFaq(obj) {
	//On ouvre la réponse au clic sur la question
	removeEmptyTextNodesChild(obj.parentNode.parentNode);
	obj.onclick = openFaq;
}
/********** openFaq **********/
function openFaq() {
	var toOpen = this.parentNode.nextSibling;
	if (toOpen) {
		openClose(toOpen);
		document.location.hash = toOpen.id;
	}
	return false;
}

/*********** makeOpenMenuLateral **************/
function makeOpenMenuLateral(obj) {
	//On ouvre les sous-sections au clic sur une section
	removeEmptyTextNodesChild(obj.parentNode);
	obj.onclick = openMenuLateral;
}
function openMenuLateral() {
	var toOpen = this.nextSibling;
	if (toOpen) {
		openClose(toOpen);
		if (getStyleInfo(toOpen, "display")=="block") this.className = "focus";
		else this.className="";
		
		this.blur();
	}
	return false;	
}


//********* makeFocusMenu *******//
//On mets la classe de focus sur le lien s'il pointe vers l'adresse actuelle
function makeFocusMenu(obj) {
	var url = document.location.href;
	var href = obj.href;
	var ulMenu = obj.parentNode.parentNode; //L'ul qui contient le lien
	//Si je trouve le href dans l'url actuelle, alors focus
	if (url.find(href)) {
		obj.className+=" focus";
		if (ulMenu && getStyleInfo(ulMenu, "display")=="none") openClose(ulMenu);
	}
}


/********** makeOpenLivraison **************/
function makeOpenLivraison(obj) {
	//Si déjà checked, on ouvre
	if (obj.checked) openClose(document.getElementById("adresse_livraison"));
	obj.onclick = function() {
		openClose(document.getElementById("adresse_livraison"));
		//Si on le ferme, on vide les champs
		if (!this.checked) {
			document.getElementById("user_livraison_nom").value = "";
			document.getElementById("user_livraison_prenom").value = "";
			document.getElementById("user_livraison_adresse").value = "";
			document.getElementById("user_livraison_code_postal").value = "";
			document.getElementById("user_livraison_ville").value = "";
			document.getElementById("user_livraison_pays").value = "";
		}
	}
}