annotate mrjunejune/src/talk/index.html @ 137:095f7dc5bfce

[MrJuneJune] Fix the js file to hit correct endpoints.
author June Park <parkjune1995@gmail.com>
date Fri, 09 Jan 2026 11:33:35 -0800
parents 75c144fd6964
children 1f023b8bf9c3
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>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
8 body { font-family: sans-serif; padding: 20px; }
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
9 #messages { height: 200px; border: 1px solid #ccc; overflow-y: scroll; margin-bottom: 10px; padding: 10px; }
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}}
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
16 <h1>Talks</h1>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
17
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
18 <div id="messages"></div>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
19
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
20 <div id="chat">
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
21 <input type="text" id="messageInput" placeholder="Type a message...">
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
22 <button id="sendBtn">Send</button>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
23 </div>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
24 {{/parts/footer.html}}
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
25 <script>
136
75c144fd6964 [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 125
diff changeset
26 const host = window.location.hostname;
75c144fd6964 [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 125
diff changeset
27 const port = '6969';
137
095f7dc5bfce [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 136
diff changeset
28 const url = host === "mrjunejune.com" ? `wss://${host}/echo` : `ws://${host}:${port}/echo`;
136
75c144fd6964 [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 125
diff changeset
29 const ws = new WebSocket(`ws://${host}:${port}/echo`);
125
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
30 const messagesDiv = document.getElementById('messages');
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
31
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
32 ws.onopen = () => {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
33 console.log('Connected!');
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
34 appendMessage('System: Connected to server');
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
35 };
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
36
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
37 ws.onmessage = (event) => {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
38 console.log('Received:', event.data);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
39 appendMessage('Server: ' + event.data);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
40 };
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 // Function to send message
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
43 sendBtn.onclick = () => {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
44 const message = messageInput.value;
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
45 if (message) {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
46 ws.send(message);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
47 appendMessage('You: ' + message);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
48 messageInput.value = ''; // Clear input
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
49 }
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
50 };
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
51
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
52 // Helper to show messages on screen
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
53 function appendMessage(text) {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
54 const msg = document.createElement('p');
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
55 msg.textContent = text;
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
56 messagesDiv.appendChild(msg);
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
57 messagesDiv.scrollTop = messagesDiv.scrollHeight;
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
58 }
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
59
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
60 messageInput.addEventListener('keydown', (event) => {
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
61 if (event.key === 'Enter' && !event.shiftKey)
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
62 {
136
75c144fd6964 [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 125
diff changeset
63 event.preventDefault();
75c144fd6964 [MrJuneJune] Fix the js file to hit correct endpoints.
June Park <parkjune1995@gmail.com>
parents: 125
diff changeset
64 sendBtn.click();
125
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 });
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
67 </script>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
68 </body>
f236c895604e [MrJuneJune] Added web socket for chat to this.
June Park <parkjune1995@gmail.com>
parents:
diff changeset
69 </html>