|
6 | 6 | function dial() { |
7 | 7 | const conn = new WebSocket(`ws://${location.host}/subscribe`) |
8 | 8 |
|
9 | | - conn.addEventListener("close", ev => { |
| 9 | + conn.addEventListener('close', ev => { |
10 | 10 | appendLog(`WebSocket Disconnected code: ${ev.code}, reason: ${ev.reason}`, true) |
11 | 11 | if (ev.code !== 1001) { |
12 | | - appendLog("Reconnecting in 1s", true) |
| 12 | + appendLog('Reconnecting in 1s', true) |
13 | 13 | setTimeout(dial, 1000) |
14 | 14 | } |
15 | 15 | }) |
16 | | - conn.addEventListener("open", ev => { |
17 | | - console.info("websocket connected") |
| 16 | + conn.addEventListener('open', ev => { |
| 17 | + console.info('websocket connected') |
18 | 18 | }) |
19 | 19 |
|
20 | 20 | // This is where we handle messages received. |
21 | | - conn.addEventListener("message", ev => { |
22 | | - if (typeof ev.data !== "string") { |
23 | | - console.error("unexpected message type", typeof ev.data) |
| 21 | + conn.addEventListener('message', ev => { |
| 22 | + if (typeof ev.data !== 'string') { |
| 23 | + console.error('unexpected message type', typeof ev.data) |
24 | 24 | return |
25 | 25 | } |
26 | 26 | const p = appendLog(ev.data) |
|
32 | 32 | } |
33 | 33 | dial() |
34 | 34 |
|
35 | | - const messageLog = document.getElementById("message-log") |
36 | | - const publishForm = document.getElementById("publish-form") |
37 | | - const messageInput = document.getElementById("message-input") |
| 35 | + const messageLog = document.getElementById('message-log') |
| 36 | + const publishForm = document.getElementById('publish-form') |
| 37 | + const messageInput = document.getElementById('message-input') |
38 | 38 |
|
39 | 39 | // appendLog appends the passed text to messageLog. |
40 | 40 | function appendLog(text, error) { |
41 | | - const p = document.createElement("p") |
| 41 | + const p = document.createElement('p') |
42 | 42 | // Adding a timestamp to each message makes the log easier to read. |
43 | 43 | p.innerText = `${new Date().toLocaleTimeString()}: ${text}` |
44 | 44 | if (error) { |
45 | | - p.style.color = "red" |
46 | | - p.style.fontStyle = "bold" |
| 45 | + p.style.color = 'red' |
| 46 | + p.style.fontStyle = 'bold' |
47 | 47 | } |
48 | 48 | messageLog.append(p) |
49 | 49 | return p |
50 | 50 | } |
51 | | - appendLog("Submit a message to get started!") |
| 51 | + appendLog('Submit a message to get started!') |
52 | 52 |
|
53 | 53 | // onsubmit publishes the message from the user when the form is submitted. |
54 | 54 | publishForm.onsubmit = async ev => { |
55 | 55 | ev.preventDefault() |
56 | 56 |
|
57 | 57 | const msg = messageInput.value |
58 | | - if (msg === "") { |
| 58 | + if (msg === '') { |
59 | 59 | return |
60 | 60 | } |
61 | | - messageInput.value = "" |
| 61 | + messageInput.value = '' |
62 | 62 |
|
63 | 63 | expectingMessage = true |
64 | 64 | try { |
65 | | - const resp = await fetch("/publish", { |
66 | | - method: "POST", |
| 65 | + const resp = await fetch('/publish', { |
| 66 | + method: 'POST', |
67 | 67 | body: msg, |
68 | 68 | }) |
69 | 69 | if (resp.status !== 202) { |
|
0 commit comments