From fa58dd85b7ee06fed8d7a5ecc14fda8146f7521b Mon Sep 17 00:00:00 2001 From: Ben Harris Date: Thu, 27 Oct 2022 14:30:23 +0100 Subject: [PATCH] js: Distinguish manual resizes from device pixel ratio changes This adds a new callback, rescale_puzzle(), that's called when the device pixel ratio changes. This means that resize_puzzle() can safely set the nominal canvas size, which means that manual resizing of the puzzle now sticks. Still missing: paying attention to the device pixel ratio when choosing the initial (or reset) size. --- cmake/platforms/emscripten.cmake | 2 ++ emcc.c | 11 +++++++++-- emccpre.js | 4 +++- 3 files changed, 14 insertions(+), 3 deletions(-) diff --git a/cmake/platforms/emscripten.cmake b/cmake/platforms/emscripten.cmake index 6526037..5c13f90 100644 --- a/cmake/platforms/emscripten.cmake +++ b/cmake/platforms/emscripten.cmake @@ -26,6 +26,8 @@ set(emcc_export_list # Callbacks when the resizing controls are used _resize_puzzle _restore_puzzle_size + # Callback when device pixel ratio changes + _rescale_puzzle # Main program, run at initialisation time _main) diff --git a/emcc.c b/emcc.c index 4591ccb..605938b 100644 --- a/emcc.c +++ b/emcc.c @@ -195,8 +195,8 @@ static void resize(void) canvas_h = h; } -/* Called from JS when the user uses the resize handle */ -void resize_puzzle(int w, int h) +/* Called from JS when the device pixel ratio changes */ +void rescale_puzzle(int w, int h) { midend_size(me, &w, &h, true); if (canvas_w != w || canvas_h != h) { @@ -207,6 +207,13 @@ void resize_puzzle(int w, int h) } } +/* Called from JS when the user uses the resize handle */ +void resize_puzzle(int w, int h) +{ + rescale_puzzle(w, h); + js_canvas_set_nominal_size(); +} + /* Called from JS when the user uses the restore button */ void restore_puzzle_size(int w, int h) { diff --git a/emccpre.js b/emccpre.js index 0c555f9..c2af60a 100644 --- a/emccpre.js +++ b/emccpre.js @@ -535,12 +535,14 @@ function initPuzzle() { * (CC0) to work on older browsers. */ + var rescale_puzzle = Module.cwrap('rescale_puzzle', + 'void', ['number', 'number']); var mql = null; var update_pixel_ratio = function() { var dpr = window.devicePixelRatio; if (mql !== null) mql.removeListener(update_pixel_ratio); - resize_puzzle(nominal_width * dpr, nominal_height * dpr); + rescale_puzzle(nominal_width * dpr, nominal_height * dpr); mql = window.matchMedia(`(resolution: ${dpr}dppx)`); mql.addListener(update_pixel_ratio); }