49 lines
1.7 KiB
JavaScript

document.addEventListener("DOMContentLoaded", () => {
const form = document.getElementById('chat-form');
const promptInput = document.getElementById('prompt');
const chatLog = document.getElementById('chat-log');
const sendBtn = document.getElementById('send-btn');
const spinner = document.getElementById('spinner');
const thinkingText = document.getElementById('thinking-text');
function appendMessage(role, text) {
const bubble = document.createElement('div');
bubble.className = `bubble ${role}`;
bubble.textContent = text;
chatLog.appendChild(bubble);
chatLog.scrollTop = chatLog.scrollHeight;
}
form.addEventListener('submit', async function (e) {
e.preventDefault();
const prompt = promptInput.value.trim();
if (!prompt) return;
appendMessage("user", prompt);
promptInput.value = "";
sendBtn.disabled = true;
spinner.style.display = 'block';
thinkingText.style.display = 'block';
try {
const response = await fetch("/chat", {
method: "POST",
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
body: new URLSearchParams({ prompt })
});
const data = await response.json();
appendMessage("bot", data.text);
} catch (error) {
appendMessage("bot", "❌ Error procesando la respuesta.");
console.error(error);
} finally {
sendBtn.disabled = false;
spinner.style.display = 'none';
thinkingText.style.display = 'none';
}
});
});