From 2b5630fc751e603ab67442443f49648ea5e647cc Mon Sep 17 00:00:00 2001
From: pisouvigne <pisouvigne>
Date: Sat, 15 Aug 2020 21:21:13 +0200
Subject: [PATCH] gg

---
 site/v1/css/style.css      |  8 +++++
 site/v1/index.html         | 67 ++++++++++++++++++++++----------------
 site/v1/js/func.js         | 21 ++++++++++--
 site/v1/js/generateGame.js | 29 ++++++++++++-----
 site/v1/js/lang.js         | 10 +++---
 site/v1/js/timer.js        |  5 ++-
 6 files changed, 95 insertions(+), 45 deletions(-)

diff --git a/site/v1/css/style.css b/site/v1/css/style.css
index ac23077..99fe72a 100644
--- a/site/v1/css/style.css
+++ b/site/v1/css/style.css
@@ -105,6 +105,14 @@ html {
     justify-content: center;
 }
 
+#firstTime {
+    z-index: 5;
+}
+
+#firstTimeet {
+    z-index: 1;
+}
+
 #selectionContainer2 {
     margin: 0 auto;
     width: 60%;
diff --git a/site/v1/index.html b/site/v1/index.html
index 06325dc..34c3576 100644
--- a/site/v1/index.html
+++ b/site/v1/index.html
@@ -137,11 +137,12 @@
                 </div>
             </div>
             <div id="containerVanilla">
-                <div class="border background dys listenerHover vanillaElement" onclick="wait('vanillaInfini', this)">
+                <div class="border background dys listenerHover vanillaElement sel4"
+                    onclick="wait('vanillaInfini', this)">
                     <a>Mode Infini</a>
                     <i class="fa fa-play" aria-hidden="true"></i>
                 </div>
-                <div class="border background dys listenerHover vanillaElement scoreElement"
+                <div class="border background dys listenerHover vanillaElement scoreElement infScore"
                     onclick="leaderboard('vanilla', this)">
                     <a></a>
                     <i class="fa fa-trophy" aria-hidden="true"></i>
@@ -209,24 +210,24 @@
             <div>
                 <p>Fonctions Logiques : </p>
                 <div>
-                    <input type="checkbox" id="logique1" name="logique1" checked>
-                    <label for="logique1">ET</label>
+                    <input type="checkbox" id="logique10" name="logique10" checked>
+                    <label for="logique10">ET</label>
                 </div>
                 <div>
-                    <input type="checkbox" id="logique2" name="logique2">
-                    <label for="logique2">OU</label>
+                    <input type="checkbox" id="logique20" name="logique20">
+                    <label for="logique20">OU</label>
                 </div>
                 <div>
-                    <input type="checkbox" id="logique3" name="logique3">
-                    <label for="logique3">NON</label>
+                    <input type="checkbox" id="logique30" name="logique30">
+                    <label for="logique30">NON</label>
                 </div>
                 <div>
-                    <input type="checkbox" id="logique4" name="logique4">
-                    <label for="logique4">NON-ET</label>
+                    <input type="checkbox" id="logique40" name="logique40">
+                    <label for="logique40">NON-ET</label>
                 </div>
                 <div>
-                    <input type="checkbox" id="logique5" name="logique5">
-                    <label for="logique5">NON-OU</label>
+                    <input type="checkbox" id="logique50" name="logique50">
+                    <label for="logique50">NON-OU</label>
                 </div>
             </div><br><br>
             <div class="border background dys listenerHover" id="generate_button_perso"
@@ -338,6 +339,26 @@
                 </div>
             </div>
         </div>-->
