Weyoun/chess
1
0
Fork 0
Code Issues 3 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Fix Issue #7: Add status message element and fix column resizing bug #8

Open
Weyoun wants to merge 6 commits from fix/issue-7-and-column-resize into main
pull from: fix/issue-7-and-column-resize
merge into: Weyoun:main
Conversation 0 Commits 6 Files Changed 36 +22 -18
3 changed files with 22 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit e88e67de4b - Show all commits

12
css/main.css
View File

@ -103,12 +103,16 @@ body {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
min-width: 600px;
width: 100%;
} }
.game-sidebar { .game-sidebar {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 1.5rem; gap: 1.5rem;
width: 100%;
max-width: 250px;
} }
.captured-pieces { .captured-pieces {
@ -116,6 +120,8 @@ body {
padding: 1rem; padding: 1rem;
border-radius: 8px; border-radius: 8px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 250px;
} }
.captured-pieces h3 { .captured-pieces h3 {
@ -130,6 +136,8 @@ body {
flex-wrap: wrap; flex-wrap: wrap;
gap: 0.5rem; gap: 0.5rem;
min-height: 60px; min-height: 60px;
max-width: 100%;
overflow: hidden;
} }
.move-history-section { .move-history-section {
@ -138,13 +146,17 @@ body {
border-radius: 8px; border-radius: 8px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
flex: 1; flex: 1;
width: 100%;
max-width: 250px;
} }
.move-history { .move-history {
max-height: 400px; max-height: 400px;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden;
font-family: 'Courier New', monospace; font-family: 'Courier New', monospace;
font-size: 0.9rem; font-size: 0.9rem;
width: 100%;
} }
.game-controls { .game-controls {

9
js/controllers/GameController.js
View File

@ -108,14 +108,11 @@ export class GameController {
const moveResult = this.board.movePiece(fromRow, fromCol, toRow, toCol); const moveResult = this.board.movePiece(fromRow, fromCol, toRow, toCol);
captured = moveResult.captured; captured = moveResult.captured;
// Check for promotion // Check for promotion - emit event WITHOUT auto-promoting
if (specialMoveType === 'promotion' || (piece.type === 'pawn' && piece.canPromote())) { if (specialMoveType === 'promotion' || (piece.type === 'pawn' && piece.canPromote())) {
// Default to queen, UI should prompt for choice // Emit promotion event for UI to handle - DON'T auto-promote yet
const newPiece = SpecialMoves.promote(this.board, piece, 'queen');
promotedTo = newPiece.type;
// Emit promotion event for UI to handle
this.emit('promotion', { pawn: piece, position: { row: toRow, col: toCol } }); this.emit('promotion', { pawn: piece, position: { row: toRow, col: toCol } });
// promotedTo will be set when the UI calls back with the chosen piece
} }
} }

19
js/main.js
View File

@ -263,7 +263,6 @@ class ChessApp {
* @param {Position} position - Pawn position * @param {Position} position - Pawn position
*/ */
showPromotionDialog(pawn, position) { showPromotionDialog(pawn, position) {
const overlay = document.getElementById('promotion-overlay');
const dialog = document.getElementById('promotion-dialog'); const dialog = document.getElementById('promotion-dialog');
if (!dialog) { if (!dialog) {
@ -271,25 +270,22 @@ class ChessApp {
return; return;
} }
if (overlay) { // Show dialog using HTML5 dialog element API
overlay.style.display = 'block'; dialog.showModal();
}
dialog.style.display = 'block';
// Update symbols for current color // Update symbols for current color
const symbols = pawn.color === 'white' ? const symbols = pawn.color === 'white' ?
{ queen: '♕', rook: '♖', bishop: '♗', knight: '♘' } : { queen: '♕', rook: '♖', bishop: '♗', knight: '♘' } :
{ queen: '♛', rook: '♜', bishop: '♝', knight: '♞' }; { queen: '♛', rook: '♜', bishop: '♝', knight: '♞' };
document.querySelectorAll('.promotion-piece .symbol').forEach(el => { document.querySelectorAll('.promotion-piece .piece-icon').forEach(el => {
const type = el.parentElement.dataset.type; const type = el.parentElement.dataset.piece;
el.textContent = symbols[type]; el.textContent = symbols[type];
el.style.color = pawn.color === 'white' ? '#ffffff' : '#000000';
}); });
// Handle selection // Handle selection
const handleSelection = (e) => { const handleSelection = (e) => {
const pieceType = e.currentTarget.dataset.type; const pieceType = e.currentTarget.dataset.piece;
// Promote pawn // Promote pawn
import('./engine/SpecialMoves.js').then(({ SpecialMoves }) => { import('./engine/SpecialMoves.js').then(({ SpecialMoves }) => {
@ -297,9 +293,8 @@ class ChessApp {
this.updateDisplay(); this.updateDisplay();
}); });
// Hide dialog // Close dialog using HTML5 dialog element API
overlay.style.display = 'none'; dialog.close();
dialog.style.display = 'none';
// Remove listeners // Remove listeners
document.querySelectorAll('.promotion-piece').forEach(el => { document.querySelectorAll('.promotion-piece').forEach(el => {