vendor: 17,431 bytes, lines 1-529
1/*! 2 * Signature Pad v3.0.0-beta.3 | https://github.com/szimek/signature_pad 3 * (c) 2018 Szymon Nowak | Released under the MIT license 4 */ 5 6(function (global, factory) { 7 typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : 8 typeof define === 'function' && define.amd ? define(factory) : 9 (global.SignaturePad = factory()); 10 }(this, (function () { 'use strict'; 11 12 var Point = (function () { 13 function Point(x, y, time) { 14 this.x = x; 15 this.y = y; 16 this.time = time || Date.now(); 17 } 18 Point.prototype.distanceTo = function (start) { 19 return Math.sqrt(Math.pow(this.x - start.x, 2) + Math.pow(this.y - start.y, 2)); 20 }; 21 Point.prototype.equals = function (other) { 22 return this.x === other.x && this.y === other.y && this.time === other.time; 23 }; 24 Point.prototype.velocityFrom = function (start) { 25 return this.time !== start.time 26 ? this.distanceTo(start) / (this.time - start.time) 27 : 0; 28 }; 29 return Point; 30 }()); 31 32 var Bezier = (function () { 33 function Bezier(startPoint, control2, control1, endPoint, startWidth, endWidth) { 34 this.startPoint = startPoint; 35 this.control2 = control2; 36 this.control1 = control1; 37 this.endPoint = endPoint; 38 this.startWidth = startWidth; 39 this.endWidth = endWidth; 40 } 41 Bezier.fromPoints = function (points, widths) { 42 var c2 = this.calculateControlPoints(points[0], points[1], points[2]).c2; 43 var c3 = this.calculateControlPoints(points[1], points[2], points[3]).c1; 44 return new Bezier(points[1], c2, c3, points[2], widths.start, widths.end); 45 }; 46 Bezier.calculateControlPoints = function (s1, s2, s3) { 47 var dx1 = s1.x - s2.x; 48 var dy1 = s1.y - s2.y; 49 var dx2 = s2.x - s3.x; 50 var dy2 = s2.y - s3.y; 51 var m1 = { x: (s1.x + s2.x) / 2.0, y: (s1.y + s2.y) / 2.0 }; 52 var m2 = { x: (s2.x + s3.x) / 2.0, y: (s2.y + s3.y) / 2.0 }; 53 var l1 = Math.sqrt(dx1 * dx1 + dy1 * dy1); 54 var l2 = Math.sqrt(dx2 * dx2 + dy2 * dy2); 55 var dxm = m1.x - m2.x; 56 var dym = m1.y - m2.y; 57 var k = l2 / (l1 + l2); 58 var cm = { x: m2.x + dxm * k, y: m2.y + dym * k }; 59 var tx = s2.x - cm.x; 60 var ty = s2.y - cm.y; 61 return { 62 c1: new Point(m1.x + tx, m1.y + ty), 63 c2: new Point(m2.x + tx, m2.y + ty) 64 }; 65 }; 66 Bezier.prototype.length = function () { 67 var steps = 10; 68 var length = 0; 69 var px; 70 var py; 71 for (var i = 0; i <= steps; i += 1) { 72 var t = i / steps; 73 var cx = this.point(t, this.startPoint.x, this.control1.x, this.control2.x, this.endPoint.x); 74 var cy = this.point(t, this.startPoint.y, this.control1.y, this.control2.y, this.endPoint.y); 75 if (i > 0) { 76 var xdiff = cx - px; 77 var ydiff = cy - py; 78 length += Math.sqrt(xdiff * xdiff + ydiff * ydiff); 79 } 80 px = cx; 81 py = cy; 82 } 83 return length; 84 }; 85 Bezier.prototype.point = function (t, start, c1, c2, end) { 86 return (start * (1.0 - t) * (1.0 - t) * (1.0 - t)) 87 + (3.0 * c1 * (1.0 - t) * (1.0 - t) * t) 88 + (3.0 * c2 * (1.0 - t) * t * t) 89 + (end * t * t * t); 90 }; 91 return Bezier; 92 }()); 93 94 function throttle(fn, wait) { 95 if (wait === void 0) { wait = 250; } 96 var previous = 0; 97 var timeout = null; 98 var result; 99 var storedContext; 100 var storedArgs; 101 var later = function () { 102 previous = Date.now(); 103 timeout = null; 104 result = fn.apply(storedContext, storedArgs); 105 if (!timeout) { 106 storedContext = null; 107 storedArgs = []; 108 } 109 }; 110 return function wrapper() { 111 var args = []; 112 for (var _i = 0; _i < arguments.length; _i++) { 113 args[_i] = arguments[_i]; 114 } 115 var now = Date.now(); 116 var remaining = wait - (now - previous); 117 storedContext = this; 118 storedArgs = args; 119 if (remaining <= 0 || remaining > wait) { 120 if (timeout) { 121 clearTimeout(timeout); 122 timeout = null; 123 } 124 previous = now; 125 result = fn.apply(storedContext, storedArgs); 126 if (!timeout) { 127 storedContext = null; 128 storedArgs = []; 129 } 130 } 131 else if (!timeout) { 132 timeout = window.setTimeout(later, remaining); 133 } 134 return result; 135 }; 136 } 137 138 var SignaturePad = (function () { 139 function SignaturePad(canvas, options) { 140 if (options === void 0) { options = {}; } 141 var _this = this; 142 this.canvas = canvas; 143 this.options = options; 144 this._handleMouseDown = function (event) { 145 if (event.which === 1) { 146 _this._mouseButtonDown = true; 147 _this._strokeBegin(event); 148 } 149 }; 150 this._handleMouseMove = function (event) { 151 if (_this._mouseButtonDown) { 152 _this._strokeMoveUpdate(event); 153 } 154 }; 155 this._handleMouseUp = function (event) { 156 if (event.which === 1 && _this._mouseButtonDown) { 157 _this._mouseButtonDown = false; 158 _this._strokeEnd(event); 159 } 160 }; 161 this._handleTouchStart = function (event) { 162 event.preventDefault(); 163 if (event.targetTouches.length === 1) { 164 var touch = event.changedTouches[0]; 165 _this._strokeBegin(touch); 166 } 167 }; 168 this._handleTouchMove = function (event) { 169 event.preventDefault(); 170 var touch = event.targetTouches[0]; 171 _this._strokeMoveUpdate(touch); 172 }; 173 this._handleTouchEnd = function (event) { 174 var wasCanvasTouched = event.target === _this.canvas; 175 if (wasCanvasTouched) { 176 event.preventDefault(); 177 var touch = event.changedTouches[0]; 178 _this._strokeEnd(touch); 179 } 180 }; 181 this.velocityFilterWeight = options.velocityFilterWeight || 0.7; 182 this.minWidth = options.minWidth || 0.5; 183 this.maxWidth = options.maxWidth || 2.5; 184 this.throttle = ('throttle' in options ? options.throttle : 16); 185 this.minDistance = ('minDistance' in options 186 ? options.minDistance 187 : 5); 188 if (this.throttle) { 189 this._strokeMoveUpdate = throttle(SignaturePad.prototype._strokeUpdate, this.throttle); 190 } 191 else { 192 this._strokeMoveUpdate = SignaturePad.prototype._strokeUpdate; 193 } 194 this.dotSize = 195 options.dotSize || 196 function dotSize() { 197 return (this.minWidth + this.maxWidth) / 2; 198 }; 199 this.penColor = options.penColor || 'black'; 200 this.backgroundColor = options.backgroundColor || 'rgba(0,0,0,0)'; 201 this.onBegin = options.onBegin; 202 this.onEnd = options.onEnd; 203 this._ctx = canvas.getContext('2d'); 204 this.clear(); 205 this.on(); 206 } 207 SignaturePad.prototype.clear = function () { 208 var ctx = this._ctx; 209 var canvas = this.canvas; 210 ctx.fillStyle = this.backgroundColor; 211 ctx.clearRect(0, 0, canvas.width, canvas.height); 212 ctx.fillRect(0, 0, canvas.width, canvas.height); 213 this._data = []; 214 this._reset(); 215 this._isEmpty = true; 216 }; 217 SignaturePad.prototype.fromDataURL = function (dataUrl, options, callback) { 218 var _this = this; 219 if (options === void 0) { options = {}; } 220 var image = new Image(); 221 var ratio = options.ratio || window.devicePixelRatio || 1; 222 var width = options.width || this.canvas.width / ratio; 223 var height = options.height || this.canvas.height / ratio; 224 this._reset(); 225 image.onload = function () { 226 _this._ctx.drawImage(image, 0, 0, width, height); 227 if (callback) { 228 callback(); 229 } 230 }; 231 image.onerror = function (error) { 232 if (callback) { 233 callback(error); 234 } 235 }; 236 image.src = dataUrl; 237 this._isEmpty = false; 238 }; 239 SignaturePad.prototype.toDataURL = function (type, encoderOptions) { 240 if (type === void 0) { type = 'image/png'; } 241 switch (type) { 242 case 'image/svg+xml': 243 return this._toSVG(); 244 default: 245 return this.canvas.toDataURL(type, encoderOptions); 246 } 247 }; 248 SignaturePad.prototype.on = function () { 249 this.canvas.style.touchAction = 'none'; 250 this.canvas.style.msTouchAction = 'none'; 251 if (window.PointerEvent) { 252 this._handlePointerEvents(); 253 } 254 else { 255 this._handleMouseEvents(); 256 if ('ontouchstart' in window) { 257 this._handleTouchEvents(); 258 } 259 } 260 }; 261 SignaturePad.prototype.off = function () { 262 this.canvas.style.touchAction = 'auto'; 263 this.canvas.style.msTouchAction = 'auto'; 264 this.canvas.removeEventListener('pointerdown', this._handleMouseDown); 265 this.canvas.removeEventListener('pointermove', this._handleMouseMove); 266 document.removeEventListener('pointerup', this._handleMouseUp); 267 this.canvas.removeEventListener('mousedown', this._handleMouseDown); 268 this.canvas.removeEventListener('mousemove', this._handleMouseMove); 269 document.removeEventListener('mouseup', this._handleMouseUp); 270 this.canvas.removeEventListener('touchstart', this._handleTouchStart); 271 this.canvas.removeEventListener('touchmove', this._handleTouchMove); 272 this.canvas.removeEventListener('touchend', this._handleTouchEnd); 273 }; 274 SignaturePad.prototype.isEmpty = function () { 275 return this._isEmpty; 276 }; 277 SignaturePad.prototype.fromData = function (pointGroups) { 278 var _this = this; 279 this.clear(); 280 this._fromData(pointGroups, function (_a) { 281 var color = _a.color, curve = _a.curve; 282 return _this._drawCurve({ color: color, curve: curve }); 283 }, function (_a) { 284 var color = _a.color, point = _a.point; 285 return _this._drawDot({ color: color, point: point }); 286 }); 287 this._data = pointGroups; 288 }; 289 SignaturePad.prototype.toData = function () { 290 return this._data; 291 }; 292 SignaturePad.prototype._strokeBegin = function (event) { 293 var newPointGroup = { 294 color: this.penColor, 295 points: [] 296 }; 297 if (typeof this.onBegin === 'function') { 298 this.onBegin(event); 299 } 300 this._data.push(newPointGroup); 301 this._reset(); 302 this._strokeUpdate(event); 303 }; 304 SignaturePad.prototype._strokeUpdate = function (event) { 305 var x = event.clientX; 306 var y = event.clientY; 307 var point = this._createPoint(x, y); 308 var lastPointGroup = this._data[this._data.length - 1]; 309 var lastPoints = lastPointGroup.points; 310 var lastPoint = lastPoints.length > 0 && lastPoints[lastPoints.length - 1]; 311 var isLastPointTooClose = lastPoint 312 ? point.distanceTo(lastPoint) <= this.minDistance 313 : false; 314 var color = lastPointGroup.color; 315 if (!lastPoint || !(lastPoint && isLastPointTooClose)) { 316 var curve = this._addPoint(point); 317 if (!lastPoint) { 318 this._drawDot({ color: color, point: point }); 319 } 320 else if (curve) { 321 this._drawCurve({ color: color, curve: curve }); 322 } 323 lastPoints.push({ 324 time: point.time, 325 x: point.x, 326 y: point.y 327 }); 328 } 329 }; 330 SignaturePad.prototype._strokeEnd = function (event) { 331 this._strokeUpdate(event); 332 if (typeof this.onEnd === 'function') { 333 this.onEnd(event); 334 } 335 }; 336 SignaturePad.prototype._handlePointerEvents = function () { 337 this._mouseButtonDown = false; 338 this.canvas.addEventListener('pointerdown', this._handleMouseDown); 339 this.canvas.addEventListener('pointermove', this._handleMouseMove); 340 document.addEventListener('pointerup', this._handleMouseUp); 341 }; 342 SignaturePad.prototype._handleMouseEvents = function () { 343 this._mouseButtonDown = false; 344 this.canvas.addEventListener('mousedown', this._handleMouseDown); 345 this.canvas.addEventListener('mousemove', this._handleMouseMove); 346 document.addEventListener('mouseup', this._handleMouseUp); 347 }; 348 SignaturePad.prototype._handleTouchEvents = function () { 349 this.canvas.addEventListener('touchstart', this._handleTouchStart); 350 this.canvas.addEventListener('touchmove', this._handleTouchMove); 351 this.canvas.addEventListener('touchend', this._handleTouchEnd); 352 }; 353 SignaturePad.prototype._reset = function () { 354 this._lastPoints = []; 355 this._lastVelocity = 0; 356 this._lastWidth = (this.minWidth + this.maxWidth) / 2; 357 this._ctx.fillStyle = this.penColor; 358 }; 359 SignaturePad.prototype._createPoint = function (x, y) { 360 var rect = this.canvas.getBoundingClientRect(); 361 return new Point(x - rect.left, y - rect.top, new Date().getTime()); 362 }; 363 SignaturePad.prototype._addPoint = function (point) { 364 var _lastPoints = this._lastPoints; 365 _lastPoints.push(point); 366 if (_lastPoints.length > 2) { 367 if (_lastPoints.length === 3) { 368 _lastPoints.unshift(_lastPoints[0]); 369 } 370 var widths = this._calculateCurveWidths(_lastPoints[1], _lastPoints[2]); 371 var curve = Bezier.fromPoints(_lastPoints, widths); 372 _lastPoints.shift(); 373 return curve; 374 } 375 return null; 376 }; 377 SignaturePad.prototype._calculateCurveWidths = function (startPoint, endPoint) { 378 var velocity = this.velocityFilterWeight * endPoint.velocityFrom(startPoint) + 379 (1 - this.velocityFilterWeight) * this._lastVelocity; 380 var newWidth = this._strokeWidth(velocity); 381 var widths = { 382 end: newWidth, 383 start: this._lastWidth 384 }; 385 this._lastVelocity = velocity; 386 this._lastWidth = newWidth; 387 return widths; 388 }; 389 SignaturePad.prototype._strokeWidth = function (velocity) { 390 return Math.max(this.maxWidth / (velocity + 1), this.minWidth); 391 }; 392 SignaturePad.prototype._drawCurveSegment = function (x, y, width) { 393 var ctx = this._ctx; 394 ctx.moveTo(x, y); 395 ctx.arc(x, y, width, 0, 2 * Math.PI, false); 396 this._isEmpty = false; 397 }; 398 SignaturePad.prototype._drawCurve = function (_a) { 399 var color = _a.color, curve = _a.curve; 400 var ctx = this._ctx; 401 var widthDelta = curve.endWidth - curve.startWidth; 402 var drawSteps = Math.floor(curve.length()) * 2; 403 ctx.beginPath(); 404 ctx.fillStyle = color; 405 for (var i = 0; i < drawSteps; i += 1) { 406 var t = i / drawSteps; 407 var tt = t * t; 408 var ttt = tt * t; 409 var u = 1 - t; 410 var uu = u * u; 411 var uuu = uu * u; 412 var x = uuu * curve.startPoint.x; 413 x += 3 * uu * t * curve.control1.x; 414 x += 3 * u * tt * curve.control2.x; 415 x += ttt * curve.endPoint.x; 416 var y = uuu * curve.startPoint.y; 417 y += 3 * uu * t * curve.control1.y; 418 y += 3 * u * tt * curve.control2.y; 419 y += ttt * curve.endPoint.y; 420 var width = curve.startWidth + ttt * widthDelta; 421 this._drawCurveSegment(x, y, width); 422 } 423 ctx.closePath(); 424 ctx.fill(); 425 }; 426 SignaturePad.prototype._drawDot = function (_a) { 427 var color = _a.color, point = _a.point; 428 var ctx = this._ctx; 429 var width = typeof this.dotSize === 'function' ? this.dotSize() : this.dotSize; 430 ctx.beginPath(); 431 this._drawCurveSegment(point.x, point.y, width); 432 ctx.closePath(); 433 ctx.fillStyle = color; 434 ctx.fill(); 435 }; 436 SignaturePad.prototype._fromData = function (pointGroups, drawCurve, drawDot) { 437 for (var _i = 0, pointGroups_1 = pointGroups; _i < pointGroups_1.length; _i++) { 438 var group = pointGroups_1[_i]; 439 var color = group.color, points = group.points; 440 if (points.length > 1) { 441 for (var j = 0; j < points.length; j += 1) { 442 var basicPoint = points[j]; 443 var point = new Point(basicPoint.x, basicPoint.y, basicPoint.time); 444 this.penColor = color; 445 if (j === 0) { 446 this._reset(); 447 } 448 var curve = this._addPoint(point); 449 if (curve) { 450 drawCurve({ color: color, curve: curve }); 451 } 452 } 453 } 454 else { 455 this._reset(); 456 drawDot({ 457 color: color, 458 point: points[0] 459 }); 460 } 461 } 462 }; 463 SignaturePad.prototype._toSVG = function () { 464 var _this = this; 465 var pointGroups = this._data; 466 var ratio = Math.max(window.devicePixelRatio || 1, 1); 467 var minX = 0; 468 var minY = 0; 469 var maxX = this.canvas.width / ratio; 470 var maxY = this.canvas.height / ratio; 471 var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); 472 svg.setAttribute('width', this.canvas.width.toString()); 473 svg.setAttribute('height', this.canvas.height.toString()); 474 this._fromData(pointGroups, function (_a) { 475 var color = _a.color, curve = _a.curve; 476 var path = document.createElement('path'); 477 if (!isNaN(curve.control1.x) && 478 !isNaN(curve.control1.y) && 479 !isNaN(curve.control2.x) && 480 !isNaN(curve.control2.y)) { 481 var attr = "M " + curve.startPoint.x.toFixed(3) + "," + curve.startPoint.y.toFixed(3) + " " + 482 ("C " + curve.control1.x.toFixed(3) + "," + curve.control1.y.toFixed(3) + " ") + 483 (curve.control2.x.toFixed(3) + "," + curve.control2.y.toFixed(3) + " ") + 484 (curve.endPoint.x.toFixed(3) + "," + curve.endPoint.y.toFixed(3)); 485 path.setAttribute('d', attr); 486 path.setAttribute('stroke-width', (curve.endWidth * 2.25).toFixed(3)); 487 path.setAttribute('stroke', color); 488 path.setAttribute('fill', 'none'); 489 path.setAttribute('stroke-linecap', 'round'); 490 svg.appendChild(path); 491 } 492 }, function (_a) { 493 var color = _a.color, point = _a.point; 494 var circle = document.createElement('circle'); 495 var dotSize = typeof _this.dotSize === 'function' ? _this.dotSize() : _this.dotSize; 496 circle.setAttribute('r', dotSize.toString()); 497 circle.setAttribute('cx', point.x.toString()); 498 circle.setAttribute('cy', point.y.toString()); 499 circle.setAttribute('fill', color); 500 svg.appendChild(circle); 501 }); 502 var prefix = 'data:image/svg+xml;base64,'; 503 var header = '<svg' + 504 ' xmlns="http://www.w3.org/2000/svg"' + 505 ' xmlns:xlink="http://www.w3.org/1999/xlink"' + 506 (" viewBox=\"" + minX + " " + minY + " " + maxX + " " + maxY + "\"") + 507 (" width=\"" + maxX + "\"") + 508 (" height=\"" + maxY + "\"") + 509 '>'; 510 var body = svg.innerHTML; 511 if (body === undefined) { 512 var dummy = document.createElement('dummy'); 513 var nodes = svg.childNodes; 514 dummy.innerHTML = ''; 515 for (var i = 0; i < nodes.length; i += 1) { 516 dummy.appendChild(nodes[i].cloneNode(true)); 517 } 518 body = dummy.innerHTML; 519 } 520 var footer = '</svg>'; 521 var data = header + body + footer; 522 return prefix + btoa(data); 523 }; 524 return SignaturePad; 525 }()); 526 527 return SignaturePad; 528 529 })));
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.