Skip to content

Commit

Permalink
Merge pull request #10 from eeoooue/individual-pieces
Browse files Browse the repository at this point in the history 
Moving towards Object Oriented Design
  • Loading branch information
@eeoooue
eeoooue committed Jun 5, 2023
2 parents 9184da9 + fb66c7f commit a3d03a1
Show file tree
Hide file tree
Showing 21 changed files with 891 additions and 608 deletions.
212 changes: 58 additions & 154 deletions docs/chessgame.js
View file
Original file line number Diff line number Diff line change
@@ -1,54 +1,70 @@
import { ChessMove } from "./chessmove.js";
import { MoveTracker } from "./movetracker.js";
import { Piece } from "./piece.js";
import { Bishop } from "./pieces/bishop.js";
import { Rook } from "./pieces/rook.js";
import { Knight } from "./pieces/knight.js";
import { King } from "./pieces/king.js";
import { Pawn } from "./pieces/pawn.js";
import { Queen } from "./pieces/queen.js";
export class ChessGame {
constructor(boardContainer) {
this.turncount = 0;
this.active = false;
constructor(webgame) {
this.boardstate = [];
this.grid = [];
this.moveTracker = new MoveTracker();
this.boardContainer = boardContainer;
this.paintTiles();
this.active = false;
this.turncount = 0;
this.webgame = webgame;
this.initializeBoardstate();
this.fullboardPiecePaint();
}
checkClickEvent() {
const move = this.findClickedCell();
if (!move) {
return;
}
interpretSelection(move) {
if (!this.active) {
this.processStartMove(move);
}
else if (this.active) {
this.processEndCell(move);
if (this.active) {
this.clearHighlights();
this.webgame.clearHighlights();
this.active = false;
this.processStartMove(move);
}
}
}
setValidMove(i, j) {
const tile = this.grid[i][j];
if (!tile.classList.contains("validmove")) {
this.grid[i][j].classList.add("validmove");
canStepHere(piece, i, j) {
if (!this.validCoordinates(i, j)) {
return false;
}
return true;
}
findClickedCell() {
for (let i = 0; i < 8; i++) {
for (let j = 0; j < 8; j++) {
const tile = this.grid[i][j];
if (tile instanceof HTMLElement) {
if (tile.classList.contains("clicked")) {
tile.classList.remove("clicked");
return new ChessMove(i, j);
}
}
}
instantiatePiece(pieceName) {
switch (pieceName) {
case "P":
return new Pawn(this.webgame, this);
case "R":
return new Rook(this.webgame, this);
case "N":
return new Knight(this.webgame, this);
case "B":
return new Bishop(this.webgame, this);
case "Q":
return new Queen(this.webgame, this);
default:
return new King(this.webgame, this);
}
return null;
}
activateStart(i, j) {
const tile = this.webgame.grid[i][j];
this.moveTracker.setStartMove(i, j);
tile.classList.add("highlighted");
this.active = true;
this.populateOptions(i, j);
}
initializeBoardstate() {
this.boardstate.push(["Rb", "Nb", "Bb", "Qb", "Kb", "Bb", "Nb", "Rb"]);
this.boardstate.push(["Pb", "Pb", "Pb", "Pb", "Pb", "Pb", "Pb", "Pb"]);
this.boardstate.push([".", ".", ".", ".", ".", ".", ".", "."]);
this.boardstate.push([".", ".", ".", ".", ".", ".", ".", "."]);
this.boardstate.push([".", ".", ".", ".", ".", ".", ".", "."]);
this.boardstate.push([".", ".", ".", ".", ".", ".", ".", "."]);
this.boardstate.push(["Pw", "Pw", "Pw", "Pw", "Pw", "Pw", "Pw", "Pw"]);
this.boardstate.push(["Rw", "Nw", "Bw", "Qw", "Kw", "Bw", "Nw", "Rw"]);
}
getTurnPlayer() {
if (this.turncount % 2 == 0) {
Expand All @@ -63,7 +79,7 @@ export class ChessGame {
return true;
}
validEnd(i, j) {
const tile = this.grid[i][j];
const tile = this.webgame.grid[i][j];
if (tile.classList.contains("validmove")) {
return true;
}
Expand All @@ -79,39 +95,9 @@ export class ChessGame {
this.moveTracker.setEndMove(move.i, move.j);
this.active = false;
this.submitMove();
this.turncount += 1;
}
}
activateStart(i, j) {
const tile = this.grid[i][j];
this.moveTracker.setStartMove(i, j);
tile.classList.add("highlighted");
this.active = true;
this.populateOptions(i, j);
}
populateOptions(i, j) {
const pieceChar = this.boardstate[i][j][0];
const pieceName = this.lookupPiece(pieceChar);
const colour = this.boardstate[i][j][1];
const piece = this.instantiatePiece(pieceName);
if (pieceName === "pawn") {
piece.pawnOptions(i, j, colour);
}
if (pieceName === "knight") {
piece.knightOptions(i, j, colour);
}
if (pieceName === "rook" || pieceName === "queen") {
piece.rookOptions(i, j, colour);
}
if (pieceName === "bishop" || pieceName === "queen") {
piece.bishopOptions(i, j, colour);
}
if (pieceName === "king") {
piece.kingOptions(i, j, colour);
}
}
instantiatePiece(pieceName) {
return new Piece(this);
}
submitMove() {
const startMove = this.moveTracker.getStartMove();
const endMove = this.moveTracker.getEndMove();
Expand All @@ -124,111 +110,29 @@ export class ChessGame {
let y = endMove[1];
this.boardstate[x][y] = this.boardstate[a][b];
this.boardstate[a][b] = ".";
this.paintPosition(x, y);
this.paintPosition(a, b);
this.clearHighlights();
this.turncount += 1;
}
clearHighlights() {
document.querySelectorAll(".highlighted").forEach(el => el.classList.remove("highlighted"));
document.querySelectorAll(".validmove").forEach(el => el.classList.remove("validmove"));
document.querySelectorAll(".markerdot").forEach(el => el.remove());
document.querySelectorAll(".markercircle").forEach(el => el.remove());
this.webgame.paintPosition(x, y);
this.webgame.paintPosition(a, b);
this.webgame.clearHighlights();
}
legalPosition(i, j, colour) {
if (this.validCoordinates(i, j)) {
if (this.boardstate[i][j] === ".") {
this.addDot(i, j);
this.webgame.addDot(i, j);
return true;
}
if (this.boardstate[i][j][1] != colour) {
this.addCircle(i, j);
this.webgame.addCircle(i, j);
}
}
return false;
}
validCoordinates(i, j) {
return (0 <= i && i < 8 && 0 <= j && j < 8);
}
initializeBoardstate() {
this.boardstate.push(["Rb", "Nb", "Bb", "Qb", "Kb", "Bb", "Nb", "Rb"]);
this.boardstate.push(["Pb", "Pb", "Pb", "Pb", "Pb", "Pb", "Pb", "Pb"]);
this.boardstate.push([".", ".", ".", ".", ".", ".", ".", "."]);
this.boardstate.push([".", ".", ".", ".", ".", ".", ".", "."]);
this.boardstate.push([".", ".", ".", ".", ".", ".", ".", "."]);
this.boardstate.push([".", ".", ".", ".", ".", ".", ".", "."]);
this.boardstate.push(["Pw", "Pw", "Pw", "Pw", "Pw", "Pw", "Pw", "Pw"]);
this.boardstate.push(["Rw", "Nw", "Bw", "Qw", "Kw", "Bw", "Nw", "Rw"]);
}
fullboardPiecePaint() {
for (let i = 0; i < 8; i++) {
for (let j = 0; j < 8; j++) {
this.paintPosition(i, j);
}
}
}
addDot(i, j) {
const dot = document.createElement("div");
dot.classList.add("markerdot");
this.setValidMove(i, j);
this.grid[i][j].appendChild(dot);
}
addCircle(i, j) {
const circle = document.createElement("div");
circle.classList.add("markercircle");
this.setValidMove(i, j);
this.grid[i][j].appendChild(circle);
}
lookupPiece(piece) {
switch (piece) {
case "P":
return "pawn";
case "R":
return "rook";
case "N":
return "knight";
case "B":
return "bishop";
case "Q":
return "queen";
case "K":
return "king";
}
return "";
}
paintPosition(i, j) {
const tile = this.grid[i][j];
tile.innerHTML = "";
if (this.boardstate[i][j] == ".") {
return;
}
const piece = this.boardstate[i][j][0];
const pieceName = this.lookupPiece(piece);
populateOptions(i, j) {
const pieceChar = this.boardstate[i][j][0];
const colour = this.boardstate[i][j][1];
const imgpath = `assets\\${pieceName}_${colour}.png`;
const img = document.createElement("img");
img.src = imgpath;
img.style.margin = "5px 5px";
tile.appendChild(img);
}
paintTiles() {
const painting = ["whitebg", "blackbg"];
var paint = 0;
for (let i = 0; i < 8; i++) {
this.grid.push([]);
for (let j = 0; j < 8; j++) {
const tile = document.createElement("div");
tile.classList.add("boardtile");
tile.classList.add(painting[paint]);
tile.addEventListener("click", () => {
tile.classList.toggle("clicked");
this.checkClickEvent();
});
this.grid[i].push(tile);
this.boardContainer.appendChild(tile);
paint = (paint + 1) % 2;
}
paint = (paint + 1) % 2;
}
const piece = this.instantiatePiece(pieceChar);
piece.moveOptions(i, j, colour);
}
}
4 changes: 2 additions & 2 deletions docs/main.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { ChessGame } from './chessgame.js';
import { WebChessGame } from './webchessgame.js';
const boardContainer = document.querySelector(".board-container");
if (boardContainer) {
new ChessGame(boardContainer);
new WebChessGame(boardContainer);
}
Loading

0 comments on commit a3d03a1

Please sign in to comment.