41 lines
1.4 KiB
JavaScript
41 lines
1.4 KiB
JavaScript
document.addEventListener('DOMContentLoaded', () => {
|
|
const chatMessages = document.getElementById('chat-messages');
|
|
const chatForm = document.getElementById('chat-form');
|
|
const chatInput = document.getElementById('chat-input');
|
|
|
|
const addMessage = (sender, text) => {
|
|
const messageElement = document.createElement('div');
|
|
messageElement.classList.add('message', sender);
|
|
|
|
const senderName = sender === 'user' ? 'You' : 'KittyAI';
|
|
const senderElement = document.createElement('div');
|
|
senderElement.classList.add('message-sender');
|
|
senderElement.textContent = senderName;
|
|
|
|
messageElement.appendChild(senderElement);
|
|
messageElement.append(text);
|
|
|
|
chatMessages.appendChild(messageElement);
|
|
chatMessages.scrollTop = chatMessages.scrollHeight;
|
|
};
|
|
|
|
chatForm.addEventListener('submit', (e) => {
|
|
e.preventDefault();
|
|
const messageText = chatInput.value.trim();
|
|
|
|
if (messageText) {
|
|
addMessage('user', messageText);
|
|
chatInput.value = '';
|
|
|
|
setTimeout(() => {
|
|
addMessage('bot', 'Meow! This is a placeholder response from KittyAI. The real AI is still napping!');
|
|
}, 1200);
|
|
}
|
|
});
|
|
|
|
// Initial bot message
|
|
setTimeout(() => {
|
|
addMessage('bot', 'Welcome to KittyAI! Ask me anything.');
|
|
}, 1000);
|
|
});
|