Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <title>Titanic Explainer Waking Up</title> | |
| <style> | |
| :root { | |
| color-scheme: light; | |
| --bg: #f5f7fb; | |
| --card: #ffffff; | |
| --text: #12243a; | |
| --muted: #546b84; | |
| --accent: #0b5fff; | |
| } | |
| body { | |
| margin: 0; | |
| min-height: 100vh; | |
| display: grid; | |
| place-items: center; | |
| background: radial-gradient(circle at top right, #deebff, var(--bg) 45%); | |
| font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; | |
| color: var(--text); | |
| } | |
| .card { | |
| width: min(680px, 92vw); | |
| background: var(--card); | |
| border-radius: 16px; | |
| padding: 28px; | |
| box-shadow: 0 10px 30px rgba(15, 35, 95, 0.12); | |
| } | |
| h1 { | |
| margin: 0 0 10px; | |
| font-size: 1.7rem; | |
| } | |
| p { | |
| margin: 0 0 10px; | |
| color: var(--muted); | |
| line-height: 1.4; | |
| } | |
| .status { | |
| margin-top: 16px; | |
| font-family: ui-monospace, SFMono-Regular, Menlo, monospace; | |
| } | |
| .dot { | |
| display: inline-block; | |
| width: 10px; | |
| height: 10px; | |
| border-radius: 999px; | |
| background: var(--accent); | |
| margin-right: 8px; | |
| animation: pulse 1.2s infinite; | |
| } | |
| @keyframes pulse { | |
| 0% { opacity: 0.2; transform: scale(0.9); } | |
| 50% { opacity: 1; transform: scale(1.05); } | |
| 100% { opacity: 0.2; transform: scale(0.9); } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <main class="card"> | |
| <h1>Titanic Explainer is waking up</h1> | |
| <p>The demo sleeps when idle to save cost. This page will refresh automatically as soon as the app is ready.</p> | |
| <p>If it takes longer than a minute, keep this tab open and wait for the next check.</p> | |
| <div class="status"><span class="dot"></span><span id="message">Checking backend...</span></div> | |
| </main> | |
| <script> | |
| const messageEl = document.getElementById("message"); | |
| async function checkBackend() { | |
| try { | |
| const res = await fetch("/__backend_health", { cache: "no-store" }); | |
| if (res.ok) { | |
| messageEl.textContent = "Backend is ready, redirecting..."; | |
| window.location.reload(); | |
| return; | |
| } | |
| messageEl.textContent = `Still waking up (status ${res.status})...`; | |
| } catch (err) { | |
| messageEl.textContent = "Still waking up (network retry)..."; | |
| } | |
| } | |
| checkBackend(); | |
| setInterval(checkBackend, 2500); | |
| </script> | |
| </body> | |
| </html> | |