HTML5 handwritten signature

<! DOCTYPE html>
var canvas, board;     Canvas = document.getElementById (' MyCanvas ');     Canvas.height = 300;     Canvas.width = 400;     board = canvas.getcontext (' 2d '); Board.linewidth = 1;     Set Brush Weight Board.strokestyle = "#f00"; Board.linejoin = "Round";     Set brush trajectory based on dot concatenation var mousepress = false;     var last = null;     function BeginDraw (event) {mousepress = true;         } function EndDraw (event) {mousepress = false;         Event.preventdefault ();     last = null;         } function Drawing (event) {Event.preventdefault ();         if (!mousepress) return;         var xy = GetPos (event);             if (last! = null) {Board.beginpath ();             Board.moveto (Last.x, LAST.Y);             Board.lineto (xy.x, XY.Y);         Board.stroke ();     } last = xy;         } function GetPos (event) {var Istouch = event.type.indexOf (' touch ') >= 0? true:false; var x = Istouch? Event.touches[0].pagex:event.offsetx + EvenT.target.offsetleft; var y = Istouch?         Event.touches[0].pagey:event.offsety + Event.target.offsetTop;     return {x:x, y:y};         } function Save () {var data = Canvas.todataurl ("Image/png");//Convert the contents of the canvas artboard to the specified format picture data and Base64 encode         var img = new Image ();         IMG.SRC = data;     $ (document.body). Append (IMG);     } function Clean () {board.clearrect (0, 0, canvas.width, canvas.height);     } Canvas.onmousedown = BeginDraw;     Canvas.onmousemove = drawing;     Canvas.onmouseup = EndDraw;     Canvas.addeventlistener (' Touchstart ', BeginDraw, false);     Canvas.addeventlistener (' Touchmove ', drawing, false); Canvas.addeventlistener (' Touchend ', EndDraw, false);
HTML5 handwritten signature