Something went wrong. Try again.
Identities for entities did.bot
agent llm did
Something went wrong. Try again.
10 kB · 143 lines
Astro
at main
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144---// The landing page's tuning panel: eleven sliders over the Ising// simulation's schedule and the page's reveal timing, plus a copyable// settings line for reporting a value back as an edit to// src/config/anim.ts or crates/didbot-site-anim/src/anneal.rs. See// site/README.md for how the owner uses it.//// index.astro renders this only under `import.meta.env.DEV`, so it is part// of the dev server and not of the tree scripts/publish-site.sh uploads.// `?tune=1` opens it; the same guard gates its wiring in index.astro's// script.--- <div id="tune-panel"> <h2>tuning (dev only)</h2> <div class="field" data-key="tHigh"> <div class="field-label"><span>start temperature</span> <span class="val-group"><span class="val" id="v-t-high"></span> <button type="button" class="slider-reset" data-key="tHigh" title="reset to default">↺</button></span> </div> <input type="range" id="t-t-high" min="2" max="8" step="0.1" /> <p class="desc">How hot the lattice starts, before any cooling begins — higher makes the opening noise look more scrambled and less clustered.</p> </div> <div class="field" data-key="tLow"> <div class="field-label"><span>cooling floor temperature</span> <span class="val-group"><span class="val" id="v-t-low"></span> <button type="button" class="slider-reset" data-key="tLow" title="reset to default">↺</button></span> </div> <input type="range" id="t-t-low" min="0.1" max="4" step="0.05" /> <p class="desc">The coolest the lattice gets on its way down, before the hold and the reveal — lower gives tighter, calmer clusters more time to settle during the dwell.</p> </div> <div class="field" data-key="fieldStart"> <div class="field-label"><span>hold length (before reveal)</span> <span class="val-group"><span class="val" id="v-field-start"></span> <button type="button" class="slider-reset" data-key="fieldStart" title="reset to default">↺</button></span> </div> <input type="range" id="t-field-start" min="0.3" max="0.95" step="0.01" /> <p class="desc">How much of the anneal passes at a steady, held temperature before the wordmark starts pulling itself together. This is when the field turns on in the underlying physics, not just a visual cue — reveal start/width below only make sense relative to it.</p> </div> <div class="field" data-key="fieldRamp"> <div class="field-label"><span>field ramp width</span> <span class="val-group"><span class="val" id="v-field-ramp"></span> <button type="button" class="slider-reset" data-key="fieldRamp" title="reset to default">↺</button></span> </div> <input type="range" id="t-field-ramp" min="0.05" max="0.9" step="0.01" /> <p class="desc">How gradually the letterform's pull strengthens after hold length above ends — small snaps to full strength almost immediately, large lets it build slowly across more of the remaining anneal.</p> </div> <div class="field" data-key="fieldStrength"> <div class="field-label"><span>field strength</span> <span class="val-group"><span class="val" id="v-field-strength"></span> <button type="button" class="slider-reset" data-key="fieldStrength" title="reset to default">↺</button></span> </div> <input type="range" id="t-field-strength" min="0.5" max="9" step="0.1" /> <p class="desc">How hard the field pulls lattice cells into the wordmark's shape once it's active — higher makes the letters assert themselves faster and more forcefully over whatever pattern already formed.</p> </div> <div class="field" data-key="annealTemperature"> <div class="field-label"><span>annealing plateau temperature</span> <span class="val-group"><span class="val" id="v-anneal-temp"></span> <button type="button" class="slider-reset" data-key="annealTemperature" title="reset to default">↺</button></span> </div> <input type="range" id="t-anneal-temp" min="0.3" max="5" step="0.05" /> <p class="desc">How much thermal noise remains once the field is pulling cells into letters — higher keeps the reveal looking lively and textured instead of freezing into flat, static shapes.</p> </div> <div class="field" data-key="totalSweeps"> <div class="field-label"><span>sweeps per scroll (total sweeps)</span> <span class="val-group"><span class="val" id="v-total-sweeps"></span> <button type="button" class="slider-reset" data-key="totalSweeps" title="reset to default">↺</button></span> </div> <input type="range" id="t-total-sweeps" min="100" max="1600" step="10" /> <p class="desc">How many simulation steps the whole scroll covers — more steps means each point of scroll shows a finer-grained slice of the process, including the reveal itself.</p> </div> <div class="field" data-key="revealStart"> <div class="field-label"><span>reveal band start (scroll)</span> <span class="val-group"><span class="val" id="v-reveal-start"></span> <button type="button" class="slider-reset" data-key="revealStart" title="reset to default">↺</button></span> </div> <input type="range" id="t-reveal-start" min="0.5" max="0.97" step="0.01" /> <p class="desc">Where in the scroll (0 = top, 1 = bottom) the reveal band begins — together with reveal band width below, this sets the stretch of scrolling during which the wordmark actually appears.</p> </div> <div class="field" data-key="revealWidth"> <div class="field-label"><span>reveal band width (scroll)</span> <span class="val-group"><span class="val" id="v-reveal-width"></span> <button type="button" class="slider-reset" data-key="revealWidth" title="reset to default">↺</button></span> </div> <input type="range" id="t-reveal-width" min="0.02" max="0.5" step="0.01" /> <p class="desc">How much scroll distance the reveal band spans, starting at reveal band start above — narrow snaps the wordmark into place quickly, wide spreads it into a slower, more gradual materialization.</p> </div> <div class="field" data-key="finalEasePower"> <div class="field-label"><span>final segment easing power</span> <span class="val-group"><span class="val" id="v-ease"></span> <button type="button" class="slider-reset" data-key="finalEasePower" title="reset to default">↺</button></span> </div> <input type="range" id="t-ease" min="1" max="6" step="0.5" /> <p class="desc">How sharply the very last bit of scroll decelerates into its final position — 1 is a straight line with no easing; higher values slow down more as they approach the end.</p> </div> <div class="field" data-key="freeRunThreshold"> <div class="field-label"><span>free-run threshold (scroll)</span> <span class="val-group"><span class="val" id="v-free-run"></span> <button type="button" class="slider-reset" data-key="freeRunThreshold" title="reset to default">↺</button></span> </div> <input type="range" id="t-free-run" min="0.85" max="1" step="0.005" /> <p class="desc">How far down the scroll before the simulation stops replaying deterministically and starts free-running instead (continuing to sweep at the final temperature and field, so pixels keep churning while the letters hold). Scrolling back up above this line returns to deterministic replay.</p> </div> <div class="agreement" id="agreement-box">crystallisation agreement: computing…</div> <label for="settings-line" style="color: var(--dim); display:block; margin-bottom: 4px;"> copy this line back to report a setting: </label> <textarea id="settings-line" class="settings-line" rows="4" readonly onfocus="this.select()"></textarea> <button id="reset-defaults" type="button">reset all to defaults</button> </div>
<style>/* `?tune=1` adds `.open`; index.astro's script is what sets it. The class goes on the panel rather than on <body> so every selector here is an element this component renders, and Astro's scoping reaches all of it. */#tune-panel { display: none; position: fixed; z-index: 8; top: 0; right: 0; bottom: 0; width: min(320px, 90vw); overflow-y: auto; background: rgba(5,16,10,0.96); border-left: 2px solid var(--accent); padding: 14px 16px 24px; font-size: 11.5px; }#tune-panel.open { display: block; }#tune-panel h2 { font-size: 12px; margin: 0 0 10px; color: var(--accent); text-transform: uppercase; letter-spacing: 0.06em; }#tune-panel .field { margin-bottom: 14px; }#tune-panel .field-label { display: flex; justify-content: space-between; gap: 8px; color: var(--dim); margin-bottom: 2px; }#tune-panel .field-label .val-group { display: inline-flex; align-items: center; gap: 4px; }#tune-panel .field-label .val { color: var(--ink); font-variant-numeric: tabular-nums; }#tune-panel input[type="range"] { width: 100%; }#tune-panel .desc { margin: 4px 0 0; color: var(--dim); font-size: 10.5px; line-height: 1.4; }#tune-panel .slider-reset { background: transparent; border: none; color: var(--dim); font-size: 13px; line-height: 1; cursor: pointer; opacity: 0.25; padding: 0 1px; }#tune-panel .slider-reset:hover { color: var(--ink); opacity: 1; }#tune-panel .slider-reset.changed { opacity: 1; color: var(--accent); }#tune-panel .agreement { margin: 14px 0; padding: 8px 10px; border: 1px solid var(--dim); }#tune-panel .agreement.warn { border-color: var(--warn); color: var(--warn); }#tune-panel .settings-line { width: 100%; font: 10.5px/1.4 ui-monospace, monospace; background: var(--ground); color: var(--ink); border: 1px solid var(--dim); padding: 6px; resize: vertical; }#tune-panel button { margin-top: 8px; background: transparent; color: var(--ink); border: 1px solid var(--dim); padding: 5px 10px; font: inherit; cursor: pointer; }#tune-panel button:hover { border-color: var(--accent); color: var(--accent); }</style>