2017-02-12 01:39:49 +00:00
|
|
|
var wrapper = document.getElementById("signature-pad"),
|
2017-11-03 19:22:40 +00:00
|
|
|
// clearButton = wrapper.querySelector("[data-action=clear]"),
|
2017-02-12 01:39:49 +00:00
|
|
|
|
|
|
|
saveDataButton = wrapper.querySelector("[data-action=save-data]"),
|
|
|
|
canvas = wrapper.querySelector("canvas"),
|
|
|
|
signaturePad;
|
|
|
|
|
|
|
|
// Adjust canvas coordinate space taking into account pixel ratio,
|
|
|
|
// to make it look crisp on mobile devices.
|
|
|
|
// 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);
|
|
|
|
}
|
|
|
|
|
|
|
|
window.onresize = resizeCanvas;
|
|
|
|
resizeCanvas();
|
|
|
|
|
|
|
|
signaturePad = new SignaturePad(canvas);
|
|
|
|
|
2017-11-03 19:22:40 +00:00
|
|
|
document.getElementById('clear').addEventListener('click', function() {
|
|
|
|
signaturePad.clear();
|
2017-02-12 01:39:49 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
saveDataButton.addEventListener("click", function (event) {
|
|
|
|
if (signaturePad.isEmpty()) {
|
|
|
|
alert("Por favor firme primero.");
|
|
|
|
} else {
|
|
|
|
saveViaAJAX();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|