- Kipinä Agent Workspace
+
-
+ Kipinä Agent Workspace
+
+
Monitoring Active
-
- 
-
- KPN CLI
- Paikallinen Ohjaus
+
+
+
@@ -756,6 +883,114 @@
import init, { start_agent_node, set_gpu_load, set_auto_tasks } from './pkg/node.js';
// Päävälilehtien vaihto
+ // Agenttien system promptit
+ const agentPrompts = {
+ client: { name: 'Asiakas — Projektin vaatimukset', model: 'user-input', default: 'Kirjoita tähän asiakkaan toiveet ja projektin vaatimukset. Orkestraattori (Manageri) purkaa ja delegoi nämä työt asiantuntijoille.' },
+ observer: { name: 'Tarkkailija — System Prompt', model: 'deepseek-r1', default: 'Olet ohjelmistoprojektin riippumaton valvoja. Sinulla on täysi pääsy kaikkiin projektin tietoihin ja muiden agenttien keskusteluihin. Valvo tiimin (Manageri, Koodari, Data, QA, DevOps) toimintaa asiantuntijana kokonaisuutena ja huomauta välittömästi visio- tai turvallisuusriskeistä.' },
+ manager: { name: 'Manageri — System Prompt', model: 'qwen-coder', default: 'Olet projektipäällikkö. Jaa tehtävät osiin, priorisoi ja koordinoi tiimin työtä.' },
+ coder: { name: 'Koodari — System Prompt', model: 'qwen-coder', default: 'Olet kokenut ohjelmistokehittäjä. Kirjoita selkeää, testattavaa koodia ja vastaa aina koodilla.' },
+ data: { name: 'Data-Agentti — System Prompt', model: 'qwen-coder', default: 'Olet tietokanta-asiantuntija. Vastaat skeemojen suunnittelusta, SQL-kyselyiden optimoinnista ja datamalleista.' },
+ qa: { name: 'QA — System Prompt', model: 'smollm-135m', default: 'Olet laadunvarmistaja (QA). Kirjoitat testejä, etsit virheitä ja varmistat, että kaikki reunatapaukset on huomioitu.' },
+ tester: { name: 'DevOps — System Prompt', model: 'smollm-135m', default: 'Olet DevOps-insinööri. Vastaat koodin julkaisuputkista, serveri-infrastruktuurista ja ympäristön suorituskyvystä.' },
+ };
+ const selectedAgents = new Set();
+ let sharedPrompt = localStorage.getItem('kpn-shared-prompt') || '';
+
+ // Ladataan tallennetut promptit localStoragesta
+ for (const key of Object.keys(agentPrompts)) {
+ const saved = localStorage.getItem('kpn-agent-prompt-' + key);
+ if (saved) agentPrompts[key].prompt = saved;
+ else agentPrompts[key].prompt = agentPrompts[key].default;
+ }
+
+ function updatePromptEditor() {
+ const editor = document.getElementById('agent-prompt-editor');
+ const nameEl = document.getElementById('agent-prompt-name');
+ const textEl = document.getElementById('agent-prompt-text');
+ const sharedEl = document.getElementById('shared-prompt-section');
+ const btnAll = document.getElementById('btn-toggle-all');
+
+ if (btnAll) {
+ if (selectedAgents.size === Object.keys(agentPrompts).length) {
+ btnAll.textContent = 'Tyhjennä valinnat';
+ } else {
+ btnAll.textContent = 'Valitse kaikki';
+ }
+ }
+
+ if (selectedAgents.size === 0) {
+ editor.classList.remove('visible');
+ return;
+ }
+
+ editor.classList.add('visible');
+
+ if (selectedAgents.size === 1) {
+ const agent = [...selectedAgents][0];
+ const cfg = agentPrompts[agent];
+ nameEl.textContent = cfg.name;
+ textEl.value = cfg.prompt;
+ sharedEl.style.display = 'none';
+ } else {
+ const names = [...selectedAgents].map(a => agentPrompts[a].name.split(' — ')[0]);
+ nameEl.textContent = names.join(' + ') + ' — Yhteinen konteksti';
+ textEl.value = sharedPrompt;
+ sharedEl.style.display = 'block';
+ }
+ }
+
+ window.selectAgent = function(agent) {
+ const card = document.querySelector(`[data-agent="${agent}"]`);
+
+ if (selectedAgents.has(agent)) {
+ selectedAgents.delete(agent);
+ card.classList.remove('selected');
+ card.classList.remove('active');
+ } else {
+ selectedAgents.add(agent);
+ card.classList.add('selected');
+ }
+
+ updatePromptEditor();
+ if (selectedAgents.size > 0) {
+ document.getElementById('agent-prompt-text')?.focus();
+ }
+ };
+
+ window.toggleAllAgents = function() {
+ const allAgents = Object.keys(agentPrompts);
+ if (selectedAgents.size === allAgents.length) {
+ selectedAgents.clear();
+ document.querySelectorAll('.avatar-card').forEach(c => c.classList.remove('selected', 'active'));
+ } else {
+ allAgents.forEach(a => {
+ selectedAgents.add(a);
+ const card = document.querySelector(`[data-agent="${a}"]`);
+ if (card) card.classList.add('selected');
+ });
+ }
+ updatePromptEditor();
+ };
+
+ // Autosave prompti
+ document.getElementById('agent-prompt-text')?.addEventListener('input', (e) => {
+ if (selectedAgents.size === 0) return;
+ const saved = document.getElementById('agent-prompt-saved');
+
+ if (selectedAgents.size === 1) {
+ const agent = [...selectedAgents][0];
+ agentPrompts[agent].prompt = e.target.value;
+ localStorage.setItem('kpn-agent-prompt-' + agent, e.target.value);
+ } else {
+ sharedPrompt = e.target.value;
+ localStorage.setItem('kpn-shared-prompt', e.target.value);
+ }
+
+ saved.style.opacity = '1';
+ clearTimeout(saved._t);
+ saved._t = setTimeout(() => saved.style.opacity = '0', 1500);
+ });
+
window.switchMainTab = function(tab) {
document.querySelectorAll('.main-panel').forEach(p => p.classList.remove('active'));
document.querySelectorAll('.main-tab').forEach(t => t.classList.remove('active'));
@@ -779,9 +1014,10 @@
}
};
- // URL-hash navigointi: #codelab tai #network
- if (window.location.hash === '#codelab') {
- switchMainTab('codelab');
+ // URL-hash navigointi
+ const initHash = window.location.hash.replace('#', '');
+ if (['codelab', 'agents'].includes(initHash)) {
+ switchMainTab(initHash);
}
// Synkronoi coder-status kun WS on jo auki (suora #codelab navigointi)
@@ -1020,6 +1256,142 @@
coderEl.style.color = '#f85149';
}
};
+ // Terminaalin komentorivi
+ const termInput = document.getElementById('term-input');
+ const termPanel = document.getElementById('agent-terminal');
+ const termHistory = [];
+ let termHistIdx = -1;
+
+ function termLog(html, color) {
+ const div = document.createElement('div');
+ div.className = 'terminal-line';
+ if (color) div.style.color = color;
+ div.innerHTML = html;
+ termPanel.appendChild(div);
+ while (termPanel.children.length > 100) termPanel.removeChild(termPanel.firstChild);
+ termPanel.scrollTop = termPanel.scrollHeight;
+ }
+
+ async function kpnRun(model, prompt) {
+ termLog(` → ${model} käsittelee...`, '#8b949e');
+ try {
+ const taskId = crypto.randomUUID();
+ // Liitetään yhteinen konteksti + agentin oma system prompt
+ const agent = Object.values(agentPrompts).find(a => a.model === model);
+ const parts = [];
+ if (sharedPrompt) parts.push(sharedPrompt);
+ if (agent && agent.prompt) parts.push(agent.prompt);
+ parts.push(prompt);
+ const fullPrompt = parts.join('\n\n');
+ const res = await fetch('/api/v1/chat/completions', {
+ method: 'POST',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify({ model, prompt: fullPrompt, task_id: taskId }),
+ });
+ if (!res.ok) {
+ termLog(` ✗ Virhe: ${res.status} ${res.statusText}`, '#f85149');
+ return;
+ }
+ const data = await res.json();
+ const response = (data.response || '').trim();
+ const tokGen = data.tokens_generated || 0;
+ termLog(` ✓ ${data.model || model} (${tokGen} tok)`);
+ termLog(` ${response.replace(/$ ${cmd.replace(/ {
+ if (e.key === 'Enter') {
+ const cmd = termInput.value.trim();
+ if (cmd) termExec(cmd);
+ termInput.value = '';
+ } else if (e.key === 'ArrowUp') {
+ e.preventDefault();
+ if (termHistIdx < termHistory.length - 1) {
+ termHistIdx++;
+ termInput.value = termHistory[termHistIdx];
+ }
+ } else if (e.key === 'ArrowDown') {
+ e.preventDefault();
+ if (termHistIdx > 0) {
+ termHistIdx--;
+ termInput.value = termHistory[termHistIdx];
+ } else {
+ termHistIdx = -1;
+ termInput.value = '';
+ }
+ }
+ });
+
+ // Klikkaa terminaalipaneelia → fokusoi input
+ termPanel?.addEventListener('click', () => termInput?.focus());
+
uiSocket.onmessage = (event) => {
try {
const raw = event.data;
@@ -1281,9 +1653,8 @@
}
document.querySelectorAll('.avatar-card').forEach(c => c.classList.remove('active'));
const model = data.model || '';
- if (model.includes('coder')) document.getElementById('avatar-coder')?.classList.add('active');
- else document.getElementById('avatar-smol')?.classList.add('active');
- document.getElementById('avatar-discord')?.classList.add('active');
+ if (model.includes('coder') || model.includes('Coder')) document.getElementById('avatar-coder')?.classList.add('active');
+ else document.getElementById('avatar-tester')?.classList.add('active');
}
} catch(e) {}
};
+
-
+ 
+
+ Asiakas
+ Tuoteomistaja
+
- 
-
- Qwen-Coder
- Koodiagentti
+
+
+
+
+
+
+
-
+ 
+
+
+
+ Tarkkailija
+ Laadunvalvonta
+
+ 
+
+ Manageri
+ KPN CLI
+
- 
-
+
- SmolLM
- Logiikka
+
+
+
+
+
+
-
+ 
+
+
+ Koodari
+ Ohjelmistokehitys
+
+ 
+
+
+ Data
+ Tietokannat
+
+ 
+
+
+ QA
+ Testaus
+
+ 
+
+ DevOps
+ Käyttöönotto
+
- 
-
+
+
- Swarm
- WebGPU Solmu
+
+
@@ -747,6 +869,11 @@
+ —
+ Tallennettu
+
+
+
$ kpn hub connect wss://localhost
✓ Yhdistetty Kipinä Hubiin
+ $
+
+