60 lines
1.3 KiB
JavaScript
60 lines
1.3 KiB
JavaScript
const socket = io();
|
|
|
|
let channel = "global";
|
|
|
|
const chatBox = document.getElementById("chat-messages");
|
|
|
|
let history = {
|
|
global: [],
|
|
guild: [],
|
|
private: [],
|
|
};
|
|
|
|
function updateChat() {
|
|
chatBox.value = history[channel].join("\n");
|
|
|
|
chatBox.scrollTop = chatBox.scrollHeight;
|
|
}
|
|
|
|
document.querySelectorAll(".chat-channels button").forEach((btn) => {
|
|
btn.onclick = () => {
|
|
document
|
|
.querySelectorAll(".chat-channels button")
|
|
.forEach((b) => b.classList.remove("active"));
|
|
|
|
btn.classList.add("active");
|
|
|
|
channel = btn.dataset.channel;
|
|
|
|
// Titel ändern
|
|
if (channel === "global") chatTitle.innerText = "Globalchat";
|
|
if (channel === "guild") chatTitle.innerText = "Gildenchat";
|
|
if (channel === "private") chatTitle.innerText = "Privatchat";
|
|
|
|
updateChat();
|
|
};
|
|
});
|
|
|
|
document.getElementById("chat-send").onclick = () => {
|
|
const text = document.getElementById("chat-text").value;
|
|
|
|
if (!text) return;
|
|
|
|
socket.emit("chatMessage", {
|
|
channel: channel,
|
|
message: text,
|
|
});
|
|
|
|
document.getElementById("chat-text").value = "";
|
|
};
|
|
|
|
socket.on("chatMessage", (data) => {
|
|
const line = `${data.user}: ${data.message}`;
|
|
|
|
history[data.channel].push(line);
|
|
|
|
if (history[data.channel].length > 50) history[data.channel].shift();
|
|
|
|
if (data.channel === channel) updateChat();
|
|
});
|