From ff326bc273274569e355b4646701e98ad7502b55 Mon Sep 17 00:00:00 2001 From: "Steinar H. Gunderson" Date: Tue, 27 Dec 2022 12:59:56 +0100 Subject: [PATCH] Position arrows without forcing a style recalc. --- www/js/remoteglot.js | 13 ++++++------- 1 file changed, 6 insertions(+), 7 deletions(-) diff --git a/www/js/remoteglot.js b/www/js/remoteglot.js index c3de366..ee24324 100644 --- a/www/js/remoteglot.js +++ b/www/js/remoteglot.js @@ -380,9 +380,7 @@ let sync_server_clock = function(server_date_string) { let clear_arrows = function() { for (let i = 0; i < arrows.length; ++i) { if (arrows[i].svg) { - if (arrows[i].svg.parentElement) { - arrows[i].svg.parentElement.removeChild(arrows[i].svg); - } + arrows[i].svg.remove(); delete arrows[i].svg; } } @@ -506,11 +504,12 @@ let position_arrow = function(arrow) { return; } - let zoom_factor = document.getElementById("board").getBoundingClientRect().width / 400.0; + let board_width = parseInt(document.querySelector(".board-b72b1").style.width, 10); + let zoom_factor = board_width / 400.0; let line_width = arrow.line_width * zoom_factor; let arrow_size = arrow.arrow_size * zoom_factor; - let square_width = document.querySelector(".square-a8").getBoundingClientRect().width; + let square_width = board_width / 8; let from_y, to_y, from_x, to_x; if (board.orientation() === 'black') { from_y = (arrow.from_row + 0.5)*square_width; @@ -527,8 +526,8 @@ let position_arrow = function(arrow) { let SVG_NS = "http://www.w3.org/2000/svg"; let XHTML_NS = "http://www.w3.org/1999/xhtml"; let svg = document.createElementNS(SVG_NS, "svg"); - svg.setAttribute("width", /** @type{number} */ (document.getElementById("board").getBoundingClientRect().width)); - svg.setAttribute("height", /** @type{number} */ (document.getElementById("board").getBoundingClientRect().height)); + svg.setAttribute("width", board_width); + svg.setAttribute("height", board_width); svg.setAttribute("style", "position: absolute"); svg.setAttribute("position", "absolute"); svg.setAttribute("version", "1.1"); -- 2.39.2