+        <div id="firstTime" class="modal">
+            <div class="modal-content info-content">
+                <div class="modal-body dys border background" align=center>
+                    <span class="close" onclick="closeModal('firstTime');">&times;</span>
+                    <h1 class="dys">Comment jouer</h1>
+                    <hr id="hr">
+
+                    <br>
+
+                    <br>Vous devez allumer la boite la plus à droite du circuit logique pour gagner la partie<br>
+                    Pour cela, vous devez cliquer sur les boites à gauche de l'écran pour changer leur valeur : 0
+                    (FAUX/ETEINT) ou 1 (VRAI/ALLUME).<br><br>
+                    Le but est de terminer les niveaux en un minimum de clics et un minimum de temps<br><br>
+                    Vous pouvez voir votre score à côté de chaque mode de jeu ainsi que le score des autres
+                    joueurs.<br>
+                    <p class="dys info_check" align=right>Ne plus afficher les aides <input type="checkbox"
+                            id="info_check_input" onclick="showInfo();"></p>
+                </div>
+            </div>
+        </div>
         <div id="firstTimeet" class="modal">
             <div class="modal-content info-content">
                 <div class="modal-body dys border background" align=center>
@@ -373,11 +394,9 @@
                         </tr>
                     </table>
                     <br>
-                    <p>a = entrée en haut à gauche<br>
+                    <p class="dys">a = entrée en haut à gauche<br>
                         b = entrée en bas à gauche<br>
                         S = sortie à droite</p>
-                    <br>
-                    <p></p>
                     <p><img src="img/txt_en/and.png" class="margin-right"><img src="img/sym/and.png"></p>
                     <br><br>
                     <p class="dys info_check" align=right>Ne plus afficher les aides <input type="checkbox"
@@ -420,11 +439,9 @@
                         </tr>
                     </table>
                     <br>
-                    <p>a = entrée en haut à gauche<br>
+                    <p class="dys">a = entrée en haut à gauche<br>
                         b = entrée en bas à gauche<br>
                         S = sortie à droite</p>
-                    <br>
-                    <p></p>
                     <p><img src="img/txt_en/or.png" class="margin-right"><img src="img/sym/or.png"></p>
                     <br><br>
                     <p class="dys info_check" align=right>Ne plus afficher les aides <input type="checkbox"
@@ -454,10 +471,8 @@
                         </tr>
                     </table>
                     <br>
-                    <p>a = entrée à gauche<br>
+                    <p class="dys">a = entrée à gauche<br>
                         S = sortie à droite</p>
-                    <br>
-                    <p></p>
                     <p><img src="img/txt_en/not.png" class="margin-right"><img src="img/sym/not.png"></p>
                     <br><br>
                     <p class="dys info_check" align=right>Ne plus afficher les aides</a><input type="checkbox"
@@ -500,11 +515,9 @@
                         </tr>
                     </table>
                     <br>
-                    <p>a = entrée en haut à gauche<br>
+                    <p class="dys">a = entrée en haut à gauche<br>
                         b = entrée en bas à gauche<br>
                         S = sortie à droite</p>
-                    <br>
-                    <p></p>
                     <p><img src="img/txt_en/nor.png" class="margin-right"><img src="img/sym/nor.png"></p>
                     <br><br>
                     <p class="dys info_check" align=right>Ne plus afficher les aides <a class="txt"
@@ -547,11 +560,9 @@
                         </tr>
                     </table>
                     <br>
-                    <p>a = entrée en haut à gauche<br>
+                    <p class="dys">a = entrée en haut à gauche<br>
                         b = entrée en bas à gauche<br>
                         S = sortie à droite</p>
-                    <br>
-                    <p></p>
                     <p><img src="img/txt_en/nand.png" class="margin-right"><img src="img/sym/nand.png"></p>
                     <br><br>
                     <p class="dys info_check" align=right>Ne plus afficher les aides <a class="txt"
@@ -584,7 +595,7 @@
                     <p><a class="dys"></a><a class="dys" id="scoreTotGameOver"></a></p>
                     <p class="dys"><a class="dys"></a><a class="dys" id="TempsTotGameOver"></a></p>
                     <p><a class="dys">Vous avez atteint le niveau : </a><a class="dys" id="niveauGameOver"></a><a
-                            class="dys"> / 5</a></p>
+                            class="dys nivShow"> / 5</a></p>
                 </div>
 
                 <div class="border background dys listenerHover" id="retry_button" onclick="">
