37 lines
1.2 KiB
JavaScript
37 lines
1.2 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function () {
|
|
const chatBody = document.getElementById('chat-body');
|
|
const chatInput = document.getElementById('chat-input');
|
|
const sendButton = document.getElementById('send-button');
|
|
|
|
const appendMessage = (text, sender) => {
|
|
const messageDiv = document.createElement('div');
|
|
messageDiv.classList.add('message', sender);
|
|
|
|
const bubbleDiv = document.createElement('div');
|
|
bubbleDiv.classList.add('bubble');
|
|
bubbleDiv.textContent = text;
|
|
|
|
messageDiv.appendChild(bubbleDiv);
|
|
chatBody.appendChild(messageDiv);
|
|
chatBody.scrollTop = chatBody.scrollHeight;
|
|
};
|
|
|
|
const handleUserMessage = () => {
|
|
const message = chatInput.value.trim();
|
|
if (message) {
|
|
appendMessage(message, 'user');
|
|
chatInput.value = '';
|
|
setTimeout(() => {
|
|
appendMessage('This is a simple built-in reply.', 'bot');
|
|
}, 500);
|
|
}
|
|
};
|
|
|
|
sendButton.addEventListener('click', handleUserMessage);
|
|
chatInput.addEventListener('keypress', function (e) {
|
|
if (e.key === 'Enter') {
|
|
handleUserMessage();
|
|
}
|
|
});
|
|
});
|