jozamudi/battle-royal-tetris
1
0
Fork 0
Code Issues Pull Requests Activity

Show garbage received on player elimination

Browse Source 
- Add garbageReceived array to player objects
- Track garbage in addGarbageToPlayer() with sender name
- Include garbageReceived in getStates() output
- Update endGame() to pass garbage stats to UI
- Update showGameOver() to display garbage count per player
- Add CSS styling for eliminated players and garbage column
- Bump CSS version for cache refresh

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Josue Zamudio
2026-03-21 02:44:39 +00:00
parent a1cbd27a71
commit e3f594e44e
5 changed files with 29 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/css/style.css
+10
View File
@@ -397,6 +397,16 @@ button:active {
color: #0f0;
}
#final-scores .score-item.eliminated {
border-color: #f00;
opacity: 0.7;
}
#final-scores .score-item span:last-child {
color: #888;
font-size: 0.7rem;
}
/* Game Over Overlay */
#gameover-screen {
position: fixed;
public/index.html
+1 -1
View File
@@ -7,7 +7,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/style.css?v=10">
<link rel="stylesheet" href="css/style.css?v=11">
</head>
<body>
<div id="app">
public/js/app.js
+6 -2
View File
@@ -214,11 +214,15 @@ function endGame(states) {
winner = winnerPlayer.name;
}
// Build scores list
// Build scores list with garbage info
Object.values(states).forEach(state => {
const player = network.getPlayer(state.playerId);
if (player) {
scores[player.name] = state.score;
scores[player.name] = {
score: state.score,
garbageReceived: (state.garbageReceived || []).length,
eliminated: state.eliminated
};
}
});
public/js/ui.js
+4 -2
View File
@@ -140,12 +140,14 @@ class UIManager {
this.displays.winnerDisplay.style.color = winner ? '#0f0' : '#fff';
this.displays.finalScores.innerHTML = '';
Object.entries(scores).forEach(([name, score], index) => {
Object.entries(scores).forEach(([name, data], index) => {
const item = document.createElement('div');
item.className = 'score-item' + (index === 0 ? ' winner' : '');
if (data.eliminated) item.classList.add('eliminated');
item.innerHTML = `
<span>${this.escapeHtml(name)}</span>
<span>${score}</span>
<span>Score: ${data.score}</span>
<span class="garbage">Garbage: ${data.garbageReceived}</span>
`;
this.displays.finalScores.appendChild(item);
});
server/index.js
+8 -2
View File
@@ -115,7 +115,8 @@ io.on('connection', (socket) => {
eliminated: false,
ready: false,
dropCounter: 0,
dropInterval: 1000
dropInterval: 1000,
garbageReceived: []
};
lobby.players.set(socket.id, player);
@@ -479,6 +480,9 @@ function addGarbageToPlayer(player, senderName) {
garbageRow[gap] = 0;
player.board.push(garbageRow);
// Track garbage received
player.garbageReceived.push({ rows: 1, sender: senderName });
// Push current piece up by 1 row if it exists (y decreases when moving up)
if (player.currentPiece) {
const oldY = player.currentPiece.y;
@@ -519,6 +523,7 @@ function startGame() {
player.dropInterval = 1000;
player.holdPiece = null;
player.canHold = true;
player.garbageReceived = [];
lobby.playerSequenceIndex.set(player.id, 0);
}
@@ -578,7 +583,8 @@ function getStates() {
lines: p.lines,
level: p.level,
eliminated: p.eliminated,
sequenceIndex: lobby.playerSequenceIndex.get(p.id) || 0
sequenceIndex: lobby.playerSequenceIndex.get(p.id) || 0,
garbageReceived: p.garbageReceived ? JSON.parse(JSON.stringify(p.garbageReceived)) : []
}));
}