Increase to 8 multiplayers

This commit is contained in:
Mike Müller 2026-03-08 20:23:00 +01:00
parent 25a8826030
commit 43874d0f54
2 changed files with 40 additions and 17 deletions

View File

@ -5,7 +5,7 @@ const crypto = require("crypto");
const { WebSocketServer } = require("ws");
const PORT = Number(process.env.PORT || 8080);
const MAX_PLAYERS = 4;
const MAX_PLAYERS = 8;
const ROOT = __dirname;
const HIGHSCORE_FILE = path.join(ROOT, "highscores.json");

View File

@ -45,10 +45,14 @@ const SPAWN_POINTS = [
{ x: CONFIG.cols - 2, y: 1 },
{ x: 1, y: CONFIG.rows - 2 },
{ x: CONFIG.cols - 2, y: CONFIG.rows - 2 },
{ x: Math.floor(CONFIG.cols / 2), y: 1 },
{ x: Math.floor(CONFIG.cols / 2), y: CONFIG.rows - 2 },
{ x: 1, y: Math.floor(CONFIG.rows / 2) },
{ x: CONFIG.cols - 2, y: Math.floor(CONFIG.rows / 2) },
];
const POWERUPS = ["bomb", "flame", "speed"];
const MAX_PLAYERS = 4;
const MAX_PLAYERS = 8;
const NETWORK_PATH = "/ws";
const PLAYER_NAME_STORAGE_KEY = "gptBomberPlayerName";
const SNAPSHOT_RATE = 24;
@ -2116,43 +2120,61 @@ function drawLobby() {
const lobbyHint =
network.lobbyPhase === "game"
? "Match currently running. You will join next round."
: "Host can start with 2-4 players.";
: "Host can start with 2-8 players.";
ctx.fillText(lobbyHint, canvas.width / 2, panelY + 74);
const splitX = panelX + panelWidth / 2;
const playerListX = panelX + 34;
const highscoreX = splitX + 24;
const listStartY = panelY + 130;
const fitLine = (text, maxWidth) => {
const limit = Math.max(10, maxWidth);
let trimmed = text;
while (ctx.measureText(trimmed).width > limit && trimmed.length > 4) {
trimmed = trimmed.slice(0, -4) + "...";
}
return trimmed;
};
ctx.textAlign = "left";
ctx.font = "bold 17px Trebuchet MS";
ctx.font = "bold 15px Trebuchet MS";
ctx.fillStyle = "#ffdca3";
ctx.fillText("Lobby Players", panelX + 34, panelY + 102);
ctx.fillText("Lobby Players", playerListX, panelY + 102);
const playerMaxWidth = splitX - playerListX - 18;
for (let i = 0; i < MAX_PLAYERS; i += 1) {
const player = network.lobbyPlayers[i];
const y = panelY + 136 + i * 34;
const line = player
const y = listStartY + i * 24;
const rawLine = player
? String(i + 1) + ". " + player.name + (player.id === network.hostId ? " (Host)" : "")
: String(i + 1) + ". Waiting...";
const line = fitLine(rawLine, playerMaxWidth);
ctx.fillStyle = player ? "#e9f6ff" : "#8fb6d4";
ctx.fillText(line, panelX + 34, y);
ctx.fillText(line, playerListX, y);
}
ctx.strokeStyle = "#8acfff44";
ctx.beginPath();
ctx.moveTo(panelX + panelWidth / 2, panelY + 98);
ctx.lineTo(panelX + panelWidth / 2, panelY + 306);
ctx.moveTo(splitX, panelY + 98);
ctx.lineTo(splitX, panelY + 318);
ctx.stroke();
ctx.fillStyle = "#ffdca3";
ctx.font = "bold 17px Trebuchet MS";
ctx.fillText("Server Highscores", panelX + panelWidth / 2 + 24, panelY + 102);
ctx.fillText("Server Highscores", highscoreX, panelY + 102);
const highscoreMaxWidth = panelX + panelWidth - highscoreX - 20;
if (network.highscores.length === 0) {
ctx.fillStyle = "#8fb6d4";
ctx.font = "bold 15px Trebuchet MS";
ctx.fillText("No rounds recorded yet.", panelX + panelWidth / 2 + 24, panelY + 136);
ctx.fillText("No rounds recorded yet.", highscoreX, listStartY);
} else {
ctx.font = "bold 14px Trebuchet MS";
network.highscores.forEach((entry, index) => {
const y = panelY + 136 + index * 22;
const y = listStartY + index * 20;
const rank = String(index + 1).padStart(2, "0");
const line =
const rawLine =
rank +
". " +
entry.name +
@ -2161,18 +2183,19 @@ function drawLobby() {
" (" +
formatAliveSeconds(entry.longestAlive) +
")";
const line = fitLine(rawLine, highscoreMaxWidth);
ctx.fillStyle = "#e9f6ff";
ctx.fillText(line, panelX + panelWidth / 2 + 24, y);
ctx.fillText(line, highscoreX, y);
});
}
const items = getLobbyMenuItems();
items.forEach((item, index) => {
const y = panelY + 324 + index * 34;
const y = panelY + 326 + index * 30;
const selected = index === state.lobbyMenu.selectedIndex;
if (selected && !item.disabled) {
ctx.fillStyle = "#ffd166";
ctx.fillRect(panelX + 34, y - 21, panelWidth - 68, 28);
ctx.fillRect(panelX + 34, y - 18, panelWidth - 68, 26);
}
ctx.fillStyle = item.disabled ? "#7f9bb0" : selected ? "#1a2a3f" : "#e7f4ff";
ctx.textAlign = "center";