document.addEventListener("DOMContentLoaded", function () {
    const sendButton = document.getElementById("send-button");
    const userInput = document.getElementById("user-input");
    const chatMessages = document.getElementById("chat-messages");

    sendButton.addEventListener("click", async function () {
        const message = userInput.value.trim();
        if (!message) {
            alert("لطفاً یک پیام وارد کنید!");
            return;
        }

        // نمایش پیام کاربر
        const userMessage = document.createElement("p");
        userMessage.textContent = `You: ${message}`;
        chatMessages.appendChild(userMessage);

        // پاک کردن ورودی
        userInput.value = "";

        try {
            // ارسال پیام به سرور
            const response = await fetch("?message=" + encodeURIComponent(message), {
                method: "GET",
                headers: { "Content-Type": "application/json" },
            });

            if (!response.ok) {
                throw new Error(`HTTP error! status: ${response.status}`);
            }

            const data = await response.json();

            // نمایش پاسخ مدل
            const assistantMessage = document.createElement("p");
            assistantMessage.textContent = `Assistant: ${data.response}`;
            chatMessages.appendChild(assistantMessage);
        } catch (error) {
            console.error("Error fetching response:", error);
            const errorMessage = document.createElement("p");
            errorMessage.textContent = "خطایی در دریافت پاسخ از سرور رخ داده است.";
            errorMessage.style.color = "red";
            chatMessages.appendChild(errorMessage);
        }

        // اسکرول به پایین
        chatMessages.scrollTop = chatMessages.scrollHeight;
    });
});