+ animateMove: function(move) {
+ let startSquare = document.getElementById(this.getSquareId(move.start));
+ let endSquare = document.getElementById(this.getSquareId(move.end));
+ let rectStart = startSquare.getBoundingClientRect();
+ let rectEnd = endSquare.getBoundingClientRect();
+ let translation = {x:rectEnd.x-rectStart.x, y:rectEnd.y-rectStart.y};
+ let movingPiece =
+ document.querySelector("#" + this.getSquareId(move.start) + " > img.piece");
+ // HACK for animation (with positive translate, image slides "under background")
+ // Possible improvement: just alter squares on the piece's way...
+ squares = document.getElementsByClassName("board");
+ for (let i=0; i<squares.length; i++)
+ {
+ let square = squares.item(i);
+ if (square.id != this.getSquareId(move.start))
+ square.style.zIndex = "-1";
+ }
+ movingPiece.style.transform = "translate(" + translation.x + "px," +
+ translation.y + "px)";
+ movingPiece.style.transitionDuration = "0.2s";
+ movingPiece.style.zIndex = "3000";
+ setTimeout( () => {
+ for (let i=0; i<squares.length; i++)
+ squares.item(i).style.zIndex = "auto";
+ movingPiece.style = {}; //required e.g. for 0-0 with KR swap
+ this.play(move); //TODO: plutôt envoyer message "please play"
+ }, 250);
+ },
+ play: function(move, programmatic) {
+ if (!!programmatic) //computer or human opponent
+ return this.animateMove(move);
+ // Not programmatic, or animation is over
+ if (!move.notation)
+ move.notation = this.vr.getNotation(move);
+ this.vr.play(move);
+ if (!move.fen)
+ move.fen = this.vr.getFen();
+ if (this.sound == 2)
+ new Audio("/sounds/move.mp3").play().catch(err => {});
+ if (this.mode == "human")
+ {
+ updateStorage(move); //after our moves and opponent moves
+ if (this.vr.turn == this.userColor)
+ this.conn.send(JSON.stringify({code:"newmove", move:move, oppid:this.oppid}));
+ }
+ else if (this.mode == "computer")
+ {
+ // Send the move to web worker (including his own moves)
+ this.compWorker.postMessage(["newmove",move]);
+ }
+ if (this.score == "*" || this.mode == "analyze")
+ {
+ // Stack move on movesList
+ this.moves.push(move);
+ }
+ // Is opponent in check?
+ this.incheck = this.vr.getCheckSquares(this.vr.turn);
+ const score = this.vr.getCurrentScore();
+ if (score != "*")
+ {
+ if (["human","computer"].includes(this.mode))
+ this.endGame(score);
+ else //just show score on screen (allow undo)
+ this.showScoreMsg(score);
+ // TODO: notify end of game (give score)
+ }
+ else if (this.mode == "computer" && this.vr.turn != this.userColor)
+ this.playComputerMove();
+ },
+ undo: function(move) {
+ this.vr.undo(move);
+ if (this.sound == 2)
+ new Audio("/sounds/undo.mp3").play().catch(err => {});
+ this.incheck = this.vr.getCheckSquares(this.vr.turn);
+ if (this.mode == "analyze")
+ this.moves.pop();
+ },