Working Hours: 09:00 - 18:00 (Beijing Time)
We are currently offline. Please leave a message and we will reply as soon as possible.
Hi there 👋 Welcome! Please leave your email and message. We usually respond during business hours.
t modal = document.getElementById("live-chat-modal");
const panel = document.getElementById("live-chat-panel");
const openBtn = document.getElementById("open-live-chat-btn");
const closeBtn = document.getElementById("close-live-chat-btn");
const form = document.getElementById("live-chat-form");
const emailInput = document.getElementById("chat-email");
const messageInput = document.getElementById("chat-message");
const emailError = document.getElementById("email-error");
const chatStatus = document.getElementById("chat-status");
const quickButtons = document.querySelectorAll(".quick-reply-btn");
const offlineNote = document.getElementById("offline-note");
const beijingNow = new Date(new Date().toLocaleString("en-US", { timeZone: "Asia/Shanghai" }));
const hour = beijingNow.getHours();
const isOffline = hour < 9 || hour >= 18;
if (isOffline) {
offlineNote.classList.remove("hidden");
}
const openModal = function () {
modal.classList.remove("chat-modal-hidden");
modal.classList.add("chat-modal-visible");
panel.classList.remove("chat-panel-hidden");
panel.classList.add("chat-panel-visible");
openBtn.setAttribute("aria-expanded", "true");
setTimeout(() => emailInput.focus(), 60);
document.body.classList.add("overflow-hidden");
};
const closeModal = function () {
modal.classList.remove("chat-modal-visible");
modal.classList.add("chat-modal-hidden");
panel.classList.remove("chat-panel-visible");
panel.classList.add("chat-panel-hidden");
openBtn.setAttribute("aria-expanded", "false");
document.body.classList.remove("overflow-hidden");
openBtn.focus();
};
const validEmail = function (value) {
return /^[^s@]+@[^s@]+.[^s@]+$/.test(value.trim());
};
const sanitize = function (value) {
return value.replace(/[<>]/g, "");
};
openBtn.addEventListener("click", openModal);
closeBtn.addEventListener("click", closeModal);
modal.addEventListener("click", function (event) {
if (event.target === modal) closeModal();
});
document.addEventListener("keydown", function (event) {
if (event.key === "Escape" && modal.classList.contains("chat-modal-visible")) closeModal();
});
quickButtons.forEach(function (btn) {
btn.addEventListener("click", function () {
if (!validEmail(emailInput.value)) {
emailError.classList.remove("hidden");
chatStatus.textContent = "";
emailInput.focus();
return;
}
emailError.classList.add("hidden");
messageInput.value = btn.getAttribute("data-reply") || "";
messageInput.focus();
});
});
form.addEventListener("submit", async function (event) {
event.preventDefault();
const email = sanitize(emailInput.value);
const message = sanitize(messageInput.value || "No message provided.");
const timestamp = new Date().toISOString();
if (!validEmail(email)) {
emailError.classList.remove("hidden");
chatStatus.textContent = "";
emailInput.focus();
return;
}
emailError.classList.add("hidden");
chatStatus.textContent = "Sending...";
try {
const payload = {
to: "evie.guan@ould.com.cn",
subject: "Live Chat Submission",
email: email,
message: message,
timestamp: timestamp
};
await fetch("/api/live-chat-notify", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(payload)
});
chatStatus.textContent = "Message sent successfully.";
form.reset();
setTimeout(closeModal, 900);
} catch (error) {
chatStatus.textContent = "Unable to send now. Please email us directly.";
}
});
})();
