Merge pull request #15870 from marcusmoore/bug/sc-26857

Always call resizeCanvas

resources/views/account/accept/create.blade.php

@@ -110,24 +110,24 @@
             canvas = wrapper.querySelector("canvas"),
             signaturePad;
 
+        signaturePad = new SignaturePad(canvas);
+
         // Adjust canvas coordinate space taking into account pixel ratio,
-        // to make it look crisp on mobile devices.
-        // This also causes canvas to be cleared.
-        if (window.matchMedia("(min-width: 768px)").matches) {
-            function 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);
-                canvas.width = canvas.offsetWidth * ratio;
-                canvas.height = canvas.offsetHeight * ratio;
-                canvas.getContext("2d").scale(ratio, ratio);
-            }
-            window.onresize = resizeCanvas;
-            resizeCanvas();
+        // 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() {
+            // 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);
+            canvas.width = canvas.offsetWidth * ratio;
+            canvas.height = canvas.offsetHeight * ratio;
+            canvas.getContext("2d").scale(ratio, ratio);
+            signaturePad.clear(); // otherwise isEmpty() might return incorrect value
         }
-
-        signaturePad = new SignaturePad(canvas);
+        window.onresize = resizeCanvas;
+        resizeCanvas();
 
         $('#clear_button').on("click", function (event) {
             signaturePad.clear();
@@ -144,4 +144,4 @@ function resizeCanvas() {
 
 
     </script>
-@stop
+@stop