prism/server/public/admin.html

70 lines
1.9 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SUP Admin</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/png" href="/favicon.png">
<link rel="stylesheet" href="/admin.css">
<script src="/htmx.js"></script>
</head>
<body>
<div class="card">
<div id="health-status"
hx-get="/health/fragment"
hx-trigger="load, every 10s"
class="loading">
Loading...
</div>
</div>
<div class="card">
<h2>Signal</h2>
<div id="signal-info"
hx-get="/signal-info/fragment"
hx-trigger="load">
Loading...
</div>
<div id="qr-section"></div>
</div>
<div class="card">
<h2>Endpoints</h2>
<div id="endpoints-list"
hx-get="/endpoints/fragment"
hx-trigger="load"
class="loading">
Loading...
</div>
</div>
<script>
document.body.addEventListener('htmx:responseError', (e) => {
const status = e.detail.xhr.status;
const response = e.detail.xhr.responseText;
if (status === 426) {
const healthDiv = document.getElementById('health-status');
if (healthDiv) {
healthDiv.innerHTML = `<div class="status status-error">HTTPS Required</div><p>${response}</p><p>Access this page over HTTPS or from localhost.</p>`;
}
document.querySelectorAll('.card:not(:first-child)').forEach(card => {
card.style.display = 'none';
});
} else if (status === 429) {
const healthDiv = document.getElementById('health-status');
if (healthDiv) {
healthDiv.innerHTML = `<div class="status status-error">Rate Limited</div><p>${response}</p>`;
}
document.querySelectorAll('.card:not(:first-child)').forEach(card => {
card.style.display = 'none';
});
}
});
</script>
</body>
</html>