chat!

1 files changed, 41 insertions, 0 deletions

diff --git a/client-web/source/chat.ts b/client-web/source/chat.ts
new file mode 100644
index 0000000..d1165ee
--- /dev/null
+++ b/client-web/source/chat.ts
@@ -0,0 +1,41 @@
+import { ediv, espan } from "./helper.ts";
+import { CHAT } from "./index.ts";
+import { Room } from "./room.ts";
+import { User } from "./user/mod.ts";
+
+export class Chat {
+    private _shown = false;
+
+    messages = ediv({ class: "messages" })
+    controls = ediv({ class: "controls" })
+
+    get shown() { return this._shown }
+    set shown(value: boolean) {
+        if (value && !this._shown) document.body.prepend(CHAT)
+        if (!value && this._shown) document.body.removeChild(CHAT)
+        this._shown = value
+    }
+
+    constructor(public room: Room) {
+        const send = document.createElement("input")
+        send.type = "text"
+        send.onkeydown = (ev) => {
+            if (ev.code == "Enter") {
+                room.local_user.chat(send.value)
+                this.send_message(room.local_user, send.value)
+                send.value = ""
+            }
+        }
+        this.controls.append(send)
+        this.messages.append(document.createElement("hr"))
+        CHAT.append(this.messages, this.controls)
+    }
+
+    send_message(sender: User, message: string) {
+        this.messages.append(ediv({ class: "message" },
+            espan(sender.display_name, { class: "author" }),
+            ": ",
+            espan(message, { class: "content" })
+        ))
+    }
+}