Skip to content

Commit

Permalink
Merge pull request #7 from RiteshS1/last
Browse files Browse the repository at this point in the history
last few tweaks
  • Loading branch information
RiteshS1 authored Nov 14, 2024
2 parents 69ead81 + 414f9ed commit 5a9dff5
Show file tree
Hide file tree
Showing 10 changed files with 166 additions and 47 deletions.
13 changes: 6 additions & 7 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,15 +9,14 @@
</head>
<body>
<h1>♔ Chessical ♔</h1>
<div id="board"></div>

<div class="captured-area">

<div class="game-container">
<div id="captured-white" class="captured-pieces">White Captured Pieces</div>
<div id="board"></div>
<div id="captured-black" class="captured-pieces">Black Captured Pieces</div>
</div>

<div id="evaluation-bar">
<div id="evaluation-score"></div>
<div id="evaluation-bar">
<div id="evaluation-score"></div>
</div>
</div>

<button id="suggest-best-move">Suggest Best Move</button>
Expand Down
43 changes: 40 additions & 3 deletions scripts/board.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,23 @@ let blackQueensideRookMoved = false;
let selectedPiece = null;
let selectedSquare = null;

// Sound effects
const sounds = {
move: new Audio('sounds/move.mp3'),
capture: new Audio('sounds/capture.mp3'),
castle: new Audio('sounds/castle.mp3'),
check: new Audio('sounds/check.mp3'),
promote: new Audio('sounds/promote.mp3'),
notify: new Audio('sounds/notify.mp3')
};

// Preload sounds
function preloadSounds() {
for (const sound in sounds) {
sounds[sound].load(); // Preload each sound
}
}