diff --git a/site/v1/js/func.js b/site/v1/js/func.js
index 28c5ac0..76fa5d7 100644
--- a/site/v1/js/func.js
+++ b/site/v1/js/func.js
@@ -704,7 +704,10 @@ function success(mode) {
             document.querySelector("#win_pannel").style.display = "block";
             //openModal("success");
             document.querySelector("#click_number").innerHTML = click;
-            document.querySelector("#time_number").innerHTML = time;
+            if (mode === "tuto") {
+                document.querySelector("#time_number").innerHTML = "∞";
+            } else
+                document.querySelector("#time_number").innerHTML = time;
             document.querySelector("#next_level_button").onclick = function () {
                 //closeModal('success');
                 nextLevel(mode);
@@ -972,7 +975,12 @@ function vanillaSelection() {
     document.querySelector(".sel3").onclick = function () {
         wait('vanillaImpossible', document.querySelector(".sel3"))
     }
-
+    document.querySelector(".sel4").onclick = function () {
+        wait('vanillaInfini', document.querySelector(".sel4"))
+    }
+    document.querySelector(".infScore").onclick = function () {
+        leaderboard('vanilla', document.querySelector(".infScore"))
+    }
 }
 
 function normalSelection() {
@@ -993,11 +1001,17 @@ function normalSelection() {
     document.querySelector(".sel3").onclick = function () {
         wait('normalImpossible', document.querySelector(".sel3"))
     }
+    document.querySelector(".sel4").onclick = function () {
+        wait('normalInfini', document.querySelector(".sel4"))
+    }
+    document.querySelector(".infScore").onclick = function () {
+        leaderboard('normal', document.querySelector(".infScore"))
+    }
 }
 
 function playVanilla() {
     hideDiv(document.querySelector("#VanillalevelSelectionPage"));
-    showDiv(document.querySelector("#mainPage"));
+    showDiv(document.querySelector("#playPage"));
     niveauActuel = 1;
     timeTot = 0;
     launchGameOne("vanilla");
@@ -1232,6 +1246,7 @@ function modeSelect() {
 
 
 function wait(mode, btn) {
+    console.log(mode)
     document.querySelector("#lose_pannel").style.display = "none";
     isFinish = false;
     var time = 300;
diff --git a/site/v1/js/generateGame.js b/site/v1/js/generateGame.js
index c4aa99e..5e120cb 100644
--- a/site/v1/js/generateGame.js
+++ b/site/v1/js/generateGame.js
@@ -279,6 +279,8 @@ function tuto(niveau) {
         if (firstTime.length > 0) {
             if (allowedInfoPorte) {
                 openModal('firstTime' + firstTime[0]);
+                if (firstTime[0] === "et")
+                    openModal('firstTime');
                 timer.pause();
             }
             generator([], [1], [[true, firstTime[0]]], "tuto");
@@ -321,14 +323,25 @@ function generator(matchs, col, listePorteLogique, mode, time) {
     var logiquesTemp = [];
     for (let i = 0; i < col.length; i++) colCopy[i] = col[i];
     //liste porte logique
-    if (listePorteLogique === null || listePorteLogique === undefined)
-        arrayPorte = [
-            [document.querySelector("#logique1").checked, "et"],
-            [document.querySelector("#logique2").checked, "ou"],
-            [document.querySelector("#logique3").checked, "inv"],
-            [document.querySelector("#logique4").checked, "etnon"],
-            [document.querySelector("#logique5").checked, "nonou"]
-        ];
+    if (listePorteLogique === null || listePorteLogique === undefined) {
+        if (mode === "select")
+            arrayPorte = [
+                [document.querySelector("#logique10").checked, "et"],
+                [document.querySelector("#logique20").checked, "ou"],
+                [document.querySelector("#logique30").checked, "inv"],
+                [document.querySelector("#logique40").checked, "etnon"],
+                [document.querySelector("#logique50").checked, "nonou"]
+            ];
+        else
+            arrayPorte = [
+                [document.querySelector("#logique1").checked, "et"],
+                [document.querySelector("#logique2").checked, "ou"],
+                [document.querySelector("#logique3").checked, "inv"],
+                [document.querySelector("#logique4").checked, "etnon"],
+                [document.querySelector("#logique5").checked, "nonou"]
+            ];
+    }
+
     else arrayPorte = listePorteLogique;
     arrayPorte = arrayPorte.filter(function (e) {
         if (e[0] === true) return e;
diff --git a/site/v1/js/lang.js b/site/v1/js/lang.js
index 8385900..cdf9dc4 100644
--- a/site/v1/js/lang.js
+++ b/site/v1/js/lang.js
@@ -22,11 +22,11 @@ const lang = {
         temps: "Temps : ",
         title_selection: "Sélection du mode de jeu",
         infoFirstTimeEt: "Porte \"et\"",
-        infoFirstTimeEtInfo1: "L'opérateur ET renvoie VRAI seulement si ses deux entrées sont à 1.<br><br><br> Voici la table de vérité :",
+        infoFirstTimeEtInfo1: "L'opérateur ET (ou AND en anglais) renvoie 1 seulement si ses deux entrées sont à 1.<br><br><br> Voici la table de vérité :",
         infoFirstTimeOu: "Porte \"ou\"",
-        infoFirstTimeOuInfo1: "L'opérateur OU renvoie VRAI si au moins une entrée est à 1.<br><br><br> Voici la table de vérité :",
+        infoFirstTimeOuInfo1: "L'opérateur OU (ou OR en anglais) renvoie 1 si au moins une entrée est à 1.<br><br><br> Voici la table de vérité :",
         infoFirstTimeinv: "Porte \"non\"",
-        infoFirstTimeinvInfo1: "La sortie est l'inverse de l'entrée.<br><br><br> Voici la table de vérité :",
+        infoFirstTimeinvInfo1: "L'opérateur NON (ou NOT en anglais) renvoie l'inverse de l'entrée.<br><br><br> Voici la table de vérité :",
         cache_reinit: "Réinitialiser toutes les données du navigateur",
         reset_cache_message: "Toutes les données ont été supprimées.<br><br><br> La page va automatiquement se rafraichir dans 3s ...",
         reset: "Reset",
@@ -36,10 +36,10 @@ const lang = {
         symbole: "Mode symboles",
         timerSetting: "Activer la barre timer",
         infoFirstTimenonou: "Porte \"non-ou\"",
-        infoFirstTimenonouInfo1: "L'opérateur non-ou renvoie VRAI si aucune des entrées est à 1.<br><br><br> Voici la table de vérité :",
+        infoFirstTimenonouInfo1: "L'opérateur non-ou (ou NOR en anglais) renvoie 1 si aucune des entrées est à 1.<br><br><br> Voici la table de vérité :",
         infoFirstTimeetnon: "Porte \"non-et\"",
         timeInfo: "Vous avez réussi en ",
-        infoFirstTimeetnonInfo1: "L'opérateur non-et renvoie FAUX si les deux entrées sont à 1. Sinon il renvoie VRAI<br><br><br> Voici la table de vérité :",
+        infoFirstTimeetnonInfo1: "L'opérateur non-et (ou NAND en anglais) renvoie 0 si les deux entrées sont à 1. Sinon il renvoie VRAI<br><br><br> Voici la table de vérité :",
 
     },
     en: {
diff --git a/site/v1/js/timer.js b/site/v1/js/timer.js
index afac478..bc82800 100644
--- a/site/v1/js/timer.js
+++ b/site/v1/js/timer.js
@@ -45,7 +45,9 @@ timer.addEventListener('secondsUpdated', function (e) {
 });
 
 function endTime() {
-  if (modeG === "vanilla" || modeG === "normal") {
+  console.log(modeG);
+  document.querySelector(".nivShow").innerHTML = " / 5";
+  if (modeG === "vanillaInfini" || modeG === "normalInfini") {
     clickTot = clickTot + click;
     var scoreTot
     if (niveauActuel === 1)
@@ -57,6 +59,7 @@ function endTime() {
     document.querySelector("#TempsTotGameOver").innerHTML = "Temps : " + timeTot;
     sendScore(scoreTot, modeG, clickTot, niveauActuel, 25, timeTot);
     clickTot = 0;
+    document.querySelector(".nivShow").innerHTML = "";
     document.querySelector("#lose_pannel").style.display = "block";
     document.querySelector("#play_menu_game").style.display = "none";
   } else {