-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
87 lines (74 loc) · 2.83 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
85
86
87
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Cabin+Sketch|Handlee|Merienda|Unica+One" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt"
crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="assets/css/style.css">
<title>Trivia Time</title>
</head>
<body>
<div class="container introPage">
<div class="row">
<div class="col-md-12 col-sm-12">
<p class="title">Trivial Pursuit</p>
</div>
</div>
<div class="row">
<div class="col-md-12 col-sm-12">
<button id="startGame" class="btn btn-lg btn-secondary">
Enter
</button>
<button id="resetGame" class="btn btn-lg btn-outline-secondary disappear">
Restart
</button>
<div>
<p id="animation"></p>
</div>
</div>
</div>
</div>
<div class="container triviaPage">
<div class="row">
<div class="col-md-8 col-sm-8 questionsBox disappear">
<h1>#Sandynism
<i class="far fa-heart"></i>
</h1>
<hr id="hr1" style="margin-bottom: 2px">
<div id="question"></div>
<hr id="hr2">
<div id="choices">
<button id="btn0"></button>
<button id="btn1"></button>
<button id="btn2"></button>
<button id="btn3"></button>
</div>
<p id="timer"></p>
<hr id="hr3">
<footer>
<p id="progress"></p>
</footer>
</div>
<div class="col-md-8 col-sm-8 showAnswer disappear"></div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="assets/javascript/app.js"></script>
<script src="assets/javascript/messenger.js"></script>
</body>
</html>
<!-- Gameplan
Object with questions & answers
jQuery to push into the html container
Randomize questions**
Need a win, lose or unresponsive 'alert' of some sort
Correct or Incorrect tracker for duration of the game
Summary of trivia game at the end
Set Interval, Clear Interval, Timer functions
Start Gameplay
Reset Gameplay
End Gameplay Screen
-->