Grant
9dde938348
Backend:
- download.py module: drives ./hf-download.sh <repo> [-c --copy-parallel] over SSH, parses tqdm output (regex matches '8%|...| 2.06G/25.1G [03:20<18:35, 20.6MB/s]') into percent + bytes done/total + elapsed + ETA + rate
- DownloadManager: in-memory job tracking with asyncio.Lock (one download at a time)
- POST /api/download, GET /api/download/{id}, SSE /api/download/{id}/stream
- Phase detection: Connecting / Fetching N files / Downloading / Copying to peer Sparks / Done
Frontend:
- '+ Download a new model' button next to LLM swap section title
- Inline form: HF repo text field + solo/cluster radio + Cancel/Start
- Progress UI: spinner, elapsed timer, phase label, percent fill, stats line (bytes/rate/ETA), collapsible raw logs
Package: bump 0.2.1:0
132 lines
5.0 KiB
HTML
132 lines
5.0 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
|
<meta name="color-scheme" content="dark">
|
|
<title>spark-control</title>
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
</head>
|
|
<body>
|
|
<header class="topbar">
|
|
<div class="brand">
|
|
<span class="logo-dot"></span>
|
|
<span>spark-control</span>
|
|
</div>
|
|
<div class="current" id="current">
|
|
<span class="muted">connecting…</span>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<section id="setup-banner" class="banner hidden">
|
|
<strong>Configuration needed.</strong>
|
|
<span>Run the <em>Configure Sparks</em> action in StartOS to set hostnames, then run <em>Test Connection</em>.</span>
|
|
</section>
|
|
|
|
<section id="endpoint-panel" class="endpoint-panel hidden">
|
|
<div class="ep-title muted small">OpenAI-compatible endpoint</div>
|
|
<div class="ep-row">
|
|
<span class="ep-label">Base URL</span>
|
|
<code class="ep-value" id="ep-url">—</code>
|
|
<button class="copy-btn" data-copy="#ep-url" title="Copy base URL">Copy</button>
|
|
</div>
|
|
<div class="ep-row">
|
|
<span class="ep-label">Model ID</span>
|
|
<code class="ep-value" id="ep-model">—</code>
|
|
<button class="copy-btn" data-copy="#ep-model" title="Copy model ID">Copy</button>
|
|
</div>
|
|
<details class="ep-curl">
|
|
<summary class="muted small">curl example</summary>
|
|
<pre id="ep-curl-snippet" class="snippet"></pre>
|
|
<button class="copy-btn small" data-copy="#ep-curl-snippet">Copy snippet</button>
|
|
</details>
|
|
</section>
|
|
|
|
<section id="swap-panel" class="swap-panel hidden">
|
|
<div class="swap-header">
|
|
<span class="spinner"></span>
|
|
<span id="swap-title">Swap in progress</span>
|
|
<span class="spacer"></span>
|
|
<span class="timer" id="swap-elapsed">0:00</span>
|
|
</div>
|
|
<div class="phase-row">
|
|
<div class="phase" id="swap-phase">Starting…</div>
|
|
<div class="phase-detail muted small" id="swap-phase-detail"></div>
|
|
</div>
|
|
<div class="phase-track">
|
|
<div class="phase-fill" id="swap-phase-fill"></div>
|
|
</div>
|
|
<details id="swap-log-details">
|
|
<summary class="muted small">Show technical logs</summary>
|
|
<pre id="swap-log" class="log"></pre>
|
|
</details>
|
|
</section>
|
|
|
|
<section id="services-panel" class="services hidden">
|
|
<h2 class="section-title">Always-on services</h2>
|
|
<div id="services-grid" class="services-grid"></div>
|
|
</section>
|
|
|
|
<section id="models-section">
|
|
<div class="section-header">
|
|
<h2 class="section-title">LLM swap</h2>
|
|
<button id="open-download" class="btn small-btn">+ Download a new model</button>
|
|
</div>
|
|
|
|
<section id="download-panel" class="download-panel hidden">
|
|
<div class="download-form" id="download-form">
|
|
<label class="dl-row">
|
|
<span class="dl-label">HuggingFace repo</span>
|
|
<input type="text" id="dl-repo" placeholder="e.g. RedHatAI/Qwen3.6-35B-A3B-NVFP4" autocomplete="off">
|
|
</label>
|
|
<div class="dl-row">
|
|
<span class="dl-label">Where</span>
|
|
<label class="radio"><input type="radio" name="dl-mode" value="solo" checked> Spark 1 only (solo)</label>
|
|
<label class="radio"><input type="radio" name="dl-mode" value="cluster"> Both Sparks (cluster, copy in parallel)</label>
|
|
</div>
|
|
<div class="dl-actions">
|
|
<button id="dl-cancel" class="btn">Cancel</button>
|
|
<button id="dl-start" class="btn primary">Start download</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="download-progress hidden" id="download-progress">
|
|
<div class="dl-header">
|
|
<span class="spinner"></span>
|
|
<span id="dl-title">Downloading…</span>
|
|
<span class="spacer"></span>
|
|
<span class="timer" id="dl-elapsed">0:00</span>
|
|
</div>
|
|
<div class="phase-row">
|
|
<div class="phase" id="dl-phase">Connecting…</div>
|
|
<div class="phase-detail muted small" id="dl-phase-detail"></div>
|
|
</div>
|
|
<div class="phase-track">
|
|
<div class="phase-fill" id="dl-progress-fill"></div>
|
|
</div>
|
|
<div class="dl-stats muted small" id="dl-stats"></div>
|
|
<details id="dl-log-details">
|
|
<summary class="muted small">Show technical logs</summary>
|
|
<pre id="dl-log" class="log"></pre>
|
|
</details>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="cards" class="cards"></section>
|
|
</section>
|
|
|
|
<footer class="footer">
|
|
<div class="health">
|
|
<span class="health-item" id="h-vllm"><span class="dot"></span> vLLM</span>
|
|
<span class="health-item" id="h-parakeet"><span class="dot"></span> Parakeet</span>
|
|
<span class="health-item" id="h-magpie"><span class="dot"></span> Magpie</span>
|
|
</div>
|
|
<div class="muted small" id="updated"></div>
|
|
</footer>
|
|
</main>
|
|
|
|
<script src="/static/app.js"></script>
|
|
</body>
|
|
</html>
|