touche 0.0.15

Synchronous HTTP library
Documentation 
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

<!DOCTYPE html>
<html>
  <head>
    <script>
      document.addEventListener("DOMContentLoaded", () => {
        const socket = new WebSocket("ws://localhost:4444/ws");

        const messages = document.getElementById("messages");
        socket.addEventListener("message", function (event) {
          const data = JSON.parse(event.data);

          switch (data.type) {
            case "user": {
              const { id: userId } = data;
              messages.insertAdjacentHTML("beforeend", `<li>${userId} joined</li>`);
              break;
            }

            case "message": {
              const { userId, text } = data;
              messages.insertAdjacentHTML("beforeend", `<li>${userId}: ${text}</li>`);
              break;
            }
          }
        });

        const messageForm = document.getElementById("message-form");
        messageForm.addEventListener("submit", evt => {
          evt.preventDefault();
          socket.send(messageForm.message.value);
          messageForm.message.value = "";
        });
      });
    </script>
  </head>

  <body>
    <form id="message-form">
      <input type="text" name="message">
      <button type="submit">Send</button>
    </form>

    <ul id="messages"></ul>
  </body>
</html>