Page de test 2

/* Tout JavaScript ici sera chargé avec chaque page accédée par n’importe quel utilisateur. */

/*Favicon*/

$('link[rel="shortcut icon"]').attr('href', 'https://gf1.geo.gfsrv.net/cdn98/191b803adbf82f4b8febe3a2c38c2c.ico');

/*Tabber*/

function onTabClick(bol){

 var parent = this.parentElement;
 var buttonList = parent.children;
 var contentList = parent.nextElementSibling.children;
 var position = this.dataset.position; // position du bouton sélectionné
 var activeButton = parent.querySelector(".tabber-active");

 if (activeButton == null) {
   
   this.classList.add("tabber-active");
   contentList[position].classList.add("tabber-active");
   
 } else {
   
   var activePosition = activeButton.dataset.position; // position du bouton actif
   
   if (activePosition == position) {
     
     // lorsque la fonction est appelé par le target
     if (bol !== undefined) {
       
       this.classList.remove("tabber-active");
       contentList[position].classList.remove("tabber-active");
     }
     
   } else {

     this.classList.add("tabber-active");
     contentList[position].classList.add("tabber-active");
     
     activeButton.classList.remove("tabber-active");
     contentList[activePosition].classList.remove("tabber-active");
   }
 }

}

function buttonTabber(content){

 var buttonList = content.querySelectorAll(".button");
 var targetButton = content.querySelector(".button:target");
   
 buttonList.forEach(function(button) {
     
   button.addEventListener("click", onTabClick, false);
 });
 
 if (targetButton !== null) {
   onTabClick().call(targetButton);
 }

}

/*Calcul*/

function createInput(content){

 //sélectionne toutes les div contenant les futurs input
 var allInput = content.querySelectorAll("div#inputCalcul");
 
 //sélectionne les div qui contiendront les input du résultat du calcul
 var resultatCalc = content.querySelectorAll("div#inputResult");

 //parcourt tous les input 
 allInput.forEach(function(e){
   
   //insert les input à l'intérieur des associées
   e.insertAdjacentHTML('afterbegin','<input id="entree" type="number" required>');
 });
 
 //parcourt les input résultat
 resultatCalc.forEach(function(e){
   
   //insert les input résultat à l'intérieur des div associées
   e.insertAdjacentHTML('afterbegin','<input id="sortie" type="number" required>');
 });

}

function formule(tabValue,tabCoeff,formuleNumber){

 if(formuleNumber === 0){
   
   var value = 0;
   var n = tabValue.length;
   
   if (n*(n+1)/2 != tabCoeff.length){
     return 0;
   } else {
     var c = 0;
     for(var i=0; i < n; i++){
       for(var j=0; j < n-i; j++){
         value += parseFloat(tabCoeff[c])*tabValue[i]*tabValue[i+j];
         c += 1;
       }
     }
     return Math.floor(value);
   }
 } else {
   switch(formuleNumber) {
     case 1:
       return 0;
   }
 }

}

function calculWiki(content){

 //sélectionne la div qui contient les coefficients de la formule
 var coeffDOM = content.querySelector("div#coeffFormule");
   
 if (coeffDOM != null){
     
   //crée le tableau des coefficients de la formule
   var tabCoeff = coeffDOM.textContent.split(",");
     
 } else {
   
   //sélectionne le numéro de la formule à utiliser
   var formuleNumberDOM = content.querySelector("div#formuleNumber");
   var formuleNumber = parseInt(formuleNumberDOM.textContent);
 }

 //séléectionne le bouton assoicié aux calculs
 var bouttonCalcul = content.querySelector("#buttonCalcul");
 
 //exécute une fonction à chaque clic sur le bouton
 bouttonCalcul.addEventListener("click", function(){
   
   var value = 0;
   
   //sélectionne tous les input d'entrée
   var allRealInput = content.querySelectorAll("input#entree");
   
   //sélectionne tous les input de sortie
   var allRealInputOut = content.querySelectorAll("input#sortie");
   
   var tableauInput = [1];

   //stocke toutes les valeurs des inputs dans tableauInput
   allRealInput.forEach(function(e){
     if (e.value != ""){
       tableauInput.push(parseFloat((e.value)));
     }
   });
   
   if(tabCoeff != undefined){
     value = formule(tableauInput,tabCoeff,0);
   } else {
     value = formule(tableauInput,[],formuleNumber);
   }
   
   //parcourt tous les input de sortie en leur donnant la valeur calculée précédemment 
   allRealInputOut.forEach(function(e){
     e.value=value;
   });
 });   

}

/*Modal*/

