Asetukset-välilehti: kaikki LLM-parametrit muokattavissa UI:sta

Uusi "Asetukset"-tab jossa:
- System Prompt (tekstikenttä, Courier-fontti)
- Temperature (slider 0-1.5, reaaliaikainen arvo)
- Top-K (slider 1-100)
- Repetition Penalty (slider 1.0-2.0)
- Max Tokens (slider 64-4096)
- Stop-sekvenssit (yksi per rivi)
- Mallinvalinta (dropdown: 1.5B/3B/7B Q4/7B)
- "Palauta oletukset" -nappi

Kaikki tallentuvat localStorageen (kpn-settings).
Jokainen parametri selitetty hint-tekstillä.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jaakko Vanhala
2026-04-09 22:44:03 +03:00
parent 1216e016c2
commit 90c9a7e4fa
3 changed files with 163 additions and 0 deletions

View File

@@ -5,6 +5,7 @@ import Terminal from "../components/Terminal.astro";
import Editor from "../components/Editor.astro";
import Guide from "../components/Guide.astro";
import AgentBar from "../components/AgentBar.astro";
import Settings from "../components/Settings.astro";
---
<!DOCTYPE html>
<html lang="fi">
@@ -30,6 +31,7 @@ import AgentBar from "../components/AgentBar.astro";
<div class="tab active" onclick="switchTab('agents')">Agentit</div>
<div class="tab" onclick="switchTab('editor')">Editor</div>
<div class="tab" onclick="switchTab('guide')">Opas</div>
<div class="tab" onclick="switchTab('settings')">Asetukset</div>
</div>
<!-- Agents-paneeli -->
@@ -41,6 +43,7 @@ import AgentBar from "../components/AgentBar.astro";
<Editor />
<Guide />
<Settings />
</div>
<script is:inline>
@@ -95,6 +98,19 @@ Provide a brief risk assessment with severity (low/medium/high/critical).` },
function saveAgents() { localStorage.setItem('kpn-agents', JSON.stringify(agents)); }
function getAgentModel(name) { const a = agents[name]; return a ? a.model : name; }
// LLM-asetukset (localStorage-persistenssi)
const defaultSettings = {
systemPrompt: "You are a coding assistant. Respond with ONLY code. No explanations, no markdown fences, no 'Please note' text. Only working code with proper imports.",
temperature: 0.7,
topK: 40,
repeatPenalty: 1.15,
maxTokens: 1024,
stopSequences: "\\n###\\n\\nExplanation\\nNote:\\nPlease note\\nThis is a basic\\n```\\n\\n\\n// Example\\n# Example",
model: "qwen2.5-coder:3b",
};
let settings = JSON.parse(localStorage.getItem('kpn-settings') || 'null') || { ...defaultSettings };
function saveSettings() { localStorage.setItem('kpn-settings', JSON.stringify(settings)); }
// === Tab switching ===
window.switchTab = function(tab) {
document.querySelectorAll('.panel').forEach(p => p.classList.remove('active'));
@@ -800,6 +816,58 @@ Provide a brief risk assessment with severity (low/medium/high/critical).` },
}
return html;
}
// === Settings panel ===
function initSettings() {
const els = {
systemPrompt: document.getElementById('set-system-prompt'),
temperature: document.getElementById('set-temperature'),
tempVal: document.getElementById('set-temp-val'),
topK: document.getElementById('set-topk'),
topkVal: document.getElementById('set-topk-val'),
repeat: document.getElementById('set-repeat'),
repVal: document.getElementById('set-rep-val'),
maxTokens: document.getElementById('set-maxtokens'),
maxtokVal: document.getElementById('set-maxtok-val'),
stopSeq: document.getElementById('set-stop-sequences'),
model: document.getElementById('set-model'),
};
if (!els.systemPrompt) return;
// Lataa arvot
els.systemPrompt.value = settings.systemPrompt;
els.temperature.value = settings.temperature;
els.tempVal.textContent = settings.temperature;
els.topK.value = settings.topK;
els.topkVal.textContent = settings.topK;
els.repeat.value = settings.repeatPenalty;
els.repVal.textContent = settings.repeatPenalty;
els.maxTokens.value = settings.maxTokens;
els.maxtokVal.textContent = settings.maxTokens;
els.stopSeq.value = settings.stopSequences.replace(/\\n/g, '\n');
els.model.value = settings.model;
// Tallenna muutokset
els.systemPrompt.oninput = () => { settings.systemPrompt = els.systemPrompt.value; saveSettings(); };
els.temperature.oninput = () => { settings.temperature = +els.temperature.value; els.tempVal.textContent = settings.temperature; saveSettings(); };
els.topK.oninput = () => { settings.topK = +els.topK.value; els.topkVal.textContent = settings.topK; saveSettings(); };
els.repeat.oninput = () => { settings.repeatPenalty = +els.repeat.value; els.repVal.textContent = settings.repeatPenalty; saveSettings(); };
els.maxTokens.oninput = () => { settings.maxTokens = +els.maxTokens.value; els.maxtokVal.textContent = settings.maxTokens; saveSettings(); };
els.stopSeq.oninput = () => { settings.stopSequences = els.stopSeq.value.replace(/\n/g, '\\n'); saveSettings(); };
els.model.onchange = () => { settings.model = els.model.value; saveSettings(); };
}
// Alustetaan kun settings-tab avataan
const origSwitchTab = window.switchTab;
window.switchTab = function(tab) {
origSwitchTab(tab);
if (tab === 'settings') initSettings();
};
window.resetSettings = function() {
if (!confirm('Palautetaanko kaikki asetukset oletuksiin?')) return;
settings = { ...defaultSettings };
saveSettings();
initSettings();
};
</script>
</body>
</html>