fixed delete session and added create button

This commit is contained in:
2026-03-13 17:19:50 +01:00
parent 8d7bb90a82
commit 08256c6113
2 changed files with 126 additions and 10 deletions
+59 -8
View File
@@ -165,7 +165,13 @@
<div class="card">
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;">
<h2>Sessions</h2>
<button class="btn secondary" onclick="loadSessions()" style="padding:4px 10px;font-size:11px;">Laden</button>
<div style="display:flex;gap:4px;">
<button class="btn secondary" onclick="createSession()" style="padding:4px 10px;font-size:11px;">+ Neu</button>
<button class="btn secondary" onclick="loadSessions()" style="padding:4px 10px;font-size:11px;">Laden</button>
</div>
</div>
<div id="active-session-bar" style="font-size:10px;color:#34C759;margin-bottom:6px;padding:4px 6px;background:#0D0D1A;border-radius:4px;display:none;">
Aktiv: <span id="active-session-name" style="font-weight:bold;"></span>
</div>
<div id="sessions-list" style="max-height:300px;overflow-y:auto;font-size:12px;"></div>
<div id="session-detail" style="display:none;margin-top:8px;background:#080810;border:1px solid #1E1E2E;border-radius:4px;padding:8px;max-height:300px;overflow-y:auto;">
@@ -361,7 +367,10 @@
const proto = location.protocol === 'https:' ? 'wss' : 'ws';
ws = new WebSocket(`${proto}://${location.host}`);
ws.onopen = () => addLog('info', 'browser', 'Verbunden mit Diagnostic Server');
ws.onopen = () => {
addLog('info', 'browser', 'Verbunden mit Diagnostic Server');
send({ action: 'get_active_session' });
};
ws.onclose = () => {
addLog('warn', 'browser', 'Verbindung zum Diagnostic Server verloren — Reconnect in 2s');
setTimeout(connectWS, 2000);
@@ -461,10 +470,23 @@
if (msg.type === 'sessions_list') { renderSessions(msg); return; }
if (msg.type === 'session_detail') { renderSessionDetail(msg); return; }
if (msg.type === 'session_deleted') {
if (msg.ok) loadSessions(); // Liste neu laden
if (msg.ok) loadSessions();
else alert('Loeschen fehlgeschlagen: ' + (msg.error || '?'));
return;
}
if (msg.type === 'active_session') {
updateActiveSessionBar(msg.sessionKey);
loadSessions(); // Tabelle neu rendern
return;
}
if (msg.type === 'session_created') {
if (msg.ok) {
loadSessions();
} else {
alert('Session erstellen fehlgeschlagen: ' + (msg.error || '?'));
}
return;
}
if (msg.type === 'brain_list') { renderBrainList(msg); return; }
if (msg.type === 'brain_content') { renderBrainContent(msg); return; }
if (msg.type === 'response') { return; }
@@ -848,6 +870,8 @@
send({ action: 'list_sessions' });
}
let currentActiveSession = '';
function renderSessions(data) {
const container = document.getElementById('sessions-list');
if (data.error) {
@@ -871,14 +895,19 @@
const key = escapeHtml(s.sessionKey || s.path.split('/').pop());
const orphanBadge = s.orphan ? ' <span style="background:#FF3B30;color:#fff;font-size:9px;padding:1px 4px;border-radius:3px;">verwaist</span>' : '';
const modelBadge = s.model ? `<div style="font-size:9px;color:#555570;">${escapeHtml(s.model)}</div>` : '';
const keyColor = s.orphan ? '#555570' : '#E0E0F0';
html += `<tr style="border-bottom:1px solid #0D0D1A;cursor:pointer;" onmouseover="this.style.background='#1E1E2E'" onmouseout="this.style.background=''">`
const isActive = (s.sessionKey === currentActiveSession);
const keyColor = isActive ? '#34C759' : (s.orphan ? '#555570' : '#E0E0F0');
const activeBadge = isActive ? ' <span style="background:#34C759;color:#000;font-size:9px;padding:1px 4px;border-radius:3px;">aktiv</span>' : '';
const rowBg = isActive ? 'background:rgba(52,199,89,0.08);' : '';
html += `<tr style="border-bottom:1px solid #0D0D1A;cursor:pointer;${rowBg}" onmouseover="this.style.background='#1E1E2E'" onmouseout="this.style.background='${isActive ? 'rgba(52,199,89,0.08)' : ''}'">`
+ `<td style="padding:4px 6px;" onclick="viewSession('${escapeHtml(s.path)}')">`
+ `<div style="color:${keyColor};">${key}${orphanBadge}</div>${modelBadge}</td>`
+ `<div style="color:${keyColor};">${key}${activeBadge}${orphanBadge}</div>${modelBadge}</td>`
+ `<td style="padding:4px 6px;color:#8888AA;">${s.lines}</td>`
+ `<td style="padding:4px 6px;color:#8888AA;font-size:10px;">${date}</td>`
+ `<td style="padding:4px 6px;"><button class="btn secondary" onclick="event.stopPropagation();deleteSession('${escapeHtml(s.path)}')" style="padding:2px 6px;font-size:10px;color:#FF6B6B;">X</button></td>`
+ '</tr>';
+ `<td style="padding:4px 6px;white-space:nowrap;">`
+ (isActive ? '' : `<button class="btn secondary" onclick="event.stopPropagation();activateSession('${escapeHtml(s.sessionKey)}')" style="padding:2px 6px;font-size:10px;color:#34C759;margin-right:2px;" title="Aktivieren">&#9654;</button>`)
+ `<button class="btn secondary" onclick="event.stopPropagation();deleteSession('${escapeHtml(s.path)}')" style="padding:2px 6px;font-size:10px;color:#FF6B6B;" title="Loeschen">X</button>`
+ `</td></tr>`;
}
html += '</table>';
container.innerHTML = html;
@@ -941,6 +970,28 @@
send({ action: 'delete_session', sessionPath: path });
}
function activateSession(sessionKey) {
send({ action: 'set_active_session', sessionKey });
}
function createSession() {
const name = prompt('Name fuer neue Session (a-z, 0-9, -, _):');
if (!name) return;
send({ action: 'create_session', sessionName: name.trim() });
}
function updateActiveSessionBar(sessionKey) {
currentActiveSession = sessionKey || '';
const bar = document.getElementById('active-session-bar');
const nameEl = document.getElementById('active-session-name');
if (currentActiveSession) {
bar.style.display = 'block';
nameEl.textContent = currentActiveSession;
} else {
bar.style.display = 'none';
}
}
// ── Brain Viewer ────────────────────────────────────────
function loadBrain() {