From 24821968763002b1326560d79ca12edb89c8126a Mon Sep 17 00:00:00 2001
From: Mitchell McCaffrey <mitchemmc@gmail.com>
Date: Sat, 2 Jan 2021 18:01:04 +1100
Subject: [PATCH] Fix errors with fog disappearing on zoom and crashing on
 zooming out

---
 src/components/map/MapFog.js   | 14 ++++++++++++--
 src/components/map/MapToken.js | 12 ++++++++++--
 2 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/src/components/map/MapFog.js b/src/components/map/MapFog.js
index 9c346d0..eaed990 100644
--- a/src/components/map/MapFog.js
+++ b/src/components/map/MapFog.js
@@ -428,11 +428,21 @@ function MapFog({
     const canvas = fogGroup.getChildren()[0].getCanvas();
     const pixelRatio = canvas.pixelRatio || 1;
 
+    // Constrain fog buffer to the map resolution
+    const fogRect = fogGroup.getClientRect();
+    const maxMapSize = Math.max(map.width, map.height);
+    const maxFogSize =
+      Math.max(fogRect.width, fogRect.height) / debouncedStageScale;
+    const maxPixelRatio = maxMapSize / maxFogSize;
+
     fogGroup.cache({
-      pixelRatio: Math.min(debouncedStageScale * pixelRatio, 20),
+      pixelRatio: Math.min(
+        Math.max(debouncedStageScale * pixelRatio, 1),
+        maxPixelRatio
+      ),
     });
     fogGroup.getLayer().draw();
-  }, [fogShapes, editable, active, debouncedStageScale, mapWidth]);
+  }, [fogShapes, editable, active, debouncedStageScale, mapWidth, map]);
 
   return (
     <Group>
diff --git a/src/components/map/MapToken.js b/src/components/map/MapToken.js
index eb7df1a..2b3ea7d 100644
--- a/src/components/map/MapToken.js
+++ b/src/components/map/MapToken.js
@@ -192,14 +192,22 @@ function MapToken({
       tokenWidth > 0 &&
       tokenHeight > 0
     ) {
+      const maxImageSize = Math.max(token.width, token.height);
+      const maxTokenSize = Math.max(tokenWidth, tokenHeight);
+      // Constrain image buffer to original image size
+      const maxRatio = maxImageSize / maxTokenSize;
+
       image.cache({
-        pixelRatio: debouncedStageScale * pixelRatio,
+        pixelRatio: Math.min(
+          Math.max(debouncedStageScale * pixelRatio, 1),
+          maxRatio
+        ),
       });
       image.drawHitFromCache();
       // Force redraw
       image.getLayer().draw();
     }
-  }, [debouncedStageScale, tokenWidth, tokenHeight, tokenSourceStatus]);
+  }, [debouncedStageScale, tokenWidth, tokenHeight, tokenSourceStatus, token]);
 
   // Animate to new token positions if edited by others
   const tokenX = tokenState.x * mapWidth;