là c'est la classe !!!

index.html

@@ -66,8 +66,16 @@
         <div class="modal-content">
         <span class="close-btn" onclick="fermerAlerte()">&times;</span>
         <p id="message_alerte_jolie"></p>
+        
+        <div class="div-centrer-contenu">
+            <input type="text" id="input_alerte_jolie">
+        
             <button onclick="fermerAlerte()">OK</button>
         </div>
+
+        </div>
+
+
     </div>
     <div class="ad" style="display: none;">
         

js/alerte.js

@@ -2,31 +2,45 @@
 // Pour cela, on utilise une file et une fonction asynchrone qui boucle et vide la file alerte par alerte
 let file_alertes = []
 
-function ouvrirAlerte(message){
+function ouvrirAlerte(message,prompt=false){
-    file_alertes.push(message)
+
+    // on renvoie une promise pour couvrir le cas d'une alerte en mode prompt
+    // qui se doit donc de renvoyer le texte saisi par l'utilisateur
+    return new Promise((resolve) => {
+        file_alertes.push({message,prompt,resolve})
 
         // si c'est la seule alerte en attente, on l'affiche
         if(file_alertes.length == 1 ) {
-        afficherAlerte(file_alertes[0])
+            afficherAlerte(file_alertes[0].message, file_alertes[0].prompt)
         }
         // sinon, elle sera automatiquement affichée lors de la fermeture de l'alerte juste avant dans la file
+    })
+    
 }
 
 
 // Fonction pour afficher une alerte mais plus jolie que celle par défaut
-function afficherAlerte(message) {
+function afficherAlerte(message,prompt) {
-
     // on signale une alerte en train d'être visionnée
     flag = true
 
 
     // on prend les elements
-    let modal = document.getElementById('alerte_jolie');
+    let modal = document.getElementById("alerte_jolie")
 
-    var messageElement = document.getElementById('message_alerte_jolie');
+    const message_ele = document.getElementById("message_alerte_jolie")
     
     // Mettre le message
-    messageElement.textContent = message;
+    message_ele.textContent = message;
+
+    // afficher la barre de saisie de texte si besoin
+    const alerte_input = document.getElementById("input_alerte_jolie")
+    if(prompt){
+        //inline pour mettre l'input à coté du bouton OK :)
+        alerte_input.style.display = "inline-block";
+    }else{
+        alerte_input.style.display = "none";
+    }
     
     // et on affiche en changeant la propriété css
     modal.style.display = "block";
@@ -42,11 +56,22 @@ function fermerAlerte() {
     modal.style.display = "none";
 
     // enlève notre élément de la file
-    file_alertes.shift()
+
+    const alerte_vue = file_alertes.shift()
+    console.log(alerte_vue)
+
+    // resolve la promise de ouvrirAlerte avec la valeur de l'input 
+    // quand l'utilisateur a fermé l'alerte
+    // dans le cas d'une alerte sans le mode prompt, on ne récupère pas de valeur
+    // donc on se moque de ce que cela peut renvoyer (Nan, sans doute)
+    const alerte_input = document.getElementById("input_alerte_jolie")
+    if(alerte_vue.resolve){
+        alerte_vue.resolve(alerte_input.value)
+    }
 
     // affiche récursivement les autres alertes en attentes
     if(file_alertes.length > 0){
-        afficherAlerte(file_alertes[0])
+        afficherAlerte(file_alertes[0].message, file_alertes[0].prompt)
     }
 
 }

js/main.js

@@ -434,7 +434,10 @@ function cadeauClickCallback(){
     const div_cadeau = document.getElementById("div_cadeau");
 
     const nb_gen = Math.floor(Math.random() * 10) + 1; // Nombre aléatoire entre 1 et 10
-    const nb_devine = parseInt(prompt("Entrez un chiffre entre 1 et 10 :"), 10);
+
+    ouvrirAlerte("Entrez un chiffre entre 1 et 10 :",true).then((val)=>{
+        const nb_devine = parseInt(val, 10);
+
         if (isNaN(nb_devine) || nb_devine < 1 || nb_devine > 10) {
             ouvrirAlerte("Le chiffre rentré n'est pas valide")
         }else{ 
@@ -452,6 +455,8 @@ function cadeauClickCallback(){
         // génère un nouveau timer pour le prochain cadeau à afficher !
         setTimeout(genererCadeau, Math.random() * 10000 + 20000); // Premier affichage aléatoire entre 20 et 30 secondes
     
+    })
+
 }
 
 
@@ -474,5 +479,8 @@ function teleportationCadeau(n) {
             teleportationCadeau(n)
         }, Math.random() * 1000 + 500); // Durée d'affichage entre 500ms et 1.5 seconde
         
+    }else{
+        // on enlève le cadeau à la 15ème téléportation :)
+        div_cadeau.style.display = "none"
     }
 }