Update chat.js

chat.js

@@ -1,55 +1,38 @@
-const userInput = document.getElementById('message-input');
 const sendButton = document.getElementById('send-message');
+const userInput = document.getElementById('message-input');
 const chatBox = document.getElementById('conversation-history');
-const status = document.getElementById('status');
-
-// Funktion, um eine Abfrage an die Hugging Face API zu senden
-async function queryHuggingFace(data) {
-    const response = await fetch(
-        "https://api-inference.huggingface.co/models/mistralai/Mixtral-8x7B-v0.1",
-        {
-            headers: { Authorization: "Bearer IhrHuggingFaceAPIToken" },
-            method: "POST",
-            body: JSON.stringify(data),
-        }
-    );
-    const result = await response.json();
-    return result;
-}
-
-// Event-Listener für den Senden-Button
-sendButton.addEventListener('click', () => {
-    const message = userInput.value.trim();
-    if (!message) return;
 
+sendButton.addEventListener('click', async () => {
+  const message = userInput.value.trim();
+  if (message) {
     displayMessage('Du: ' + message, 'user');
     userInput.value = '';
 
-    status.textContent = 'Der Bot antwortet...';
-    queryHuggingFace({"inputs": message})
-        .then(response => {
-            displayMessage('Bot: ' + response.generated_text, 'bot');
-            status.textContent = '';
-        })
-        .catch(error => {
-            displayMessage('Fehler beim Generieren der Antwort: ' + error, 'error');
-            status.textContent = '';
-        });
+    try {
+      const response = await fetch('http://localhost:7860/api/chat/', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          "inputs": message,
+        }),
+      });
+      const data = await response.json();
+
+      displayMessage('Bot: ' + data, 'bot');
+    } catch (error) {
+      console.error('Fehler beim Senden der Nachricht:', error);
+    }
+  }
 });
 
-// Nachricht im Chat anzeigen
 function displayMessage(message, sender) {
-    const messageElement = document.createElement('div');
-    messageElement.className = 'message ' + sender;
-    messageElement.textContent = message;
-    chatBox.appendChild(messageElement);
-    chatBox.scrollTop = chatBox.scrollHeight; // Scroll to the bottom
+  const messageElement = document.createElement('div');
+  messageElement.className = 'message ' + sender;
+  messageElement.textContent = message;
+  chatBox.appendChild(messageElement);
+  chatBox.scrollTop = chatBox.scrollHeight; // Scroll to the bottom
 }
 
-// Enter-Taste als Alternative zum Senden
-userInput.addEventListener('keypress', function(e) {
-    if (e.key === 'Enter') {
-        sendButton.click();
-    }
-});