// signature_signature.js // RJM Programming // May, 2017 // Help out signature_signature.html and others like it var savenow=0, lastsavenow=0, ppx=-1,ppy=-1,pmore='', fcont, w, isScribble=1; //0; var xua = navigator.userAgent; var isiPad = /iPad/i.test(xua) || /iPhone/i.test(xua) || /iPhone OS 3_1_2/i.test(xua) || /Andrxoid/i.test(xua) || /iPhone OS 3_2_2/i.test(xua); var isTouch = /touch/i.test(xua) || /Touch/i.test(xua); function times_up() { savenow=0; context.clearRect(0, 0, elem.width, elem.height); if (document.getElementById('showit')) { document.getElementById('showit').style.display='inline'; } } function touchWindowHandler(event) // thanks to http://stackoverflow.com/questions/1517924/javascript-mapping-touch-events-to-mouse-events { var touches = event.changedTouches, first = touches[0], type = ""; switch(event.type) { case "touchstart": type = "onclick"; //alert(88 + moid + event.targetTouches.length); break; default: return; } //initMouseEvent(type, canBubble, cancelable, view, clickCount, // screenX, screenY, clientX, clientY, ctrlKey, // altKey, shiftKey, metaKey, button, relatedTarget); var simulatedEvent = document.createEvent("MouseEvent"); simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY, false, false, false, false, 0/*left*/, null); first.target.dispatchEvent(simulatedEvent); event.preventDefault(); } function touchHandler(event) // thanks to http://stackoverflow.com/questions/1517924/javascript-mapping-touch-events-to-mouse-events { var touches = event.changedTouches, first = touches[0], type = ""; //if (event.targetTouches.length == 1) { switch(event.type) { case "touchstart": type="mousedown"; break; case "touchmove": type="mousemove"; break; case "touchend": type="mouseup"; break; default: return; } //initMouseEvent(type, canBubble, cancelable, view, clickCount, // screenX, screenY, clientX, clientY, ctrlKey, // altKey, shiftKey, metaKey, button, relatedTarget); var simulatedEvent = document.createEvent("MouseEvent"); simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY, false, false, false, false, 0/*left*/, null); first.target.dispatchEvent(simulatedEvent); event.preventDefault(); event.stopPropagation(); switch(type) { case "mousedown": if (isScribble == 1) { isScribble=2; if (event.pageX || event.pageY) { ppx=event.pageX - elemLeft; ppy=event.pageY - elemTop; } else { ppx=event.clientX - elemLeft; ppy=event.clientY - elemTop; } lastx=0; // new to scribble lasty=0; x=0; y=0; } break; case "mousemove": if (isScribble == 2) { if (x == 0 && y == 0 && lastx == 0 && lasty == 0) { if (event.pageX || event.pageY) { x = event.pageX - elemLeft; y = event.pageY - elemTop; } else { x = event.clientX - elemLeft; y = event.clientY - elemTop; } lastx=x; lasty=y; } else { lastx=x; lasty=y; if (event.pageX || event.pageY) { x = event.pageX - elemLeft; y = event.pageY - elemTop; } else { x = event.clientX - elemLeft; y = event.clientY - elemTop; } } if (x != lastx || y != lasty) { //document.getElementById('divannotation').style.display='block'; //document.getElementById('myisubject').style.display = 'inline'; //document.getElementById('myiemail').style.display = 'inline'; //context.strokeStyle=document.getElementById('mycolour').value; context.beginPath(); context.moveTo(x,y); context.lineTo(lastx,lasty); context.stroke(); if (sscoords == '') sscoordsdelim=''; if (('*' + sscoords + '*').indexOf(lastx + ',' + lasty + '*') == -1) { if (sscoords.indexOf(',') != -1) savenow=sscoords.length; sscoords+=sscordsdelim + '-' + lastx; sscordsdelim=','; sscoords+=sscordsdelim + lasty; if (savenow != 0) { lastsavenow=savenow; savenow=sscoords.length; } } if (('*' + sscoords + '*').indexOf(x + ',' + y + '*') == -1) { if (sscoords.indexOf(',') != -1) savenow=sscoords.length; sscoords+=sscordsdelim + x; sscordsdelim=','; sscoords+=sscordsdelim + y; if (savenow != 0) { lastsavenow=savenow; savenow=sscoords.length; } } wassscoords=''; if (document.getElementById('showit')) { document.getElementById('showit').style.display='inline'; if (1 == 2 && document.getElementById('animage')) { document.getElementById('animage').src = elem.toDataURL("image/png"); } } } } break; case "mouseup": if (isScribble == 2) { pmore=' pm '; isScribble=1; } break; default: return; } //} } function regularly() { if (savenow != 0) { if (savenow != lastsavenow) { if (document.getElementById('showi')) { if (document.getElementById('animage')) { document.getElementById('animage').src = elem.toDataURL("image/png"); } document.getElementById('showi').style.display='inline'; } } } setTimeout(regularly,1000); } function canvas_events() { regularly(); if (sscoords != '') { var asscoords=sscoords.split(','); wassscoords=sscoords; sscoords = ''; sscoordsdelim=''; context.beginPath(); context.moveTo(Math.abs(eval(asscoords[0])),Math.abs(eval(asscoords[1]))); for (var iss=2; iss= 0 && ppy >= 0) { lastx=ppx; lasty=ppy; ppx=-1; ppy=-1; } else { lastx=x; lasty=y; } } else { lastx=x; lasty=y; if (event.pageX || event.pageY) { x = event.pageX - elemLeft; y = event.pageY - elemTop; } else { x = event.clientX - elemLeft; y = event.clientY - elemTop; } } if (x != lastx || y != lasty) { //document.getElementById('divannotation').style.display='block'; //document.getElementById('myisubject').style.display = 'inline'; //document.getElementById('myiemail').style.display = 'inline'; //context.strokeStyle=document.getElementById('mycolour').value; context.beginPath(); context.moveTo(x,y); context.lineTo(lastx,lasty); context.stroke(); if (sscoords == '') sscoordsdelim=''; if (('*' + sscoords + '*').indexOf(lastx + ',' + lasty + '*') == -1) { if (sscoords.indexOf(',') != -1) savenow=sscoords.length; sscoords+=sscordsdelim + '-' + lastx; sscordsdelim=','; sscoords+=sscordsdelim + lasty; if (savenow != 0) { lastsavenow=savenow; savenow=sscoords.length; } } if (('*' + sscoords + '*').indexOf(x + ',' + y + '*') == -1) { if (sscoords.indexOf(',') != -1) savenow=sscoords.length; sscoords+=sscordsdelim + x; sscordsdelim=','; sscoords+=sscordsdelim + y; if (savenow != 0) { lastsavenow=savenow; savenow=sscoords.length; } } wassscoords=''; if (document.getElementById('showit')) { document.getElementById('showit').style.display='inline'; if (1 == 2 && document.getElementById('animage')) { document.getElementById('animage').src = elem.toDataURL("image/png"); } } //document.title+=pmore + ' here'; } } }); } } setTimeout(canvas_events, 2000);