Select Git revision
-
Elarouti Adam authoredElarouti Adam authored
chess.js 13.42 KiB
const canvas = document.getElementById("chessboard");
const ctx = canvas.getContext("2d");
const size = 60; // Taille des cases
currentPlayer = 0;
// Disposition initiale de l'échiquier
const board = [
["T", "C", "F", "Q", "K", "F", "C", "T"],
["P", "P", "P", "P", "P", "P", "P", "P"],
["", "", "", "", "", "", "", ""],
["", "", "", "", "", "", "", ""],
["", "", "", "", "", "", "", ""],
["", "", "", "", "", "", "", ""],
["p", "p", "p", "p", "p", "p", "p", "p"],
["t", "c", "f", "q", "k", "f", "c", "t"]
];
// Charger les images des pièces
const pieceImages = {
"p": "pion_blanc.png",
"P": "pion_noir.png",
"t": "tour_blanc.png",
"T": "tour_noir.png",
"c": "cavalier_blanc.png",
"C": "cavalier_noir.png",
"f": "fou_blanc.png",
"F": "fou_noir.png",
"q": "reine_blanc.png",
"Q": "reine_noir.png",
"k": "roi_blanc.png",
"K": "roi_noir.png"
};
const pieces_joueurs = {0: ["p","t","c","f","q","k"],1:["P","T","C","F","Q","K"]};
// Dessiner l'échiquier avec les couleurs des cases
function drawBoard() {
for (let row = 0; row < 8; row++) {
for (let col = 0; col < 8; col++) {
ctx.fillStyle = (row + col) % 2 === 0 ? "#F5DEB3" : "#8B4513";
ctx.fillRect(col * size, row * size, size, size);
}
}
}
// Dessiner les pièces sur l'échiquier
function drawPieces() {
for (let row = 0; row < 8; row++) {
for (let col = 0; col < 8; col++) {
const piece = board[row][col];
if (piece !== "") {
let img = new Image();
img.src = "chess_pieces/" + pieceImages[piece];
img.onload = function () {
console.log("Image chargée : ", img.src); // Vérification du chemin de l'image
ctx.drawImage(img, col * size, row * size, size, size);
};
img.onerror = function (e) {
console.log("Erreur de chargement de l'image : ", img.src); // En cas d'erreur de chargement
};
}
}
}
}
// Fonction principale pour dessiner l'échiquier
function draw() {
drawBoard();
drawPieces();
}
// Appeler la fonction pour afficher l'échiquier
draw();
//Mouvement des pièces sur l'échiquier
let selectedPiece = null;
let selectedPosition = null;
canvas.addEventListener("click", function(event) {
const col = Math.floor(event.offsetX / size);
const row = Math.floor(event.offsetY / size);
if (selectedPiece) {
movePiece(row, col);
} else {
selectPiece(row, col);
}
});
function selectPiece(row, col) {
const piece = board[row][col];
if (piece !== "" && pieces_joueurs[currentPlayer].includes(piece)) { // Vérifier que ce n'est pas une case vide
selectedPiece = piece;
selectedPosition = { row, col };
highlightMoves(currentPlayer,piece, row, col);
}
}
function highlightMoves(player,piece, row, col) {
if (player===0){
direction=-1;
opponent=1;
}
else{direction=1;
opponent=0;
}
let moves = [];
if (piece.toLowerCase() === "p") {
if(row===6 && player===0){
if (board[row + 2*direction][col] === "") {
moves.push({row: row + 2*direction,col});
}
}
if(row===1 && player===1){
if (board[row +2*direction][col] === "") {
moves.push({row: row + 2*direction,col});
}
}
if (board[row + direction] && board[row + direction][col] === "") {
moves.push({ row: row + direction, col });
}
if (pieces_joueurs[opponent].includes(board[row + direction][col + direction])){
moves.push({row: row +direction, col: col + direction })
}
if (pieces_joueurs[opponent].includes(board[row + direction][col - direction])){
moves.push({row: row +direction, col: col - direction })
}
}
if (piece.toLowerCase() === "t") {
// Déplacements vers le haut
for (let r = row - 1; r >= 0; r--) {
if (board[r][col] === "") {
moves.push({ row: r, col });
}
else {
if (pieces_joueurs[opponent].includes(board[r][col])) {
moves.push({ row: r, col }); // Capture possible
}
break // Bloqué par une pièce
}
}
// Déplacements vers le bas
for (let r = row + 1; r < 8; r++) {
if (board[r][col] === "") {
moves.push({ row: r, col });
} else {
if (pieces_joueurs[opponent].includes(board[r][col])) {
moves.push({ row: r, col });
}
break;
}
}
// Déplacements vers la gauche
for (let c = col - 1; c >= 0; c--) {
if (board[row][c] === "") {
moves.push({ row, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[row][c])) {
moves.push({ row, col: c });
}
break;
}
}
// Déplacements vers la droite
for (let c = col + 1; c < 8; c++) {
if (board[row][c] === "") {
moves.push({ row, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[row][c])) {
moves.push({ row, col: c });
}
break;
}
}
}
if (piece.toLowerCase() === "f") {
// Déplacements en haut à gauche
for (let r = row - 1, c = col - 1; r >= 0 && c >= 0; r--, c--) {
if (board[r][c] === "") {
moves.push({ row: r, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[r][c])) {
moves.push({ row: r, col: c });
}
break; // Bloqué par une pièce
}
}
// Déplacements en haut à droite
for (let r = row - 1, c = col + 1; r >= 0 && c < 8; r--, c++) {
if (board[r][c] === "") {
moves.push({ row: r, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[r][c])) {
moves.push({ row: r, col: c });
}
break;
}
}
// Déplacements en bas à gauche
for (let r = row + 1, c = col - 1; r < 8 && c >= 0; r++, c--) {
if (board[r][c] === "") {
moves.push({ row: r, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[r][c])) {
moves.push({ row: r, col: c });
}
break;
}
}
// Déplacements en bas à droite
for (let r = row + 1, c = col + 1; r < 8 && c < 8; r++, c++) {
if (board[r][c] === "") {
moves.push({ row: r, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[r][c])) {
moves.push({ row: r, col: c });
}
break;
}
}
}
if (piece.toLowerCase() === "k") {
let directions = [
{ dr: -1, dc: 0 }, // Haut
{ dr: 1, dc: 0 }, // Bas
{ dr: 0, dc: -1 }, // Gauche
{ dr: 0, dc: 1 }, // Droite
{ dr: -1, dc: -1 }, // Diagonale haut-gauche
{ dr: -1, dc: 1 }, // Diagonale haut-droite
{ dr: 1, dc: -1 }, // Diagonale bas-gauche
{ dr: 1, dc: 1 } // Diagonale bas-droite
];
for (let { dr, dc } of directions) {
let newRow = row + dr;
let newCol = col + dc;
// Vérifie que la nouvelle position est sur l'échiquier
if (newRow >= 0 && newRow < 8 && newCol >= 0 && newCol < 8) {
if (board[newRow][newCol] === "" || pieces_joueurs[opponent].includes(board[newRow][newCol])) {
moves.push({ row: newRow, col: newCol });
}
}
}
}
if (piece.toLowerCase() === "c") {
let movesL = [
{ dr: -2, dc: -1 }, { dr: -2, dc: 1 }, // Haut gauche, Haut droite
{ dr: 2, dc: -1 }, { dr: 2, dc: 1 }, // Bas gauche, Bas droite
{ dr: -1, dc: -2 }, { dr: -1, dc: 2 }, // Gauche haut, Droite haut
{ dr: 1, dc: -2 }, { dr: 1, dc: 2 } // Gauche bas, Droite bas
];
for (let { dr, dc } of movesL) {
let newRow = row + dr;
let newCol = col + dc;
// Vérifie que la nouvelle position est sur l'échiquier
if (newRow >= 0 && newRow < 8 && newCol >= 0 && newCol < 8) {
if (board[newRow][newCol] === "" || pieces_joueurs[opponent].includes(board[newRow][newCol])) {
moves.push({ row: newRow, col: newCol });
}
}
}
}
if (piece.toLowerCase() === "q") {
// Déplacements verticaux (haut et bas)
for (let r = row - 1; r >= 0; r--) { // Haut
if (board[r][col] === "") {
moves.push({ row: r, col });
} else {
if (pieces_joueurs[opponent].includes(board[r][col])) {
moves.push({ row: r, col }); // Capture possible
}
break; // Bloqué par une pièce
}
}
for (let r = row + 1; r < 8; r++) { // Bas
if (board[r][col] === "") {
moves.push({ row: r, col });
} else {
if (pieces_joueurs[opponent].includes(board[r][col])) {
moves.push({ row: r, col });
}
break;
}
}
// Déplacements horizontaux (gauche et droite)
for (let c = col - 1; c >= 0; c--) { // Gauche
if (board[row][c] === "") {
moves.push({ row, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[row][c])) {
moves.push({ row, col: c });
}
break;
}
}
for (let c = col + 1; c < 8; c++) { // Droite
if (board[row][c] === "") {
moves.push({ row, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[row][c])) {
moves.push({ row, col: c });
}
break;
}
}
// Déplacements diagonaux (haut-gauche, haut-droite, bas-gauche, bas-droite)
for (let r = row - 1, c = col - 1; r >= 0 && c >= 0; r--, c--) { // Haut-Gauche
if (board[r][c] === "") {
moves.push({ row: r, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[r][c])) {
moves.push({ row: r, col: c });
}
break;
}
}
for (let r = row - 1, c = col + 1; r >= 0 && c < 8; r--, c++) { // Haut-Droite
if (board[r][c] === "") {
moves.push({ row: r, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[r][c])) {
moves.push({ row: r, col: c });
}
break;
}
}
for (let r = row + 1, c = col - 1; r < 8 && c >= 0; r++, c--) { // Bas-Gauche
if (board[r][c] === "") {
moves.push({ row: r, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[r][c])) {
moves.push({ row: r, col: c });
}
break;
}
}
for (let r = row + 1, c = col + 1; r < 8 && c < 8; r++, c++) { // Bas-Droite
if (board[r][c] === "") {
moves.push({ row: r, col: c });
} else {
if (pieces_joueurs[opponent].includes(board[r][c])) {
moves.push({ row: r, col: c });
}
break;
}
}
}
return moves;
}
function drawHighlightedMoves(moves) {
ctx.fillStyle = "rgba(0, 255, 0, 0.5)"; // Vert transparent
for (let move of moves) {
ctx.beginPath();
ctx.arc(move.col * size + size / 2, move.row * size + size / 2, size / 4, 0, 2 * Math.PI);
ctx.fill();
}
}
function movePiece(newRow, newCol) {
if (!selectedPiece) return;
// Vérifier si le mouvement est valide
const validMoves = highlightMoves(currentPlayer,selectedPiece, selectedPosition.row, selectedPosition.col);
console.log(validMoves); // Vérifie la structure des validMoves
// Vérifier que validMoves est un tableau et qu'il contient des objets avec { row, col }
const isValidMove = Array.isArray(validMoves) && validMoves.some(m => m.row === newRow && m.col === newCol);
if (isValidMove) {
// Déplacer la pièce
board[newRow][newCol] = selectedPiece;
board[selectedPosition.row][selectedPosition.col] = "";
// Réinitialiser la pièce sélectionnée
selectedPiece = null;
selectedPosition = null;
currentPlayer=(currentPlayer+1)%2;
// Redessiner le plateau
drawBoard();
drawPieces();
} else {
// Si le mouvement est invalide, tu pourrais afficher un message
console.log("Mouvement invalide !");
selectedPiece=null;
}
}