52 lines
1.8 KiB
JavaScript
52 lines
1.8 KiB
JavaScript
document.addEventListener("DOMContentLoaded", function () {
|
|
const chatFab = document.getElementById("chat-fab");
|
|
const chatWindow = document.getElementById("chat-window");
|
|
const closeChatBtn = document.getElementById("close-chat");
|
|
const chatForm = document.getElementById("chat-form");
|
|
const chatInput = document.getElementById("chat-input");
|
|
const chatBody = document.getElementById("chat-body");
|
|
|
|
// --- Toggle Chat Window ---
|
|
chatFab.addEventListener("click", () => {
|
|
chatWindow.classList.toggle("open");
|
|
chatFab.classList.toggle("d-none");
|
|
});
|
|
|
|
closeChatBtn.addEventListener("click", () => {
|
|
chatWindow.classList.remove("open");
|
|
chatFab.classList.remove("d-none");
|
|
});
|
|
|
|
// --- Handle Message Sending ---
|
|
chatForm.addEventListener("submit", function (e) {
|
|
e.preventDefault();
|
|
const messageText = chatInput.value.trim();
|
|
|
|
if (messageText) {
|
|
// 1. Add user message to UI
|
|
addMessage(messageText, "user");
|
|
chatInput.value = "";
|
|
chatBody.scrollTop = chatBody.scrollHeight;
|
|
|
|
// 2. Simulate bot reply
|
|
setTimeout(() => {
|
|
const botReply = "Thanks for your message! We'll be in touch shortly.";
|
|
addMessage(botReply, "bot");
|
|
chatBody.scrollTop = chatBody.scrollHeight;
|
|
}, 500);
|
|
}
|
|
});
|
|
|
|
function addMessage(text, type) {
|
|
const messageElement = document.createElement("div");
|
|
messageElement.classList.add("chat-message", type);
|
|
messageElement.textContent = text;
|
|
chatBody.appendChild(messageElement);
|
|
}
|
|
|
|
// Add initial bot message
|
|
setTimeout(() => {
|
|
addMessage("Hi there! How can I help you today?", "bot");
|
|
}, 1000);
|
|
});
|