From a2abaadd31cf49ebfcaa161daf62f96d34e4da86 Mon Sep 17 00:00:00 2001
From: StevenRafft <steven.rafft@gmail.com>
Date: Wed, 6 Sep 2023 21:12:15 +0300
Subject: [PATCH] more modular

---
 .prettierrc                              |  4 +
 experiments/adminpanel/wwwroot/script.js | 97 +++++++++++++-----------
 2 files changed, 58 insertions(+), 43 deletions(-)
 create mode 100644 .prettierrc

diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 0000000..5a938ce
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,4 @@
+{
+  "tabWidth": 4,
+  "useTabs": false
+}
diff --git a/experiments/adminpanel/wwwroot/script.js b/experiments/adminpanel/wwwroot/script.js
index 3aea4ca..f03e908 100644
--- a/experiments/adminpanel/wwwroot/script.js
+++ b/experiments/adminpanel/wwwroot/script.js
@@ -1,62 +1,73 @@
+var socket = new WebSocket("ws://127.0.0.1:1337/"); // WebSocket server URL
+var form = document.getElementById("form");
+var input = document.getElementById("input");
 
-const socket = new WebSocket("ws://127.0.0.1:1337/"); // WebSocket server URL
+function getCurrentFormattedTime() {
+    const d = new Date();
+    const formattedTime = `[${d.getHours().toString().padStart(2, "0")}:${d
+        .getMinutes()
+        .toString()
+        .padStart(2, "0")}:${d.getSeconds().toString().padStart(2, "0")}]`;
+    return formattedTime;
+}
+
+function addNewPlayer(furA, furB, furC, furD, char, name) {
+    let li = document.createElement("li");
+    let img = document.createElement("img");
+    img.src = `https://jazzjackrabbit.net/fur/fur.php?a=${furA}&b=${furB}&c=${furC}&d=${furD}&char=${char}&frame=3`;
+    li.appendChild(img);
+    li.appendChild(document.createTextNode(name));
+    document.getElementById("player-list").appendChild(li);
+}
+
+function assemblePacket(type, content) {
+    return `${type}:${content}`;
+}
+
+function disassemblePacket(message) {
+    const type = message.slice(0, message.indexOf(":")).trim();
+    const content = message.slice(message.indexOf(":") + 1).trim();
+    
+    return [type, content];
+}
+
+function addMessage(content, includeFormattedTime) {
+    var item = document.createElement("li");
+    item.textContent = `${includeFormattedTime ? (getCurrentFormattedTime() + " ") : ""}${content}`;
+    messages.appendChild(item);
+    window.scrollTo(0, document.body.scrollHeight);
+}
 
 socket.onopen = () => {
     console.log("WebSocket connection established!");
 };
 
 socket.onmessage = (event) => {
-  const message = event.data;
-
-  const type = message.slice(0, message.indexOf(':')).trim();
-  const content = message.slice(message.indexOf(':') + 1).trim();
-
-  console.log(`Type: ${type}`);
-  console.log(`Content: ${content}`);
-  
-  if(type == "message") {
-      var item = document.createElement("li");
-      item.textContent = content;
-      messages.appendChild(item);
-      window.scrollTo(0, document.body.scrollHeight);
-  }
+    const message = event.data;
+
+    var [type, content] = disassemblePacket(message);
+
+    if (type == "message") {
+        addMessage(content, false);
+    } else {
+        console.warn(`Unknown packet with type \`${type}\` and with content \`${content}\`, full packet: \`${message}\``);
+    }
 };
 
 socket.onclose = () => {
     console.log("WebSocket connection closed!");
 };
 
-var form = document.getElementById("form");
-var input = document.getElementById("input");
-
-function getCurrentFormattedTime() {
-    const d = new Date();
-    const formattedTime = `[${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}:${d.getSeconds().toString().padStart(2, '0')}]`;
-    return formattedTime;
-}
-
-function addNewPlayer(furA, furB, furC, furD, char, name) {
-  let li = document.createElement("li");
-  let img = document.createElement("img");
-  img.src = `https://jazzjackrabbit.net/fur/fur.php?a=${furA}&b=${furB}&c=${furC}&d=${furD}&char=${char}&frame=3`;
-  li.appendChild(img);
-  li.appendChild(document.createTextNode(name));
-  document.getElementById("player-list").appendChild(li);
-}
-
-addNewPlayer(32, 48, 64, 0, "spaz", "PI");
-
-form.addEventListener("submit", function(e) {
+form.addEventListener("submit", function (e) {
     e.preventDefault();
 
     if (input.value) {
-        // prediction
-        var item = document.createElement("li");
-        item.textContent = `${getCurrentFormattedTime()} Admin: ${input.value}`;
-        messages.appendChild(item);
-        window.scrollTo(0, document.body.scrollHeight);
+        // prediction :P
+        addMessage(`Admin: ${input.value}`, true);
 
-        socket.send("message:" + input.value);
+        socket.send(assemblePacket("message", input.value));
         input.value = "";
     }
-});
\ No newline at end of file
+});
+
+addNewPlayer(32, 48, 64, 0, "spaz", "PI");