X-Git-Url: https://git.auder.net/variants/Baroque/complete_rules.html?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FRules.vue;h=4daebf9d80e7bdfcbb3aa09bb1327f9f50256cfc;hb=6808d7a16ec1e761c6a2dffec2281c96953e4d89;hp=5f9d6dd748ce985d5f56ead943768dec7bdaefaf;hpb=9a3049f3a48fa4b3627ef26ccdf213a8e550d478;p=vchess.git diff --git a/client/src/views/Rules.vue b/client/src/views/Rules.vue index 5f9d6dd7..4daebf9d 100644 --- a/client/src/views/Rules.vue +++ b/client/src/views/Rules.vue @@ -23,9 +23,9 @@ import ComputerGame from "@/components/ComputerGame.vue"; import { store } from "@/store"; import { getDiagram } from "@/utils/printDiagram"; export default { - name: 'my-rules', + name: "my-rules", components: { - ComputerGame, + ComputerGame }, data: function() { return { @@ -37,14 +37,14 @@ export default { vname: "", mode: "versus", fen: "", - score: "*", + score: "*" } }; }, watch: { - "$route": function(newRoute) { + $route: function(newRoute) { this.re_setVariant(newRoute.params["vname"]); - }, + } }, created: function() { // NOTE: variant cannot be set before store is initialized @@ -52,23 +52,27 @@ export default { }, computed: { content: function() { - if (!this.gameInfo.vname) - return ""; //variant not set yet + if (!this.gameInfo.vname) return ""; //variant not set yet // (AJAX) Request to get rules content (plain text, HTML) - return require("raw-loader!@/translations/rules/" + - this.gameInfo.vname + "/" + this.st.lang + ".pug") - // Next two lines fix a weird issue after last update (2019-11) - .replace(/\\n/g, " ").replace(/\\"/g, '"') - .replace('module.exports = "', '').replace(/"$/, "") - .replace(/(fen:)([^:]*):/g, this.replaceByDiag); - }, + return ( + require("raw-loader!@/translations/rules/" + + this.gameInfo.vname + + "/" + + this.st.lang + + ".pug") + // Next two lines fix a weird issue after last update (2019-11) + .replace(/\\n/g, " ") + .replace(/\\"/g, '"') + .replace('module.exports = "', "") + .replace(/"$/, "") + .replace(/(fen:)([^:]*):/g, this.replaceByDiag) + ); + } }, methods: { clickReadRules: function() { - if (this.display != "rules") - this.display = "rules"; - else if (this.gameInProgress) - this.display = "computer"; + if (this.display != "rules") this.display = "rules"; + else if (this.gameInProgress) this.display = "computer"; }, parseFen(fen) { const fenParts = fen.split(" "); @@ -76,7 +80,7 @@ export default { position: fenParts[0], marks: fenParts[1], orientation: fenParts[2], - shadow: fenParts[3], + shadow: fenParts[3] }; }, // Method to replace diagrams in loaded HTML @@ -90,8 +94,7 @@ export default { this.gameInfo.vname = vname; }, startGame: function(mode) { - if (this.gameInProgress) - return; + if (this.gameInProgress) return; this.gameInProgress = true; this.display = "computer"; this.gameInfo.mode = mode; @@ -107,10 +110,11 @@ export default { this.gameInProgress = false; }, gotoAnalyze: function() { - this.$router.push("/analyse/" + this.gameInfo.vname - + "/?fen=" + V.GenRandInitFen()); - }, - }, + this.$router.push( + "/analyse/" + this.gameInfo.vname + "/?fen=" + V.GenRandInitFen() + ); + } + } }; @@ -186,48 +190,4 @@ ul:not(.browser-default) ul:not(.browser-default) > li list-style-type: disc - -.light-square-diag - background-color: #e5e5ca - -.dark-square-diag - background-color: #6f8f57 - -// TODO: following is duplicated (Board.vue) -div.board - float: left - height: 0 - display: inline-block - position: relative - -div.board8 - width: 12.5% - padding-bottom: 12.5% - -div.board10 - width: 10% - padding-bottom: 10% - -div.board11 - width: 9.09% - padding-bottom: 9.1% - -img.piece - width: 100% - -img.piece, img.mark-square - max-width: 100% - height: auto - display: block - -img.mark-square - opacity: 0.6 - width: 76% - position: absolute - top: 12% - left: 12% - opacity: .7 - -.in-shadow - filter: brightness(50%)