Chore : move files out of directory

2026-09-26 21:41:08 +00:00 · 2024-09-18 08:54:54 +00:00
parent f282f6cc97
commit f47127cd1d
28 changed files with 0 additions and 0 deletions
@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>docker-example</title>
+    <style>
+        #messages {
+            display: flex;
+            flex-direction: column;
+        }
+    </style>
+</head>
+
+<body>
+    <span>Username: </span><input type="text" value="User1" id="author">
+    <span>Message: </span><input type="text" value="hello-world" id="message">
+    <button id="send" onclick="sendMessage(usernameDiv.value, messageDiv.value)">SEND</button>
+    <div id="messages"></div>
+
+    <script>
+        const usernameDiv = document.getElementById("author")
+        const messageDiv = document.getElementById("message")
+
+        function printMessage({ author, message }) {
+            const span = document.createElement("span")
+
+            const authorSpan = document.createElement("span")
+            authorSpan.innerText = author
+
+            const messageSpan = document.createElement("span")
+            messageSpan.innerText = message
+
+            span.appendChild(authorSpan)
+            span.innerHTML += " : "
+            span.appendChild(messageSpan)
+            return span
+        }
+
+        async function fetchAPI() {
+            const test = await fetch("http://localhost/api")
+            return await test.json()
+        }
+
+        async function refreshMessages() {
+            const messages = await fetchAPI()
+            const div = document.getElementById("messages")
+            div.innerHTML = ""
+            messages.forEach(element => {
+                const msg = JSON.parse(element)
+                div.appendChild(printMessage(msg))
+            });
+        }
+
+        async function sendMessage(author, message) {
+            await fetch("http://localhost/api", {
+                method: "POST",
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({ author, message })
+            })
+        }
+
+        refreshMessages()
+    </script>
+</body>
+
+</html>