diff options
Diffstat (limited to 'std/examples/chat/index.html')
-rw-r--r-- | std/examples/chat/index.html | 81 |
1 files changed, 0 insertions, 81 deletions
diff --git a/std/examples/chat/index.html b/std/examples/chat/index.html deleted file mode 100644 index 2daf288b3..000000000 --- a/std/examples/chat/index.html +++ /dev/null @@ -1,81 +0,0 @@ -<html lang="en"> - <head> - <meta charset="UTF-8" /> - <title>ws chat example</title> - </head> - <body> - <div> - <input type="text" id="input" /> - <button id="sendButton" disabled>send</button> - <button id="connectButton" disabled>connect</button> - <button id="closeButton" disabled>close</button> - </div> - <div id="status"></div> - <ul id="timeline"></ul> - <script> - let ws; - function messageDom(msg) { - const div = document.createElement("li"); - div.className = "message"; - div.innerText = msg; - return div; - } - const timeline = document.getElementById("timeline"); - const sendButton = document.getElementById("sendButton"); - sendButton.onclick = send; - const closeButton =document.getElementById("closeButton"); - closeButton.onclick=close; - const connectButton = document.getElementById("connectButton"); - connectButton.onclick=connect; - const status = document.getElementById("status"); - const input = document.getElementById("input"); - input.addEventListener("keydown", keyDownEvent); - function send() { - const msg = input.value; - ws.send(msg); - applyState({inputValue: ""}); - } - function keyDownEvent(e) { - if (e.keyCode === 13) return send(); - } - function connect() { - if (ws) ws.close(); - ws = new WebSocket(`ws://${location.host}/ws`); - ws.addEventListener("open", () => { - console.log("open", ws); - applyState({connected: true}); - }); - ws.addEventListener("message", ({data}) => { - timeline.appendChild(messageDom(data)); - }); - ws.addEventListener("close", () => { - applyState({connect: false}); - }); - } - function close() { - ws.close(); - applyState({connected: false}); - } - function applyState({connected, status, inputValue}) { - if (inputValue != null) { - input.value = inputValue; - } - if(status != null) { - status.innerText = status; - } - if (connected != null) { - if (connected) { - sendButton.disabled = false; - connectButton.disabled = true; - closeButton.disabled= false; - } else { - sendButton.disabled= true; - connectButton.disabled=false; - closeButton.disabled=true; - } - } - } - connect(); - </script> - </body> -</html> |