jaakko/agentic-studio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Highlight.js koodin syntaksikorostukseen (automaattinen kielentunnistus) + markdown-strippaus

Browse Source 
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jaakko Vanhala
2026-04-05 08:43:20 +03:00
parent 949f34833f
commit 50ff34cb09
1 changed files with 12 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
network-poc/static/index.html
View File

@@ -4,6 +4,8 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kipinä Agentic Playground</title> <title>Kipinä Agentic Playground</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/styles/github-dark.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/highlight.min.js"></script>
<style> <style>
:root { :root {
--bg-color: #0d1117; --bg-color: #0d1117;
@@ -134,15 +136,12 @@
padding: 14px; padding: 14px;
font-size: 13px; font-size: 13px;
line-height: 1.6; line-height: 1.6;
color: var(--success-color);
white-space: pre-wrap; white-space: pre-wrap;
overflow-x: auto; overflow-x: auto;
max-height: 400px; max-height: 400px;
overflow-y: auto; overflow-y: auto;
} }
.code-output .keyword { color: #ff7b72; } .code-output .hljs { background: transparent; padding: 0; }
.code-output .string { color: #a5d6ff; }
.code-output .comment { color: #8b949e; }
.code-task-card { .code-task-card {
background: #0d1117; background: #0d1117;
@@ -2371,20 +2370,14 @@
let pendingCodePrompt = null; let pendingCodePrompt = null;
// Yksinkertainen Python-syntaksikorostus // Yksinkertainen Python-syntaksikorostus
function highlightPython(code) { function highlightCode(code) {
return code if (typeof hljs !== 'undefined') {
// Kommentit try {
.replace(/(#.*)/g, '<span style="color:#8b949e">$1</span>') const result = hljs.highlightAuto(code);
// Merkkijonot (f-stringit, tavalliset) return result.value;
.replace(/(f?"[^"]*"|f?'[^']*')/g, '<span style="color:#a5d6ff">$1</span>') } catch(e) {}
// Avainsanat }
.replace(/\b(def|return|if|elif|else|for|while|in|not|and|or|is|import|from|class|try|except|with|as|lambda|yield|True|False|None|raise|pass|break|continue)\b/g, '<span style="color:#ff7b72">$1</span>') return esc(code);
// Sisäänrakennetut funktiot
.replace(/\b(print|len|range|int|str|float|list|dict|set|tuple|type|isinstance|enumerate|zip|map|filter|sorted|reversed|sum|min|max|abs|round|input|open)\b/g, '<span style="color:#d2a8ff">$1</span>')
// Numerot
.replace(/\b(\d+\.?\d*)\b/g, '<span style="color:#79c0ff">$1</span>')
// Dekoraattorit
.replace(/(@\w+)/g, '<span style="color:#d2a8ff">$1</span>');
} }
function addCodeResult(data) { function addCodeResult(data) {
@@ -2417,7 +2410,7 @@
card.className = 'code-task-card'; card.className = 'code-task-card';
card.innerHTML = ` card.innerHTML = `
<div class="prompt">${esc(stripSystemPrompt(data.prompt))}</div> <div class="prompt">${esc(stripSystemPrompt(data.prompt))}</div>
<div class="code-output">${highlightPython(response)}</div> <div class="code-output">${highlightCode(response)}</div>
<div class="meta"> <div class="meta">
${model} · ${tokGen} tokenia · ${typeof durMs === 'number' ? durMs.toFixed(0) : durMs}ms · ${tokS} tok/s ${model} · ${tokGen} tokenia · ${typeof durMs === 'number' ? durMs.toFixed(0) : durMs}ms · ${tokS} tok/s
</div>`; </div>`;