1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 |
|
11 | import { BasicPoint } from './point';
|
12 | import { SignatureEventTarget } from './signature_event_target';
|
13 | export interface SignatureEvent {
|
14 | event: MouseEvent | TouchEvent | PointerEvent;
|
15 | type: string;
|
16 | x: number;
|
17 | y: number;
|
18 | pressure: number;
|
19 | }
|
20 | export interface FromDataOptions {
|
21 | clear?: boolean;
|
22 | }
|
23 | export interface ToSVGOptions {
|
24 | includeBackgroundColor?: boolean;
|
25 | }
|
26 | export interface PointGroupOptions {
|
27 | dotSize: number;
|
28 | minWidth: number;
|
29 | maxWidth: number;
|
30 | penColor: string;
|
31 | velocityFilterWeight: number;
|
32 | |
33 |
|
34 |
|
35 |
|
36 |
|
37 | compositeOperation: GlobalCompositeOperation;
|
38 | }
|
39 | export interface Options extends Partial<PointGroupOptions> {
|
40 | minDistance?: number;
|
41 | backgroundColor?: string;
|
42 | throttle?: number;
|
43 | canvasContextOptions?: CanvasRenderingContext2DSettings;
|
44 | }
|
45 | export interface PointGroup extends PointGroupOptions {
|
46 | points: BasicPoint[];
|
47 | }
|
48 | export default class SignaturePad extends SignatureEventTarget {
|
49 | private canvas;
|
50 | dotSize: number;
|
51 | minWidth: number;
|
52 | maxWidth: number;
|
53 | penColor: string;
|
54 | minDistance: number;
|
55 | velocityFilterWeight: number;
|
56 | compositeOperation: GlobalCompositeOperation;
|
57 | backgroundColor: string;
|
58 | throttle: number;
|
59 | canvasContextOptions: CanvasRenderingContext2DSettings;
|
60 | private _ctx;
|
61 | private _drawingStroke;
|
62 | private _isEmpty;
|
63 | private _lastPoints;
|
64 | private _data;
|
65 | private _lastVelocity;
|
66 | private _lastWidth;
|
67 | private _strokeMoveUpdate;
|
68 | constructor(canvas: HTMLCanvasElement, options?: Options);
|
69 | clear(): void;
|
70 | fromDataURL(dataUrl: string, options?: {
|
71 | ratio?: number;
|
72 | width?: number;
|
73 | height?: number;
|
74 | xOffset?: number;
|
75 | yOffset?: number;
|
76 | }): Promise<void>;
|
77 | toDataURL(type: 'image/svg+xml', encoderOptions?: ToSVGOptions): string;
|
78 | toDataURL(type?: string, encoderOptions?: number): string;
|
79 | on(): void;
|
80 | off(): void;
|
81 | private _getListenerFunctions;
|
82 | private _removeMoveUpEventListeners;
|
83 | isEmpty(): boolean;
|
84 | fromData(pointGroups: PointGroup[], { clear }?: FromDataOptions): void;
|
85 | toData(): PointGroup[];
|
86 | _isLeftButtonPressed(event: MouseEvent, only?: boolean): boolean;
|
87 | private _pointerEventToSignatureEvent;
|
88 | private _touchEventToSignatureEvent;
|
89 | private _handleMouseDown;
|
90 | private _handleMouseMove;
|
91 | private _handleMouseUp;
|
92 | private _handleTouchStart;
|
93 | private _handleTouchMove;
|
94 | private _handleTouchEnd;
|
95 | private _handlePointerDown;
|
96 | private _handlePointerMove;
|
97 | private _handlePointerUp;
|
98 | private _getPointGroupOptions;
|
99 | private _strokeBegin;
|
100 | private _strokeUpdate;
|
101 | private _strokeEnd;
|
102 | private _handlePointerEvents;
|
103 | private _handleMouseEvents;
|
104 | private _handleTouchEvents;
|
105 | private _reset;
|
106 | private _createPoint;
|
107 | private _addPoint;
|
108 | private _calculateCurveWidths;
|
109 | private _strokeWidth;
|
110 | private _drawCurveSegment;
|
111 | private _drawCurve;
|
112 | private _drawDot;
|
113 | private _fromData;
|
114 | toSVG({ includeBackgroundColor }?: ToSVGOptions): string;
|
115 | }
|