-
Notifications
You must be signed in to change notification settings - Fork 5
/
offline.html
72 lines (67 loc) · 5.19 KB
/
offline.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
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Offline | LCHS Go</title>
<style>
*, *::before, *::after {
font-family: "Niramit", sans-serif;
color: white;
}
.center {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
align-content: center;
align-items: center;
height: 80%;
}
</style>
</head>
<body id="bod">
<div class="center">
<svg width="300" height="300" viewBox="0 0 460 460" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.8557 230.073C12.8557 110.171 110.049 12.9711 229.942 12.9711C287.517 12.9711 342.734 35.8444 383.446 76.5589C424.157 117.274 447.029 172.494 447.029 230.073C447.029 349.976 349.836 447.176 229.942 447.176C110.049 447.176 12.8557 349.976 12.8557 230.073V230.073Z" stroke="white" stroke-width="24" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M220.934 246.073C220.934 241.099 224.967 237.066 229.942 237.066C232.331 237.066 234.622 238.015 236.312 239.704C238.001 241.393 238.95 243.684 238.95 246.073C238.95 251.048 234.917 255.081 229.942 255.081C224.967 255.081 220.934 251.048 220.934 246.073V246.073Z" stroke="white" stroke-width="24" stroke-miterlimit="10" stroke-linejoin="round"/>
<path d="M245.923 239.016C246.554 239.545 246.948 240.202 247.105 240.986C247.261 241.756 247.114 242.734 246.663 243.919C246.21 245.09 245.424 246.497 244.303 248.14C243.19 249.79 241.653 251.784 239.691 254.121C237.728 256.459 236.031 258.319 234.599 259.701C233.175 261.09 231.922 262.112 230.841 262.769C229.752 263.419 228.811 263.737 228.019 263.725C227.225 263.699 226.513 263.421 225.883 262.892L141.538 192.134C140.908 191.605 140.514 190.956 140.358 190.186C140.201 189.401 140.336 188.406 140.763 187.201C141.182 185.989 141.936 184.548 143.025 182.878C144.106 181.201 145.627 179.194 147.589 176.856C149.552 174.518 151.265 172.672 152.729 171.317C154.185 169.955 155.47 168.966 156.584 168.351C157.698 167.722 158.651 167.42 159.445 167.447C160.237 167.459 160.948 167.729 161.579 168.258L245.923 239.016ZM134.295 142.289C139.091 146.313 141.583 150.076 141.771 153.579C141.958 157.066 139.824 161.463 135.371 166.769C130.864 172.139 126.945 175.017 123.614 175.405C120.282 175.777 116.31 174.029 111.697 170.159C106.893 166.129 104.368 162.372 104.123 158.89C103.876 155.392 106.006 150.959 110.513 145.589C114.967 140.283 118.889 137.442 122.28 137.064C125.677 136.678 129.682 138.42 134.295 142.289Z" fill="white"/>
<path d="M388.306 196.519C386.417 197.993 384.744 199.167 383.285 200.04C381.833 200.922 380.572 201.516 379.503 201.822C378.44 202.136 377.519 202.201 376.74 202.016C375.976 201.832 375.367 201.449 374.912 200.866L350.258 169.267L248.539 248.629C247.89 249.135 247.136 249.38 246.277 249.363C245.433 249.347 244.466 248.979 243.375 248.258C242.292 247.531 241.009 246.411 239.525 244.9C238.034 243.395 236.327 241.41 234.405 238.946C232.476 236.474 230.963 234.332 229.866 232.519C228.76 230.713 227.986 229.196 227.544 227.969C227.117 226.743 226.995 225.715 227.179 224.885C227.378 224.056 227.802 223.388 228.451 222.882L330.17 143.521L305.516 111.922C305.01 111.274 304.771 110.569 304.798 109.808C304.84 109.048 305.139 108.187 305.696 107.224C306.259 106.27 307.142 105.191 308.344 103.989C309.546 102.787 311.092 101.449 312.981 99.9749C314.927 98.4563 316.646 97.2473 318.138 96.3479C319.637 95.4421 320.919 94.8322 321.982 94.5181C323.051 94.2123 323.938 94.1474 324.644 94.3236C325.364 94.5016 325.977 94.915 326.484 95.5638L395.879 184.507C396.334 185.09 396.57 185.765 396.586 186.532C396.618 187.3 396.352 188.161 395.789 189.116C395.232 190.079 394.329 191.173 393.079 192.399C391.844 193.627 390.253 195.001 388.306 196.519Z" fill="white"/>
</svg>
<h1>You're Offline!</h1>
<button onclick="location.reload();">Reload</button>
</div>
<script defer>
document.getElementById("bod").style.backgroundColor = hslToHex(JSON.parse(localStorage.getItem("settings")).colorTheme, 50, 50);
function hslToHex(h, s, l) {
l /= 100;
const a = s * Math.min(l, 1 - l) / 100;
const f = n => {
const k = (n + h / 30) % 12;
const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
return Math.round(255 * color).toString(16).padStart(2, '0'); // convert to Hex and prefix "0" if needed
};
return `#${f(0)}${f(8)}${f(4)}`;
}
window.addEventListener('online', () => {
window.history.pushState("", "now", "/?now");
window.location.reload();
});
async function checkNetworkAndReload() {
try {
const response = await fetch('.');
// Verify we get a valid response from the server
if (response.status >= 200 && response.status < 500) {
window.history.pushState("", "now", "/?now");
window.location.reload();
return;
}
} catch {
// Unable to connect to the server, ignore.
}
window.setTimeout(checkNetworkAndReload, 2500);
}
checkNetworkAndReload();
</script>
</body>
</html>