From 0254a163ff002aca56a6e08d7a5799f34cf48d94 Mon Sep 17 00:00:00 2001 From: Ben Harris Date: Sat, 22 Oct 2022 18:50:34 +0100 Subject: [PATCH] js: Make resizing of puzzles work properly again This requires looking at the CSS size of the puzzle canvas rather than its internal size, and then adjusting the new size to account for the device pixel ratio. --- emccpre.js | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/emccpre.js b/emccpre.js index f97fb63..2dd4a18 100644 --- a/emccpre.js +++ b/emccpre.js @@ -482,10 +482,10 @@ function initPuzzle() { resize_handle.onmousedown = function(event) { if (event.button == 0) { var xy = element_coords(onscreen_canvas); - resize_xbase = xy.x + onscreen_canvas.width / 2; + resize_xbase = xy.x + onscreen_canvas.offsetWidth / 2; resize_ybase = xy.y; - resize_xoffset = xy.x + onscreen_canvas.width - event.pageX; - resize_yoffset = xy.y + onscreen_canvas.height - event.pageY; + resize_xoffset = xy.x + onscreen_canvas.offsetWidth - event.pageX; + resize_yoffset = xy.y + onscreen_canvas.offsetHeight - event.pageY; } else { restore_pending = true; } @@ -494,8 +494,10 @@ function initPuzzle() { }; window.addEventListener("mousemove", function(event) { if (resize_xbase !== null && resize_ybase !== null) { - resize_puzzle((event.pageX + resize_xoffset - resize_xbase) * 2, - (event.pageY + resize_yoffset - resize_ybase)); + var dpr = window.devicePixelRatio || 1; + resize_puzzle( + (event.pageX + resize_xoffset - resize_xbase) * dpr * 2, + (event.pageY + resize_yoffset - resize_ybase) * dpr); event.preventDefault(); // Chrome insists on selecting text during a resize drag // no matter what I do