Commit | Line | Data |
---|---|---|
a6088c90 BA |
1 | <template lang="pug"> |
2 | .row | |
3 | .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2 | |
834c202a BA |
4 | BaseGame(:game="game" :vr="vr" ref="basegame" |
5 | @newmove="processMove" @gameover="gameOver") | |
a6088c90 BA |
6 | </template> |
7 | ||
8 | <script> | |
9 | import BaseGame from "@/components/BaseGame.vue"; | |
10 | import { store } from "@/store"; | |
41cb9b94 | 11 | import Worker from "worker-loader!@/playCompMove"; |
a6088c90 BA |
12 | |
13 | export default { | |
41cb9b94 | 14 | name: "my-computer-game", |
a6088c90 BA |
15 | components: { |
16 | BaseGame, | |
17 | }, | |
6dd02928 | 18 | // gameInfo: fen + mode + vname |
a6088c90 | 19 | // mode: "auto" (game comp vs comp), "versus" (normal) or "analyze" |
6dd02928 | 20 | props: ["gameInfo"], |
a6088c90 BA |
21 | data: function() { |
22 | return { | |
23 | st: store.state, | |
41cb9b94 | 24 | game: {}, |
b7c32f1a | 25 | vr: null, |
a6088c90 BA |
26 | // Web worker to play computer moves without freezing interface: |
27 | timeStart: undefined, //time when computer starts thinking | |
41cb9b94 | 28 | compThink: false, //avoid asking a new move while one is being searched |
a6088c90 | 29 | compWorker: null, |
a6088c90 BA |
30 | }; |
31 | }, | |
a6088c90 | 32 | watch: { |
834c202a | 33 | "gameInfo.fen": function() { |
a6088c90 BA |
34 | this.launchGame(); |
35 | }, | |
41cb9b94 BA |
36 | "gameInfo.score": function(newScore) { |
37 | if (newScore != "*") | |
834c202a | 38 | { |
41cb9b94 | 39 | this.game.score = newScore; //user action |
834c202a | 40 | this.game.mode = "analyze"; |
41cb9b94 BA |
41 | if (!this.compThink) |
42 | this.$emit("game-stopped"); //otherwise wait for comp | |
834c202a BA |
43 | } |
44 | }, | |
a6088c90 BA |
45 | }, |
46 | // Modal end of game, and then sub-components | |
47 | created: function() { | |
41cb9b94 BA |
48 | // Computer moves web worker logic: |
49 | this.compWorker = new Worker(); | |
a6088c90 | 50 | this.compWorker.onmessage = e => { |
a6088c90 | 51 | let compMove = e.data; |
41cb9b94 BA |
52 | if (!compMove) |
53 | return; //after game ends, no more moves, nothing to do | |
a6088c90 BA |
54 | if (!Array.isArray(compMove)) |
55 | compMove = [compMove]; //to deal with MarseilleRules | |
56 | // Small delay for the bot to appear "more human" | |
41cb9b94 BA |
57 | // TODO: debug delay, 2000 --> 0 |
58 | const delay = 2000 + Math.max(500-(Date.now()-this.timeStart), 0); | |
59 | console.log("GOT MOVE: " + this.compThink); | |
a6088c90 | 60 | setTimeout(() => { |
41cb9b94 | 61 | // NOTE: Dark and 2-moves are incompatible |
6dd02928 | 62 | const animate = (this.gameInfo.vname != "Dark"); |
1acda11c | 63 | this.$refs.basegame.play(compMove[0], animate); |
41cb9b94 BA |
64 | const waitEndOfAnimation = () => { |
65 | // 250ms = length of animation (TODO: some constant somewhere) | |
66 | setTimeout( () => { | |
67 | console.log("RESET: " + this.compThink); | |
68 | this.compThink = false; | |
69 | if (this.game.score != "*") //user action | |
70 | this.$emit("game-stopped"); | |
71 | }, animate ? 250 : 0); | |
72 | }; | |
a6088c90 | 73 | if (compMove.length == 2) |
41cb9b94 BA |
74 | { |
75 | setTimeout( () => { | |
76 | this.$refs.basegame.play(compMove[1], animate); | |
77 | waitEndOfAnimation(); | |
78 | }, 750); | |
79 | } | |
80 | else | |
81 | waitEndOfAnimation(); | |
a6088c90 BA |
82 | }, delay); |
83 | } | |
834c202a | 84 | if (!!this.gameInfo.fen) |
b7c32f1a | 85 | this.launchGame(); |
a6088c90 BA |
86 | }, |
87 | // dans variant.js (plutôt room.js) conn gère aussi les challenges | |
88 | // et les chats dans chat.js. Puis en webRTC, repenser tout ça. | |
89 | methods: { | |
90 | launchGame: async function() { | |
6dd02928 | 91 | const vModule = await import("@/variants/" + this.gameInfo.vname + ".js"); |
a6088c90 | 92 | window.V = vModule.VariantRules; |
6dd02928 | 93 | this.compWorker.postMessage(["scripts",this.gameInfo.vname]); |
834c202a BA |
94 | this.compWorker.postMessage(["init",this.gameInfo.fen]); |
95 | this.vr = new V(this.gameInfo.fen); | |
96 | const mycolor = (Math.random() < 0.5 ? "w" : "b"); | |
41cb9b94 | 97 | let players = [{name:"Myself"},{name:"Computer"}]; |
834c202a BA |
98 | if (mycolor == "b") |
99 | players = players.reverse(); | |
41cb9b94 | 100 | // NOTE: fen and fenStart are redundant in game object |
834c202a BA |
101 | this.game = Object.assign({}, |
102 | this.gameInfo, | |
103 | { | |
104 | fenStart: this.gameInfo.fen, | |
105 | players: players, | |
106 | mycolor: mycolor, | |
2c6cb25e | 107 | score: "*", |
834c202a BA |
108 | }); |
109 | this.compWorker.postMessage(["init",this.gameInfo.fen]); | |
110 | if (mycolor != "w" || this.gameInfo.mode == "auto") | |
37cdcbf3 | 111 | this.playComputerMove(); |
a6088c90 BA |
112 | }, |
113 | playComputerMove: function() { | |
114 | this.timeStart = Date.now(); | |
41cb9b94 BA |
115 | this.compThink = true; |
116 | console.log("ASK MOVE (SET TRUE): " + this.compThink); | |
a6088c90 BA |
117 | this.compWorker.postMessage(["askmove"]); |
118 | }, | |
1acda11c BA |
119 | processMove: function(move) { |
120 | // Send the move to web worker (including his own moves) | |
121 | this.compWorker.postMessage(["newmove",move]); | |
122 | // subTurn condition for Marseille (and Avalanche) rules | |
123 | if ((!this.vr.subTurn || this.vr.subTurn <= 1) | |
834c202a | 124 | && (this.gameInfo.mode == "auto" || this.vr.turn != this.game.mycolor)) |
1acda11c BA |
125 | { |
126 | this.playComputerMove(); | |
127 | } | |
128 | }, | |
93d1d7a7 | 129 | gameOver: function(score) { |
41cb9b94 | 130 | this.game.score = score; |
834c202a | 131 | this.game.mode = "analyze"; |
41cb9b94 | 132 | this.$emit("game-over", score); //bubble up to Rules.vue |
834c202a | 133 | }, |
a6088c90 BA |
134 | }, |
135 | }; | |
136 | </script> |