Restructure folders (#411)

2025-06-27 01:27:43 +02:00 · 2021-02-25 21:57:58 -03:00
parent 9db98162b2
commit c3407627d0
334 changed files with 127 additions and 120 deletions
--- a/websockets/chat/static/websocket.html
+++ b/websockets/chat/static/websocket.html
@ -0,0 +1,112 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Chat!</title>
+
+    <meta charset="utf-8" />
+
+    <script>
+      'use strict'
+
+      window.onload = () => {
+        let conn = null
+
+        const log = (msg) => {
+          div_log.innerHTML += msg + '<br>'
+          div_log.scroll(0, div_log.scrollTop + 1000)
+        }
+
+        const connect = () => {
+          disconnect()
+
+          const wsUri =
+            (window.location.protocol === 'https:' ? 'wss://' : 'ws://') +
+            window.location.host +
+            '/ws/'
+
+          conn = new WebSocket(wsUri)
+          log('Connecting...')
+
+          conn.onopen = function () {
+            log('Connected.')
+            update_ui()
+          }
+
+          conn.onmessage = function (e) {
+            log('Received: ' + e.data)
+          }
+
+          conn.onclose = function () {
+            log('Disconnected.')
+            conn = null
+
+            update_ui()
+          }
+        }
+
+        const disconnect = () => {
+          if (conn) {
+            log('Disconnecting...')
+            conn.close()
+            conn = null
+
+            update_ui()
+          }
+        }
+
+        const update_ui = () => {
+          if (!conn) {
+            span_status.textContent = 'disconnected'
+            btn_connect.textContent = 'Connect'
+          } else {
+            span_status.textContent = `connected (${conn.protocol})`
+            btn_connect.textContent = 'Disconnect'
+          }
+        }
+
+        btn_connect.onclick = () => {
+          if (!conn) {
+            connect()
+          } else {
+            disconnect()
+          }
+
+          update_ui()
+        }
+
+        btn_send.onclick = () => {
+          if (!conn) return
+
+          const text = input_text.value
+          log('Sending: ' + text)
+          conn.send(text)
+
+          input_text.value = ''
+          input_text.focus()
+        }
+
+        input_text.onkeyup = (e) => {
+          if (e.key === 'Enter') {
+            btn_send.click()
+          }
+        }
+      }
+    </script>
+  </head>
+
+  <body>
+    <h3>Chat!</h3>
+    <div>
+      <button id="btn_connect">Connect</button>
+      Status: <span id="span_status">disconnected</span>
+    </div>
+
+    <div
+      id="div_log"
+      style="width: 20em; height: 15em; overflow: auto; border: 1px solid black"
+    ></div>
+
+    <input id="input_text" type="text" />
+    <input id="btn_send" type="button" value="Send" />
+  </body>
+</html>