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 | |
b7c32f1a BA |
4 | BaseGame(:vname="vname" :analyze="analyze" |
5 | :vr="vr" :fen-start="fenStart" :players="players" :mycolor="mycolor") | |
a6088c90 BA |
6 | </template> |
7 | ||
8 | <script> | |
9 | import BaseGame from "@/components/BaseGame.vue"; | |
10 | import { store } from "@/store"; | |
11 | import Worker from 'worker-loader!@/playCompMove'; | |
12 | ||
13 | export default { | |
14 | name: 'my-computer-game', | |
15 | components: { | |
16 | BaseGame, | |
17 | }, | |
18 | // mode: "auto" (game comp vs comp), "versus" (normal) or "analyze" | |
b7c32f1a | 19 | props: ["fen","mode","vname"], |
a6088c90 BA |
20 | data: function() { |
21 | return { | |
22 | st: store.state, | |
b7c32f1a BA |
23 | // variables passed to BaseGame: |
24 | fenStart: "", | |
25 | vr: null, | |
26 | players: ["Myself","Computer"], //always playing white for now | |
27 | mycolor: "w", | |
a6088c90 BA |
28 | // Web worker to play computer moves without freezing interface: |
29 | timeStart: undefined, //time when computer starts thinking | |
30 | lockCompThink: false, //to avoid some ghost moves | |
a6088c90 | 31 | compWorker: null, |
a6088c90 BA |
32 | }; |
33 | }, | |
34 | computed: { | |
35 | analyze: function() { | |
36 | return this.mode == "analyze"; | |
37 | }, | |
38 | }, | |
39 | watch: { | |
40 | fen: function() { | |
41 | // (Security) No effect if a computer move is in progress: | |
42 | if (this.lockCompThink) | |
43 | return this.$emit("computer-think"); | |
44 | this.launchGame(); | |
45 | }, | |
46 | }, | |
47 | // Modal end of game, and then sub-components | |
48 | created: function() { | |
a6088c90 BA |
49 | // Computer moves web worker logic: (TODO: also for observers in HH games ?) |
50 | this.compWorker = new Worker(); //'/javascripts/playCompMove.js'), | |
51 | this.compWorker.onmessage = e => { | |
52 | this.lockCompThink = true; //to avoid some ghost moves | |
53 | let compMove = e.data; | |
54 | if (!Array.isArray(compMove)) | |
55 | compMove = [compMove]; //to deal with MarseilleRules | |
56 | // Small delay for the bot to appear "more human" | |
57 | const delay = Math.max(500-(Date.now()-this.timeStart), 0); | |
58 | setTimeout(() => { | |
b7c32f1a | 59 | const animate = this.vname != "Dark"; |
a6088c90 BA |
60 | this.play(compMove[0], animate); |
61 | if (compMove.length == 2) | |
62 | setTimeout( () => { this.play(compMove[1], animate); }, 750); | |
63 | else //250 == length of animation (TODO: should be a constant somewhere) | |
64 | setTimeout( () => this.lockCompThink = false, 250); | |
65 | }, delay); | |
66 | } | |
b7c32f1a BA |
67 | if (!!this.fen) |
68 | this.launchGame(); | |
a6088c90 BA |
69 | }, |
70 | // dans variant.js (plutôt room.js) conn gère aussi les challenges | |
71 | // et les chats dans chat.js. Puis en webRTC, repenser tout ça. | |
72 | methods: { | |
73 | launchGame: async function() { | |
b7c32f1a | 74 | const vModule = await import("@/variants/" + this.vname + ".js"); |
a6088c90 | 75 | window.V = vModule.VariantRules; |
b7c32f1a | 76 | this.compWorker.postMessage(["scripts",this.vname]); |
a6088c90 BA |
77 | this.newGameFromFen(this.fen); |
78 | }, | |
79 | newGameFromFen: function(fen) { | |
80 | this.vr = new V(fen); | |
81 | this.moves = []; | |
82 | this.cursor = -1; | |
83 | this.fenStart = fen; | |
84 | this.score = "*"; | |
85 | if (this.mode == "analyze") | |
86 | { | |
87 | this.mycolor = V.ParseFen(fen).turn; | |
88 | this.orientation = this.mycolor; | |
89 | } | |
90 | else if (this.mode == "computer") //only other alternative (HH with gameId) | |
91 | { | |
92 | this.mycolor = (Math.random() < 0.5 ? "w" : "b"); | |
93 | this.orientation = this.mycolor; | |
94 | this.compWorker.postMessage(["init",fen]); | |
95 | if (this.mycolor != "w" || this.subMode == "auto") | |
96 | this.playComputerMove(); | |
97 | } | |
98 | }, | |
99 | playComputerMove: function() { | |
100 | this.timeStart = Date.now(); | |
101 | this.compWorker.postMessage(["askmove"]); | |
102 | }, | |
103 | }, | |
104 | }; | |
105 | </script> |