Added shift+enter for newline and enter for send message

This commit is contained in:
Henry Hiles 2022-02-08 11:35:16 -05:00
parent cf06a9889b
commit 9a221a1427
2 changed files with 16 additions and 11 deletions

View file

@ -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 { message, isYours, isSystem, user } = messageObject
const addMessage = ({ message, isYours, isSystem, user }) => {
const messageDiv = document
.querySelector("template")
.content.cloneNode(true)
@ -90,14 +103,7 @@ if (nameButton)
}
})
if (messageButton)
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 = ""
})
if (messageButton) messageButton.addEventListener("click", submitMessage)
socket.on("chat-message", (message, user) => {
addMessage({ message, user })

View file

@ -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;
}