-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
89 lines (85 loc) · 2.52 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" dir="ltr">
<head>
<meta charset="utf-8">
<title>Covid 19 Tracking App</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<style>
*{
padding: 0px;
margin: 0px;
box-sizing: boborder-box;
}
body{
background-color: lightblue;
}
h1{
border-bottom: 5px solid green;
padding-bottom: 3vh;
margin-bottom: 2vh;
}
p{
border: 3px solid green;
padding 2px;
text-align: center;
margin: 5vh 0vw;
}
table,th,tr,td{
border: 3px solid green;
padding: 10px;
}
</style>
</head>
<body>
<div class="container">
<h1 class="text-center mt-5">Covid Cases Reposted in India</h1>
<p>Updated At Date:<span id="date"></span>, Time:<span id="time"></span></p>
<table class="table table-hover">
<thead>
<tr>
<th>Total Cases</th>
<th>Total Active Cases</th>
<th>Total Deths</th>
<th>Total Recovered</th>
</tr>
</thead>
<tbody>
<tr id="data">
</tr>
</tbody>
</table>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
init()
function init(){
var url = "https://api.covid19api.com/summary"
var data=''
var date=""
var time=""
$.get(url,function(data){
date = data.Countries[76].Date.split("T")[0]
time = data.Countries[76].Date.split("T")[1].split(".")[0]
detail_time= time.split(":")
if(detail_time[0]>=12){
var hours = parseInt(time.split(":")[0]) -12;
time= hours.toString()+":"+detail_time[1]+":"+detail_time[2] + " PM"
} else {
time+=" AM"
}
data=`
<td>${data.Countries[76].TotalConfirmed} (+${data.Countries[76].NewConfirmed}) </td>
<td>${data.Countries[76].TotalConfirmed-data.Countries[76].TotalDeaths-data.Countries[76].TotalRecovered}</td>
<td>${data.Countries[76].TotalDeaths} (+${data.Countries[76].NewDeaths}) </td>
<td>${data.Countries[76].TotalRecovered} (+${data.Countries[76].NewRecovered}) </td>
`
$("#data").html(data)
$("#date").html(date)
$("#time").html(time)
})
}
})
</script>
</html>