Merge pull request #14577 from Godmartinz/signature_pad_upgrade

Upgraded Signature-pad.js  && Fixed Resizing Canvas on mobile
This commit is contained in:
snipe 2024-04-11 15:35:47 +01:00 committed by GitHub
commit b5c83721ad
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 20 additions and 12 deletions

5
package-lock.json generated
View file

@ -19162,6 +19162,11 @@
"integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==",
"dev": true
},
"signature_pad": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/signature_pad/-/signature_pad-4.2.0.tgz",
"integrity": "sha512-YLWysmaUBaC5wosAKkgbX7XI+LBv2w5L0QUcI6Jc4moHYzv9BUBJtAyNLpWzHjtjKTeWOH6bfP4a4pzf0UinfQ=="
},
"simple-concat": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.1.tgz",

View file

@ -56,6 +56,7 @@
"papaparse": "^4.3.3",
"select2": "4.0.13",
"sheetjs": "^2.0.0",
"signature_pad": "^4.2.0",
"tableexport.jquery.plugin": "1.28.0",
"tether": "^1.4.0",
"vue-resource": "^1.5.2",

View file

@ -70,7 +70,7 @@
<h3 style="padding-top: 20px">{{trans('general.sign_tos')}}</h3>
<div id="signature-pad" class="m-signature-pad">
<div class="m-signature-pad--body col-md-12 col-sm-12 col-lg-12 col-xs-12">
<canvas></canvas>
<canvas style="width:100%;"></canvas>
<input type="hidden" name="signature_output" id="signature_output">
</div>
<div class="col-md-12 col-sm-12 col-lg-12 col-xs-12 text-center">
@ -94,6 +94,7 @@
@section('moar_scripts')
<script nonce="{{ csrf_token() }}">
var wrapper = document.getElementById("signature-pad"),
clearButton = wrapper.querySelector("[data-action=clear]"),
saveButton = wrapper.querySelector("[data-action=save]"),
@ -103,6 +104,7 @@
// 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
@ -112,9 +114,9 @@
canvas.height = canvas.offsetHeight * ratio;
canvas.getContext("2d").scale(ratio, ratio);
}
window.onresize = resizeCanvas;
resizeCanvas();
}
signaturePad = new SignaturePad(canvas);