From 9f49c254016dd3507ec9703e8f6539e8911354f4 Mon Sep 17 00:00:00 2001
From: Marcus Moore <contact@marcusmoore.io>
Date: Thu, 21 Nov 2024 13:12:13 -0800
Subject: [PATCH] WIP: move signature pad creation up and add debugging

---
 resources/views/account/accept/create.blade.php | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/resources/views/account/accept/create.blade.php b/resources/views/account/accept/create.blade.php
index 8b25d51d3d..7225c0eba1 100644
--- a/resources/views/account/accept/create.blade.php
+++ b/resources/views/account/accept/create.blade.php
@@ -110,24 +110,28 @@
             canvas = wrapper.querySelector("canvas"),
             signaturePad;
 
+        signaturePad = new SignaturePad(canvas);
+
         // Adjust canvas coordinate space taking into account pixel ratio,
         // to make it look crisp on smaller screens.
         // https://github.com/szimek/signature_pad#handling-high-dpi-screens
         // (This also causes canvas to be cleared.)
         function resizeCanvas() {
+            console.log('resizeCanvas');
             // When zoomed out to less than 100%, for some very strange reason,
             // some browsers report devicePixelRatio as less than 1
             // and only part of the canvas is cleared then.
-            var ratio = Math.max(window.devicePixelRatio || 1, 1);
+            let devicePixelRatio = window.devicePixelRatio;
+            console.log({devicePixelRatio})
+            var ratio = Math.max(devicePixelRatio || 1, 1);
             canvas.width = canvas.offsetWidth * ratio;
             canvas.height = canvas.offsetHeight * ratio;
             canvas.getContext("2d").scale(ratio, ratio);
+            signaturePad.clear(); // otherwise isEmpty() might return incorrect value
         }
         window.onresize = resizeCanvas;
         resizeCanvas();
 
-        signaturePad = new SignaturePad(canvas);
-
         $('#clear_button').on("click", function (event) {
             signaturePad.clear();
         });