File size: 3,255 Bytes
ae853c1 e30a933 ae853c1 4076330 ae853c1 fb88864 ae853c1 e30a933 ae853c1 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WEED-SIM · Speciation Bench</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/static/lab.css">
<link rel="stylesheet" href="/static/agent-widget.css">
<script src="https://cdn.jsdelivr.net/npm/d3@7"></script>
</head>
<body>
<header class="lab-header">
<div class="logo">
<span class="icon">⬡</span>
<h1>SPECIATION BENCH <span class="subtitle">Germplasm Analytics · BrAPI-style</span></h1>
</div>
<div class="controls">
<span id="count-badge" class="badge">0 accessions</span>
<a href="/play" class="action-btn">← Play Mode</a>
<a href="/agent" class="action-btn">⌬ Agent</a>
<a href="/deck" class="action-btn">◆ Deck</a>
<a href="/" class="action-btn">⌂</a>
<button id="btn-refresh" class="action-btn">Refresh</button>
<button id="btn-newick" class="action-btn">Export Newick</button>
</div>
</header>
<main class="lab-grid">
<!-- Facet rail -->
<aside class="panel facets-panel">
<div class="panel-header"><h2>Filtration</h2><button id="btn-clear-filters" class="mini-btn">clear</button></div>
<div class="panel-content" id="facet-rail"></div>
</aside>
<!-- Center: parallel coords + grid -->
<section class="center-col">
<div class="panel pc-panel">
<div class="panel-header"><h2>Parallel Coordinates <span class="hint">drag on an axis to brush</span></h2></div>
<div class="panel-content" id="parallel-coords"></div>
</div>
<div class="panel grid-panel">
<div class="panel-header"><h2>Germplasm Registry</h2></div>
<div class="panel-content" id="grid-wrap"></div>
</div>
</section>
<!-- Right: color gamut + cross predictor -->
<aside class="right-col">
<div class="panel wheel-panel">
<div class="panel-header"><h2>Phenotype Color Gamut</h2></div>
<div class="panel-content" id="color-wheel"></div>
</div>
<div class="panel predict-panel">
<div class="panel-header"><h2>Cross Predictor <span class="hint">Monte-Carlo</span></h2></div>
<div class="panel-content">
<div class="predict-controls">
<select id="pred-a"></select>
<span class="cross-x">×</span>
<select id="pred-b"></select>
<button id="btn-predict" class="action-btn primary">Simulate</button>
</div>
<div id="predict-output"></div>
</div>
</div>
</aside>
</main>
<script src="/static/session.js"></script>
<script src="/static/lab.js"></script>
<script src="/static/agent-widget.js"></script>
</body>
</html>
|