function modal(content){

 //sélectionne le bouton, le modal et le close à l'intérieur de l'id modalContainer
 var boutonModal = content.querySelector(".button");
 var modalContent = content.querySelector(".modal");
 var boutonClose = content.querySelector(".close");
 
 //exécute la fonction suivante lorsqu'on clique sur le bouton
 boutonModal.addEventListener("click", function(){
   
   //ajoute la classe active au bouton
   boutonModal.className += " tabber-active";
   
   //affiche le modal
   modalContent.style.display = "block";
   
   //ferme le modal lorsqu'on clique sur le bouton close
   boutonClose.addEventListener("click", function(){
     modalContent.style.display = "none";
     boutonModal.className = boutonModal.className.replace("tabber-active", "")
   });
   
   //ferme le modal lorsqu'on clique en dehors du modal
   window.addEventListener("click", function(e){
     if (e.target == modalContent) {
       modalContent.style.display = "none";
       boutonModal.className = boutonModal.className.replace("tabber-active", "")
     }
   });
 });

}

/*switch de contenu*/

function switchDiv(content){

 //sélectionne le bouton à l'intérieur de l'id buttonContainer
 var boutonSwitch = content.querySelector(".button");
 
 //exécute la fonction suivante à chaque clique sur le bouton
 boutonSwitch.addEventListener("click", function(){
   
   //sélectionne toutes les div avec l'id change
   var changeDiv = content.querySelectorAll("div#change");
   var n = changeDiv.length;
   
   //fais disparaître la div affichée et fais apparaître la div suivante
   for (var i = 0; i < n; i++) {
     if(getComputedStyle(changeDiv[i]).display == "block") {
       changeDiv[i].style.display="none";
       if(i<=n-2) {
         changeDiv[i+1].style.display="block";
       } else {
         changeDiv[0].style.display="block";
       }
       break;
     }
   }
 });

}

function changeDisplay(content){

 //sélectionne le bouton à l'intérieur de l'id buttonContainer
 var boutonSwitch = content.querySelector(".button");
 
 var frereList = content.nextElementSibling;
 
 //exécute la fonction suivante à chaque clique sur le bouton
 boutonSwitch.addEventListener("click", function(){
   if (this.classList.length == 1) {
     this.classList.add('tabber-active');
     frereList.classList.remove('tabber-noactive');
   } else {
     this.classList.remove('tabber-active');
     frereList.classList.add('tabber-noactive');
   }
 });

}

//s'exécute une fois au chargement de chaque page (function(){

 //sélectionne toutes les div contenant un tabber à l'intérieur du contenu de chaque page
 var tabberContainer = document.querySelectorAll("div#mw-content-text div.tabber-container");
 
 //parcourt chaque div contenant un tabber, rien si vide
 tabberContainer.forEach(function(e){
   
   //exécute la fonction buttonTabber
   buttonTabber(e);
   });
 
 //sélectionne toutes les div contenant un calcul à l'intérieur du contenu de chaque page
 var containerCalcul = document.querySelectorAll("div#mw-content-text div#container-calcul");
 
 //parcourt chaque div contenant un calcul, rien si vide
 containerCalcul.forEach(function(e){
   
   //exécute les fonctions createInput et calculWiki
   createInput(e);
   calculWiki(e);
 });
 
 //sélectionne toutes les div contenant un modal à l'intérieur du contenu de chaque page
 var modalContainer = document.querySelectorAll("div#mw-content-text div#modalContainer");
 
 //parcourt chaque div contenant un modal, rien si vide
 modalContainer.forEach(function(e){
   
   //exécute la fonction modal
   modal(e);
 });
 
 //sélectionne toutes les div contenant un bouton pour switch à l'intérieur du contenu de chaque page
 var bcontainer = document.querySelectorAll("div#mw-content-text #buttonContainer"); 
 
 //parcourt chaque div contenant un bouton pour switch, rien si vide
 bcontainer.forEach(function(e){
   
   //exécute la fonction switchDiv
   switchDiv(e);
 });

 var ccontainer = document.querySelectorAll("div#mw-content-text .list-equip");
 
 ccontainer.forEach(function(e){
   
   changeDisplay(e);
 });

})();

/* Pour les cookies */

(function () {

   var req = new XMLHttpRequest();
   req.addEventListener('load', function (ev) {
       if (this.status >= 200 && this.status < 300) {
           var data = JSON.parse(this.responseText);
           if (data.hasOwnProperty('version')) {
               var gdpr = document.createElement("script");
               gdpr.src = "https://s3-static.geo.gfsrv.net/cookiebanner/" + data.version + "/cookie.min.js";
               document.head.appendChild(gdpr);
           }
       }
   });
   req.open('GET', "https://s3-static.geo.gfsrv.net/cookiebanner/version.json");
   req.send();

})();