Finale version with comments

script.js

@@ -15,6 +15,10 @@ readTextFile("words.txt");
 aleatoire();
 setMyKeyDownListener();
 
+
+
+//------------------------------Changement de couleur Keys et Divs------------------
+
 function change_color_good_letter(coord){
     var case_div = document.getElementById(coord);
     case_div.style.color = good_letter_text_color;
@@ -52,41 +56,46 @@ function key_color_bad_letter(key){
 
 function key_color_mid_letter(key){
     var key_div = document.getElementById(key);
-    if (key_div.style.backgroundColor != good_letter_color){
+    console.log(key_div.style.backgroundColor);
+    if (key_div.style.backgroundColor != "rgb(152, 217, 139)"){
+        
         key_div.style.backgroundColor = mid_letter_color;
     }
 }
 
-function update(x) {
+//------------------------------END - Changement de couleur Keys et Divs------------------
+
+//Fonction de mise a jour lettre par lettre
+function update(x) { 
     if (free_box[1]==6) {
     }
     else {
-        word += x.toLowerCase();
-        free = free_box.map(num=>{return String(num)}).join("");
-        document.getElementById(free).innerHTML = x;
-        free_box[1]+=1;
-        if (word.length == 5){
-            if(arrWords.includes(word)){
-            }
-            else {
+        word += x.toLowerCase(); 
+        free = free_box.map(num=>{return String(num)}).join(""); //  free prends la valeur des deux indices de la case courante concatenes (ex:[1,2] devient 12)
+        document.getElementById(free).innerHTML = x; // on affiche la lettre dans la case du tableau d'affichage a l'aide de l'id free  /
+        free_box[1]+=1; 
+        if (word.length == 5){ 
+            if (!(arrWords.includes(word))){ //affichage de l'existance d'un mot ou non/
                 document.getElementById("info").innerHTML="NOT A WORD";
             }
         }
     }
 }
 
+//Fonction de suppression de lettres dans divs
 function Supprimer() {
-    document.getElementById("info").innerHTML="";
-    word = word.slice(0,-1);
-    if (free_box[1]==1) {
+    document.getElementById("info").innerHTML=""; //reset l'information sur l'existance d'un mot ou non car il y a au max 4 lettres/
+    word = word.slice(0,-1); 
+    if (free_box[1]==1) { 
     }
     else {
         free_box[1]+=-1;
     }
-    free = free_box.map(num=>{return String(num)}).join("");
-    document.getElementById(free).innerHTML = "";
+    free = free_box.map(num=>{return String(num)}).join(""); // free prends la valeur des deux indices de la case courante concatenes (ex:[1,2] devient 12) /
+    document.getElementById(free).innerHTML = ""; //on retire la lettre dans la case du tableau d'affichage a l'aide de l'id free  */
 }
 
+//Fonction de vérification du mot
 function Enter() {
     if (verifWord() && free_box[0]!=6) {
         write_result(verifLettres(word));
@@ -102,6 +111,7 @@ function Enter() {
     }
 }
 
+//Fonction de vérification de la lettre : bonne place, bonne lettre + changement couleur clavier
 function verifLettres() {
     let verif = [0,0,0,0,0];
     for(let i=0 ; i<5; i++){
@@ -122,6 +132,7 @@ function verifLettres() {
         return verif;
 }
 
+//Fonction de vérification de la lettre : bonne place, bonne lettre
 function write_result(verif){
     let pos = "";
     pos = free_box[0].toString();
@@ -145,6 +156,7 @@ function write_result(verif){
     }
 }
 
+//Fonction de redémarrage du jeu
 function recommencer (){
     word="";
     let coord;
@@ -168,6 +180,7 @@ function recommencer (){
     free_box = [1,1];
 }
 
+//Fonction de lecture du fichier texte words.txt dans une variable arrwords
 function readTextFile(file) { //Merci StackOverflow
     var rawFile = new XMLHttpRequest();
     rawFile.open("GET", file, false);
@@ -182,25 +195,28 @@ function readTextFile(file) { //Merci StackOverflow
     rawFile.send(null);
 }
 
+//Fonction de vérification de l'existence d'un mot
 function verifWord() {
     let exist = false;
     if (word.length == 5){
         if(arrWords.includes(word)){
             exist = true;
         }
-        else {
+        else { //affichage de l'existance d'un mot ou non/
             document.getElementById("info").innerHTML="NOT A WORD";
         }
     }
     return exist;
 }
 
+//Fonction d'attribution d'un mot aléatoire à deviner
 function aleatoire() {
     let rand = Math.floor(Math.random() * arrWords.length);
     reponse = arrWords[rand];
     console.log(reponse);
 }
 
+//Fonction pour lire les entrées du clavier physique
 function setMyKeyDownListener() {
     window.addEventListener("keydown",
     function(event){

styles.css

@@ -16,7 +16,7 @@ section{ /* Alignement du tableau de jeu */
     padding-top: 5%;
     align-items: center;
 }
-.info{ /* Alignement du tableau de jeu */
+.info{ /* Alignement du texte NOT A WORD et fin de jeu */
     text-align: center;
     height: 15px;
 }
@@ -64,7 +64,7 @@ footer{ /* Fond et alignement du clavier */
     justify-content: space-evenly;
 
 }
-footer div {
+footer div { /* Placement du clavier dans le footer */
     padding-bottom: 5px;
     padding-bottom: 30px;
 }
@@ -74,7 +74,7 @@ footer div {
     padding-bottom: 5px;
 }
 
-button { /* Apparence touches clavier */
+button { /* Apparence touches clavier + Start Over */
     padding-bottom: 5px;
     width: 45px;
     height: 45px;
@@ -86,7 +86,7 @@ button { /* Apparence touches clavier */
     border:none;
 }
 
-button:hover{ /* Apparence touches clavier quand suvolées */
+button:hover{ /* Apparence touches clavier quand suvolées + Start Over */
     background-color:rgb(75, 24, 15);
     color : rgb(245, 230, 230);
 }