function initBoard() {
const initialBoard = [
['black_rook', 'black_knight', 'black_bishop', 'black_queen', 'black_king', 'black_bishop', 'black_knight', 'black_rook'],
Expand All @@ -26,7 +43,6 @@ function initBoard() {
];

let isWhiteSquare = true;

const fileLabels = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];

for (let i = 0; i < 64; i++) {
Expand Down Expand Up @@ -233,7 +249,12 @@ function isValidMove(draggedPiece, sourceIndex, targetIndex) {
if (targetPiece) {
const sourceColor = draggedPiece.getAttribute('data-piece').split('_')[0];
const targetColor = targetPiece.getAttribute('data-piece').split('_')[0];
if (sourceColor === targetColor) return false;
if (sourceColor === targetColor) return false; // Cannot capture own piece
}

// Check if the target piece is a king
if (targetPiece && targetPiece.getAttribute('data-piece').includes('king')) {
return false; // Cannot capture the king
}

// Check for check resolution
Expand Down Expand Up @@ -470,6 +491,17 @@ function validateKingMove(sourceRow, sourceCol, targetRow, targetCol) {
// Check if the target square is under attack
const isWhiteKing = document.querySelector(`[data-index="${sourceRow * 8 + sourceCol}"]`)
.querySelector('.piece').getAttribute('data-piece').startsWith('white');

// Check if the target square is adjacent to the opposing king
const opponentKingPos = findKingPosition(!isWhiteKing);
if (opponentKingPos) {
const opponentKingRow = opponentKingPos.row;
const opponentKingCol = opponentKingPos.col;
if (Math.abs(opponentKingRow - targetRow) <= 1 && Math.abs(opponentKingCol - targetCol) <= 1) {
return false; // Cannot move into a square adjacent to the opposing king
}
}

return !isKingInCheck(targetRow, targetCol, isWhiteKing);
}

Expand Down Expand Up @@ -574,6 +606,7 @@ function doesMoveResolveCheck(piece, sourceIndex, targetIndex) {
}

// Initialize the board with pieces and listeners
preloadSounds(); // Preload sounds
initBoard();

// Add this function after handleDrop
Expand All @@ -599,6 +632,7 @@ function handlePawnPromotion(square, piece) {
// Update the piece
piece.src = option.src;
piece.setAttribute('data-piece', `${pieceColor}_${pieceType}`);
sounds.promote.play(); // Play promote sound
modal.remove();
updateBoardState();
updateEvaluationBar();
Expand Down Expand Up @@ -721,7 +755,8 @@ function handleSquareClick(event) {
return;
}
targetPiece.remove();

sounds.capture.play(); // Play capture sound

if (capturedPieceColor === 'white') {
capturedWhitePieces.push(targetPiece);
} else {
Expand All @@ -733,6 +768,7 @@ function handleSquareClick(event) {

// Move the piece
square.appendChild(selectedPiece);
sounds.move.play(); // Play move sound
handlePawnPromotion(square, selectedPiece);

const currentPosition = getCurrentPosition();
Expand All @@ -747,6 +783,7 @@ function handleSquareClick(event) {

if (isCheckmate(opponentIsWhite)) {
setTimeout(() => {
sounds.notify.play(); // Play checkmate sound
showGameEndModal(`${pieceColor.charAt(0).toUpperCase() + pieceColor.slice(1)} wins by checkmate!`);
}, 100);
}
Expand Down
45 changes: 42 additions & 3 deletions scripts/evaluation.js
Original file line number Diff line number Diff line change
Expand Up @@ -79,15 +79,54 @@ function getPieceValue(piece) {
[-30, 5, 10, 15, 15, 10, 5,-30],
[-40,-20, 0, 5, 5, 0,-20,-40],
[-50,-40,-30,-30,-30,-30,-40,-50]
],
'bishop': [
[-20,-10,-10,-10,-10,-10,-10,-20],
[-10, 0, 0, 0, 0, 0, 0,-10],
[-10, 5, 10, 10, 10, 10, 5,-10],
[-10, 10, 10, 10, 10, 10, 10,-10],
[-10, 0, 10, 10, 10, 10, 0,-10],
[-10, 0, 0, 0, 0, 0, 0,-10],
[-20,-10,-10,-10,-10,-10,-10,-20],
[-30,-30,-30,-30,-30,-30,-30,-30]
],
'rook': [
[0, 0, 0, 0, 0, 0, 0, 0],
[5, 10, 10, 10, 10, 10, 10, 5],
[0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0],
[5, 10, 10, 10, 10, 10, 10, 5],
[10, 10, 10, 10, 10, 10, 10, 10],
[0, 0, 0, 0, 0, 0, 0, 0]
],
'queen': [
[-20,-10,-10,-5,-5,-10,-10,-20],
[-10, 0, 0, 0, 0, 0, 0,-10],
[-10, 5, 10, 10, 10, 10, 5,-10],
[-5, 0, 10, 10, 10, 10, 0,-5],
[0, 0, 10, 10, 10, 10, 0, 0],
[-10, 0, 10, 10, 10, 10, 5,-10],
[-10, 0, 0, 0, 0, 0, 0,-10],
[-20,-10,-10,-5,-5,-10,-10,-20]
],
'king': [
[20, 30, 10, 0, 0, 10, 30, 20],
[20, 30, 10, 0, 0, 10, 30, 20],
[0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0],
[-20,-30,-30,-30,-30,-30,-30,-20],
[-30,-40,-40,-50,-50,-40,-40,-30],
[-30,-40,-40,-50,-50,-40,-40,-30],
[-40,-50,-50,-60,-60,-50,-50,-40]
]
// Add similar position tables for other pieces
};

let value = values[piece.type] || 0;

// Add position-based bonus if available
if (positionBonus[piece.type]) {
const row = piece.color === 'white' ? 7 - piece.row : piece.row;
const row = piece.color === 'white' ? 7 - piece.row : piece.row; // Adjust row for white's perspective
value += positionBonus[piece.type][row][piece.col];
}

Expand Down Expand Up @@ -120,4 +159,4 @@ function updateEvaluationBar() {
const maxScore = 4000;
const evalPercent = 50 + (score / maxScore) * 50;
evaluationDiv.style.height = evalPercent + '%';
}
}
Binary file added sounds/capture.mp3
Binary file not shown.
Binary file added sounds/castle.mp3
Binary file not shown.
Binary file added sounds/check.mp3
Binary file not shown.
Binary file added sounds/move.mp3
Binary file not shown.
Binary file added sounds/notify.mp3
Binary file not shown.
Binary file added sounds/promote.mp3
Binary file not shown.
112 changes: 78 additions & 34 deletions styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,41 @@
margin: 0;
}

body {
background-color: #2c3e50;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
overflow-x: hidden;
padding: 2em;
text-align: center;
}

h1{
text-align: center;
margin: 1.2em;
color:#b58863
color:#b58863;
font-size: 2.3em;

}


.game-container {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5em;
margin:0 2em ;

}
#board {
display: grid;
grid-template-columns: repeat(8, 1fr);
grid-template-columns: repeat(8, 80px);
width: 640px;
height: 640px;
border: 2px solid;
border: 2px solid #333;
}

.square {
Expand Down Expand Up @@ -55,12 +79,14 @@ h1{
}

.captured-pieces {
width: 640px;
display: flex;
flex-wrap: wrap;
min-height: 40px;
padding: 5px;
border: 1px solid #ccc;
margin: 10px 0;
margin: 5px 0;
background-color: rgba(255, 255, 255, 0.8);
}

.captured-pieces .piece {
Expand All @@ -73,17 +99,21 @@ h1{
padding: 0.9em;
border-radius: 25px;
font-size: 0.8em;
margin-top: 0.5em;
cursor: pointer;
}

#evaluation-bar {
width: 30px;
height: 400px;
border: 1px solid #ccc;
position: fixed;
right: 50px;
top: 50%;
transform: translateY(-50%);
overflow: hidden;
right: 10px;
top: 20%;


background-color: white;
z-index: 100;
}

#evaluation-score {
Expand All @@ -96,7 +126,7 @@ h1{
}

.highlighted-square {
background-color: rgba(255, 255, 0, 0.5) !important;
background-color: rgba(147, 245, 82, 0.944) !important;
animation: highlightPulse 4s ease-in-out;
}

Expand Down Expand Up @@ -145,38 +175,52 @@ h1{

/* Add responsive design */
@media (max-width: 768px) {
#board {
width: 100vw;
height: 100vw;
max-width: 640px;
max-height: 640px;
}


.square {
width: 12.5vw;
height: 12.5vw;
max-width: 80px;
max-height: 80px;
.game-container{
position: relative;
transform: scale(0.9);
transform-origin:center;
margin: 0 2em;
padding: 4em;
}
.piece {
width: 100%;
height: 100%;

#board, .captured-pieces {
max-width: 640px;

}

#evaluation-bar {
right: 10px;
position: fixed;
width: 15px;
height: 300px;
right: -2em;

}

.captured-pieces {
padding: 2px;
}

@media (max-width: 500px) {
.game-container {
transform: scale(0.9);
transform-origin:top;
margin: 0 6em;

}

.captured-pieces .piece {
width: 30px;
height: 30px;
#board,.captured-pieces{

margin-left: 12em;
}






#evaluation-bar {
width: 10px;
height: 300px;
position: fixed;
}
}

/* Add touch support */
Expand All @@ -193,4 +237,4 @@ h1{
.selected-square {
background-color: rgba(255, 255, 0, 0.4) !important;
}
}
}

0 comments on commit 5a9dff5

Please sign in to comment.