X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fcomponents%2FBaseGame.vue;h=3c14a7fd08c4d436d1ce9d28f630b0f742dbfeac;hb=f9c36b2da005b596ad656f4b6cc4e09ef3c656f1;hp=85007395acb1dc185527aba19e2242830e98fb92;hpb=e533e1ba918a45e6f8f3292dc5180ec9cb05f4d7;p=vchess.git diff --git a/client/src/components/BaseGame.vue b/client/src/components/BaseGame.vue index 85007395..3c14a7fd 100644 --- a/client/src/components/BaseGame.vue +++ b/client/src/components/BaseGame.vue @@ -23,11 +23,16 @@ div#baseGame ) #turnIndicator(v-if="showTurn") {{ turn }} #controls - button(@click="gotoBegin()") << - button(@click="undo()") < - button(v-if="canFlip" @click="flip()") ⇅ - button(@click="play()") > - button(@click="gotoEnd()") >> + button(@click="gotoBegin()") + img.inline(src="/images/icons/fast-forward_rev.svg") + button(@click="undo()") + img.inline(src="/images/icons/play_rev.svg") + button(v-if="canFlip" @click="flip()") + img.inline(src="/images/icons/flip.svg") + button(@click="play()") + img.inline(src="/images/icons/play.svg") + button(@click="gotoEnd()") + img.inline(src="/images/icons/fast-forward.svg") #belowControls #downloadDiv(v-if="allowDownloadPGN") a#download(href="#") @@ -45,7 +50,6 @@ div#baseGame | {{ st.tr["Rules"] }} #movesList MoveList( - v-if="showMoves != 'none'" :show="showMoves" :score="game.score" :message="game.scoreMsg" @@ -223,11 +227,13 @@ export default { this.lastMove = null; }, analyzePosition: function() { - const newUrl = + let newUrl = "/analyse/" + this.game.vname + "/?fen=" + this.vr.getFen().replace(/ /g, "_"); + if (this.game.mycolor) + newUrl += "&side=" + this.game.mycolor; // Open in same tab in live games (against cheating) if (this.game.type == "live") this.$router.push(newUrl); else window.open("#" + newUrl); @@ -268,6 +274,7 @@ export default { // Animate an elementary move animateMove: function(move, callback) { let startSquare = document.getElementById(getSquareId(move.start)); + if (!startSquare) return; //shouldn't happen but... let endSquare = document.getElementById(getSquareId(move.end)); let rectStart = startSquare.getBoundingClientRect(); let rectEnd = endSquare.getBoundingClientRect(); @@ -278,6 +285,9 @@ export default { let movingPiece = document.querySelector( "#" + getSquareId(move.start) + " > img.piece" ); + // For some unknown reasons Opera get "movingPiece == null" error + // TOOO: is it calling 'animate()' twice ? One extra time ? + if (!movingPiece) return; // HACK for animation (with positive translate, image slides "under background") // Possible improvement: just alter squares on the piece's way... const squares = document.getElementsByClassName("board"); @@ -333,7 +343,7 @@ export default { } }; const playMove = () => { - const animate = V.ShowMoves == "all" && received; + const animate = V.ShowMoves == "all" && (received || navigate); if (!Array.isArray(move)) move = [move]; let moveIdx = 0; let self = this; @@ -505,10 +515,17 @@ export default { #controls margin: 0 auto text-align: center + display: flex button display: inline-block width: 20% margin: 0 + img.inline + height: 24px + padding-top: 5px + @media screen and (max-width: 767px) + img.inline + height: 18px #turnIndicator text-align: center