/*
Project: E-commerce Chatbot
Developed by: Molla Samser
Team: Rima Khatun (Designer & Tester)
Website: https://rskworld.in
Email: support@rskworld.in
Year: 2026
"Empowering E-commerce with AI"
*/

const chatTrigger = document.getElementById('chat-trigger');
const closeChat = document.getElementById('close-chat');
const chatContainer = document.getElementById('chat-container');
const sendBtn = document.getElementById('send-btn');
const voiceBtn = document.getElementById('voice-btn');
const userInput = document.getElementById('user-input');
const chatMessages = document.getElementById('chat-messages');

let chatHistory = [];

chatTrigger.onclick = () => {
    chatContainer.style.display = 'flex';
    chatTrigger.style.display = 'none';
};

closeChat.onclick = () => {
    chatContainer.style.display = 'none';
    chatTrigger.style.display = 'block';
};

sendBtn.onclick = async () => {
    const message = userInput.value.trim();
    if (!message) return;

    // Add user message to UI
    appendMessage(message, 'user');
    userInput.value = '';

    try {
        const response = await fetch('/api/chat', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ message, history: chatHistory })
        });
        const data = await response.json();

        // Add bot message to UI
        appendMessage(data.response, 'bot');

        // Update history
        chatHistory.push({ role: 'user', content: message });
        chatHistory.push({ role: 'assistant', content: data.response });

        // Auto scroll
        chatMessages.scrollTop = chatMessages.scrollHeight;
    } catch (error) {
        console.error('Error:', error);
        appendMessage("Sorry, I'm having trouble connecting to the AI brain.", 'bot');
    }
};

userInput.onkeypress = (e) => {
    if (e.key === 'Enter') sendBtn.click();
};

voiceBtn.onclick = () => {
    voiceBtn.style.color = 'red';
    appendMessage("Listening... (Voice simulation active for 2026)", 'bot');
    setTimeout(() => {
        voiceBtn.style.color = 'var(--text-muted)';
        userInput.value = "Show my loyalty points";
        sendBtn.click();
    }, 2000);
};

function appendMessage(text, sender) {
    const msgDiv = document.createElement('div');
    msgDiv.className = `message ${sender}`;
    msgDiv.innerText = text;
    chatMessages.appendChild(msgDiv);
    chatMessages.scrollTop = chatMessages.scrollHeight;
}