Spaces:
Sleeping
Sleeping
| | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <title>Crypto Intelligence Dashboard</title> | |
| <link rel="preconnect" href="https://fonts.googleapis.com" /> | |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> | |
| <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" /> | |
| <link rel="stylesheet" href="/static/css/unified-ui.css" /> | |
| <link rel="stylesheet" href="/static/css/components.css" /> | |
| <script defer src="/static/js/ui-feedback.js"></script> | |
| <script defer src="/static/js/dashboard-app.js"></script> | |
| </head> | |
| <body class="page page-dashboard"> | |
| <header class="top-nav"> | |
| <div class="branding"> | |
| <svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><circle cx="12" cy="12" r="10"/></svg> | |
| <div> | |
| <strong>Crypto Intelligence Hub</strong> | |
| <small style="color:var(--ui-text-muted);letter-spacing:0.2em;">Real-time data + HF models</small> | |
| </div> | |
| </div> | |
| <nav class="nav-links"> | |
| <a class="active" href="/dashboard">Dashboard</a> | |
| <a href="/admin">Admin</a> | |
| <a href="/hf_console">HF Console</a> | |
| <a href="/docs" target="_blank" rel="noreferrer">API Docs</a> | |
| </nav> | |
| </header> | |
| <main class="page-content"> | |
| <section class="card" id="intro-card"> | |
| <div class="section-heading"> | |
| <h2>Unified Market Pulse</h2> | |
| <span class="badge info" id="intro-source">Loading...</span> | |
| </div> | |
| <p style="color:var(--text-muted);max-width:780px;line-height:1.6;"> | |
| Live collectors + local fallback registry guarantee resilient insights. All numbers below already honor the FastAPI routes | |
| (<code>/api/crypto/prices/top</code>, <code>/api/crypto/market-overview</code>, <code>/health</code>) so you can monitor status even when providers degrade. | |
| </p> | |
| </section> | |
| <section class="card-grid" id="market-metrics"> | |
| <article class="card"><h3>Total Market Cap</h3><div class="metric-value" id="metric-market-cap">-</div><div class="metric-subtext" id="metric-cap-source"></div></article> | |
| <article class="card"><h3>24h Volume</h3><div class="metric-value" id="metric-volume">-</div><div class="metric-subtext" id="metric-volume-source"></div></article> | |
| <article class="card"><h3>BTC Dominance</h3><div class="metric-value" id="metric-btc-dom">-</div><div class="metric-subtext">Based on /api/crypto/market-overview</div></article> | |
| <article class="card"><h3>System Health</h3><div class="metric-value" id="metric-health">-</div><div class="metric-subtext" id="metric-health-details"></div></article> | |
| </section> | |
| <section class="card table-card"> | |
| <div class="section-heading"> | |
| <h2>Top Assets</h2> | |
| <span class="badge info" id="top-prices-source">Loading...</span> | |
| </div> | |
| <div class="table-wrapper"> | |
| <table> | |
| <thead> | |
| <tr><th>Symbol</th><th>Price</th><th>24h %</th><th>Volume</th></tr> | |
| </thead> | |
| <tbody id="top-prices-table"> | |
| <tr><td colspan="4">Loading...</td></tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| </section> | |
| <section class="split-grid"> | |
| <article class="card" id="overview-card"> | |
| <div class="section-heading"> | |
| <h2>Market Overview</h2> | |
| <span class="badge info" id="market-overview-source">Loading...</span> | |
| </div> | |
| <ul class="list" id="market-overview-list"></ul> | |
| </article> | |
| <article class="card" id="system-card"> | |
| <div class="section-heading"> | |
| <h2>System & Rate Limits</h2> | |
| <span class="badge info" id="system-status-source">/health</span> | |
| </div> | |
| <div id="system-health-status" class="metric-subtext"></div> | |
| <ul class="list" id="system-status-list"></ul> | |
| <div class="section-heading" style="margin-top:24px;"> | |
| <h2>Configuration</h2> | |
| </div> | |
| <ul class="list" id="system-config-list"></ul> | |
| <div class="section-heading" style="margin-top:24px;"> | |
| <h2>Rate Limits</h2> | |
| </div> | |
| <ul class="list" id="rate-limits-list"></ul> | |
| </article> | |
| </section> | |
| <section class="split-grid"> | |
| <article class="card" id="hf-widget"> | |
| <div class="section-heading"> | |
| <h2>HuggingFace Snapshot</h2> | |
| <span class="badge info" id="hf-health-status">Loading...</span> | |
| </div> | |
| <div id="hf-widget-summary" class="metric-subtext"></div> | |
| <ul class="list" id="hf-registry-list"></ul> | |
| </article> | |
| <article class="card"> | |
| <div class="section-heading"> | |
| <h2>Live Stream (/ws)</h2> | |
| <span class="badge info" id="ws-status">Connecting...</span> | |
| </div> | |
| <div class="ws-stream" id="ws-stream"></div> | |
| </article> | |
| </section> | |
| </main> | |
| </body> | |
| </html> | |