X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fcomponents%2FBoard.vue;h=5ed351a7f4c913952cebabc430884b1b63a7e7fb;hb=6e0f28425075e6d2d79cab6d30bca6ce6d55f19d;hp=70c46b91a0a01139d5e937c5888d563a9b4b7b0c;hpb=4f524197ee499b58f574908c58bf50efa69dd359;p=vchess.git diff --git a/client/src/components/Board.vue b/client/src/components/Board.vue index 70c46b91..5ed351a7 100644 --- a/client/src/components/Board.vue +++ b/client/src/components/Board.vue @@ -60,10 +60,13 @@ export default { if (!!lm) { if (!Array.isArray(lm)) lm = [lm]; lm.forEach(m => { - if (V.OnBoard(m.start.x, m.start.y)) + if (!m.start.noHighlight && V.OnBoard(m.start.x, m.start.y)) lmHighlights[m.start.x + sizeX * m.start.y] = true; - if (V.OnBoard(m.end.x, m.end.y)) + if (!m.end.noHighlight && V.OnBoard(m.end.x, m.end.y)) lmHighlights[m.end.x + sizeX * m.end.y] = true; + if (!!m.start.toplay) + // For Dice variant (at least?) + lmHighlights[m.start.toplay[0] + sizeX * m.start.toplay[1]] = true; }); } const showLight = ( @@ -188,7 +191,8 @@ export default { "incheck-light": showCheck && lightSquare && incheckSq[ci][cj], "incheck-dark": - showCheck && !lightSquare && incheckSq[ci][cj] + showCheck && !lightSquare && incheckSq[ci][cj], + "hover-highlight": this.vr.hoverHighlight(ci, cj) }, attrs: { id: getSquareId({ x: ci, y: cj }) @@ -637,6 +641,7 @@ export default { const color = this.analyze ? this.vr.turn : this.userColor; if (this.vr.canIplay(color, startSquare)) this.possibleMoves = this.vr.getPossibleMovesFrom(startSquare); + else return; // For potential drag'n drop, remember start coordinates // (to center the piece on mouse cursor) const rect = parent.getBoundingClientRect(); @@ -901,6 +906,10 @@ img.ghost // TODO: no predefined highlight colors, but layers. How? +.hover-highlight:hover + // TODO: color dependant on board theme, or inner border... + background-color: #C571E6 !important + .light-square.lichess.highlight-light background-color: #cdd26a .dark-square.lichess.highlight-dark @@ -915,4 +924,9 @@ img.ghost background-color: #9f9fff .dark-square.chesstempo.highlight-dark background-color: #557fff + +.light-square.orangecc.highlight-light + background-color: #fef273 +.dark-square.orangecc.highlight-dark + background-color: #e8c525