X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fcomponents%2FBoard.vue;h=f20e7da6ef08423fdc6d28c5cd6d041f400e271a;hb=07d62cec868b1c1a04cf28679cc274417fdf2649;hp=b45280821e91119e533e00ca046206780df93b79;hpb=cdab566355412821c9187078ee0864ceb30545de;p=vchess.git diff --git a/client/src/components/Board.vue b/client/src/components/Board.vue index b4528082..f20e7da6 100644 --- a/client/src/components/Board.vue +++ b/client/src/components/Board.vue @@ -194,7 +194,9 @@ export default { showCheck && lightSquare && incheckSq[ci][cj], "incheck-dark": showCheck && !lightSquare && incheckSq[ci][cj], - "hover-highlight": this.vr.hoverHighlight(ci, cj) + "hover-highlight": + this.vr.hoverHighlight( + [ci, cj], !this.analyze ? this.userColor : null) }, attrs: { id: getSquareId({ x: ci, y: cj }) @@ -544,15 +546,20 @@ export default { } }, addArrow: function(arrow) { - this.arrows.push(arrow); - // Also add to DOM: - const boardElt = document.getElementById("gamePosition"); - const squareWidth = boardElt.offsetWidth / V.size.y; - const bPos = boardElt.getBoundingClientRect(); - const newArrow = - this.getSvgArrow(arrow, bPos.top, bPos.left, squareWidth); - document.getElementById("arrowCanvas") - .insertAdjacentElement("beforeend", newArrow); + const arrowIdx = this.arrows.findIndex(a => { + return ( + a.start[0] == arrow.start[0] && a.start[1] == arrow.start[1] && + a.end[0] == arrow.end[0] && a.end[1] == arrow.end[1] + ); + }); + if (arrowIdx >= 0) + // Erase the arrow + this.arrows.splice(arrowIdx, 1); + else + // Add to arrows vector: + this.arrows.push(arrow); + // NOTE: no need to draw here, will be re-draw + // by updated() hook callong re_setDrawings() }, getSvgArrow: function(arrow, top, left, squareWidth) { const aStart = @@ -575,11 +582,12 @@ export default { return path; }, re_setDrawings: function() { + // Add some drawing on board (for some variants + arrows and circles) + const boardElt = document.getElementById("gamePosition"); + if (!boardElt) return; // Remove current canvas, if any const curCanvas = document.getElementById("arrowCanvas"); if (!!curCanvas) curCanvas.parentNode.removeChild(curCanvas); - // Add some drawing on board (for some variants + arrows and circles) - const boardElt = document.getElementById("gamePosition"); const squareWidth = boardElt.offsetWidth / V.size.y; const bPos = boardElt.getBoundingClientRect(); let svgArrows = [];