2 lines
4.5 KiB
JavaScript
2 lines
4.5 KiB
JavaScript
"use strict";var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t};!function(t,e){"object"===("undefined"==typeof exports?"undefined":_typeof(exports))&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self,t.Signature=e)}(void 0,function(t){function e(){o.step++,o.step<status.length&&(o.status.length=o.step),o.status.push(o.getContentBase64())}var o=this;this.obj=t&&!Array.isArray(t)?t:{},this.option={el:o.obj.el?o.obj.el:"body",lineWidth:o.obj.lineWidth&&!isNaN(parseInt(o.obj.lineWidth))?o.obj.lineWidth:5,lineColor:o.obj.lineColor&&/^#[1-9|A-F]{6}/.test(o.obj.lineColor.substr(0,7).toLocaleUpperCase())?o.obj.lineColor:"#000000",overflow:!o.obj.direction||"boolean"!=typeof o.obj.direction||o.obj.direction,background:o.obj.background&&/^#[1-9|A-F]{6}/.test(o.obj.background.substr(0,7).toLocaleUpperCase())?o.obj.background:"#ffffff"},this.status=[],this.step=-1,this.firstStatus="";var n=document.querySelector(this.option.el);if("CANVAS"!==n.tagName)throw new Error("Target element must be canvas");n.style.backgroundColor=this.option.background;var i=n.getContext("2d");this.create=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:o.option;i.lineWidth=t.lineWidth,i.strokeStyle=t.lineColor,!0===t.overflow&&(document.querySelector("body").style.overflow="hidden");var s="",a=navigator.userAgent.toLocaleLowerCase();o.firstStatus=o.getContentBase64(),-1!==a.indexOf("iphone")||-1!==a.indexOf("android")?(n.addEventListener("touchstart",function(t){s={x:t.touches[0].clientX-this.offsetLeft,y:t.touches[0].clientY-this.offsetTop}}),n.addEventListener("touchmove",function(t){i.beginPath(),i.moveTo(s.x,s.y),s={x:t.touches[0].clientX-this.offsetLeft,y:t.touches[0].clientY-this.offsetTop},i.lineTo(s.x,s.y),i.fill(),i.closePath(),i.stroke()}),n.addEventListener("touchend",function(){s=""})):(n.addEventListener("mousedown",function(t){e(),s={x:t.clientX-this.offsetLeft,y:t.clientY-this.offsetTop}}),n.addEventListener("mousemove",function(t){s.x&&s.y&&(i.beginPath(),i.moveTo(s.x,s.y),s={x:t.clientX-this.offsetLeft,y:t.clientY-this.offsetTop},i.lineTo(s.x,s.y),i.fill(),i.closePath(),i.stroke())}),n.addEventListener("mouseup",function(){s=""}),n.addEventListener("mouseout",function(){s=""}))},this.getContentBase64=function(t,e){if(t){var i=!0,s=!1,a=void 0;try{for(var r,f=document.querySelectorAll('canvas[data-none="1"]')[Symbol.iterator]();!(i=(r=f.next()).done);i=!0){var d=r.value;d.parentNode.removeChild(d)}}catch(t){s=!0,a=t}finally{try{!i&&f.return&&f.return()}finally{if(s)throw a}}var l=document.createElement("canvas");l.dataset.none="1",l.width=n.offsetHeight,l.height=n.offsetWidth,document.body.appendChild(l);var c=document.querySelector('canvas[data-none="1"]').getContext("2d"),u=new Image;u.src=o.getContentBase64(),u.onload=function(){var t=Math.round(n.offsetHeight/2),o=Math.round(n.offsetWidth/2);c.save(),c.translate(t,o),c.rotate(-90*Math.PI/180),c.drawImage(u,-u.width/2,-u.height/2),c.restore(),e&&e(document.querySelector('canvas[data-none="1"]').toDataURL("image/png"))}}else{if(!e)return n.toDataURL("image/png");e(n.toDataURL("image/png"))}},this.getBlob=function(){for(var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.getContentBase64(),e=t.split(","),o=e[0].match(/:(.*?);/)[1],n=atob(e[1]),i=n.length,s=new Uint8Array(i);i--;)s[i]=n.charCodeAt(i);return new Blob([s],{type:o})},this.getFile=function(t){for(var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:this.getContentBase64(),o=t||"file",n=e.split(","),i=n[0].match(/:(.*?);/)[1],s=i.split("/")[1],a=atob(n[1]),r=a.length,f=new Uint8Array(r);r--;)f[r]=a.charCodeAt(r);return new File([f],o+"."+s,{type:i})},this.reset=function(){if(!o.firstStatus)return!1;i.clearRect(0,0,n.offsetWidth,n.offsetHeight);var t=new Image;try{t.src=o.firstStatus,t.addEventListener("load",function(){i.drawImage(t,0,0)}),o.step=-1,o.status=[]}catch(t){}},this.undo=function(t){if(o.step>=0){i.clearRect(0,0,n.offsetWidth,n.offsetHeight);var e=new Image;try{e.src=o.status[o.step],e.addEventListener("load",function(){i.drawImage(e,0,0)})}catch(t){}o.step--}else console.warn("no more undo"),t&&t()},this.redo=function(t){if(o.step<o.status.length-2){o.step++;var e=new Image;o.status[o.step+1]&&(e.src=o.status[o.step+1],e.addEventListener("load",function(){i.clearRect(0,0,n.offsetWidth,n.offsetHeight),i.drawImage(e,0,0)}))}else console.warn("no more redo"),t&&t()}});
|