bitcoinsingularity-website/test-chat.html at master · BTCBoyd/bitcoinsingularity-website · GitHub

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
<!DOCTYPE html>
<html>
<head>
    <title>Simple Chat Test</title>
    <style>
        body { font-family: sans-serif; max-width: 600px; margin: 50px auto; padding: 20px; }
        #messages { border: 1px solid #ccc; padding: 20px; min-height: 300px; margin-bottom: 20px; }
        input { width: 70%; padding: 10px; }
        button { padding: 10px 20px; }
        .user { color: blue; margin: 10px 0; }
        .assistant { color: green; margin: 10px 0; }
        .error { color: red; margin: 10px 0; }
    </style>
<!-- Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-E7QS7E2R8Y"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag("js", new Date());
        gtag("config", "G-E7QS7E2R8Y");
    </script>
</head>
<body>
    <h1>Simple Chat Test (No Auth/Session)</h1>
    <div id="messages"></div>
    <input type="text" id="input" placeholder="Type a message...">
    <button onclick="sendMessage()">Send</button>
    <p><small>Testing: /.netlify/functions/chat-simple-test</small></p>

    <script>
        async function sendMessage() {
            const input = document.getElementById('input');
            const messages = document.getElementById('messages');
            const message = input.value.trim();

            if (!message) return;

            // Display user message
            messages.innerHTML += `<div class="user"><strong>You:</strong> ${message}</div>`;
            input.value = '';

            try {
                const response = await fetch('/.netlify/functions/chat-simple-test', {
                    method: 'POST',
                    headers: { 'Content-Type': 'application/json' },
                    body: JSON.stringify({ message })
                });

                const data = await response.json();

                if (!response.ok) {
                    throw new Error(data.error || 'Request failed');
                }

                // Display assistant response
                const reply = data.full || data.reply || 'No response';
                messages.innerHTML += `<div class="assistant"><strong>Maxi:</strong> ${reply}</div>`;

            } catch (error) {
                messages.innerHTML += `<div class="error"><strong>Error:</strong> ${error.message}</div>`;
            }
        }

        document.getElementById('input').addEventListener('keypress', (e) => {
            if (e.key === 'Enter') sendMessage();
        });
    </script>
</body>
</html>