// Onglets.js // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - // Historique de mise à jour // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - // 2007-01-28 : Vincent // Création du script // 2011-06-07 : Guillaume Lagacé // Ajout possibilité de sélectionner un onglet par défaut function Onglets() { var aDivs = document.getElementsByTagName("div"); for ( var cDivs = 0; cDivs < aDivs.length; cDivs++ ) { var eDiv = aDivs[cDivs]; if (eDiv.className.indexOf("Onglets_Groupe") != -1) { new Onglets_Object(eDiv); } } window.bTabFound = false; // Variable pour savoir si on a trouvé un onglet à activer window.initialLoad = true; if (location.hash.length > 0) { // sélection onglet par défaut si # dans l'url var aSelected = document.getElementById("a" + location.hash.substring(1, location.hash.length)); if (aSelected) { aSelected.onclick(); window.bTabFound = true; // Selection du parent if (location.hash.indexOf("#exp") == 0) { // Onglet navigation par expertises var aMasterTab = document.getElementById("abyExpertise"); if (aMasterTab) aMasterTab.onclick(); } else { if (location.hash.indexOf("#y") == 0) { // Onglet navigation par années var aMasterTab = document.getElementById("abyDate"); if (aMasterTab) aMasterTab.onclick(); } else { if (location.hash.indexOf("#origin") == 0) { // Onglet navigation par origine var aMasterTab = document.getElementById("abyOrigin"); if (aMasterTab) aMasterTab.onclick(); } else { if (location.hash.indexOf("#all") == 0) { // Affichage "Toutes les fiches techniques" var aAll = document.getElementById("aall"); if (aAll) aAll.onclick(); } } } } } } if (!window.bTabFound) { // activation premier onglet par défaut (Par date) var aMasterTab = document.getElementById("abyDate"); if (aMasterTab) { aMasterTab.onclick(); } else { // Affichage toutes les fiches techniques var aAll = document.getElementById("aall"); if (aAll) { aAll.onclick(); } else { // activation premier onglet par défaut (Par origine - Brevets) var aOriginTab = document.getElementById("abyOrigin"); if (aOriginTab) { aOriginTab.onclick(); } else { // autres sortes d'onglets standards (dans about us ou archives nouvelles) aULs = document.getElementsByTagName("ul"); for (var cULs = 0; cULs < aULs.length; cULs++) { var eUL = aULs[cULs]; if (eUL.className.indexOf("Onglets_Navigation") != -1) { var aFirstTab = eUL.getElementsByTagName("a")[0]; if (aFirstTab) { aFirstTab.onclick(); } } } } } } } window.initialLoad = false; } function Onglets_Object( eOnglets ) { // Propriétés de l'objet this.elementContenus = "div"; this.ongletActif = null; this.contenusActifs = new Array(); this.navigation = null; this.contenu = null; this.classeActive = "Onglets_Actif"; // Méthodes this.afficher = Onglets_Afficher; this.retournerContenus = Onglets_RetournerContenus; // Redéfini l'élément de contenu à afficher si définit if ( eOnglets.className.split(" ")[1] ) this.elementContenus = eOnglets.className.split(" ")[1]; // Tente d'aller chercher les éléments de navigation et du contenu du groupe d'onglet au premier niveau des childNodes for ( var cNodes = 0; cNodes < eOnglets.childNodes.length; cNodes++ ) { var node = eOnglets.childNodes[cNodes] ; if ( node.nodeType == 1 ) { // On semble avoir trouvé la navigation if ( node.className.indexOf("Onglets_Navigation") != -1 ) this.navigation = node; // On semble avoir trouvé le contenu if ( node.className.indexOf("Onglets_Contenu") != -1 ) this.contenu = node; } } // Vérifie si l'on a la navigation et le contenu, sinon on arrête le programme if ( this.navigation && this.contenu ) { // Ajoute les méthodes d'affichage au ancres de la navigation var aAncres = this.navigation.getElementsByTagName("a"); for ( var cAncres = 0; cAncres < aAncres.length; cAncres++ ) { var boutonOnglet = aAncres[cAncres]; boutonOnglet.refObject = this; boutonOnglet.contenus = this.retournerContenus(boutonOnglet); boutonOnglet.onclick = function() { this.refObject.afficher(this); /* return false;*/ }; } // Active le premier bouton du groupe (si aucun # dans l'url) //if (location.hash.length == 0) aAncres[0].onclick(); } } // Retourne un tableau des éléments de contenus associés à un onglet function Onglets_RetournerContenus( bouton ) { var aNomContenus = bouton.className.split(" "); //var aElements = this.contenu.getElementsByTagName(this.elementContenus); var aElements = new Array(); var aContenusLies = new Array(); for (var cElements = 0; cElements < this.contenu.childNodes.length; cElements++) { var node = this.contenu.childNodes[cElements]; if (node.nodeName.toLowerCase() == this.elementContenus) { aElements.push(node); } } for ( var cNomContenus = 0; cNomContenus < aNomContenus.length; cNomContenus++ ) { var nomContenu = aNomContenus[cNomContenus]; for ( var cElements = 0; cElements < aElements.length; cElements++ ) { var eElement = aElements[cElements]; if ( eElement.className.indexOf(nomContenu) != -1 ) { aContenusLies.push(eElement); eElement.style.display = "none"; eElement.style.opacity = "0"; eElement.style.filter = "alpha(opacity=0)"; /*eElement.style.position = "absolute"; eElement.style.top = "0";*/ } } } return aContenusLies; } // Affiche l'onglet et le contenu demandé function Onglets_Afficher(bouton) { // Désactive l'onglet courant ainsi que son contenu if ( this.ongletActif && this.ongletActif != bouton ) { this.ongletActif.className = this.ongletActif.className.replace(this.classeActive + " ", ""); for ( var cContenus = 0; cContenus < this.contenusActifs.length; cContenus++ ) { //this.contenusActifs[cContenus].className = this.contenusActifs[cContenus].className.replace(this.classeActive, ""); this.contenusActifs[cContenus].style.zIndex = "1"; this.contenusActifs[cContenus].style.display = "none"; this.contenusActifs[cContenus].style.opacity = "0"; this.contenusActifs[cContenus].style.filter = "alpha(opacity=0)"; /*var fx = new Fx.Styles(this.contenusActifs[cContenus], {duration: 400, wait:false}); fx.start({'opacity': 0});*/ } } if ( this.ongletActif != bouton ) { // Active l'onglet courant ainsi que son contenu this.ongletActif = bouton; this.ongletActif.className = this.classeActive + " " + this.ongletActif.className; this.contenusActifs = this.ongletActif.contenus; // Affiche les contenus de l'onglet for (var cContenus = 0; cContenus < this.ongletActif.contenus.length; cContenus++) { //this.ongletActif.contenus[cContenus].className = "Onglets_Actif " + this.ongletActif.contenus[cContenus].className; this.ongletActif.contenus[cContenus].style.zIndex = "2"; var fx = new Fx.Styles(this.ongletActif.contenus[cContenus], {duration: 400, wait:false}); fx.start({'opacity': 1}); this.ongletActif.contenus[cContenus].style.display = "block"; } } // Active le premier onglet de la sous-navigation par défaut // (si on est dans le chargement initial de la page et qu'on n'a pas trouvé le bon onglet avec le # dans l'url // ou si on clique sur un onglet de la navigation principale) if ((window.initialLoad && !window.bTabFound) || (!window.initialLoad && (bouton.id.toLowerCase() == "abyexpertise" || bouton.id.toLowerCase() == "abydate" || bouton.id.toLowerCase() == "abyorigin"))) { var aLinks = document.getElementsByTagName("a"); var sCondition = ""; if (bouton.id.toLowerCase() == "abyexpertise") { sCondition = "aexp"; } else { if (bouton.id.toLowerCase() == "abydate") { sCondition = "ay"; } else { if (bouton.id.toLowerCase() == "abyorigin") { sCondition = "aorigin"; } } } for (var i = 0; i < aLinks.length; i++) { if (sCondition.length > 0 && aLinks[i].id.indexOf(sCondition) == 0) { aLinks[i].onclick(); break; } } } } // Attache l'événement au chargement de la page if ( window.addEventListener ) window.addEventListener("load", Onglets, false); else if ( window.attachEvent ) window.attachEvent("onload", Onglets);