js: Move much of the handling of device pixel ratios to the mid-end

Now that the mid-end knows how to do it, we can remove some complexity
from the front end.
This commit is contained in:
Ben Harris
2022-11-07 23:02:06 +00:00
parent e45cd43aaa
commit ad9ee5a524
3 changed files with 21 additions and 63 deletions

55
emcc.c
View File

@ -82,7 +82,6 @@ extern void js_canvas_copy_from_blitter(int id, int x, int y, int w, int h);
extern void js_canvas_make_statusbar(void); extern void js_canvas_make_statusbar(void);
extern void js_canvas_set_statusbar(const char *text); extern void js_canvas_set_statusbar(const char *text);
extern void js_canvas_set_size(int w, int h); extern void js_canvas_set_size(int w, int h);
extern void js_canvas_set_nominal_size();
extern double js_get_device_pixel_ratio(); extern double js_get_device_pixel_ratio();
extern void js_dialog_init(const char *title); extern void js_dialog_init(const char *title);
@ -185,41 +184,30 @@ void timer_callback(double tplus)
static int canvas_w, canvas_h; static int canvas_w, canvas_h;
/* /*
* Called when we resize as a result of changing puzzle settings. * Called when we resize as a result of changing puzzle settings
* "initial" is true if this is the first call, or the first call * or device pixel ratio.
* since a midend_reset_tilesize(). In that case, we might want to
* adjust the size to compensate for the device pixel ratio.
*/ */
static void resize(bool initial) static void resize()
{ {
int w, h; int w, h;
double dpr;
w = h = INT_MAX; w = h = INT_MAX;
midend_size(me, &w, &h, false, 1.0); midend_size(me, &w, &h, false, js_get_device_pixel_ratio());
if (initial) {
dpr = js_get_device_pixel_ratio();
if (dpr != 1.0) {
/*
* The default w and h are probably in units of
* sensible-sized pixels (~0.25 mm). Scale them to the
* actual device pixels and then ask for a size near
* that.
*/
w *= dpr;
h *= dpr;
midend_size(me, &w, &h, true, 1.0);
}
}
js_canvas_set_size(w, h); js_canvas_set_size(w, h);
js_canvas_set_nominal_size();
canvas_w = w; canvas_w = w;
canvas_h = h; canvas_h = h;
} }
/* Called from JS when the device pixel ratio changes */ /* Called from JS when the device pixel ratio changes */
void rescale_puzzle(int w, int h) void rescale_puzzle()
{ {
midend_size(me, &w, &h, true, 1.0); resize();
midend_force_redraw(me);
}
/* Called from JS when the user uses the resize handle */
void resize_puzzle(int w, int h)
{
midend_size(me, &w, &h, true, js_get_device_pixel_ratio());
if (canvas_w != w || canvas_h != h) { if (canvas_w != w || canvas_h != h) {
js_canvas_set_size(w, h); js_canvas_set_size(w, h);
canvas_w = w; canvas_w = w;
@ -228,18 +216,11 @@ void rescale_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 */ /* Called from JS when the user uses the restore button */
void restore_puzzle_size(int w, int h) void restore_puzzle_size(int w, int h)
{ {
midend_reset_tilesize(me); midend_reset_tilesize(me);
resize(true); resize();
midend_force_redraw(me); midend_force_redraw(me);
} }
@ -734,7 +715,7 @@ static void cfg_end(bool use_results)
*/ */
select_appropriate_preset(); select_appropriate_preset();
midend_new_game(me); midend_new_game(me);
resize(false); resize();
midend_redraw(me); midend_redraw(me);
free_cfg(cfg); free_cfg(cfg);
js_dialog_cleanup(); js_dialog_cleanup();
@ -791,7 +772,7 @@ void command(int n)
assert(i < npresets); assert(i < npresets);
midend_set_params(me, presets[i]); midend_set_params(me, presets[i]);
midend_new_game(me); midend_new_game(me);
resize(false); resize();
midend_redraw(me); midend_redraw(me);
update_undo_redo(); update_undo_redo();
js_focus_canvas(); js_focus_canvas();
@ -915,7 +896,7 @@ void load_game(const char *buffer, int len)
js_error_box(err); js_error_box(err);
} else { } else {
select_appropriate_preset(); select_appropriate_preset();
resize(false); resize();
midend_redraw(me); midend_redraw(me);
update_permalinks(); update_permalinks();
update_undo_redo(); update_undo_redo();
@ -957,7 +938,7 @@ int main(int argc, char **argv)
* canvas size appropriately. * canvas size appropriately.
*/ */
midend_new_game(me); midend_new_game(me);
resize(true); resize();
/* /*
* Create a status bar, if needed. * Create a status bar, if needed.

View File

@ -558,22 +558,6 @@ mergeInto(LibraryManager.library, {
offscreen_canvas.height = h; offscreen_canvas.height = h;
}, },
/*
* void js_canvas_set_nominal_size();
*
* Set the nominal size of the puzzle to the current canvas size
* scaled to CSS pixels. This should be called whenever the
* canvas size is changed other than in response to a change of
* device pixel ratio. This nominal size will then be used at
* every change of device pixel ratio to calculate the new
* physical size of the canvas.
*/
js_canvas_set_nominal_size: function() {
var dpr = window.devicePixelRatio || 1;
nominal_width = onscreen_canvas.width / dpr;
nominal_height = onscreen_canvas.height / dpr;
},
/* /*
* double js_get_device_pixel_ratio(); * double js_get_device_pixel_ratio();
* *

View File

@ -30,12 +30,6 @@ var ctx;
// by js_canvas_end_draw. // by js_canvas_end_draw.
var update_xmin, update_xmax, update_ymin, update_ymax; var update_xmin, update_xmax, update_ymin, update_ymax;
// Nominal size of the canvas in CSS pixels. This is set when the
// canvas is explicitly resized, and used as the basis of calls to
// midend_size whenever the device pixel ratio changes. That way
// changes of zoom levels in browsers will generally be reversible.
var nominal_width, nominal_height;
// Module object for Emscripten. We fill in these parameters to ensure // Module object for Emscripten. We fill in these parameters to ensure
// that Module.run() won't be called until we're ready (we want to do // that Module.run() won't be called until we're ready (we want to do
// our own init stuff first), and that when main() returns nothing // our own init stuff first), and that when main() returns nothing
@ -540,8 +534,7 @@ function initPuzzle() {
* <https://developer.mozilla.org/en-US/docs/Web/API/Window/ * <https://developer.mozilla.org/en-US/docs/Web/API/Window/
* devicePixelRatio> (CC0) to work on older browsers. * devicePixelRatio> (CC0) to work on older browsers.
*/ */
var rescale_puzzle = Module.cwrap('rescale_puzzle', var rescale_puzzle = Module.cwrap('rescale_puzzle', 'void', []);
'void', ['number', 'number']);
var mql = null; var mql = null;
var update_pixel_ratio = function() { var update_pixel_ratio = function() {
var dpr = window.devicePixelRatio; var dpr = window.devicePixelRatio;
@ -549,7 +542,7 @@ function initPuzzle() {
mql.removeListener(update_pixel_ratio); mql.removeListener(update_pixel_ratio);
mql = window.matchMedia(`(resolution: ${dpr}dppx)`); mql = window.matchMedia(`(resolution: ${dpr}dppx)`);
mql.addListener(update_pixel_ratio); mql.addListener(update_pixel_ratio);
rescale_puzzle(nominal_width * dpr, nominal_height * dpr); rescale_puzzle();
} }
Module.onRuntimeInitialized = function() { Module.onRuntimeInitialized = function() {