From d790085fcc689ce120e27e152125397768adbffe Mon Sep 17 00:00:00 2001
From: Thomas de Roo <2+thomas@noreply.localhost>
Date: Mon, 15 Jun 2026 10:05:01 +0200
Subject: [PATCH] Add learn.php

---
 learn.php | 98 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 98 insertions(+)
 create mode 100644 learn.php
diff --git a/learn.php b/learn.php
new file mode 100644
index 0000000..5fc9932
--- /dev/null
+++ b/learn.php
@@ -0,0 +1,98 @@
+<?php
+
+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 (simpel: random)
+$word = $data['words'][array_rand($data['words'])];
+?>
+
+<!DOCTYPE html>
+<html>
+<head>
+<title>Oefenen</title>
+<link rel="stylesheet" href="assets/css/style.css">
+</head>
+<body>
+
+<div class="container">
+
+<div class="card">
+
+<h1>Oefenen</h1>
+
+<p>
+Vertaal:
+<strong><?= htmlspecialchars($word['question']) ?></strong>
+</p>
+
+<input id="answer" placeholder="jouw antwoord">
+
+<button onclick="check()">
+Controleer
+</button>
+
+<p id="result"></p>
+
+</div>
+
+</div>
+
+<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>
+
+</body>
+</html>
\ No newline at end of file
