Update learn.php

learn.php

@@ -2,25 +2,11 @@
 
 require_once 'includes/config.php';
 require_once 'includes/auth.php';
-require_once 'includes/functions.php';
-require_once 'includes/jsondb.php';
 
 requireLogin();
 
-$user = $_SESSION['user'];
-
-$lang = $_GET['lang'];
-$list = $_GET['list'];
-
-$file = listPath($user, $lang, $list);
-
-$data = JsonDB::read($file);
-
-if (!$data) {
-    die('Geen lijst');
-}
-
-// kies woord 
+$lang = $_GET['lang'] ?? '';
+$list = $_GET['list'] ?? '';
 
 ?>
 
@@ -40,10 +26,10 @@ if (!$data) {
 
 <p>
 Vertaal:
-<strong id="question"></strong>
+<strong id="question">...</strong>
 </p>
 
-<input id="answer">
+<input id="answer" autocomplete="off">
 
 <button onclick="check()">Controleer</button>
 
@@ -55,44 +41,6 @@ Vertaal:
 
 <script>
 
-async function check() {
-
-    const answer =
-        document.getElementById('answer').value;
-
-    const res =
-        await fetch('/api/answer.php', {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/json'
-            },
-            body: JSON.stringify({
-                lang: "<?= $lang ?>",
-                list: "<?= $list ?>",
-                wordId: <?= (int)$word['id'] ?>,
-                answer: answer
-            })
-        });
-
-    const data = await res.json();
-
-    const result =
-        document.getElementById('result');
-
-    if (data.correct) {
-        result.innerText = "Goed";
-        result.style.color = "green";
-    } else {
-        result.innerText = "Fout";
-        result.style.color = "red";
-    }
-
-    setTimeout(() => location.reload(), 800);
-}
-
-</script>
-<script>
-
 let currentWord = null;
 
 async function loadWord() {
@@ -103,12 +51,19 @@ async function loadWord() {
 
     const data = await res.json();
 
+    if (!data.word) {
+        document.getElementById('question').innerText =
+            "Geen woordenlijst gevonden";
+        return;
+    }
+
     currentWord = data.word;
 
     document.getElementById('question').innerText =
         currentWord.question;
 
     document.getElementById('answer').value = '';
+    document.getElementById('result').innerText = '';
 }
 
 async function check() {
@@ -131,14 +86,22 @@ async function check() {
 
     const data = await res.json();
 
-    document.getElementById('result').innerText =
-        data.correct ? "Goed" : "Fout";
+    const result = document.getElementById('result');
 
-    setTimeout(loadWord, 600);
+    if (data.correct) {
+        result.innerText = "Goed";
+        result.style.color = "green";
+    } else {
+        result.innerText = "Fout";
+        result.style.color = "red";
+    }
+
+    setTimeout(loadWord, 700);
 }
 
 loadWord();
 
 </script>
+
 </body>
 </html>