X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FRules.vue;h=f626cc9e66ad0af8d59932d6f3a0d5b9772ead23;hb=2c6cb25eb12074af1f0fb29383eef8a175abb0f0;hp=c92e0abe07fcc32d00a1e618fcd93acab4556904;hpb=a6088c906bbe6fae95707dc7028e45023fe39981;p=vchess.git diff --git a/client/src/views/Rules.vue b/client/src/views/Rules.vue index c92e0abe..f626cc9e 100644 --- a/client/src/views/Rules.vue +++ b/client/src/views/Rules.vue @@ -3,15 +3,14 @@ .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2 .button-group button(@click="display='rules'") Read the rules - button(v-show="!gameInProgress" @click="watchComputerGame") + button(v-show="!gameInProgress" @click="() => startGame('auto')") | Observe a sample game - button(v-show="!gameInProgress" @click="playAgainstComputer") + button(v-show="!gameInProgress" @click="() => startGame('versus')") | Beat the computer! button(v-show="gameInProgress" @click="stopGame") | Stop game .section-content(v-show="display=='rules'" v-html="content") - ComputerGame(v-show="display=='computer'" - :fen="fen" :mode="mode" :variant="variant" + ComputerGame(v-show="display=='computer'" :game-info="gameInfo" @computer-think="gameInProgress=false" @game-over="stopGame") @@ -19,6 +18,7 @@ import ComputerGame from "@/components/ComputerGame.vue"; import { store } from "@/store"; import { getDiagram } from "@/utils/printDiagram"; + export default { name: 'my-rules', components: { @@ -27,13 +27,16 @@ export default { data: function() { return { st: store.state, - variant: {id: 0, name: "_unknown"}, //...yet content: "", display: "rules", - mode: "versus", gameInProgress: false, - mycolor: "w", - fen: "", + // variables passed to ComputerGame: + gameInfo: { + vname: "_unknown", + mode: "versus", + fen: "", + userStop: false, + } }; }, watch: { @@ -58,13 +61,7 @@ export default { tryChangeVariant: async function(vname) { if (!vname || vname == "_unknown") return; - if (this.st.variants.length > 0) - { - const idxOfVar = this.st.variants.findIndex(e => e.name == vname); - this.variant = this.st.variants[idxOfVar]; - } - else - this.variant.name = vname; + this.gameInfo.vname = vname; const vModule = await import("@/variants/" + vname + ".js"); window.V = vModule.VariantRules; // Method to replace diagrams in loaded HTML @@ -75,26 +72,24 @@ export default { // (AJAX) Request to get rules content (plain text, HTML) this.content = require("raw-loader!@/rules/" + vname + "/" + this.st.lang + ".pug") + // Next two lines fix a weird issue after last update (2019-11) + .replace(/\\[n"]/g, " ") + .replace('module.exports = "', '').replace(/"$/, "") .replace(/(fen:)([^:]*):/g, replaceByDiag); }, - startGame: function() { + startGame: function(mode) { if (this.gameInProgress) return; this.gameInProgress = true; this.display = "computer"; - this.fen = V.GenRandInitFen(); + this.gameInfo.mode = mode; + this.gameInfo.userStop = false; + this.gameInfo.fen = V.GenRandInitFen(); }, stopGame: function() { this.gameInProgress = false; - this.mode = "analyze"; - }, - playAgainstComputer: function() { - this.mode = "versus"; - this.startGame(); - }, - watchComputerGame: function() { - this.mode = "auto"; - this.startGame(); + this.gameInfo.userStop = true; + this.gameInfo.mode = "analyze"; }, }, };