X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=public%2Fjavascripts%2Fcomponents%2Fgame.js;h=3474ea84834f90018a992afaf08221a625d21a7d;hb=388e4c401f05b1f6a4c54e33c9da9114969a53c0;hp=d8fbe47d1c61c77c3a81aae4f1c514805c26e250;hpb=748eef1fe9eb666318e2a4c84c1627085666ab07;p=vchess.git diff --git a/public/javascripts/components/game.js b/public/javascripts/components/game.js index d8fbe47d..3474ea84 100644 --- a/public/javascripts/components/game.js +++ b/public/javascripts/components/game.js @@ -52,7 +52,7 @@ Vue.component('my-game', { h('button', { on: { click: this.clickGameSeek }, - attrs: { "aria-label": translations['New online game'] }, + attrs: { "aria-label": translations['New live game'] }, 'class': { "tooltip": true, "play": true, @@ -63,7 +63,7 @@ Vue.component('my-game', { }, [h('i', { 'class': { "material-icons": true } }, "accessibility")]) ); - if (["idle","chat","computer"].includes(this.mode)) + if (variant!="Dark" && ["idle","chat","computer"].includes(this.mode)) { actionArray.push( h('button', @@ -80,7 +80,7 @@ Vue.component('my-game', { [h('i', { 'class': { "material-icons": true } }, "computer")]) ); } - if (["idle","chat","friend"].includes(this.mode)) + if (variant!="Dark" && ["idle","chat","friend"].includes(this.mode)) { actionArray.push( h('button', @@ -276,7 +276,7 @@ Vue.component('my-game', { ); // Create board element (+ reserves if needed by variant or mode) const lm = this.vr.lastMove; - const showLight = this.hints && + const showLight = this.hints && variant!="Dark" && (!["idle","chat"].includes(this.mode) || this.cursor==this.vr.moves.length); const gameDiv = h('div', { @@ -298,7 +298,8 @@ Vue.component('my-game', { _.range(sizeY).map(j => { let cj = (this.mycolor=='w' ? j : sizeY-j-1); let elems = []; - if (this.vr.board[ci][cj] != VariantRules.EMPTY) + if (this.vr.board[ci][cj] != VariantRules.EMPTY && (variant!="Dark" + || this.score!="*" || this.vr.enlightened[this.mycolor][ci][cj])) { elems.push( h( @@ -342,6 +343,8 @@ Vue.component('my-game', { 'light-square': (i+j)%2==0, 'dark-square': (i+j)%2==1, [this.color]: true, + 'in-shadow': variant=="Dark" && this.score=="*" + && !this.vr.enlightened[this.mycolor][ci][cj], 'highlight': showLight && !!lm && _.isMatch(lm.end, {x:ci,y:cj}), 'incheck': showLight && incheckSq[ci][cj], }, @@ -415,7 +418,7 @@ Vue.component('my-game', { h('button', { on: { click: () => { this.mycolor = this.vr.getOppCol(this.mycolor) } }, - attrs: { "aria-label": translations['Flip'] }, + attrs: { "aria-label": translations['Flip board'] }, "class": { "play": true, "spaceleft": true, @@ -568,7 +571,7 @@ Vue.component('my-game', { { attrs: { "id": "titleFenedit" }, "class": { "section": true }, - domProps: { innerHTML: translations["Position + flags (FEN):"] }, + domProps: { innerHTML: translations["Game state (FEN):"] }, } ), h('input', @@ -919,24 +922,27 @@ Vue.component('my-game', { ) ); } - // Show current FEN - elementArray.push( - h('div', - { - attrs: { id: "fen-div" }, - "class": { "section-content": true }, - }, - [ - h('p', - { - attrs: { id: "fen-string" }, - domProps: { innerHTML: this.vr.getBaseFen() }, - "class": { "text-center": true }, - } - ) - ] - ) - ); + if (variant != "Dark" || this.score!="*") + { + // Show current FEN + elementArray.push( + h('div', + { + attrs: { id: "fen-div" }, + "class": { "section-content": true }, + }, + [ + h('p', + { + attrs: { id: "fen-string" }, + domProps: { innerHTML: this.vr.getBaseFen() }, + "class": { "text-center": true }, + } + ) + ] + ) + ); + } } return h( 'div', @@ -1016,7 +1022,7 @@ Vue.component('my-game', { this.newGame("human", data.fen, data.color, data.oppid); break; case "newmove": //..he played! - this.play(data.move, "animate"); + this.play(data.move, (variant!="Dark" ? "animate" : null)); break; case "pong": //received if we sent a ping (game still alive on our side) if (this.gameId != data.gameId) @@ -1211,6 +1217,7 @@ Vue.component('my-game', { delete localStorage[prefix+"score"]; }, // HACK because mini-css tooltips are persistent after click... + // NOTE: seems to work only in chrome/chromium. TODO... getRidOfTooltip: function(elt) { elt.style.visibility = "hidden"; setTimeout(() => { elt.style.visibility="visible"; }, 100);