-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
89 lines (84 loc) · 3.72 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
88
89
<!DOCTYPE html>
<html lang="en">
<head>
<title>Coronavirus Count</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--JQUERY-->
<script src="libraries/jquery-3.5.1.min.js"></script>
<!--COUNTUP-->
<script src="libraries/countUp.js"></script>
<link rel="manifest" href="manifest.json">
<!--Bootstrap for style-->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<!--Bootstrap-select-->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/css/bootstrap-select.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/js/bootstrap-select.min.js"></script>
<!--In javascript-->
<span id="head"></span>
</head>
<body>
<div class="cover-container d-flex w-100 h-100 p-3 mx-auto flex-column">
<!--navigation button-->
<span class="navbutton" onclick="opennav()">☰</span>
<!--Inside navigation-->
<span id="navigation"></span>
<!--Shows the name of state, "active cases" and shows the circle with number in it-->
<div id="hide_count">
<h1 class="display-4 text-center" id="state_name"></h1>
<h3 style="font-weight: 100">Active COVID-19 Cases</h3>
<p style="font-weight: 100; font-size:14px">(As of <span id="as_of"></span>)</p>
<div id="circle">
<p id="showcases">0</p>
</div>
</div>
<!--Shows the select options and button-->
<div class="middle">
<select class="selectpicker" data-dropup-auto="false" id="country" onchange="show_state()">
<option value="">Choose Country:</option>
<option value="1">Australia</option>
<option value="2">USA</option>
<option value="3">India</option>
<option value="4">Brazil</option>
<option value="5">Russia</option>
<option value="6">France</option>
<option value="7">Italy</option>
<option value="8">Mexico</option>
<option value="9">Japan</option>
<option value="10">Iran</option>
<option value="11">China</option>
</select>
<br>
<div id="sel_state">
<!--State button show whens certain countries are selected-->
<select class="selectpicker" id="state">
<option value="0">Choose State:</option>
<option value="1">NT</option>
<option value="2">QLD</option>
<option value="3">VIC</option>
<option value="4">NSW</option>
<option value="5">WA</option>
<option value="6">SA</option>
<option value="7">TAS</option>
</select>
</div>
</div>
<button class="btn btn-secondary" id="showcounter" onclick="showcase()">Enter</button>
<div class="clearfix">
<div class="text-wrapper">
<a href="about.html" class="_link" style="float:left">Learn More about COVID-19</a>
<a href="sources.html" class="_link" style="float:right">Where Do These Numbers Come From?</a>
<br>
</div>
</div>
<div class="footer">Progessive Web Application by Darlane Tang S314609</div>
</div>
<!--SCRIPTS-->
<script src="js/javascript.js"></script>
<!--Jquery.js-->
<script src="js/jquery.js"></script>
</body>
</html>