blob: 4b46fbf80d820b3f566dd8725e8572e642dd1d34 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
|
{{define "main"}}
<!DOCTYPE html>
<html>
<head>
<title>German exercises</title>
<meta charset="utf-8" name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="stylesheet" type="text/css" href="/assets/style.css" />
<link rel="icon" sizes="64x64" href="/assets/favicon/wolfhead_negated.ico" />
<script src="https://unpkg.com/htmx.org@2.0.4" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
</head>
<body>
<div id="ancestor">
<div class="question-text" data-testid="question">
{{.Text}}
</div>
<div id="feedback" data-testid="feedback">
{{if not .Correct}}Try Again{{else}}{{template "feedback" .}}{{end}}
{{if .ShowNext}}
<button
hx-get="/next-question?current_id={{.ID}}"
hx-target="#ancestor"
hx-swap="outerHTML"
class="next-button"
data-testid="next-button">
Next Question →
</button>
{{end}}
</div>
{{template "feedback" .}}
<div id="options">
<button
data-testid="option1"
hx-post="/answer"
hx-vals='{"selected": "0", "question_id": "{{.ID}}"}'
hx-target="#feedback"
hx-swap="innerHTML"
class="option-button"
>
{{.Option1}}
</button>
<button
data-testid="option2"
hx-post="/answer"
hx-vals='{"selected": "1", "question_id": "{{.ID}}"}'
hx-target="#feedback"
hx-swap="innerHTML"
class="option-button"
>
{{.Option2}}
</button>
<button
data-testid="option3"
hx-post="/answer"
hx-vals='{"selected": "2", "question_id": "{{.ID}}"}'
hx-target="#feedback"
hx-swap="innerHTML"
class="option-button"
>
{{.Option3}}
</button>
<button
data-testid="option4"
hx-post="/answer"
hx-vals='{"selected": "3", "question_id": "{{.ID}}"}'
hx-target="#feedback"
hx-swap="innerHTML"
class="option-button"
>
{{.Option4}}
</button>
</div>
</div>
</body>
</html>
{{end}}
|
