-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
84 lines (76 loc) · 3.95 KB
/
index.html
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
76
77
78
79
80
81
82
83
84
<html>
<head>
<title>GeoQuiz</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Lobster&display=swap" rel="stylesheet">
<script src="data.js"></script>
<script src="script.js"></script>
</head>
<body onload="main()">
<div id="menu-screen" class="screen">
<h1 id="title">GeoQuiz!</h1>
<div id="main-menu-controls">
<div id="quiz-settings" class="orange-box">
<div class="box-header-div">
<h3 class="box-header">Inställningar</h3>
</div>
<div id="quiz-type-select">
<div>
<input id="words" type="radio" name="flashcards-select" checked="checked">
<label for="words">Glosor</label>
</div>
<div>
<input id="flashcards-radio" type="radio" name="flashcards-select">
<label for="flashcards-radio">Flashcards</label>
</div>
</div>
<div id="range-select">
<label for="start-input">Intervall</label>
<input id="start-input" class="number-input" type="number" min="1" max="200" value="1">
<input id="stop-input" class="number-input" type="number" min="1" max="200" value="1">
</div>
</div>
<div id="menu-buttons">
<button id="capitals-button" class="button" onclick="quiz.capitalsButtonCallback(this)">Huvudstäder</button>
<button id="countries-button" class="button" onclick="quiz.countriesButtonCallback(this)">Länder</button>
<button id="flags-button" class="button" onclick="quiz.flagsButtonCallback(this)">Flaggor</button>
</div>
</div>
</div>
<div id="quiz-screen" class="screen">
<div class="orange-box">
<h2 id="question-label" class="box-label">...</h2>
</div>
<input id="answer-input" type="text">
<div id="result-label-wrapper" class="orange-box">
<h3 id="result-label" class="box-label"></h3>
</div>
<button id="quit-button" class="button" onclick=quiz.quitButtonCallback(this)>Avsluta</button>
</div>
<div id="flashcard-quiz-screen" class="screen">
<img id="flag-img">
<div id="flashcards-question-label-div" class="orange-box">
<h2 id=flashcards-question-label class="box-label"></h2>
</div>
<div id="hint-label-wrapper" class="orange-box">
<h2 id="hint-label" class="box-label">...</h2>
</div>
<div id="flashcard-buttons">
<button id="correct-button" class="button" onclick="quiz.correctButtonCallback(this)">Rätt</button>
<button id="wrong-button" class="button" onclick="quiz.incorrectButtonCallback(this)">Fel</button>
<button id="turn-card-button" class="button" onclick="quiz.turnCardButtonCallback(this)">Visa svar</button>
</div>
<button class="button" onclick=quiz.quitButtonCallback(this)>Avsluta</button>
</div>
<div id="result-screen" class="screen">
<div class="orange-box">
<div class="box-header-div">
<h3 class="box-header">Resultat</h3>
</div>
<h4 id="num-correct-questions-label"></h4>
</div>
<button id="retry-button" class="button" onclick=quiz.retryButtonCallback(this)>Träna på misstag</button>
<button id="main-menu-button" class="button" onclick="quiz.quitButtonCallback(this)">Huvudmeny</button>
</div>
</body>
</html>