diff --git a/adapter/adapter.py b/adapter/adapter.py index cc18e5b..293164b 100644 --- a/adapter/adapter.py +++ b/adapter/adapter.py @@ -22,11 +22,10 @@ engine = subprocess.Popen( def make_piece(piece_str): - piece_type, color, file, rank = piece_str + piece_type, color = piece_str return { - "who": dict(PIECE_TYPE)[piece_type], + "piece_type": dict(PIECE_TYPE)[piece_type], "color": dict(COLOR)[color], - "position": f"{file}{rank}", } @@ -35,10 +34,10 @@ def get_state(): engine.stdin.write(b"get_state\n") engine.stdin.flush() position_str = engine.stdout.readline().decode("ascii").strip() - position = [ - make_piece(position_str[i : i + 4]) + position = { + position_str[i + 2 : i + 4]: make_piece(position_str[i : i + 2]) for i in range(0, len(position_str), 4) - ] + } return flask.jsonify(position) diff --git a/frontend/jsconfig.json b/frontend/jsconfig.json index bdf396d..eaf02e7 100644 --- a/frontend/jsconfig.json +++ b/frontend/jsconfig.json @@ -1,6 +1,6 @@ { "compilerOptions": { "checkJs": true, - "target": "es6" + "target": "es2017" } } diff --git a/frontend/main.js b/frontend/main.js index 7d49510..1741109 100644 --- a/frontend/main.js +++ b/frontend/main.js @@ -9,20 +9,15 @@ function get_json(url) { class Backend { constructor() { - this.config = this.getConfig(); - } - getConfig() { - return new Configuration( - get_json("http://localhost:3000/get_state/").map((p) => { - let piece = new Piece(); - Object.assign(piece, p); - return piece; - }) + this.config = new Configuration( + new Map(Object.entries(get_json("http://localhost:3000/get_state/"))) ); } + getConfig() { + return this.config; + } makeMove(move) { - this.config = this.config.makeMove(move); - return this.config.clone(); + this.config.makeMove(move); } getAvailableMoves(position) { return []; @@ -32,19 +27,16 @@ class Backend { class Chess { constructor() { this.backend = new Backend(); - this.configVis = null; this.canvas = new visuals.Canvas(); + this.configVis = new visuals.ConfigVis(this.backend.getConfig()); + this.configVis.draw(this.canvas); this.moveSource = null; this.canMoveTo = []; - this.syncBackend(); document.onclick = (ev) => this.click(ev); } syncBackend() { let config = this.backend.getConfig(); - if (this.configVis !== null) { - this.configVis.undraw(); - } - this.configVis = new visuals.ConfigVis(config.pieces); + this.configVis.configuration = config; this.configVis.draw(this.canvas); } showAvailableMoves(canMoveTo) {} @@ -85,46 +77,35 @@ class Move { } class Piece { - constructor(who, color, position) { - this.who = who; + constructor(piece_type, color) { + this.piece_type = piece_type; this.color = color; - this.position = position; - } - clone() { - return new Piece(this.who, this.color, this.position); - } - moveTo(position) { - return new Piece(this.who, this.color, position); } } class Configuration { - constructor(pieces) { - this.pieces = pieces; - } - clone() { - let pieces = []; - for (let piece of this.pieces) { - pieces.push(piece.clone()); - } - return new Configuration(pieces); + constructor(board) { + this.board = new Map(board); } getAt(position) { - return this.pieces.find((piece) => piece.position === position) || null; + if (!this.board.has(position)) { + return null; + } + return this.board.get(position); + } + setAt(position, piece) { + this.board.set(position, piece); } dropAt(position) { - return new Configuration( - this.pieces.filter((piece) => piece.position !== position) - ); + this.board.delete(position); } makeMove(move) { - const pieceToMove = this.getAt(move.from); - if (pieceToMove === null) return this; - else - return new Configuration([ - ...this.dropAt(move.from).dropAt(move.to).pieces, - pieceToMove.moveTo(move.to), - ]); + const piece = this.getAt(move.from); + if (piece === null) return; + else { + this.setAt(move.to, piece); + this.dropAt(move.from); + } } } diff --git a/frontend/visuals.js b/frontend/visuals.js index 70ceadd..6fdebdf 100644 --- a/frontend/visuals.js +++ b/frontend/visuals.js @@ -78,15 +78,17 @@ export function rowColToBoardIndex(row, col) { return `${colLetter}${rowDigit}`; } -export class PieceVis { +class PieceVis { constructor(piece) { - this.icon = `./icons/${piece.who}_${piece.color}.svg`; - this.position = piece.position; + this.piece = piece; this.im = null; } - draw(canvas) { + get ["icon"]() { + return `./icons/${this.piece.piece_type}_${this.piece.color}.svg`; + } + draw(canvas, position) { let [topPx, leftPx] = canvas.rowColToScreenCoords( - ...boardIndexToRowCol(this.position), + ...boardIndexToRowCol(position), canvas ); if (this.im === null) { @@ -118,15 +120,30 @@ export class ConfigVis { this.piecesVis = new Map(); } draw(canvas) { - for (const piece of this.configuration) { - let pieceVis = new PieceVis(piece); - pieceVis.draw(canvas); - this.piecesVis.set(piece.position, pieceVis); + for (let [position, piece] of this.configuration.board) { + if (this.piecesVis.has(position)) { + if (this.piecesVis.get(position).piece == piece) { + continue; + } + } + let pv = this.piecesVis.get(position); + if (pv !== undefined) { + pv.undraw(); + } + pv = new PieceVis(piece); + pv.draw(canvas, position); + this.piecesVis.set(position, pv); + } + for (let [position, pv] of this.piecesVis) { + if (!this.configuration.board.has(position)) { + pv.undraw(); + this.piecesVis.delete(position); + } } } undraw() { - for (let [position, pieceVis] of this.piecesVis) { - pieceVis.undraw(); + for (let [position, pv] of this.piecesVis) { + pv.undraw(); } this.piecesVis.clear(); }