FailedProxy/Varaverk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add a collapsed settings card under the composer

Browse Source
This commit is contained in:
Gmer4Lfe
2026-08-04 18:27:57 -04:00
parent bd583b58dc
commit 149d98a10b
1 changed files with 75 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Plugin/unraid/pages/ai.php
+75 -9
View File
@@ -198,6 +198,27 @@ if (is_dir('/var/log/varaverk')) {
font-family:inherit; font-size:13px; padding:9px; resize:vertical; min-height:58px; }
.vv-ai-input:focus { outline:none; border-color:#2d4a6a; }
.vv-ai-ctrls { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
/* ── Settings card ──────────────────────────────────────────────────────── */
/* Collapsed by default and by markup, not by JS: the card is closed because the class is
simply absent, so it cannot flash open on a slow load or stick open if a script throws.
Same toggle idiom as the reasoning block in the transcript. */
.vv-ai-set { border:1px solid #262626; border-radius:6px; background:#0e0e0e; }
.vv-ai-set-t { display:flex; align-items:center; gap:8px; padding:7px 11px; cursor:pointer;
user-select:none; font-size:9px; letter-spacing:.08em; text-transform:uppercase;
color:#4a4a4a; }
.vv-ai-set-t:hover { color:#777; }
.vv-ai-set-c { color:#333; font-size:9px; transition:transform .12s; }
.vv-ai-set-t.open .vv-ai-set-c { transform:rotate(90deg); }
.vv-ai-set-sum { margin-left:auto; color:#3a3a3a; text-transform:none; letter-spacing:0;
font-size:10px; font-family:monospace; }
.vv-ai-set-b { display:none; padding:2px 11px 11px; }
.vv-ai-set-b.open { display:block; }
.vv-ai-set-r { display:flex; align-items:flex-start; gap:10px; padding:7px 0;
border-top:1px solid #1a1a1a; }
.vv-ai-set-r:first-child { border-top:none; }
.vv-ai-set-l { font-size:11px; color:#8a8a8a; min-width:120px; flex-shrink:0; }
.vv-ai-set-d { font-size:10px; color:#4a4a4a; line-height:1.5; }
.vv-ai-ctrls select { background:#0a0a0a; border:1px solid #222; color:#8a8a8a; font-size:11px;
padding:4px 7px; border-radius:3px; }
.vv-ai-hint { font-size:10px; color:#3a3a3a; margin-left:auto; }
@@ -264,15 +285,6 @@ if (is_dir('/var/log/varaverk')) {
<textarea class="vv-ai-input" id="vv-ai-input" rows="2"
placeholder="e.g. what stops rsync and the mover running at once?"></textarea>
<div class="vv-ai-ctrls">
<select id="vv-ai-kind" title="Restrict retrieval to one kind of source">
<option value="">All sources</option>
<option value="readme">README — what things are</option>
<option value="manual">Manual — how to do things</option>
<option value="header">Script headers</option>
<option value="template">Conf templates</option>
<option value="doc">Design notes</option>
</select>
<label class="vv-ai-toggle"><input type="checkbox" id="vv-ai-think" checked> reasoning</label>
<button class="vv-ai-btn ghost" id="vv-ai-mem" type="button">Memory</button>
<button class="vv-ai-btn ghost" id="vv-ai-clear" type="button">Clear</button>
<span class="vv-ai-hint">Ctrl+Enter to send · 3-turn history · build <?=$_vv_ai_build?>
@@ -280,6 +292,43 @@ if (is_dir('/var/log/varaverk')) {
<button class="vv-ai-btn" id="vv-ai-send" type="button">Ask</button>
</div>
</div>
<!-- Settings. Below the composer and closed by default: these change how the next answer is
built, not what it is asked, so they should be reachable without being in the way. The
header carries the current values so the state is legible while collapsed. -->
<div class="vv-ai-set">
<div class="vv-ai-set-t" id="vv-ai-set-t">
<span class="vv-ai-set-c">▶</span> Settings
<span class="vv-ai-set-sum" id="vv-ai-set-sum"></span>
</div>
<div class="vv-ai-set-b" id="vv-ai-set-b">
<div class="vv-ai-set-r">
<span class="vv-ai-set-l">Retrieval source</span>
<div>
<select id="vv-ai-kind" title="Restrict retrieval to one kind of source">
<option value="">All sources</option>
<option value="readme">README — what things are</option>
<option value="manual">Manual — how to do things</option>
<option value="header">Script headers</option>
<option value="template">Conf templates</option>
<option value="doc">Design notes</option>
</select>
<div class="vv-ai-set-d">Intent routing favours per-script headers, which buries the
top-level prose. Pick README for "what is X" and "why does this exist" questions.
Varaverk Assistant only — the other profiles do not retrieve.</div>
</div>
</div>
<div class="vv-ai-set-r">
<span class="vv-ai-set-l">Reasoning</span>
<div>
<label class="vv-ai-toggle"><input type="checkbox" id="vv-ai-think" checked> show the
model's thinking</label>
<div class="vv-ai-set-d">Kept and collapsed under each answer. Thinking time scales
with the question — seconds for a greeting, ~18s for a substantive one.</div>
</div>
</div>
</div>
</div>
</div>
<div id="vv-ai-memwrap" style="display:none;border:1px solid #262626;border-radius:6px;
@@ -525,6 +574,23 @@ if (is_dir('/var/log/varaverk')) {
$('vv-ai-tok-stats').innerHTML = html;
}
// ── Settings card ───────────────────────────────────────────────────────
// The summary exists so the card is honest while shut. A collapsed panel that hides a
// non-default setting is how someone ends up puzzling over why answers changed.
function setSummary() {
const kind = $('vv-ai-kind');
const bits = [kind.options[kind.selectedIndex].text.replace(/ —.*$/, '')];
if (!$('vv-ai-think').checked) bits.push('no reasoning');
$('vv-ai-set-sum').textContent = bits.join(' · ');
}
$('vv-ai-set-t').addEventListener('click', () => {
$('vv-ai-set-t').classList.toggle('open');
$('vv-ai-set-b').classList.toggle('open');
});
$('vv-ai-kind').addEventListener('change', setSummary);
$('vv-ai-think').addEventListener('change', setSummary);
setSummary();
$('vv-ai-tok-hosts').addEventListener('click', e => {
const row = e.target.closest('.vv-ai-hostrow');
if (!row) return;