| document.addEventListener("DOMContentLoaded", function() { | |
| const chatHistory = document.getElementById("chat-history"); | |
| const userInput = document.getElementById("user-input"); | |
| const sendButton = document.getElementById("send-button"); | |
| sendButton.addEventListener("click", function() { | |
| const userMessage = userInput.value.trim(); | |
| if (userMessage !== "") { | |
| appendMessage(userMessage, true); | |
| userInput.value = ""; | |
| sendMessageToPythonAnywhere(userMessage); | |
| } | |
| }); | |
| function appendMessage(message, isUser) { | |
| const messageElement = document.createElement("div"); | |
| messageElement.classList.add("message", isUser ? "user-message" : "bot-message"); | |
| messageElement.textContent = message; | |
| chatHistory.appendChild(messageElement); | |
| chatHistory.scrollTop = chatHistory.scrollHeight; | |
| } | |
| async function sendMessageToPythonAnywhere(message) { | |
| try { | |
| const response = await fetch('YOUR_PYTHONANYWHERE_API_ENDPOINT', { | |
| method: 'POST', | |
| headers: { | |
| 'Content-Type': 'application/json' | |
| }, | |
| body: JSON.stringify({ message: message }) | |
| }); | |
| if (!response.ok) { | |
| throw new Error('Network response was not ok'); | |
| } | |
| const data = await response.json(); | |
| const botResponse = data.message; | |
| appendMessage(botResponse, false); | |
| } catch (error) { | |
| console.error('Error:', error); | |
| } | |
| } | |
| }); | |