let chatCount = 0; // Zähler für Chat-Sessions let currentChatId = null; // Aktuell angezeigte Chat-ID document.getElementById('newChatButton').addEventListener('click', () => { createNewChat(); }); document.getElementById('sendButton').addEventListener('click', () => { const chatBox = document.getElementById('chatBox'); const chatInput = document.getElementById('chatInput'); const messageText = chatInput.value.trim(); if (messageText !== '' && currentChatId !== null) { // Stelle sicher, dass eine Chat-ID vorhanden ist const messageElement = document.createElement('div'); messageElement.classList.add('chat-message', 'user'); messageElement.innerText = messageText; chatBox.prepend(messageElement); // Nachricht speichern saveMessage(currentChatId, messageText); // Verwende die aktuelle Chat-ID // Sidebar-Button für den Chat-Verlauf erstellen, falls noch nicht vorhanden if (document.getElementById(`chatSession-${currentChatId}`) === null) { createChatSessionButton(currentChatId); } chatInput.value = ''; // Input-Feld leeren } }); function createNewChat() { // Erhöhe den Chat-Zähler und erstelle einen neuen Chat const newChatId = chatCount++; localStorage.setItem(`chatHistory-${newChatId}`, JSON.stringify([])); // Leeren Chat speichern createChatSessionButton(newChatId); // Button für den neuen Chat erstellen loadChatHistory(newChatId); // Lade den neuen Chat currentChatId = newChatId; // Setze die aktuelle Chat-ID } function saveMessage(chatId, message) { const chatHistory = JSON.parse(localStorage.getItem(`chatHistory-${chatId}`)) || []; chatHistory.push({ user: "user", text: message }); localStorage.setItem(`chatHistory-${chatId}`, JSON.stringify(chatHistory)); // Aktualisiere den Button-Text in der Sidebar updateChatSessionButton(chatId, message); } function updateChatSessionButton(chatId, message) { const button = document.getElementById(`chatSession-${chatId}`); if (button) { const chatHistory = JSON.parse(localStorage.getItem(`chatHistory-${chatId}`)) || []; // Hole die erste Nachricht oder lasse es leer, wenn keine vorhanden ist const chatName = chatHistory.length > 0 ? chatHistory[0].text.slice(0, 10) : ''; // Nimm die ersten 10 Zeichen der ersten Nachricht button.innerText = chatName + "..." || `Chat ${chatId + 1}`; // Falls leer, setze auf "Chat x" } } function createChatSessionButton(chatId) { const chatList = document.getElementById('chatList'); // Container für Chat-Button und Löschen-Button const buttonContainer = document.createElement('div'); buttonContainer.classList.add('chat-session-button-container'); // Chat-Button const button = document.createElement('button'); button.classList.add('chat-session-button'); button.id = `chatSession-${chatId}`; button.innerText = `Chat ${chatId + 1}`; // Vorläufiger Name button.addEventListener('click', () => { loadChatHistory(chatId); // Lade den Chat-Verlauf und setze die aktuelle Chat-ID currentChatId = chatId; // Setze die aktuelle Chat-ID auf die ausgewählte Chat-ID }); // Löschen-Button const deleteButton = document.createElement('button'); deleteButton.classList.add('delete-chat-button'); deleteButton.innerText = "✕"; deleteButton.addEventListener('click', (event) => { event.stopPropagation(); // Verhindert, dass der Chat geladen wird, wenn auf Löschen geklickt wird deleteChat(chatId, buttonContainer); }); // Elemente hinzufügen buttonContainer.appendChild(button); buttonContainer.appendChild(deleteButton); chatList.appendChild(buttonContainer); } function loadChatHistory(chatId) { const chatBox = document.getElementById('chatBox'); chatBox.innerHTML = ''; // Aktuellen Chat leeren const chatHistory = JSON.parse(localStorage.getItem(`chatHistory-${chatId}`)) || []; chatHistory.forEach(entry => { const messageElement = document.createElement('div'); messageElement.classList.add('chat-message', entry.user); messageElement.innerText = entry.text; chatBox.prepend(messageElement); }); currentChatId = chatId; // Setze die aktuelle Chat-ID } function deleteChat(chatId, buttonContainer) { // Entferne den Chat-Verlauf aus dem LocalStorage localStorage.removeItem(`chatHistory-${chatId}`); // Entferne den Button aus der Sidebar buttonContainer.remove(); } function loadAllChatSessions() { Object.keys(localStorage).forEach((key) => { if (key.startsWith('chatHistory-')) { const chatId = parseInt(key.split('-')[1], 10); createChatSessionButton(chatId); chatCount = Math.max(chatCount, chatId + 1); // Chat-Zähler aktualisieren } }); // Lade den neuesten Chat-Verlauf if (chatCount > 0) { loadChatHistory(chatCount - 1); } } // Beim Laden der Seite alle Chat-Sitzungen laden window.addEventListener('DOMContentLoaded', loadAllChatSessions);