js: Split setting nominal and actual canvas size

Now zooming in and out repeatedly doesn't cause the canvas to wither
away, but user resizes don't stick any more.  Still more to do.

2 files changed, 23 insertions, 7 deletions

diff --git a/emcc.c b/emcc.c
index 3c9850a..4591ccb 100644
--- a/emcc.c
+++ b/emcc.c
@@ -82,6 +82,7 @@ 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_set_statusbar(const char *text);
 extern void js_canvas_set_size(int w, int h);
+extern void js_canvas_set_nominal_size();
 
 extern void js_dialog_init(const char *title);
 extern void js_dialog_string(int i, const char *title, const char *initvalue);
@@ -189,6 +190,7 @@ static void resize(void)
     w = h = INT_MAX;
     midend_size(me, &w, &h, false);
     js_canvas_set_size(w, h);
+    js_canvas_set_nominal_size();
     canvas_w = w;
     canvas_h = h;
 }
diff --git a/emcclib.js b/emcclib.js
index f29137a..1fb3a90 100644
--- a/emcclib.js
+++ b/emcclib.js
@@ -539,20 +539,34 @@ mergeInto(LibraryManager.library, {
     /*
      * void js_canvas_set_size(int w, int h);
      * 
-     * Set the size of the puzzle canvas. Called at setup, and every
-     * time the user picks new puzzle settings requiring a different
-     * size.
+     * Set the size of the puzzle canvas. Called whenever the size of
+     * the canvas needs to change.  That might be because of a change
+     * of configuration, because the user has resized the puzzle, or
+     * because the device pixel ratio has changed.
      */
     js_canvas_set_size: function(w, h) {
-        var dpr = window.devicePixelRatio || 1;
         onscreen_canvas.width = w;
         offscreen_canvas.width = w;
-        resizable_div.style.width = w / dpr + "px";
-        nominal_width = w / dpr;
+        resizable_div.style.width = w / (window.devicePixelRatio || 1) + "px";
 
         onscreen_canvas.height = h;
         offscreen_canvas.height = h;
-        nominal_height = h / dpr;
+    },
+
+    /*
+     * 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;
     },
 
     /*