srztjrtz

public/css/launcher.css

@@ -246,45 +246,6 @@ body {
   color: #7ec8ff;
 }
 
-/* ── Online-User-Liste ──────────────────────────── */
-
-#online-users {
-  position: fixed;
-  left: 20px;
-  bottom: 340px;
-  width: 350px;
-  background: linear-gradient(#2b2115, #1a140d);
-  border: 3px solid #8b6a3c;
-  color: #f3e6c5;
-  font-family: serif;
-  overflow-y: auto;
-}
-
-.online-header {
-  background: #3a2a17;
-  padding: 5px;
-  text-align: center;
-  border-bottom: 2px solid #8b6a3c;
-}
-
-#online-list div {
-  padding: 4px;
-  cursor: pointer;
-}
-
-#online-list div:hover {
-  background: #5b4325;
-}
-
-.online-dot {
-  display: inline-block;
-  width: 8px;
-  height: 8px;
-  background: #3cff3c;
-  border-radius: 50%;
-  margin-right: 6px;
-  box-shadow: 0 0 6px #3cff3c;
-}
 
 /* ── Music Control ──────────────────────────────── */
 

sockets/chat.js

@@ -1,89 +1,88 @@
-/* ============================================================
+const socket = io();
-   sockets/chat.js
+window._socket = socket; // Globale Referenz für arena.js und andere Module
-   Alle Socket-Events rund um Chat, Whisper & Online-Status
+const username =
-============================================================ */
+  typeof window.playerName === "object"
+    ? window.playerName.name
+    : window.playerName;
 
-const db = require("../database/database");
+socket.emit("register", username);
+const chatTitle = document.getElementById("chat-title");
 
-const onlineUsers = {}; // ingameName → socketId
+let channel = "global";
 
-function registerChatHandlers(io, socket) {
+const chatBox = document.getElementById("chat-messages");
 
-  /* ── Registrierung ── */
+let history = {
-  socket.on("register", async (username) => {
+  global: [],
-    const [rows] = await db.query(
+  guild: [],
-      "SELECT ingame_name FROM accounts WHERE username = ?",
+  private: [],
-      [username],
+};
-    );
 
-    if (!rows.length) return;
+function updateChat() {
+  chatBox.value = history[channel].join("\n");
 
-    const ingameName = rows[0].ingame_name;
+  chatBox.scrollTop = chatBox.scrollHeight;
-    socket.user = ingameName;
-    onlineUsers[ingameName] = socket.id;
-    io.emit("onlineUsers", Object.keys(onlineUsers));
-  });
-
-  /* ── Chat-Nachrichten ── */
-  socket.on("chatMessage", (data) => {
-    if (data.channel === "global") {
-      io.emit("chatMessage", {
-        user:    socket.user,
-        message: data.message,
-        channel: "global",
-      });
 }
 
-    if (data.channel === "guild") {
+document.querySelectorAll(".chat-channels button").forEach((btn) => {
-      io.to("guild_" + data.guild).emit("chatMessage", {
+  btn.onclick = () => {
-        user:    socket.user,
+    document
-        message: data.message,
+      .querySelectorAll(".chat-channels button")
-        channel: "guild",
+      .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();
+  };
 });
 
-  /* ── Flüstern ── */
+document.getElementById("chat-send").onclick = () => {
-  socket.on("whisper", (data) => {
+  const text = document.getElementById("chat-text").value;
-    const targetSocket = onlineUsers[data.to];
 
-    if (!targetSocket) {
+  if (!text) return;
-      socket.emit("systemMessage", { message: data.to + " ist offline" });
-      return;
-    }
 
-    io.to(targetSocket).emit("chatMessage", {
+  if (text.startsWith("/w ")) {
-      user:    socket.user,
+    const parts = text.split(" ");
-      message: data.message,
+
-      channel: "private",
+    const target = parts[1];
+
+    const message = parts.slice(2).join(" ");
+
+    socket.emit("whisper", {
+      to: target,
+      message: message,
     });
-
+  } else {
     socket.emit("chatMessage", {
-      user:    "(an " + data.to + ")",
+      channel: channel,
-      message: data.message,
+      message: text,
-      channel: "private",
-    });
-  });
-
-  /* ── Private Nachricht ── */
-  socket.on("privateMessage", (data) => {
-    const target = onlineUsers[data.to];
-    if (target) {
-      io.to(target).emit("chatMessage", {
-        user:    socket.user,
-        message: data.message,
-        channel: "private",
-      });
-    }
-  });
-
-  /* ── Disconnect: aus Online-Liste entfernen ── */
-  socket.on("disconnect", () => {
-    if (socket.user) {
-      delete onlineUsers[socket.user];
-      io.emit("onlineUsers", Object.keys(onlineUsers));
-    }
     });
   }
 
-module.exports = { registerChatHandlers };
+  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();
+});
+
+socket.on("systemMessage", (data) => {
+  const line = "[System] " + data.message;
+
+  history[channel].push(line);
+
+  updateChat();
+});

sockets/sockets_chat.js

@@ -0,0 +1,87 @@
+/* ============================================================
+   sockets/chat.js
+   Alle Socket-Events rund um Chat, Whisper & Online-Status
+============================================================ */
+
+const db = require("../database/database");
+
+const onlineUsers = {}; // ingameName → socketId (wird für Whisper benötigt)
+
+function registerChatHandlers(io, socket) {
+
+  /* ── Registrierung ── */
+  socket.on("register", async (username) => {
+    const [rows] = await db.query(
+      "SELECT ingame_name FROM accounts WHERE username = ?",
+      [username],
+    );
+
+    if (!rows.length) return;
+
+    const ingameName = rows[0].ingame_name;
+    socket.user = ingameName;
+    onlineUsers[ingameName] = socket.id;
+  });
+
+  /* ── Chat-Nachrichten ── */
+  socket.on("chatMessage", (data) => {
+    if (data.channel === "global") {
+      io.emit("chatMessage", {
+        user:    socket.user,
+        message: data.message,
+        channel: "global",
+      });
+    }
+
+    if (data.channel === "guild") {
+      io.to("guild_" + data.guild).emit("chatMessage", {
+        user:    socket.user,
+        message: data.message,
+        channel: "guild",
+      });
+    }
+  });
+
+  /* ── Flüstern ── */
+  socket.on("whisper", (data) => {
+    const targetSocket = onlineUsers[data.to];
+
+    if (!targetSocket) {
+      socket.emit("systemMessage", { message: data.to + " ist offline" });
+      return;
+    }
+
+    io.to(targetSocket).emit("chatMessage", {
+      user:    socket.user,
+      message: data.message,
+      channel: "private",
+    });
+
+    socket.emit("chatMessage", {
+      user:    "(an " + data.to + ")",
+      message: data.message,
+      channel: "private",
+    });
+  });
+
+  /* ── Private Nachricht ── */
+  socket.on("privateMessage", (data) => {
+    const target = onlineUsers[data.to];
+    if (target) {
+      io.to(target).emit("chatMessage", {
+        user:    socket.user,
+        message: data.message,
+        channel: "private",
+      });
+    }
+  });
+
+  /* ── Disconnect ── */
+  socket.on("disconnect", () => {
+    if (socket.user) {
+      delete onlineUsers[socket.user];
+    }
+  });
+}
+
+module.exports = { registerChatHandlers };

views/launcher.ejs

@@ -605,12 +605,6 @@
       </div>
     </div>
 
-    <div id="online-users">
-      <div class="online-header">Spieler Online</div>
-
-      <div id="online-list"></div>
-    </div>
-
     <div id="game-chat">
       <div class="chat-header" id="chat-title">Globalchat</div>