TBNilles
359043ad67
New FastAPI container (port 8189) to download and manage models: - Installed Models, Add/Download (CivitAI/HuggingFace/direct URL), Settings views - Persistent SQLite storage for API keys and download history (./sparkyui-data) - Downloads land in ./models, auto-sorted into ComfyUI's standard subfolders - Default COMFYUI_HOST_PATH and SPARKYUI_DATA_PATH to the project root - Wire docker-compose service, env defaults, gitignore, README docs Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
116 lines
4.1 KiB
HTML
116 lines
4.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>SparkyUI · Model Manager</title>
|
|
<link rel="stylesheet" href="/style.css" />
|
|
</head>
|
|
<body>
|
|
<div class="app">
|
|
<aside class="sidebar">
|
|
<div class="brand">
|
|
<span class="spark">⚡</span>
|
|
<div>
|
|
<div class="brand-title">SparkyUI</div>
|
|
<div class="brand-sub">Model Manager</div>
|
|
</div>
|
|
</div>
|
|
<nav>
|
|
<button class="nav-item active" data-view="installed">
|
|
<span class="nav-ico">▦</span> Installed Models
|
|
</button>
|
|
<button class="nav-item" data-view="download">
|
|
<span class="nav-ico">↓</span> Add / Download
|
|
</button>
|
|
<button class="nav-item" data-view="settings">
|
|
<span class="nav-ico">⚙</span> Settings
|
|
</button>
|
|
</nav>
|
|
<div class="sidebar-foot" id="modelsDir"></div>
|
|
</aside>
|
|
|
|
<main class="content">
|
|
<!-- Installed Models -->
|
|
<section class="view active" id="view-installed">
|
|
<header class="view-head">
|
|
<h1>Installed Models</h1>
|
|
<div class="head-actions">
|
|
<input type="search" id="modelSearch" placeholder="Filter…" />
|
|
<button class="btn" id="refreshModels">Refresh</button>
|
|
</div>
|
|
</header>
|
|
<div id="modelsContainer" class="models-container">
|
|
<p class="empty">Loading…</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Add / Download -->
|
|
<section class="view" id="view-download">
|
|
<header class="view-head"><h1>Add / Download Model</h1></header>
|
|
<div class="card form-card">
|
|
<label>Download URL</label>
|
|
<input type="text" id="dlUrl"
|
|
placeholder="Direct URL, CivitAI model link, or HuggingFace resolve URL" />
|
|
<div class="source-hint" id="sourceHint"></div>
|
|
|
|
<div class="row">
|
|
<div class="col">
|
|
<label>Model type</label>
|
|
<select id="dlType"></select>
|
|
<div class="hint">CivitAI links auto-detect type; leave as-is to use it.</div>
|
|
</div>
|
|
<div class="col">
|
|
<label>Filename (optional)</label>
|
|
<input type="text" id="dlFilename" placeholder="Auto-detected if blank" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-actions">
|
|
<button class="btn primary" id="startDownload">Start Download</button>
|
|
<span class="form-msg" id="dlMsg"></span>
|
|
</div>
|
|
</div>
|
|
|
|
<h2 class="subhead">Downloads</h2>
|
|
<div id="downloadsContainer" class="downloads-container">
|
|
<p class="empty">No downloads yet.</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Settings -->
|
|
<section class="view" id="view-settings">
|
|
<header class="view-head"><h1>Settings</h1></header>
|
|
<div class="card form-card">
|
|
<h2 class="subhead first">API Keys</h2>
|
|
<p class="hint">
|
|
Stored persistently and sent as auth headers when downloading from the
|
|
matching site. Leave blank to keep the existing value.
|
|
</p>
|
|
|
|
<label>CivitAI API Key <span class="badge" id="civitaiBadge"></span></label>
|
|
<input type="password" id="civitaiKey" placeholder="••••••••" autocomplete="off" />
|
|
|
|
<label>HuggingFace Token <span class="badge" id="hfBadge"></span></label>
|
|
<input type="password" id="hfToken" placeholder="••••••••" autocomplete="off" />
|
|
|
|
<div class="form-actions">
|
|
<button class="btn primary" id="saveSettings">Save</button>
|
|
<span class="form-msg" id="settingsMsg"></span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card form-card">
|
|
<h2 class="subhead first">Model Storage</h2>
|
|
<p class="hint">
|
|
Models are saved into the project <code>models/</code> directory, sorted into
|
|
ComfyUI's standard sub-folders by type. ComfyUI reads from the same folder.
|
|
</p>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
</div>
|
|
<script src="/app.js"></script>
|
|
</body>
|
|
</html>
|