Added shift+enter for newline and enter for send message

public/script.js

@@ -20,11 +20,24 @@ setInterval(
     45000
 )
 
+const submitMessage = () => {
+    if (!messageInput.value) return (messageInput.required = true)
+    messageInput.required = false
+    socket.emit("send-chat-message", roomName, messageInput.value)
+    addMessage({ user: "you", message: messageInput.value, isYours: true })
+    messageInput.value = ""
+}
+
+messageInput.addEventListener("keydown", (event) => {
+    if (event.shiftKey || event.key != "Enter") return
+    event.preventDefault()
+    submitMessage()
+})
+
 const toggleOpen = () =>
     document.querySelector("#rooms").classList.toggle("opened")
 
-const addMessage = (messageObject) => {
+const addMessage = ({ message, isYours, isSystem, user }) => {
-    const { message, isYours, isSystem, user } = messageObject
     const messageDiv = document
         .querySelector("template")
         .content.cloneNode(true)
@@ -90,14 +103,7 @@ if (nameButton)
         }
     })
 
-if (messageButton)
+if (messageButton) messageButton.addEventListener("click", submitMessage)
-    messageButton.addEventListener("click", () => {
-        if (!messageInput.value) return (messageInput.required = true)
-        messageInput.required = false
-        socket.emit("send-chat-message", roomName, messageInput.value)
-        addMessage({ user: "you", message: messageInput.value, isYours: true })
-        messageInput.value = ""
-    })
 
 socket.on("chat-message", (message, user) => {
     addMessage({ message, user })

public/style.css

@@ -307,7 +307,6 @@ button:is(:disabled, :hover) {
 
 :is(input[type="text"], textarea):required {
     animation: shake 0.2s ease-in-out 0s 2;
-    color: #ff0000;
     border-color: red !important;
 }