Commit | Line | Data |
---|---|---|
7f3484bd | 1 | <template lang="pug"> |
7aa548e7 | 2 | main |
63ca2b89 BA |
3 | .row |
4 | .col-sm-12 | |
5157ce0b BA |
5 | #fenDiv |
6 | input#fen(v-model="curFen" @input="adjustFenSize") | |
602d6bef BA |
7 | button(@click="gotoFen") {{ st.tr["Go"] }} |
8 | BaseGame(:game="game" :vr="vr" ref="basegame") | |
7f3484bd BA |
9 | </template> |
10 | ||
11 | <script> | |
12 | import BaseGame from "@/components/BaseGame.vue"; | |
7f3484bd | 13 | import { store } from "@/store"; |
7f3484bd BA |
14 | import { ArrayFun } from "@/utils/array"; |
15 | ||
16 | export default { | |
677fe285 | 17 | name: 'my-analyse', |
7f3484bd BA |
18 | components: { |
19 | BaseGame, | |
7f3484bd BA |
20 | }, |
21 | // gameRef: to find the game in (potentially remote) storage | |
22 | data: function() { | |
23 | return { | |
24 | st: store.state, | |
25 | gameRef: { //given in URL (rid = remote ID) | |
652f40de BA |
26 | vname: "", |
27 | fen: "" | |
28 | }, | |
29 | game: { | |
677fe285 | 30 | players:[{name:"Analyse"},{name:"Analyse"}], |
652f40de | 31 | mode: "analyze" |
7f3484bd | 32 | }, |
7f3484bd | 33 | vr: null, //"variant rules" object initialized from FEN |
5157ce0b | 34 | curFen: "", |
652f40de | 35 | //people: [], //players + observers //TODO later: interactive analyze... |
7f3484bd BA |
36 | }; |
37 | }, | |
38 | watch: { | |
a0c41e7e BA |
39 | // NOTE: no watcher for $route change, because if fenStart doesn't change |
40 | // then it doesn't trigger BaseGame.re_init() and the result is weird. | |
5157ce0b BA |
41 | "vr.movesCount": function(fen) { |
42 | this.curFen = this.vr.getFen(); | |
43 | this.adjustFenSize(); | |
44 | }, | |
7f3484bd | 45 | }, |
7f3484bd | 46 | created: function() { |
652f40de | 47 | this.gameRef.vname = this.$route.params["vname"]; |
a0c41e7e | 48 | if (this.gameRef.vname == "Dark") |
0e16cb26 | 49 | { |
677fe285 | 50 | alert(this.st.tr["Analyse in Dark mode makes no sense!"]); |
0e16cb26 BA |
51 | history.back(); //or this.$router.go(-1) |
52 | } | |
a0c41e7e BA |
53 | else |
54 | { | |
55 | this.gameRef.fen = this.$route.query["fen"].replace(/_/g, " "); | |
56 | this.initialize(); | |
57 | } | |
7f3484bd BA |
58 | }, |
59 | methods: { | |
a0c41e7e | 60 | initialize: async function() { |
5157ce0b BA |
61 | // Obtain VariantRules object |
62 | const vModule = await import("@/variants/" + this.gameRef.vname + ".js"); | |
63 | window.V = vModule.VariantRules; | |
a0c41e7e | 64 | this.loadGame(); |
5157ce0b BA |
65 | }, |
66 | loadGame: function() { | |
0e16cb26 | 67 | // NOTE: no need to set score (~unused) |
652f40de BA |
68 | this.game.vname = this.gameRef.vname; |
69 | this.game.fen = this.gameRef.fen; | |
5157ce0b BA |
70 | this.curFen = this.game.fen; |
71 | this.adjustFenSize(); | |
652f40de | 72 | this.vr = new V(this.game.fen); |
d641bec1 | 73 | this.game.mycolor = this.vr.turn; |
77c50966 | 74 | this.$set(this.game, "fenStart", this.gameRef.fen); |
7f3484bd | 75 | }, |
5157ce0b BA |
76 | adjustFenSize: function() { |
77 | let fenInput = document.getElementById("fen"); | |
78 | fenInput.style.width = this.curFen.length + "ch"; | |
79 | }, | |
80 | gotoFen: function() { | |
81 | this.gameRef.fen = this.curFen; | |
82 | this.loadGame(); | |
83 | }, | |
7f3484bd BA |
84 | }, |
85 | }; | |
86 | </script> | |
87 | ||
5157ce0b BA |
88 | <style lang="sass" scoped> |
89 | #fenDiv | |
90 | text-align: center | |
7f3484bd | 91 | </style> |