<template lang="pug">
BaseGame(
+ ref="basegame"
:game="game"
:vr="vr"
@newmove="processMove"
<script>
import BaseGame from "@/components/BaseGame.vue";
import { store } from "@/store";
+import { CompgameStorage } from "@/utils/compgameStorage";
import Worker from "worker-loader!@/playCompMove";
export default {
name: "my-computer-game",
compWorker: null
};
},
- watch: {
- "gameInfo.fen": function() {
- this.launchGame();
- },
- "gameInfo.score": function(newScore) {
- if (newScore != "*") {
- this.game.score = newScore; //user action
- if (!this.compThink) this.$emit("game-stopped"); //otherwise wait for comp
- }
- }
- },
- // Modal end of game, and then sub-components
created: function() {
// Computer moves web worker logic:
this.compWorker = new Worker();
let moveIdx = 0;
let self = this;
(function executeMove() {
- self.$set(self.game, "moveToPlay", compMove[moveIdx++]);
+ // NOTE: BaseGame::play() will trigger processMove() here
+ self.$refs["basegame"].play(compMove[moveIdx++], "received");
if (moveIdx >= compMove.length) {
self.compThink = false;
if (self.game.score != "*")
- //user action
+ // User action
self.$emit("game-stopped");
} else setTimeout(executeMove, 500 + animDelay);
})();
}, delay);
};
- if (this.gameInfo.fen) this.launchGame();
},
methods: {
- launchGame: function() {
+ launchGame: function(game) {
this.compWorker.postMessage(["scripts", this.gameInfo.vname]);
- this.compWorker.postMessage(["init", this.gameInfo.fen]);
- this.vr = new V(this.gameInfo.fen);
- const mycolor = Math.random() < 0.5 ? "w" : "b";
- let players = [{ name: "Myself" }, { name: "Computer" }];
- if (mycolor == "b") players = players.reverse();
+ if (!game) {
+ game = {
+ vname: this.gameInfo.vname,
+ fenStart: V.GenRandInitFen(),
+ mycolor: Math.random() < 0.5 ? "w" : "b",
+ moves: []
+ };
+ game.fen = game.fenStart;
+ if (this.gameInfo.mode == "versus")
+ CompgameStorage.add(game);
+ }
+ this.compWorker.postMessage(["init", game.fen]);
+ this.vr = new V(game.fen);
+ game.players = [{ name: "Myself" }, { name: "Computer" }];
+ if (game.myColor == "b") game.players = game.players.reverse();
+ game.score = "*"; //finished games are removed
this.currentUrl = document.location.href; //to avoid playing outside page
- // NOTE: fen and fenStart are redundant in game object
- this.game = Object.assign({}, this.gameInfo, {
- fenStart: this.gameInfo.fen,
- players: players,
- mycolor: mycolor,
- score: "*"
- });
- this.compWorker.postMessage(["init", this.gameInfo.fen]);
- if (mycolor != "w" || this.gameInfo.mode == "auto")
+ this.game = game;
+ this.compWorker.postMessage(["init", game.fen]);
+ if (this.gameInfo.mode == "auto" || game.mycolor != this.vr.turn)
this.playComputerMove();
},
+ // NOTE: a "goto" action could lead to an error when comp is thinking,
+ // but it's OK because from the user viewpoint the game just stops.
playComputerMove: function() {
this.timeStart = Date.now();
this.compThink = true;
) {
this.playComputerMove();
}
+ // Finally, update storage:
+ if (this.gameInfo.mode == "versus") {
+ const allowed_fields = ["appear", "vanish", "start", "end"];
+ const filtered_move = Object.keys(move)
+ .filter(key => allowed_fields.includes(key))
+ .reduce((obj, key) => {
+ obj[key] = move[key];
+ return obj;
+ }, {});
+ CompgameStorage.update(this.gameInfo.vname, {
+ move: filtered_move,
+ fen: move.fen
+ });
+ }
},
gameOver: function(score, scoreMsg) {
this.game.score = score;
this.game.scoreMsg = scoreMsg;
- this.$emit("game-over", score); //bubble up to Rules.vue
+ if (!this.compThink) this.$emit("game-stopped"); //otherwise wait for comp
}
}
};