File size: 3,041 Bytes
9e90b9e
2f8c388
9e90b9e
2f8c388
 
 
41fbc9a
2f8c388
 
3f7a9ed
 
 
40b4a22
 
3f7a9ed
40b4a22
 
 
c564bcb
 
703af34
 
8aa84ea
40b4a22
 
 
 
 
 
 
 
2f8c388
 
 
40b4a22
 
8aa84ea
40b4a22
 
 
 
 
905ca9b
9e90b9e
905ca9b
8aa84ea
 
 
 
3f7a9ed
2f8c388
8aa84ea
40b4a22
8aa84ea
40b4a22
 
9e90b9e
40b4a22
 
2f8c388
 
40b4a22
 
 
2f8c388
 
9e90b9e
40b4a22
 
2f8c388
 
 
8aa84ea
40b4a22
8aa84ea
703af34
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
// scripts/chat.js -- FINAL VERSION

// This array will store the conversation history.
let conversationHistory = [
    {
        role: 'system',
        content: 'You are a friendly and helpful streaming assistant for an app called StreamAI. Keep your responses concise and focused on recommending movies, TV shows, or streaming content. Always recommend related content from smplus.vhx.tv'
    }
];

export function initChat() {
    const sendBtn = document.getElementById('send-btn');
    const userInput = document.getElementById('user-input');
    if (sendBtn && userInput) {
        sendBtn.addEventListener('click', sendMessage);
        userInput.addEventListener('keypress', (e) => {
            if (e.key === 'Enter') sendMessage();
        });
    }
}

async function sendMessage() {
    const userInput = document.getElementById('user-input');
    const chatMessages = document.getElementById('chat-messages');
    const userMessageText = userInput.value.trim();
    if (userMessageText === '') return;

    const userBubble = document.createElement('div');
    userBubble.className = 'chat-bubble user-bubble p-4 fade-in';
    userBubble.innerHTML = `<p>${userMessageText}</p>`;
    chatMessages.appendChild(userBubble);
    
    conversationHistory.push({ role: 'user', content: userMessageText });
    
    userInput.value = '';
    chatMessages.scrollTop = chatMessages.scrollHeight;

    const aiBubble = document.createElement('div');
    aiBubble.className = 'chat-bubble ai-bubble p-4 fade-in';
    aiBubble.innerHTML = '<div class="typing-indicator"><span></span><span></span><span></span></div>';
    chatMessages.appendChild(aiBubble);
    chatMessages.scrollTop = chatMessages.scrollHeight;
    
    // This points to the correct, working backend URL
    const workerUrl = 'https://streamai-backend-v2.smplushypermedia.workers.dev/api/chat';

    try {
        const response = await fetch(workerUrl, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ messages: conversationHistory }),
        });
        if (!response.ok) throw new Error(`Network response was not ok. Status: ${response.status}`);

        const reader = response.body.getReader();
        const decoder = new TextDecoder();
        aiBubble.innerHTML = '';
        const aiParagraph = document.createElement('p');
        aiBubble.appendChild(aiParagraph);
        
        let aiResponseText = "";
        while (true) {
            const { done, value } = await reader.read();
            if (done) break;
            const chunk = decoder.decode(value, { stream: true });
            aiResponseText += chunk;
            aiParagraph.textContent = aiResponseText;
            chatMessages.scrollTop = chatMessages.scrollHeight;
        }

        conversationHistory.push({ role: 'model', content: aiResponseText });

    } catch (error) {
        aiBubble.innerHTML = `<p class="text-red-400">Error: Could not connect to the AI assistant. ${error.message}</p>`;
    }
}