Commit | Line | Data |
---|---|---|
a6088c90 | 1 | <template lang="pug"> |
910d631b | 2 | BaseGame( |
8477e53d | 3 | ref="basegame" |
910d631b | 4 | :game="game" |
910d631b BA |
5 | @newmove="processMove" |
6 | @gameover="gameOver" | |
7 | ) | |
a6088c90 BA |
8 | </template> |
9 | ||
10 | <script> | |
11 | import BaseGame from "@/components/BaseGame.vue"; | |
12 | import { store } from "@/store"; | |
98b94cc3 | 13 | import { CompgameStorage } from "@/utils/compgameStorage"; |
e71161fb | 14 | import { playMove, getFilteredMove } from "@/utils/playUndo"; |
41cb9b94 | 15 | import Worker from "worker-loader!@/playCompMove"; |
a6088c90 | 16 | export default { |
41cb9b94 | 17 | name: "my-computer-game", |
a6088c90 | 18 | components: { |
6808d7a1 | 19 | BaseGame |
a6088c90 | 20 | }, |
6dd02928 | 21 | // gameInfo: fen + mode + vname |
63ca2b89 | 22 | // mode: "auto" (game comp vs comp) or "versus" (normal) |
6dd02928 | 23 | props: ["gameInfo"], |
a6088c90 BA |
24 | data: function() { |
25 | return { | |
26 | st: store.state, | |
41cb9b94 | 27 | game: {}, |
b7c32f1a | 28 | vr: null, |
a6088c90 BA |
29 | // Web worker to play computer moves without freezing interface: |
30 | timeStart: undefined, //time when computer starts thinking | |
41cb9b94 | 31 | compThink: false, //avoid asking a new move while one is being searched |
6808d7a1 | 32 | compWorker: null |
a6088c90 BA |
33 | }; |
34 | }, | |
a6088c90 | 35 | created: function() { |
41cb9b94 BA |
36 | // Computer moves web worker logic: |
37 | this.compWorker = new Worker(); | |
a6088c90 | 38 | this.compWorker.onmessage = e => { |
a6088c90 | 39 | let compMove = e.data; |
a6088c90 | 40 | // Small delay for the bot to appear "more human" |
4404e58c BA |
41 | const minDelay = this.gameInfo.mode == "versus" ? 500 : 1000; |
42 | const delay = Math.max(minDelay - (Date.now() - this.timeStart), 0); | |
e71161fb | 43 | let self = this; |
a6088c90 | 44 | setTimeout(() => { |
6808d7a1 | 45 | if (this.currentUrl != document.location.href) return; //page change |
e71161fb BA |
46 | // NOTE: BaseGame::play() will trigger processMove() here |
47 | self.$refs["basegame"].play(compMove, "received"); | |
48 | self.compThink = false; | |
49 | if (self.game.score != "*") | |
50 | // User action | |
51 | self.$emit("game-stopped"); | |
a6088c90 | 52 | }, delay); |
6808d7a1 | 53 | }; |
a6088c90 | 54 | }, |
a6088c90 | 55 | methods: { |
98b94cc3 | 56 | launchGame: function(game) { |
6808d7a1 | 57 | this.compWorker.postMessage(["scripts", this.gameInfo.vname]); |
98b94cc3 BA |
58 | if (!game) { |
59 | game = { | |
60 | vname: this.gameInfo.vname, | |
f35b9960 | 61 | fenStart: V.GenRandInitFen(this.st.settings.randomness), |
98b94cc3 BA |
62 | moves: [] |
63 | }; | |
64 | game.fen = game.fenStart; | |
65 | if (this.gameInfo.mode == "versus") | |
66 | CompgameStorage.add(game); | |
67 | } | |
f446ee64 BA |
68 | if (this.gameInfo.mode == "versus" && !game.mycolor) |
69 | game.mycolor = Math.random() < 0.5 ? "w" : "b"; | |
98b94cc3 BA |
70 | this.compWorker.postMessage(["init", game.fen]); |
71 | this.vr = new V(game.fen); | |
72 | game.players = [{ name: "Myself" }, { name: "Computer" }]; | |
73 | if (game.myColor == "b") game.players = game.players.reverse(); | |
74 | game.score = "*"; //finished games are removed | |
6cd07b4d | 75 | this.currentUrl = document.location.href; //to avoid playing outside page |
98b94cc3 BA |
76 | this.game = game; |
77 | this.compWorker.postMessage(["init", game.fen]); | |
78 | if (this.gameInfo.mode == "auto" || game.mycolor != this.vr.turn) | |
37cdcbf3 | 79 | this.playComputerMove(); |
a6088c90 | 80 | }, |
8477e53d BA |
81 | // NOTE: a "goto" action could lead to an error when comp is thinking, |
82 | // but it's OK because from the user viewpoint the game just stops. | |
a6088c90 BA |
83 | playComputerMove: function() { |
84 | this.timeStart = Date.now(); | |
41cb9b94 | 85 | this.compThink = true; |
a6088c90 BA |
86 | this.compWorker.postMessage(["askmove"]); |
87 | }, | |
1acda11c | 88 | processMove: function(move) { |
e71161fb BA |
89 | playMove(move, this.vr); |
90 | // This move could have ended the game: if this is the case, | |
91 | // the game is already removed from storage (if mode == 'versus') | |
6808d7a1 | 92 | if (this.game.score != "*") return; |
1acda11c | 93 | // Send the move to web worker (including his own moves) |
6808d7a1 | 94 | this.compWorker.postMessage(["newmove", move]); |
e71161fb | 95 | if (this.gameInfo.mode == "auto" || this.vr.turn != this.game.mycolor) |
1acda11c | 96 | this.playComputerMove(); |
98b94cc3 BA |
97 | // Finally, update storage: |
98 | if (this.gameInfo.mode == "versus") { | |
98b94cc3 | 99 | CompgameStorage.update(this.gameInfo.vname, { |
e71161fb BA |
100 | move: getFilteredMove(move), |
101 | fen: this.vr.getFen() | |
98b94cc3 BA |
102 | }); |
103 | } | |
1acda11c | 104 | }, |
430a2038 | 105 | gameOver: function(score, scoreMsg) { |
41cb9b94 | 106 | this.game.score = score; |
430a2038 | 107 | this.game.scoreMsg = scoreMsg; |
866842c3 | 108 | if (!this.compThink) this.$emit("game-stopped"); //otherwise wait for comp |
6808d7a1 BA |
109 | } |
110 | } | |
a6088c90 BA |
111 | }; |
112 | </script> |