Mercurial

annotate mrjunejune/src/talk/index.html @ 271:13d61401c57d

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
redirect Copilot cache to service state Set XDG_CACHE_HOME from the configured inference state so the systemd service can extract Copilot outside its protected home directory. Co-authored-by: Copilot <[email protected]>
author MrJuneJune <me@mrjunejune.com>
date Fri, 07 Aug 2026 13:24:05 -0700
parents 60a876c4587a
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
125
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
1 <!DOCTYPE html>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
2 <html lang="en">
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
3 <head>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
4 <meta charset="UTF-8">
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
5 <title>Talk!</title>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
6 {{/parts/base_head.html}}
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
7 <style>
258
60a876c4587a [ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents: 145
diff changeset
8 body { font-family: sans-serif; padding: var(--zenbu-sys-padding-lg); }
60a876c4587a [ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents: 145
diff changeset
9 #messages { height: 200px; border: 1px solid #ccc; overflow-y: scroll; margin-bottom: var(--zenbu-sys-space-control); padding: var(--zenbu-sys-padding-md); }
125
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
10 #chat { display: flex; gap: 10px; }
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
11 input { flex-grow: 1; }
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
12 </style>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
13 </head>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
14 <body>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
15 {{/parts/header.html}}
145
c1eab8c0b0f9 [MrJuneJune] Small improvement UX and tests passes now.
June Park <parkjune1995@gmail.com>
parents: 143
diff changeset
16 <main>
c1eab8c0b0f9 [MrJuneJune] Small improvement UX and tests passes now.
June Park <parkjune1995@gmail.com>
parents: 143
diff changeset
17 <h1>Talk with strangers xDDD</h1>
125
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
18
145
c1eab8c0b0f9 [MrJuneJune] Small improvement UX and tests passes now.
June Park <parkjune1995@gmail.com>
parents: 143
diff changeset
19 <div id="messages"></div>
125
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
20
145
c1eab8c0b0f9 [MrJuneJune] Small improvement UX and tests passes now.
June Park <parkjune1995@gmail.com>
parents: 143
diff changeset
21 <div id="chat">
258
60a876c4587a [ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents: 145
diff changeset
22 <zen-input appearance="plain" size="md">
60a876c4587a [ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents: 145
diff changeset
23 <input type="text" id="messageInput" placeholder="Type a message...">
60a876c4587a [ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents: 145
diff changeset
24 </zen-input>
60a876c4587a [ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents: 145
diff changeset
25 <zen-button appearance="plain" size="md">
60a876c4587a [ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents: 145
diff changeset
26 <button id="sendBtn">Send</button>
60a876c4587a [ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents: 145
diff changeset
27 </zen-button>
145
c1eab8c0b0f9 [MrJuneJune] Small improvement UX and tests passes now.
June Park <parkjune1995@gmail.com>
parents: 143
diff changeset
28 </div>
c1eab8c0b0f9 [MrJuneJune] Small improvement UX and tests passes now.
June Park <parkjune1995@gmail.com>
parents: 143
diff changeset
29 </main>
125
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
30 {{/parts/footer.html}}
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
31 <script>
136
75c144fd6964 [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 125
diff changeset
32 const host = window.location.hostname;
75c144fd6964 [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 125
diff changeset
33 const port = '6969';
143
276bb3555034 Should work now.
June Park <parkjune1995@gmail.com>
parents: 139
diff changeset
34 const url = host === "mrjunejune.com" ? `wss://${host}/echo` : `ws://${host}:${port}/echo`;
138
June Park <parkjune1995@gmail.com>
parents: 137
diff changeset
35 const ws = new WebSocket(url);
125
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
36 const messagesDiv = document.getElementById('messages');
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
37
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
38 ws.onopen = () => {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
39 console.log('Connected!');
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
40 appendMessage('System: Connected to server');
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
41 };
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
42
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
43 ws.onmessage = (event) => {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
44 console.log('Received:', event.data);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
45 appendMessage('Server: ' + event.data);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
46 };
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
47
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
48 // Function to send message
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
49 sendBtn.onclick = () => {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
50 const message = messageInput.value;
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
51 if (message) {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
52 ws.send(message);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
53 appendMessage('You: ' + message);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
54 messageInput.value = ''; // Clear input
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
55 }
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
56 };
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
57
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
58 // Helper to show messages on screen
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
59 function appendMessage(text) {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
60 const msg = document.createElement('p');
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
61 msg.textContent = text;
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
62 messagesDiv.appendChild(msg);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
63 messagesDiv.scrollTop = messagesDiv.scrollHeight;
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
64 }
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
65
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
66 messageInput.addEventListener('keydown', (event) => {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
67 if (event.key === 'Enter' && !event.shiftKey)
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
68 {
136
75c144fd6964 [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 125
diff changeset
69 event.preventDefault();
75c144fd6964 [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 125
diff changeset
70 sendBtn.click();
125
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
71 }
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
72 });
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
73 </script>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
74 </body>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
75 </html>