-
Notifications
You must be signed in to change notification settings - Fork 26
/
Copy pathindex.html
190 lines (166 loc) · 10.4 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
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
<html lang="en" prefix="http://ogp.me/ns/website#">
<head>
<title>Covid Kids - Activities For Kids Stuck At Home</title>
<script type="text/javascript" src="assets/includes/head.js"></script>
<link rel="canonical" href="index.html">
<meta name="url" content="https://covidkidsonline.com/index.html">
<meta name="owner" content="Ilan">
<meta name="designer" content="Ilan">
<meta name="subject" content="a hub for kids stuck at home, Activities For Kids Stuck At Home, Things to do while stuck at home, activities for kids in home, kid activities at home, fun activities, fun things to do for kids at home, activities for kids to do">
<meta name="keywords" content="covid kids, covid kids online, corona media, kids stuck at home, keep kids busy at home, kids activities, activities for kids in home, kid activities at home, fun activities, fun things to do for kids at home, activities for kids to do">
<meta name="robots" content="index, follow">
<meta name="og:url" content="https://covidkidsonline.com">
<meta name="twitter:url" content="https://covidkidsonline.com">
<meta name="twitter:description" content="A site for kids, by kids, to help keep kids busy, informed, and content while stuck at home.">
<meta property="og:title" content="Covid Kids - Activities For Kids Stuck At Home">
<meta property="og:image" content="https://covidkidsonline.com/assets/images/corona.png">
<meta property="og:type" content="website">
<meta name="twitter:title" content="Covid Kids - Activities For Kids Stuck At Home">
<meta name="DC.format" content="text/html" scheme="DCTERMS.DCMIType">
<meta name="DC.publisher" content="Covid Kids" scheme="DCTERMS.DCMIType">
<meta name="DC.description" content="A site for kids, by kids, to help keep kids busy, informed, and content while stuck at home. Check out these funny videos, inspiring artwork, and activities to get you through boring times." scheme="DCTERMS.DCMIType">
<meta name="og:description" content="A site for kids, by kids, to help keep kids busy, informed, and content while stuck at home. Check out these funny videos, inspiring artwork, and activities to get you through boring times.">
<meta name="DC.subject" content="a hub for kids stuck at home, Activities For Kids Stuck At Home, Things to do while stuck at home, activities for kids in home, kid activities at home, fun activities, fun things to do for kids at home, activities for kids to do" scheme="DCTERMS.DCMIType">
<meta name="DC.creator" content="Covid Kids">
<meta name="twitter:image" content="https://covidkidsonline.com/assets/images/corona.png">
<meta name='description' content='A site for kids, by kids, to help keep kids busy, informed, and content while stuck at home.'>
<meta content="apple-mobile-web-app-capable" content="yes">
<meta name="theme-color" content="#5F9EA0">
</head>
<body onload="indexfunc();">
<script type="text/javascript" src="assets/includes/header.js"></script>
<br><br>
<div class="container-fluid">
<div class="row mt-4 mar">
<div class="text-center card bg-dark pt-2 rounded mx-auto mt-4 mb-3" style="width: 600px; height: 400px;">
<h2 class="text-light">Featured Funny Video</h2>
<iframe style="margin-left: 50%; transform: translate(-50%);" title="funny video" id="funnyvid" allowfullscreen allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" frameborder="0"></iframe>
<p class="text-center mt-2"><a href="videos.html" class="title2">Watch More</a></p>
</div>
<div class="text-center card bg-dark mr-3 ml-3 pt-2 mt-4 mb-3 rounded div mx-auto" style="width: 600px; height: 400px;">
<h2 class="text-light">Fun Activities</h2>
<div class="p-3 mb-3" style="width: 90%; height: 300px;" onclick="ideasfunc()">
<h6 class="text-light">Click To Generate A Random Activity!</h6>
<br>
<h3 class="text-center text-light mt-5" id="text"></h3>
<br>
<br>
</div>
<a id="link" target="_blank" class="title2"></a>
</div>
<div class="text-center card bg-dark mr-3 ml-3 mt-4 pt-2 mb-3 rounded div mx-auto" style="width: 600px; height: 400px;">
<h2 class="text-light mb-4">About</h2>
<h6 id="total" class="text-light ml-2 mr-2"></h6>
<br>
<p class="text-light mr-3 ml-3 fontsize">Covid Kids is a resource for parents of kids stuck at home. We hope to keep the bordom at bay by providing fun videos and activities to keep your kids entertained. All articles and artwork are made by kids. If you want your writing or artwork on the site email <a href="mailto:[email protected]" class="text-light">[email protected]</a>. If you have any feedback or suggestions for the site head over to the <a href="feedback.html" class="text-light">feedback page</a>.</p>
<a href="https://coronavirus.jhu.edu/" target="_blank" class="title2 linkfontsize">Click Here For More Info About COVID-19</a>
</div>
<div class="text-center card bg-dark pt-2 rounded mx-auto mt-4 mb-3" style="width: 600px; height: 400px;">
<h2 class="text-light">Featured Happy Video</h2>
<iframe style="margin-left: 50%; transform: translate(-50%);" title="happy video" id="happyvid" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen frameborder="0"></iframe>
<p class="text-center mt-2"><a href="videos.html" class="title2">Watch More</a></p>
</div>
<div class="card bg-dark mr-3 ml-3 pt-2 mt-4 mb-3 rounded div mx-auto" style="width: 600px; height: 400px;">
<h2 class="text-light text-center">Recent Articles</h2>
<br>
<ul class="text-light" id="articleslist">
</ul>
<br>
<a class="title2 text-center linkfontsize" href="articles.html">More</a>
</div>
<div class="text-center card bg-dark mr-3 ml-3 mt-4 pt-2 mb-3 rounded div mx-auto" style="width: 600px; height: 400px;">
<h2 class="text-light mb-3">Kids Artwork</h2>
<img src="assets/artwork/0/0.jpg" height="290" onclick="popupindex()" alt="mainartwork" class="mb-2">
<a style="margin-left: 50%; transform: translate(-50%);" class="title2" href="artwork.html">See More</a>
</div>
</div>
</div>
<footer class="footer bg-dark p-3 mt-4">
<div class="container text-center">
<span class="text-light">Version 1.4.12</span>
</div>
</footer>
<div class="modal fade" id="model00" tabindex="-1" role="dialog" aria-labelledby="model00Label" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="model0Label">Artwork By Isabelle</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">x</span>
</button>
</div>
<div class="modal-body text-center">
<img src="assets/artwork/0/0.jpg" width="90%;" alt="artwork0">
<img src="assets/artwork/0/1.jpg" width="90%;" alt="artwork1">
<img src="assets/artwork/0/2.jpg" width="90%;" alt="artwork2">
<img src="assets/artwork/0/3.jpg" width="90%;" alt="artwork3">
<img src="assets/artwork/0/4.jpg" width="90%;" alt="artwork4">
<img src="assets/artwork/0/5.jpg" width="90%;" alt="artwork5">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-dark" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script src="assets/js/main.js"></script>
<script>
const settings = {
"url": "https://coronavirus-19-api.herokuapp.com/all",
"method": "GET",
"timeout": 0,
};
$.ajax(settings).done((response) => {
$("#total").text(response.recovered + " People Have Recovered From Covid-19.");
});
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/sw.js')
.then(reg => {
console.log('Registered!', reg);
}).catch(err => {
console.log('Registration Failed: ', err);
});
});
}
function popupindex() {
let modalnum = "#model00"
$(modalnum).modal('show');
}
function indexfunc()
{
start();
for (let x = articles.length - 1; x >= (articles.length - 5); x -= 1) {
let div = `<h6><a class='title3' href='${articles[x].link}' target='_blank'>${articles[x].description}</a></h6>`;
let addTo = document.getElementById("articleslist");
let newContent = document.createElement('li');
newContent.innerHTML = div;
addTo.appendChild(newContent);
}
let funnyvidid = document.getElementById("funnyvid");
let happyvidid = document.getElementById("happyvid");
funnyvidid.setAttribute("src", funnyvid);
funnyvidid.setAttribute("width", "90%");
funnyvidid.setAttribute("height", "300px");
happyvidid.setAttribute("src", happyvid);
happyvidid.setAttribute("width", "90%");
happyvidid.setAttribute("height", "300px");
}
function ideasfunc()
{
const link = document.getElementById("link");
link.innerHTML = "I want to try this.";
let randIndex = Math.floor(Math.random() * words.length);
let word = words[randIndex].name;
document.getElementById("text").innerHTML = word;
let linkvar = words[randIndex].link;
if (linkvar != null) link.href = linkvar;
else
{
link.removeAttribute("href");
link.innerHTML = "";
}
}
</script>
</body>
</html>