diff --git a/js/controllers/GameController.js b/js/controllers/GameController.js index 3a76727..3379bc3 100644 --- a/js/controllers/GameController.js +++ b/js/controllers/GameController.js @@ -105,7 +105,8 @@ export class GameController { captured = SpecialMoves.executeEnPassant(this.board, piece, toRow, toCol); } else { // Normal move - captured = this.board.movePiece(fromRow, fromCol, toRow, toCol); + const moveResult = this.board.movePiece(fromRow, fromCol, toRow, toCol); + captured = moveResult.captured; // Check for promotion if (specialMoveType === 'promotion' || (piece.type === 'pawn' && piece.canPromote())) { diff --git a/js/main.js b/js/main.js index b4a51e6..4b90119 100644 --- a/js/main.js +++ b/js/main.js @@ -84,10 +84,13 @@ class ChessApp { }); // Offer Draw - document.getElementById('btn-offer-draw').addEventListener('click', () => { - this.game.offerDraw(); - this.showMessage('Draw offered to opponent'); - }); + const offerDrawBtn = document.getElementById('btn-offer-draw'); + if (offerDrawBtn) { + offerDrawBtn.addEventListener('click', () => { + this.game.offerDraw(); + this.showMessage('Draw offered to opponent'); + }); + } // Resign document.getElementById('btn-resign').addEventListener('click', () => { @@ -172,9 +175,13 @@ class ChessApp { * Update turn indicator */ updateTurnIndicator() { - const indicator = document.getElementById('turn-indicator'); + const indicator = document.getElementById('current-turn'); + if (!indicator) { + console.error('Turn indicator element not found'); + return; + } const turn = this.game.currentTurn; - indicator.textContent = `${turn.charAt(0).toUpperCase() + turn.slice(1)} to move`; + indicator.textContent = `${turn.charAt(0).toUpperCase() + turn.slice(1)}'s Turn`; indicator.style.color = turn === 'white' ? '#ffffff' : '#333333'; } @@ -182,7 +189,7 @@ class ChessApp { * Update move history display */ updateMoveHistory() { - const moveList = document.getElementById('move-list'); + const moveList = document.getElementById('move-history'); const history = this.game.gameState.moveHistory; if (history.length === 0) { @@ -211,17 +218,19 @@ class ChessApp { * Update captured pieces display */ updateCapturedPieces() { - const whiteCaptured = document.getElementById('white-captured'); - const blackCaptured = document.getElementById('black-captured'); + const whiteCaptured = document.getElementById('captured-white-pieces'); + const blackCaptured = document.getElementById('captured-black-pieces'); const captured = this.game.gameState.capturedPieces; - whiteCaptured.innerHTML = captured.black.map(piece => - `${piece.getSymbol()}` + // "Captured by Black" shows white pieces that black captured + whiteCaptured.innerHTML = captured.white.map(piece => + `${piece.getSymbol()}` ).join('') || '-'; - blackCaptured.innerHTML = captured.white.map(piece => - `${piece.getSymbol()}` + // "Captured by White" shows black pieces that white captured + blackCaptured.innerHTML = captured.black.map(piece => + `${piece.getSymbol()}` ).join('') || '-'; } @@ -232,6 +241,10 @@ class ChessApp { */ showMessage(message, type = 'info') { const statusMessage = document.getElementById('status-message'); + if (!statusMessage) { + console.warn('Status message element not found, using console:', message); + return; + } statusMessage.textContent = message; statusMessage.style.display = 'block'; @@ -250,7 +263,14 @@ class ChessApp { const overlay = document.getElementById('promotion-overlay'); const dialog = document.getElementById('promotion-dialog'); - overlay.style.display = 'block'; + if (!dialog) { + console.error('Promotion dialog not found'); + return; + } + + if (overlay) { + overlay.style.display = 'block'; + } dialog.style.display = 'block'; // Update symbols for current color