Récupération info api vers front + résultat

91833fab · romain · 3feb7f54 · 91833fab · 91833fab · 91833fab
Commit 91833fab authored 1 month ago by romain
--- a/frontend/1.jpg
+++ b/frontend/1.jpg
--- a/frontend/tokyo.jpg
+++ b/frontend/tokyo.jpg
--- a/frontend/3.jpg
+++ b/frontend/3.jpg
--- a/frontend/Front.html
+++ b/frontend/Front.html
@@ -36,8 +36,9 @@
 <body>
 <h1> OUCÉQUECÉ</h1>
-<h2><img src="perpignan-france.jpg" alt="perpignan" width=50% height=50% /></h2>
+<h2><img id="img" src=""  width=50% height=50% /></h2>
 <h3 id="test"></h3>
+<h4 id="resultat"></h4>
 <div id="a1" class="rectangle-arrondi" data-index="1"></div>
 <div id="a2" class="rectangle-arrondi" data-index="2"></div>
@@ -52,12 +53,14 @@
    const question=JSON.parse(data.question);
    const vraiquestion=question.question;
    const reponse=question.answers;
-    const img=data.imageIndex
+    const img=question.imageIndex;
    document.getElementById("test").innerText = vraiquestion;
    document.getElementById("a1").innerText = reponse[0];
    document.getElementById("a2").innerText = reponse[1];
    document.getElementById("a3").innerText = reponse[2];
    document.getElementById("a4").innerText = reponse[3];
+    document.getElementById("img").src=img+".jpg";
    document.querySelectorAll(".rectangle-arrondi").forEach(div => {
        div.addEventListener("click", async function () {
@@ -81,7 +84,16 @@
                }
                const responsejson2 = await response2.json();
-                document.getElementById("test").innerText = JSON.stringify(responsejson2);
+                const resp = JSON.stringify(responsejson2)
+                const vrairesp= JSON.parse(resp);
+                if (vrairesp.answer==false){
+                    document.getElementById("resultat").innerText = "Faux c'était " + vrairesp.correctAnswer + "score : "+ vrairesp.score;
+                    next();
+                }
+                if (vrairesp.answer==true){
+                    document.getElementById("resultat").innerText ="Bien joué !  score : "+ vrairesp.score;
+                    next();
+                }
            } catch (error) {
@@ -90,6 +102,38 @@
        });
    });
+    async function next() {
+        const jsonData3 = {
+            "uuid": uuid
+        };
+        try {
+            const response3 = await fetch("http://localhost:8080/projet_prog_reseau_war_exploded/api/quiz", {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(jsonData3),
+            });
+            if (!response3.ok) {
+                throw new Error(`Erreur HTTP : ${response3.status}`);
+            }
+            const responsejson3 = await response3.json();
+            const newresp = JSON.stringify(responsejson3)
+            const newquestions= JSON.parse(newresp);
+            const reponse=newquestions.answers;
+            const img=newquestions.imageIndex;
+            document.getElementById("a1").innerText = reponse[0];
+            document.getElementById("a2").innerText = reponse[1];
+            document.getElementById("a3").innerText = reponse[2];
+            document.getElementById("a4").innerText = reponse[3];
+            document.getElementById("img").src=img+".jpg";
+        } catch (error) {
+            console.error("Erreur : ", error);
+        }
+    }
 </script>
 </html>
\ No newline at end of file
--- a/frontend/home.html
+++ b/frontend/home.html
@@ -17,7 +17,7 @@
      cursor: pointer;
      width : 175px;
      height: 70px;
-      font-size: 15;
+      font-size: 15px;
      margin-left: 260px;
    }

--- a/src/main/resources/questions.json
+++ b/src/main/resources/questions.json
@@ -5,27 +5,28 @@
      "Paris",
      "Lyon",
      "Bordeaux",
-      "Montpellir"
+      "Montpellier"
    ],
-    "correctAnswer": 3
+    "correctAnswer": 4
  },
  {
    "imageIndex": 2,
    "answers": [
-      "lul",
+      "Pekin",
-      "Ldsn",
+      "Tokyo",
-      "Bofsfsux",
+      "Shangai",
-      "Monfqfqlier"
+      "Nagasaki"
    ],
    "correctAnswer": 2
  },
  {
-    "imageIndex": 2,
+    "imageIndex": 3,
    "answers": [
-      "lufsfs",
+      "New york",
-      "Ldsn",
+      "Londre",
-      "Bofsfsfsfsfsfs",
+      "Montreal",
-      "Mpapappaqlier"
+      "Nice"
    ],
-    "correctAnswer": 2,
+    "correctAnswer": 3
+  }
 ]
\ No newline at end of file