Update index.html

2025-06-16 12:47:46 +02:00 · 2025-06-16 12:47:46 +02:00 · 80d3c3c5e6
parent d46408294c
commit 80d3c3c5e6
1 changed files with 38 additions and 32 deletions
--- a/index.html
+++ b/index.html
@ -1,34 +1,40 @@
 <!DOCTYPE html>
-<html>
-<html lang="en"></html>
-    <head>
+<html lang="it">
+<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>Messaggi</title>
-    </head>
-    <body>
-        <h1>Progetto messaggi</h1>
-        <form action="" onsubmit="sendMessage(event)">
-            <input type="text" id="messageText" autocomplete="off"/>
-            <button>Invia</button>
-        </form>
-        <ul id='messages'>
-        </ul>
+    <title>Progetto messaggi</title>
+</head>
+<body>
+    <h1>Messaggi</h1>
+    <input type="text" id="txt_messaggi" placeholder="Scrivi un messaggio...">
+    <button onclick="inviaMessaggio()">Invia</button>
+    <div id="messages"></div>
+
    <script>
-            var ws = new WebSocket("ws://localhost:8000/ws");
-            ws.onmessage = function(event) {
-                var messages = document.getElementById('messages')
-                var message = document.createElement('li')
-                var content = document.createTextNode(event.data)
-                message.appendChild(content)
-                messages.appendChild(message)
-            };
-            function sendMessage(event) {
-                var input = document.getElementById("messageText")
-                ws.send(input.value)
-                input.value = ''
-                event.preventDefault()
+
+        const socket = new WebSocket("ws://localhost:8000/ws");
+
+        function inviaMessaggio() {
+            const message = document.getElementById("txt_messaggi").value;
+            socket.send(message);
+            document.getElementById("txt_messaggi").value = '';
        }
+
+        socket.onmessage = function(event) {
+            const messagesDiv = document.getElementById("messages");
+            const messageElement = document.createElement("div");
+            messageElement.textContent = event.data;
+            messagesDiv.appendChild(messageElement);
+        };
+
+        socket.onerror = function(event) {
+            console.error("Errore WebSocket:", event);
+        };
+
+        socket.onclose = function(event) {
+            console.log("Connessione WebSocket chiusa", event);
+        };
    </script>
-    </body>
+</body>
 </html>