4 .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
6 button(@click="clickReadRules()") {{ st.tr["Rules"] }}
8 v-show="!gameInProgress"
9 @click="startGame('auto')"
11 | {{ st.tr["Example game"] }}
13 v-show="!gameInProgress"
14 @click="startGame('versus')"
16 | {{ st.tr["Practice"] }}
18 v-show="gameInProgress"
21 | {{ st.tr["Stop game"] }}
24 @click="gotoAnalyze()"
26 | {{ st.tr["Analysis mode"] }}
28 .col-sm-12.col-md-8.col-md-offset-2.col-lg-6.col-lg-offset-3
29 h4#variantName(v-show="display=='rules'") {{ getVariantDisplay }}
31 v-show="display=='rules'"
36 v-show="display=='computer'"
38 @game-stopped="gameStopped"
43 import ComputerGame from "@/components/ComputerGame.vue";
44 import { store } from "@/store";
45 import { replaceByDiag } from "@/utils/printDiagram";
46 import { CompgameStorage } from "@/utils/compgameStorage";
47 import afterRawLoad from "@/utils/afterRawLoad";
57 gameInProgress: false,
58 // variables passed to ComputerGame:
67 $route: function(newRoute) {
68 this.re_setVariant(newRoute.params["vname"]);
72 // NOTE: variant cannot be set before store is initialized
73 this.re_setVariant(this.$route.params["vname"]);
76 showAnalyzeBtn: function() {
77 return !!this.V && this.V.CanAnalyze;
79 getVariantDisplay: function() {
80 if (!this.gameInfo.vname) return ""; //variant not set yet
81 return this.st.variants.find(v => v.name == this.gameInfo.vname).display;
84 if (!this.gameInfo.vname) return ""; //variant not set yet
88 "raw-loader!@/translations/rules/" +
89 this.gameInfo.vname + "/" + this.st.lang + ".pug"
91 ).replace(/(fen:)([^:]*):/g, replaceByDiag)
96 clickReadRules: function() {
97 if (this.display != "rules") this.display = "rules";
98 else if (this.gameInProgress) this.display = "computer";
100 re_setVariant: async function(vname) {
101 const key = "rr_" + vname;
102 if (!localStorage.getItem(key))
103 // Mark rules as "read"
104 localStorage.setItem(key, '1');
105 await import("@/variants/" + vname + ".js")
107 this.V = window.V = vModule[vname + "Rules"];
108 this.gameInfo.vname = vname;
111 // Soon after component creation, st.tr might be uninitialized.
112 // Set a timeout to let a chance for the message to show translated.
113 const text = "Mispelled variant name";
115 alert(this.st.tr[text] || text);
116 this.$router.replace("/variants");
120 startGame: function(mode) {
121 if (this.gameInProgress) return;
122 this.gameInProgress = true;
123 this.display = "computer";
124 this.gameInfo.mode = mode;
125 if (this.gameInfo.mode == "versus") {
126 CompgameStorage.get(this.gameInfo.vname, (game) => {
127 // NOTE: game might be null (if none stored yet)
128 if (!!game && !V.IsGoodFen(game.fen)) {
129 // Some issues with stored game: delete
130 CompgameStorage.remove(game.vname);
133 this.$refs["compgame"].launchGame(game);
136 else this.$refs["compgame"].launchGame();
138 // The user wants to stop the game:
139 stopGame: function() {
140 this.$refs["compgame"].gameOver("?", "Undetermined result");
142 // The game is effectively stopped:
143 gameStopped: function() {
144 this.gameInProgress = false;
145 if (this.gameInfo.mode == "versus")
146 CompgameStorage.remove(this.gameInfo.vname);
148 gotoAnalyze: function() {
150 "/analyse/" + this.gameInfo.vname +
151 "/?fen=" + V.GenRandInitFen(this.st.settings.randomness)
158 <!-- NOTE: not scoped here, because HTML is injected -->
160 @import "@/styles/_board_squares_img.sass"
161 @import "@/styles/_rules.sass"
164 <style lang="sass" scoped>