110 lines
3.9 KiB
JavaScript
110 lines
3.9 KiB
JavaScript
let chatCount = 0; // Zähler für Chat-Sessions
|
|
|
|
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 !== '') {
|
|
const messageElement = document.createElement('div');
|
|
messageElement.classList.add('chat-message', 'user');
|
|
messageElement.innerText = messageText;
|
|
chatBox.prepend(messageElement);
|
|
|
|
// Nachricht speichern
|
|
saveMessage(chatCount, messageText);
|
|
|
|
// Sidebar-Button für den Chat-Verlauf erstellen, falls noch nicht vorhanden
|
|
if (document.getElementById(`chatSession-${chatCount}`) === null) {
|
|
createChatSessionButton(chatCount);
|
|
}
|
|
|
|
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
|
|
}
|
|
|
|
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));
|
|
}
|
|
|
|
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}`;
|
|
button.addEventListener('click', () => loadChatHistory(chatId));
|
|
|
|
// 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);
|
|
});
|
|
}
|
|
|
|
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);
|