154 lines
5.1 KiB
HTML
154 lines
5.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
|
<title>embedding notebook — web1</title>
|
|
<link rel="stylesheet" href="/static/style.css" />
|
|
<script src="https://unpkg.com/htmx.org@2.0.4"></script>
|
|
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3' fill='%231f4e5f'/%3E%3C/svg%3E" />
|
|
</head>
|
|
<body>
|
|
|
|
<header class="masthead">
|
|
<div>
|
|
<h1 class="title">embedding notebook <em>— drift & projection</em></h1>
|
|
</div>
|
|
<div class="meta">
|
|
<span class="dot {% if not deployment_id %}bad{% endif %}"></span>
|
|
{% if deployment_id %}prefect · deployment {{ deployment_id[:8] }}{% else %}prefect · unreachable{% endif %}<br/>
|
|
<span style="color:var(--faint)">{{ prefect_api }}</span>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
|
|
<!-- ==================== LEFT: parameter notebook ==================== -->
|
|
<section class="col-left">
|
|
|
|
<form
|
|
id="run-form"
|
|
hx-post="/submit"
|
|
hx-target="#runs-slot"
|
|
hx-swap="innerHTML"
|
|
hx-indicator="#busy"
|
|
>
|
|
|
|
<!-- §1 reducer -->
|
|
<div class="section">
|
|
<div class="section-label">
|
|
<span>§ 1 reducer</span><span class="ordinal">method</span>
|
|
</div>
|
|
<p class="lead">Dimensionality reduction applied to each snapshot. Only reducers whose Python package is importable are shown.</p>
|
|
|
|
<ul class="reducer-list">
|
|
{% for r in reducers %}
|
|
<li>
|
|
<input type="radio" name="reducer" id="red-{{ loop.index }}" value="{{ r.key }}"
|
|
{% if r.key == default_reducer %}checked{% endif %}
|
|
hx-get="/reducer-form?name={{ r.key }}"
|
|
hx-target="#reducer-params"
|
|
hx-swap="innerHTML"
|
|
hx-trigger="change" />
|
|
<label for="red-{{ loop.index }}">
|
|
<span class="mark">{{ "%02d"|format(loop.index) }}</span>
|
|
<span>
|
|
<span class="name">{{ r.label }}</span>
|
|
<span class="blurb">{{ r.blurb }}</span>
|
|
</span>
|
|
<span class="pkg">{{ r.key }}</span>
|
|
</label>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- §2 reducer params -->
|
|
<div class="section">
|
|
<div class="section-label">
|
|
<span>§ 2 parameters</span><span class="ordinal">kwargs</span>
|
|
</div>
|
|
<div id="reducer-params">
|
|
{% include "_reducer_form.html" with context %}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- §3 data -->
|
|
<div class="section">
|
|
<div class="section-label">
|
|
<span>§ 3 data & drift</span><span class="ordinal">sampling</span>
|
|
</div>
|
|
|
|
<div class="form-grid">
|
|
<label for="generator_path">
|
|
generator
|
|
<span class="hint">data-generating surface</span>
|
|
</label>
|
|
<select name="generator_path" id="generator_path">
|
|
{% for path, short in generators %}
|
|
<option value="{{ path }}" {% if path == 'sklearn.datasets.make_s_curve' %}selected{% endif %}>{{ short }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
|
|
<label for="num_points">n<sub>points</sub></label>
|
|
<input type="number" id="num_points" name="num_points" value="5000" min="100" step="100" />
|
|
|
|
<label for="num_snapshots">n<sub>snapshots</sub></label>
|
|
<input type="number" id="num_snapshots" name="num_snapshots" value="48" min="2" step="1" />
|
|
|
|
<label for="jitter_scale">
|
|
jitter scale
|
|
<span class="hint">std of per-step Gaussian drift</span>
|
|
</label>
|
|
<input type="number" id="jitter_scale" name="jitter_scale" value="0.01" step="0.001" min="0" />
|
|
|
|
<label for="seed">
|
|
jitter seed
|
|
<span class="hint">seeds only the drift simulation — the embedder's seed is in §2 (advanced).</span>
|
|
</label>
|
|
<input type="number" id="seed" name="seed" value="42" step="1" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="actions">
|
|
<button type="submit" class="submit">submit run</button>
|
|
<span id="busy" class="htmx-indicator">dispatching…</span>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</section>
|
|
|
|
<!-- ==================== RIGHT: runs log ============================== -->
|
|
<section class="col-right">
|
|
|
|
<div class="section-label">
|
|
<span>§ 4 recent runs</span>
|
|
<span class="run-count">
|
|
<span id="runs-count">{{ runs|length }}</span> / 10 · refresh 3s
|
|
<span id="poll-ind" class="htmx-indicator" style="margin-left:6px">●</span>
|
|
</span>
|
|
</div>
|
|
|
|
<div
|
|
id="runs-slot"
|
|
hx-get="/runs"
|
|
hx-trigger="load delay:3s, every 3s"
|
|
hx-swap="innerHTML"
|
|
hx-indicator="#poll-ind"
|
|
>
|
|
{% include "_runs.html" with context %}
|
|
</div>
|
|
|
|
</section>
|
|
|
|
</main>
|
|
|
|
<footer class="colophon">
|
|
<span><span class="k">web1</span> · scientific instrument · port 8001</span>
|
|
<span>fastapi · htmx · no build step</span>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|