https://chatsworthcouncil.org/wp-content/plugins/Phox%20Elements/assets/phox-signature.js?ver=1.0.0

1(function(){
2  function initSignature(root){
3    if(!root) return;
4    var inputId = root.getAttribute('data-input-id');
5    if(!inputId) return;
6    var input  = document.getElementById(inputId);
7    var canvas = root.querySelector('.bd-signature__canvas');
8    var clear  = root.querySelector('.bd-signature__clear');
9    if(!canvas || !input) return;
10
11    function resize(){
12      var ratio = Math.max(window.devicePixelRatio || 1, 1);
13      var w = canvas.clientWidth || 500, h = canvas.clientHeight || 200;
14      canvas.width = Math.floor(w * ratio);
15      canvas.height = Math.floor(h * ratio);
16      var ctx = canvas.getContext('2d');
17      ctx.scale(ratio, ratio);
18      ctx.lineWidth = 2; ctx.lineJoin = 'round'; ctx.lineCap = 'round'; ctx.strokeStyle = '#111';
19    }
20    resize(); window.addEventListener('resize', resize);
21
22    var ctx = canvas.getContext('2d'), drawing=false, lastX=0, lastY=0;
23    function pos(e){ var r=canvas.getBoundingClientRect(); var t=e.touches?e.touches[0]:e; return {x:t.clientX-r.left, y:t.clientY-r.top}; }
24    function start(e){ drawing=true; var p=pos(e); lastX=p.x; lastY=p.y; e.preventDefault(); }
25    function move(e){ if(!drawing) return; var p=pos(e); ctx.beginPath(); ctx.moveTo(lastX,lastY); ctx.lineTo(p.x,p.y); ctx.stroke(); lastX=p.x; lastY=p.y; e.preventDefault(); }
26    function end(){ if(!drawing) return; drawing=false; input.value = canvas.toDataURL('image/png'); }
27
28    canvas.addEventListener('mousedown', start);
29    canvas.addEventListener('mousemove', move);
30    window.addEventListener('mouseup', end);
31    canvas.addEventListener('touchstart', start, {passive:false});
32    canvas.addEventListener('touchmove', move, {passive:false});
33    window.addEventListener('touchend', end);
34
35    if(clear) clear.addEventListener('click', function(){ ctx.clearRect(0,0,canvas.width,canvas.height); input.value=''; });
36
37    var form = canvas.closest('form');
38    if(form) form.addEventListener('submit', function(){ if(!input.value){ input.value = canvas.toDataURL('image/png'); }});
39  }
40
41  function boot(){ document.querySelectorAll('.bd-signature[data-input-id]').forEach(initSignature); }
42  if(document.readyState === 'loading'){ document.addEventListener('DOMContentLoaded', boot); } else { boot(); }
43})();