<main class="main">
</main>
<script>
// Datenstruktur & Status
let documents = JSON.parse(localStorage.getItem('si_docs')) || [];
let isThinking = false;
let currentFilter = 'GESAMT';
// Initialisierung
window.onload = () => {
renderDocs();
updateUI();
};
// UI Funktionen
function toggleSidebar() { document.getElementById('sidebar').classList.toggle('collapsed'); }
function openModal() { document.getElementById('modalOverlay').classList.remove('hidden'); }
function closeModal() { document.getElementById('modalOverlay').classList.add('hidden'); }
function autoResize(textarea) {
textarea.style.height = 'auto';
textarea.style.height = textarea.scrollHeight + 'px';
}
function checkKey(e) {
if (e.key === 'Enter' && !e.shiftKey) {
e.preventDefault();
sendMessage();
}
}
// Dokumente verwalten
function saveDocument() {
const name = document.getElementById('docName').value || "Unbenannt";
const content = document.getElementById('docContent').value;
const element = document.getElementById('docElement').value;
if (!content) return alert("Inhalt darf nicht leer sein.");
const newDoc = {
id: Date.now(),
name: name,
content: content,
element: element,
active: true,
length: content.length
};
documents.push(newDoc);
updateStorage();
renderDocs();
closeModal();
// Reset Form
document.getElementById('docName').value = '';
document.getElementById('docContent').value = '';
}
function deleteDoc(id) {
documents = documents.filter(d => d.id !== id);
updateStorage();
renderDocs();
}
function toggleDoc(id) {
const doc = documents.find(d => d.id === id);
if (doc) doc.active = !doc.active;
updateStorage();
renderDocs();
}
function updateStorage() {
localStorage.setItem('si_docs', JSON.stringify(documents));
updateUI();
}
function renderDocs() {
const list = document.getElementById('docList');
list.innerHTML = '';
documents.forEach(doc => {
const item = document.createElement('div');
item.className = `doc-item ${doc.active ? 'active-doc' : ''}`;
item.onclick = () => toggleDoc(doc.id);
item.innerHTML = `
SI
BEREIT
✦
System bereit.
Wähle Dokumente aus dem Archiv für die Analyse.
${doc.name}
`;
list.appendChild(item);
});
}
// Chat & Analyse Logik
function sendMessage() {
const input = document.getElementById('inputField');
const text = input.value.trim();
if (!text || isThinking) return;
// User Nachricht anzeigen
appendMessage('user', text);
input.value = '';
autoResize(input);
// KI Simulation
startThinking();
setTimeout(() => {
const activeDocs = documents.filter(d => d.active);
let response = "";
if (activeDocs.length === 0) {
response = "WARNUNG: Keine aktiven Dokumente im Archiv. Analyseergebnisse könnten unvollständig sein.\n\nSystem benötigt Kontext-Daten für präzise Auswertung.";
} else {
const totalLen = activeDocs.reduce((s, d) => s + d.length, 0);
response = `Analyse der ${activeDocs.length} aktiven Dokumente abgeschlossen (${totalLen} Zeichen Kontext).\n\nErgebnis: Die Datenstrukturen weisen eine hohe Korrelation auf. Verfahrensbeschreibung in Sektion [${activeDocs[0].element}] identifiziert.`;
}
appendMessage('si', response);
stopThinking();
}, 1500);
}
function appendMessage(role, text) {
document.getElementById('emptyState').style.display = 'none';
const container = document.getElementById('messages');
const div = document.createElement('div');
div.className = `message ${role}`;
div.innerHTML = `
`;
container.appendChild(div);
document.getElementById('bottom').scrollIntoView({ behavior: 'smooth' });
}
function startThinking() {
isThinking = true;
const dot = document.getElementById('statusDot');
dot.className = 'status-dot thinking';
document.getElementById('statusLabel').innerText = "ANALYSIERE...";
document.getElementById('sendBtn').disabled = true;
}
function stopThinking() {
isThinking = false;
const dot = document.getElementById('statusDot');
dot.className = 'status-dot active';
document.getElementById('statusLabel').innerText = "BEREIT";
document.getElementById('sendBtn').disabled = false;
}
function updateUI() {
const activeDocs = documents.filter(d => d.active);
const totalChars = activeDocs.reduce((sum, doc) => sum + doc.length, 0);
// Token Bar Update
const percent = Math.min((totalChars / 80000) * 100, 100);
document.getElementById('tokenFill').style.width = percent + '%';
document.getElementById('tokenInfo').innerText = `${totalChars.toLocaleString()} / 80.000 ZEICHEN`;
// Status Badge Sidebar
const badge = document.getElementById('activeCountBadge');
// document.getElementById('sendBtn').disabled = (activeDocs.length === 0);
}
function filterDocs(type) {
// Visuelles Feedback für die Pill-Buttons
document.querySelectorAll('.pill').forEach(p => {
p.classList.toggle('active', p.innerText === type);
});
// In dieser Version dient der Filter nur als UI-Element.
// Logik könnte hier erweitert werden.
}
</script>