6aedbe121a
When requesting / wol-proxy will show a loading page that polls /status every second. When the upstream server is ready the loading page will refresh causing the actual root page to be displayed
65 lines
1.3 KiB
HTML
65 lines
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Loading...</title>
|
|
<style>
|
|
body {
|
|
font-family: sans-serif;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 100vh;
|
|
margin: 0;
|
|
background: #f5f5f5;
|
|
}
|
|
.loader {
|
|
text-align: center;
|
|
}
|
|
.stats {
|
|
font-size: 18px;
|
|
color: #333;
|
|
margin: 20px 0;
|
|
}
|
|
.stats-label {
|
|
color: #666;
|
|
font-size: 14px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="loader">
|
|
<p>Waking up upstream server...</p>
|
|
<div class="stats">
|
|
<div><span class="stats-label">Time elapsed:</span> <span id="elapsed">0s</span></div>
|
|
<div><span id="attempts"> </span></div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
var startTime = Date.now();
|
|
var attempts = 0;
|
|
|
|
setInterval(function() {
|
|
var elapsed = (Date.now() - startTime) / 1000;
|
|
document.getElementById('elapsed').textContent = elapsed.toFixed(1) + 's';
|
|
}, 100);
|
|
|
|
// Check status every second
|
|
setInterval(function() {
|
|
attempts++;
|
|
var dots = '.'.repeat((attempts % 10) || 10);
|
|
document.getElementById('attempts').textContent = dots;
|
|
|
|
fetch('/status')
|
|
.then(function(r) { return r.text(); })
|
|
.then(function(t) {
|
|
if (t.indexOf('status: ready') !== -1) {
|
|
location.reload();
|
|
}
|
|
})
|
|
.catch(function() {});
|
|
}, 1000);
|
|
</script>
|
|
</body>
|
|
</html>
|