summaryrefslogtreecommitdiff
path: root/modules/zelfoverhoor/qs.html
blob: 32c9099be1d9f915e9108554d17d8a7d416f6820 (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
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Zelfoverhoor: <!--###ID###--></title>
<link rel="stylesheet" href="/zelfoverhoor/style.css">
<script>
// Gefeliciteerd, je hebt de antwoorden gevonden.
// De vraag is echter, wil je die gebruiken? :)
// Deze overhoor-applicatie is er immers om JEZELF te verbeteren...
var questionset=/*###QUESTIONSET###*/;
</script>
<script src="/zelfoverhoor/qs.js"></script>
<style>
#qsetdescr {
	margin-top: 5px;
	display: inline-block;
	background-color: #eee;
	padding: 5px;
}
#qcontainer {
	border: 1px #666 solid;
	border-radius: 10px;
	padding: 10px;
	display: inline-block;
}
#question, #answer {
	display: inline-block;
	background-color: #eef;
	border-radius: 10px;
	padding: 10px;
	margin-top: 5px;
}
/* HACK */
#qcontainer.invisible, .invisible {
	display: none;
}
</style>
</head>
<body>
<h1>Zelfoverhoor: vragenset "<span id="qsetname"></span>"</h1>
<b>Beschrijving:</b><br>
<div id="qsetdescr"></div><br>
<br><br>
<div id="qcontainer">
	<b>Vraag:</b><br>
	<div id="question"></div><br>
	<br>
	<input type="button" id="showAnswerButton" onclick="showAnswer()" value="Laat antwoord zien!">
	<div id="answercontainer" class="invisible">
		<b>Antwoord:</b><br>
		<div id="answer"></div><br>
		<input type="button" onclick="advance(true)" value="Goed!"><span style="margin-left:20px"></span>
		<input type="button" onclick="advance(false)" value="Fout">
	</div>
</div>
<div id="rescontainer">
	<b>Je hebt alle vragen gehad!</b><br>
	<p>Je had <span id="numcorrect"></span> vragen goed van de in totaal <span id="numtotal"></span> vragen.</p>
	<p id="allcorrectp"><b>Gefeliciteerd met je prestatie! :D</b></p>
	<input type="button" onclick="startQuiz()" value="Nog een keer?">
</div>
</body>
</html>