@syncfusion/ej2-image-editor 20.4.40 → 20.4.48
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -2
- package/README.md +1 -1
- package/dist/ej2-image-editor.umd.min.js +2 -2
- package/dist/ej2-image-editor.umd.min.js.map +1 -1
- package/dist/es6/ej2-image-editor.es2015.js +6618 -3832
- package/dist/es6/ej2-image-editor.es2015.js.map +1 -1
- package/dist/es6/ej2-image-editor.es5.js +6622 -3838
- package/dist/es6/ej2-image-editor.es5.js.map +1 -1
- package/dist/global/ej2-image-editor.min.js +2 -2
- package/dist/global/ej2-image-editor.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +11 -11
- package/src/image-editor/image-editor-model.d.ts +23 -85
- package/src/image-editor/image-editor.d.ts +279 -235
- package/src/image-editor/image-editor.js +6620 -3835
- package/styles/bootstrap-dark.css +3 -0
- package/styles/bootstrap.css +3 -0
- package/styles/bootstrap4.css +3 -0
- package/styles/bootstrap5-dark.css +3 -0
- package/styles/bootstrap5.css +3 -0
- package/styles/fabric-dark.css +3 -0
- package/styles/fabric.css +3 -0
- package/styles/fluent-dark.css +3 -0
- package/styles/fluent.css +3 -0
- package/styles/highcontrast-light.css +3 -0
- package/styles/highcontrast.css +3 -0
- package/styles/image-editor/_layout.scss +6 -0
- package/styles/image-editor/bootstrap-dark.css +3 -0
- package/styles/image-editor/bootstrap.css +3 -0
- package/styles/image-editor/bootstrap4.css +3 -0
- package/styles/image-editor/bootstrap5-dark.css +3 -0
- package/styles/image-editor/bootstrap5.css +3 -0
- package/styles/image-editor/fabric-dark.css +3 -0
- package/styles/image-editor/fabric.css +3 -0
- package/styles/image-editor/fluent-dark.css +3 -0
- package/styles/image-editor/fluent.css +3 -0
- package/styles/image-editor/highcontrast-light.css +3 -0
- package/styles/image-editor/highcontrast.css +3 -0
- package/styles/image-editor/material-dark.css +3 -0
- package/styles/image-editor/material.css +3 -0
- package/styles/image-editor/tailwind-dark.css +3 -0
- package/styles/image-editor/tailwind.css +3 -0
- package/styles/material-dark.css +3 -0
- package/styles/material.css +3 -0
- package/styles/tailwind-dark.css +3 -0
- package/styles/tailwind.css +3 -0
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { INotifyPropertyChanged } from '@syncfusion/ej2-base';
|
|
1
|
+
import { Component, INotifyPropertyChanged } from '@syncfusion/ej2-base';
|
|
2
2
|
import { EmitType } from '@syncfusion/ej2-base';
|
|
3
|
-
import { SignatureBase } from '@syncfusion/ej2-inputs';
|
|
4
3
|
import { ItemModel, ClickEventArgs } from '@syncfusion/ej2-navigations';
|
|
5
4
|
import { ChildProperty } from '@syncfusion/ej2-base';
|
|
6
5
|
import { ImageEditorModel, FinetuneSettingsModel } from './image-editor-model';
|
|
@@ -88,7 +87,7 @@ export declare class FinetuneSettings extends ChildProperty<FinetuneSettings> {
|
|
|
88
87
|
* </script>
|
|
89
88
|
* ```
|
|
90
89
|
*/
|
|
91
|
-
export declare class ImageEditor extends
|
|
90
|
+
export declare class ImageEditor extends Component<HTMLDivElement> implements INotifyPropertyChanged {
|
|
92
91
|
/**
|
|
93
92
|
*
|
|
94
93
|
* ImageEditor Private Properties
|
|
@@ -100,12 +99,13 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
100
99
|
private inMemoryCanvas;
|
|
101
100
|
private inMemoryContext;
|
|
102
101
|
private baseImg;
|
|
103
|
-
private
|
|
102
|
+
private textArea;
|
|
104
103
|
private degree;
|
|
104
|
+
private isUndoRedo;
|
|
105
105
|
private dragCanvas;
|
|
106
106
|
private dragElement;
|
|
107
107
|
private keyHistory;
|
|
108
|
-
private
|
|
108
|
+
private tempKeyHistory;
|
|
109
109
|
private mouseDownPoint;
|
|
110
110
|
private previousPoint;
|
|
111
111
|
private dragPoint;
|
|
@@ -113,47 +113,33 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
113
113
|
private oldPoint;
|
|
114
114
|
private objColl;
|
|
115
115
|
private undoRedoColl;
|
|
116
|
-
private
|
|
117
|
-
private currImgData;
|
|
116
|
+
private isImageLoaded;
|
|
118
117
|
private strokeSettings;
|
|
119
|
-
private textSettings;
|
|
120
118
|
private tempStrokeSettings;
|
|
121
|
-
private
|
|
119
|
+
private textSettings;
|
|
122
120
|
private tempTextSettings;
|
|
121
|
+
private penStrokeWidth;
|
|
123
122
|
private toolbarHeight;
|
|
124
|
-
private pannStart;
|
|
125
|
-
private pannEnd;
|
|
126
123
|
private togglePan;
|
|
127
124
|
private disablePan;
|
|
128
|
-
private lastX;
|
|
129
|
-
private lastY;
|
|
130
|
-
private dragStart;
|
|
131
|
-
private factor;
|
|
132
125
|
private currFlipState;
|
|
133
126
|
private touchEndPoint;
|
|
134
|
-
private
|
|
135
|
-
private currX;
|
|
136
|
-
private prevY;
|
|
137
|
-
private currY;
|
|
127
|
+
private undoRedoStep;
|
|
138
128
|
private togglePen;
|
|
139
129
|
private currentToolbar;
|
|
140
130
|
private textStartPoints;
|
|
141
131
|
private fontSizeColl;
|
|
142
|
-
private tempKeyHistory;
|
|
143
|
-
private penDrawColl;
|
|
144
|
-
private allowDrag;
|
|
145
132
|
private textRow;
|
|
146
133
|
private activeObj;
|
|
134
|
+
private tempActiveObj;
|
|
147
135
|
private currObjType;
|
|
148
136
|
private defToolbarItems;
|
|
149
137
|
private defaultLocale;
|
|
150
138
|
private l10n;
|
|
151
139
|
private themeColl;
|
|
152
140
|
private toolbarFn;
|
|
153
|
-
private baseImgSrc;
|
|
154
141
|
private isTimer;
|
|
155
142
|
private timer;
|
|
156
|
-
private isScreenOriented;
|
|
157
143
|
private tempObjColl;
|
|
158
144
|
private isFirstMove;
|
|
159
145
|
private startTouches;
|
|
@@ -166,14 +152,76 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
166
152
|
private currentFilter;
|
|
167
153
|
private tempFilter;
|
|
168
154
|
private canvasFilter;
|
|
169
|
-
private
|
|
170
|
-
private
|
|
171
|
-
private
|
|
172
|
-
private
|
|
155
|
+
private tempUndoRedoColl;
|
|
156
|
+
private tempUndoRedoStep;
|
|
157
|
+
private zoomFactor;
|
|
158
|
+
private tempZoomFactor;
|
|
159
|
+
private destLeft;
|
|
160
|
+
private destTop;
|
|
161
|
+
private destWidth;
|
|
162
|
+
private destHeight;
|
|
163
|
+
private srcLeft;
|
|
164
|
+
private srcTop;
|
|
165
|
+
private srcWidth;
|
|
166
|
+
private srcHeight;
|
|
167
|
+
private currSelectionPoint;
|
|
168
|
+
private cropDestPoints;
|
|
169
|
+
private panDown;
|
|
170
|
+
private panMove;
|
|
171
|
+
private tempPanMove;
|
|
172
|
+
private flipColl;
|
|
173
|
+
private isReverseRotate;
|
|
174
|
+
private isReverseFlip;
|
|
175
|
+
private isPreventDragging;
|
|
176
|
+
private isRotateZoom;
|
|
177
|
+
private rotateFlipColl;
|
|
178
|
+
private currentPannedPoint;
|
|
179
|
+
private isCircleCrop;
|
|
180
|
+
private rotatedDestPoints;
|
|
181
|
+
private croppedDegree;
|
|
182
|
+
private freehandDrawHoveredIndex;
|
|
183
|
+
private freehandDrawSelectedIndex;
|
|
184
|
+
private isFreehandDrawingPoint;
|
|
185
|
+
private isFreehandDrawEditing;
|
|
186
|
+
private tempFreeHandDrawEditingStyles;
|
|
187
|
+
private totalPannedInternalPoint;
|
|
188
|
+
private totalPannedClientPoint;
|
|
189
|
+
private currentSelectionPoint;
|
|
190
|
+
private totalPannedPoint;
|
|
191
|
+
private isCropTab;
|
|
192
|
+
private cropZoomFactor;
|
|
193
|
+
private defaultZoomFactor;
|
|
194
|
+
private fileName;
|
|
173
195
|
private isBrightnessAdjusted;
|
|
174
196
|
private isInitialLoading;
|
|
175
|
-
private
|
|
176
|
-
private
|
|
197
|
+
private fileType;
|
|
198
|
+
private freehandDrawObj;
|
|
199
|
+
private points;
|
|
200
|
+
private pointColl;
|
|
201
|
+
private pointCounter;
|
|
202
|
+
private freehandCounter;
|
|
203
|
+
private isFreehandDrawing;
|
|
204
|
+
private tempFreehandCounter;
|
|
205
|
+
private tempActObj;
|
|
206
|
+
private lastPan;
|
|
207
|
+
private selectedFreehandColor;
|
|
208
|
+
private isFreehandDrawCustomized;
|
|
209
|
+
private isShapeInserted;
|
|
210
|
+
private isAllowCropPan;
|
|
211
|
+
private tempPannedPoint;
|
|
212
|
+
private cropObj;
|
|
213
|
+
private afterCropActions;
|
|
214
|
+
private isCancelAction;
|
|
215
|
+
private isFreehandPointMoved;
|
|
216
|
+
private isTouch;
|
|
217
|
+
private freehandDownPoint;
|
|
218
|
+
private tempFlipPanPoint;
|
|
219
|
+
private currentFreehandDrawIndex;
|
|
220
|
+
private tempCurrentFreehandDrawIndex;
|
|
221
|
+
private preventZoomBtn;
|
|
222
|
+
private cancelObjColl;
|
|
223
|
+
private cancelPointColl;
|
|
224
|
+
private rotatedFlipCropSelection;
|
|
177
225
|
/**
|
|
178
226
|
* Defines class/multiple classes separated by a space for customizing Image Editor UI.
|
|
179
227
|
*
|
|
@@ -204,6 +252,7 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
204
252
|
/**
|
|
205
253
|
* Specifies the theme of the Image Editor. The shape selection appearance will be decided based on this property.
|
|
206
254
|
* The property supports all the built-in themes of Syncfusion.
|
|
255
|
+
* default 'Bootstrap5'
|
|
207
256
|
*
|
|
208
257
|
* @isenumeration true
|
|
209
258
|
* @default Theme.Bootstrap5
|
|
@@ -216,16 +265,18 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
216
265
|
* If the property is defined as empty collection, the toolbar will not be rendered.
|
|
217
266
|
* Suppose the property is not defined in control, an image editor’s toolbar will be rendered with preconfigured toolbar commands.
|
|
218
267
|
* The preconfigured toolbar commands are
|
|
219
|
-
*
|
|
220
|
-
*
|
|
221
|
-
*
|
|
222
|
-
*
|
|
223
|
-
*
|
|
224
|
-
*
|
|
225
|
-
*
|
|
226
|
-
*
|
|
227
|
-
*
|
|
228
|
-
*
|
|
268
|
+
* Crop: helps to crop an image as ellipse, square, various ratio aspects, custom selection with resize, drag and drop.
|
|
269
|
+
* Annotate: help to insert a shape on image that supports rectangle, ellipse, line, text and freehand drawing with resize, drag and drop, and customize its appearance.
|
|
270
|
+
* Transform: helps to rotate and flip an image.
|
|
271
|
+
* ZoomIn: performs zoom-in an image.
|
|
272
|
+
* ZoomOut: performs zoom-out an image.
|
|
273
|
+
* Pan: performs panning once zoomed an image.
|
|
274
|
+
* Move: disable the pan action and move to perform other actions such as insert a shape, transform, and more.
|
|
275
|
+
* Save: save the modified image.
|
|
276
|
+
* Open: open an image to perform editing.
|
|
277
|
+
* Reset: reset the modification and restore the original image.
|
|
278
|
+
*
|
|
279
|
+
* @default null
|
|
229
280
|
```html
|
|
230
281
|
* <div id='imageeditor'></div>
|
|
231
282
|
* ```
|
|
@@ -270,21 +321,12 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
270
321
|
*/
|
|
271
322
|
width: string;
|
|
272
323
|
/**
|
|
273
|
-
*
|
|
274
|
-
* The background color of the component that accepts hex value, rgb and text (like 'red'). The default value is ''.
|
|
275
|
-
*
|
|
276
|
-
* @default ''
|
|
277
|
-
* @private
|
|
278
|
-
*/
|
|
279
|
-
backgroundColor: string;
|
|
280
|
-
/**
|
|
281
|
-
* Gets or sets the background image for the component.
|
|
282
|
-
* An image that used to fill the background of the component. The default value is ''.
|
|
324
|
+
* Specifies whether to perform undo / redo operation.
|
|
283
325
|
*
|
|
284
|
-
* @default
|
|
326
|
+
* @default false
|
|
285
327
|
* @private
|
|
286
328
|
*/
|
|
287
|
-
|
|
329
|
+
allowUndoRedo: boolean;
|
|
288
330
|
/**
|
|
289
331
|
* Gets or sets whether to prevent the interaction in signature component.
|
|
290
332
|
* True, if the signature component is read only state where the user interaction is prevented. The default value is false.
|
|
@@ -293,49 +335,6 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
293
335
|
* @private
|
|
294
336
|
*/
|
|
295
337
|
isReadOnly: boolean;
|
|
296
|
-
/**
|
|
297
|
-
* Gets or sets whether to save the signature along with Background Color and background Image while saving.
|
|
298
|
-
* True, if signature component to save with background. The default value is true.
|
|
299
|
-
*
|
|
300
|
-
* @default true
|
|
301
|
-
* @private
|
|
302
|
-
*/
|
|
303
|
-
saveWithBackground: boolean;
|
|
304
|
-
/**
|
|
305
|
-
* Gets or sets the stroke color of the signature.
|
|
306
|
-
* The color of the signature stroke that accepts hex value, rgb and text (like 'red'). The default value is "#000000".
|
|
307
|
-
*
|
|
308
|
-
* @default '#000000'
|
|
309
|
-
* @private
|
|
310
|
-
*/
|
|
311
|
-
strokeColor: string;
|
|
312
|
-
/**
|
|
313
|
-
* Gets or sets the minimum stroke width for signature.
|
|
314
|
-
* The signature component calculates stroke width based on Velocity, MinStrokeWidth and MaxStrokeWidth.
|
|
315
|
-
* The minimum width of stroke. The default value is 0.5.
|
|
316
|
-
*
|
|
317
|
-
* @default 0.5
|
|
318
|
-
* @private
|
|
319
|
-
*/
|
|
320
|
-
minStrokeWidth: number;
|
|
321
|
-
/**
|
|
322
|
-
* Gets or sets the maximum stroke width for signature.
|
|
323
|
-
* The signature component calculates stroke width based on Velocity, MinStrokeWidth and MaxStrokeWidth.
|
|
324
|
-
* The maximum width of stroke. The default value is 2.0.
|
|
325
|
-
*
|
|
326
|
-
* @default 2
|
|
327
|
-
* @private
|
|
328
|
-
*/
|
|
329
|
-
maxStrokeWidth: number;
|
|
330
|
-
/**
|
|
331
|
-
* Gets or sets the velocity to calculate the stroke thickness based on the pressure of the contact on the digitizer surface.
|
|
332
|
-
* The Signature component calculates stroke thickness based on Velocity, MinStrokeWidth and MaxStrokeWidth.
|
|
333
|
-
* The default value is 0.7.
|
|
334
|
-
*
|
|
335
|
-
* @default 0.7
|
|
336
|
-
* @private
|
|
337
|
-
*/
|
|
338
|
-
velocity: number;
|
|
339
338
|
/**
|
|
340
339
|
* Specifies the Signature in RTL mode that displays the content in the right-to-left direction.
|
|
341
340
|
*
|
|
@@ -364,12 +363,6 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
364
363
|
*
|
|
365
364
|
*/
|
|
366
365
|
finetuneSettings: FinetuneSettingsModel;
|
|
367
|
-
/**
|
|
368
|
-
* Gets or sets the last signature url to maintain the persist state.
|
|
369
|
-
*
|
|
370
|
-
* @private
|
|
371
|
-
*/
|
|
372
|
-
signatureValue: string;
|
|
373
366
|
/**
|
|
374
367
|
* Triggers before an image is saved.
|
|
375
368
|
*
|
|
@@ -429,7 +422,7 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
429
422
|
*
|
|
430
423
|
* @event fileOpened
|
|
431
424
|
*/
|
|
432
|
-
fileOpened: EmitType<
|
|
425
|
+
fileOpened: EmitType<OpenEventArgs>;
|
|
433
426
|
/**
|
|
434
427
|
* Triggers once an image is saved.
|
|
435
428
|
*
|
|
@@ -463,9 +456,9 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
463
456
|
/**
|
|
464
457
|
* Triggers when applying fine tune to an image.
|
|
465
458
|
*
|
|
466
|
-
* @event
|
|
459
|
+
* @event finetuneValueChanging
|
|
467
460
|
*/
|
|
468
|
-
|
|
461
|
+
finetuneValueChanging: EmitType<FinetuneEventArgs>;
|
|
469
462
|
/**
|
|
470
463
|
*
|
|
471
464
|
* Constructor for creating the widget
|
|
@@ -473,7 +466,7 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
473
466
|
* @param {ImageEditorModel} options - Specifies the image editor model
|
|
474
467
|
* @param {string|HTMLDivElement} element - Specifies the target element
|
|
475
468
|
*/
|
|
476
|
-
constructor(options?: ImageEditorModel, element?: string |
|
|
469
|
+
constructor(options?: ImageEditorModel, element?: string | HTMLDivElement);
|
|
477
470
|
protected preRender(): void;
|
|
478
471
|
/**
|
|
479
472
|
*
|
|
@@ -510,7 +503,9 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
510
503
|
onPropertyChanged(newProperties: ImageEditorModel, oldProperties?: ImageEditorModel): void;
|
|
511
504
|
destroy(): void;
|
|
512
505
|
initialize(): void;
|
|
506
|
+
private getDefaultFilter;
|
|
513
507
|
private updateFinetunes;
|
|
508
|
+
private initializeFilter;
|
|
514
509
|
/**
|
|
515
510
|
*
|
|
516
511
|
* This Method will add events to component (element, event, method, current reference)
|
|
@@ -525,7 +520,6 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
525
520
|
* @returns {void}.
|
|
526
521
|
*/
|
|
527
522
|
private unwireEvent;
|
|
528
|
-
private initializeFilter;
|
|
529
523
|
private destroySubComponents;
|
|
530
524
|
private updateTheme;
|
|
531
525
|
private toPascalCase;
|
|
@@ -545,13 +539,17 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
545
539
|
private processSubToolbar;
|
|
546
540
|
private isToolbar;
|
|
547
541
|
private initToolbarItem;
|
|
542
|
+
private enableDisableToolbarBtn;
|
|
548
543
|
private createLeftToolbarControls;
|
|
544
|
+
private cropSelectedState;
|
|
549
545
|
private renderAnnotationBtn;
|
|
550
546
|
private renderCropBtn;
|
|
551
547
|
private renderTransformBtn;
|
|
552
548
|
private renderSaveBtn;
|
|
553
549
|
private cropSelect;
|
|
554
550
|
private transformSelect;
|
|
551
|
+
private performTransformation;
|
|
552
|
+
private updateTransform;
|
|
555
553
|
private getShapesToolbarItem;
|
|
556
554
|
private initShapesToolbarItem;
|
|
557
555
|
private createShapeColor;
|
|
@@ -565,28 +563,56 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
565
563
|
private createTextBtn;
|
|
566
564
|
private getFontSizes;
|
|
567
565
|
private getTextAreaWidth;
|
|
566
|
+
private updateUndoRedoObj;
|
|
568
567
|
private updateObjColl;
|
|
569
568
|
private applyFontStyle;
|
|
570
569
|
private initZoomToolbarItem;
|
|
570
|
+
private refreshUndoRedoColl;
|
|
571
|
+
private applyPreviewFilter;
|
|
571
572
|
private contextualToolbarClicked;
|
|
572
573
|
private defToolbarClicked;
|
|
574
|
+
private performCancel;
|
|
575
|
+
private applyShape;
|
|
576
|
+
private applyFreehandDraw;
|
|
577
|
+
private cancelFreehandDraw;
|
|
578
|
+
private openSlider;
|
|
579
|
+
private setTempFilterProperties;
|
|
573
580
|
private okBtn;
|
|
581
|
+
private updateBrightnessFilter;
|
|
582
|
+
private isFreehandDrawIndex;
|
|
583
|
+
private deleteFreehandDraw;
|
|
574
584
|
private unselectBtn;
|
|
585
|
+
private callUndo;
|
|
586
|
+
private callRedo;
|
|
575
587
|
private refreshSlider;
|
|
588
|
+
private iterateObjColl;
|
|
576
589
|
private updateAdjustment;
|
|
577
|
-
private updateBrightnessFilter;
|
|
578
590
|
private autoEnablePan;
|
|
579
591
|
private setTempFilterValue;
|
|
580
|
-
private
|
|
581
|
-
private setAdjustment;
|
|
592
|
+
private getDefaultCurrentFilter;
|
|
582
593
|
private renderSlider;
|
|
594
|
+
private createSlider;
|
|
583
595
|
private getCurrAdjustmentValue;
|
|
584
596
|
private setCurrAdjustmentValue;
|
|
585
597
|
private cancelPan;
|
|
586
598
|
private callMainToolbar;
|
|
599
|
+
private setCurrSelectionPoints;
|
|
600
|
+
private updateObjAndFreeHandDrawColl;
|
|
587
601
|
private cancelItems;
|
|
588
|
-
private
|
|
589
|
-
private
|
|
602
|
+
private freehandDownHandler;
|
|
603
|
+
private freehandUpHandler;
|
|
604
|
+
private freehandMoveHandler;
|
|
605
|
+
private processPoint;
|
|
606
|
+
private calcCurveControlPoints;
|
|
607
|
+
private point;
|
|
608
|
+
private startDraw;
|
|
609
|
+
private pointVelocity;
|
|
610
|
+
private distanceTo;
|
|
611
|
+
private drawCurve;
|
|
612
|
+
private bezierLength;
|
|
613
|
+
private bezierPoint;
|
|
614
|
+
private drawArc;
|
|
615
|
+
private freehandRedraw;
|
|
590
616
|
private redrawImgWithObj;
|
|
591
617
|
private refreshToolbar;
|
|
592
618
|
private getAdjustmentToolbarItem;
|
|
@@ -595,16 +621,63 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
595
621
|
private initPenToolbarItem;
|
|
596
622
|
private createPenColor;
|
|
597
623
|
private createPenBtn;
|
|
624
|
+
private updateFreehandDrawColorChange;
|
|
598
625
|
private setPenStroke;
|
|
599
626
|
private getPenStroke;
|
|
600
627
|
private initAdjustmentToolbarItem;
|
|
601
628
|
private initFilterToolbarItem;
|
|
629
|
+
private getCurrentCanvasData;
|
|
602
630
|
private createCanvasFilter;
|
|
631
|
+
private callUpdateCurrentTransformedState;
|
|
632
|
+
private updateCurrentTransformedState;
|
|
633
|
+
private reverseTransformedState;
|
|
634
|
+
private currentTransformedState;
|
|
635
|
+
private iterateRotateFlipColl;
|
|
636
|
+
private setTransform;
|
|
637
|
+
private isObjInsideCropRegion;
|
|
638
|
+
private panFreehandDrawColl;
|
|
639
|
+
private panObjColl;
|
|
640
|
+
private cropObjColl;
|
|
641
|
+
private cropFreehandDrawColl;
|
|
642
|
+
private hoverFreehandraw;
|
|
643
|
+
private flipFreehandrawColl;
|
|
644
|
+
private rotateFreehandDrawColl;
|
|
645
|
+
private zoomFreehandDrawColl;
|
|
646
|
+
private zoomX;
|
|
647
|
+
private zoomY;
|
|
648
|
+
private zoomObjColl;
|
|
649
|
+
private calcRatio;
|
|
650
|
+
private drawCustomSelection;
|
|
651
|
+
private clearOuterCanvas;
|
|
652
|
+
private cropCircle;
|
|
653
|
+
private updateCropObj;
|
|
654
|
+
private setCropObj;
|
|
655
|
+
private drawCropSelectionImage;
|
|
656
|
+
private cropImg;
|
|
657
|
+
private updateImageRatioForActObj;
|
|
658
|
+
private drawImgToCanvas;
|
|
659
|
+
private limitPan;
|
|
660
|
+
private updatePanPoints;
|
|
661
|
+
private setCurrentPanRegion;
|
|
662
|
+
private getCurrentPanRegion;
|
|
663
|
+
private drawPannImage;
|
|
664
|
+
private drawPannedImage;
|
|
665
|
+
private updateFlipPan;
|
|
666
|
+
private updateFlipActiveObj;
|
|
667
|
+
private resetPanPoints;
|
|
668
|
+
private flipCrop;
|
|
669
|
+
private rotateCrop;
|
|
670
|
+
private updateRotatePanPoints;
|
|
671
|
+
private rotatePan;
|
|
672
|
+
private rotateZoom;
|
|
673
|
+
private drawZoomImgToCanvas;
|
|
674
|
+
private cropZoom;
|
|
603
675
|
private updateCanvas;
|
|
604
676
|
private imageOnLoad;
|
|
605
677
|
private refreshActiveObj;
|
|
606
678
|
private redrawText;
|
|
607
679
|
private setTextSelection;
|
|
680
|
+
private updateUndoRedoColl;
|
|
608
681
|
private fileSelect;
|
|
609
682
|
private findTextPoint;
|
|
610
683
|
private getStrokeWidth;
|
|
@@ -613,7 +686,12 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
613
686
|
private targetTouches;
|
|
614
687
|
private calculateScale;
|
|
615
688
|
private getDistance;
|
|
689
|
+
private setXYPoints;
|
|
616
690
|
private touchStartHandler;
|
|
691
|
+
private isShapeTouch;
|
|
692
|
+
private isFreehandDrawTouch;
|
|
693
|
+
private selectFreehandDraw;
|
|
694
|
+
private closeContextualToolbar;
|
|
617
695
|
private mouseDownEventHandler;
|
|
618
696
|
private mouseMoveEventHandler;
|
|
619
697
|
private mouseUpEventHandler;
|
|
@@ -622,18 +700,14 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
622
700
|
private canvasMouseDownHandler;
|
|
623
701
|
private canvasMouseMoveHandler;
|
|
624
702
|
private canvasMouseUpHandler;
|
|
625
|
-
private
|
|
703
|
+
private handleScroll;
|
|
626
704
|
private textKeyDown;
|
|
627
705
|
private adjustToScreen;
|
|
628
706
|
private screenOrientation;
|
|
629
707
|
private windowResizeHandler;
|
|
630
|
-
private
|
|
631
|
-
private
|
|
632
|
-
private
|
|
633
|
-
private scaleNonUniform;
|
|
634
|
-
private zoomImg;
|
|
635
|
-
private handleScroll;
|
|
636
|
-
private redraw;
|
|
708
|
+
private updatePreviousShapeSettings;
|
|
709
|
+
private disableZoomOutBtn;
|
|
710
|
+
private setZoomDimension;
|
|
637
711
|
private applyCurrActObj;
|
|
638
712
|
private updateTextFromTextArea;
|
|
639
713
|
private setTextBoxStylesToActObj;
|
|
@@ -641,10 +715,15 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
641
715
|
private setTextBoxPos;
|
|
642
716
|
private setTextBoxPoints;
|
|
643
717
|
private findTextTarget;
|
|
718
|
+
private selectedText;
|
|
644
719
|
private setTextBoxHeight;
|
|
645
720
|
private setTextBoxWidth;
|
|
646
721
|
private setActivePoint;
|
|
722
|
+
private setDragWidth;
|
|
723
|
+
private setDragHeight;
|
|
724
|
+
private triggerShapeChange;
|
|
647
725
|
private updateActivePoint;
|
|
726
|
+
private preventDraggingInvertly;
|
|
648
727
|
private updateNWPoints;
|
|
649
728
|
private updateNPoints;
|
|
650
729
|
private updateNEPoints;
|
|
@@ -653,14 +732,17 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
653
732
|
private updateSWPoints;
|
|
654
733
|
private updateSPoints;
|
|
655
734
|
private updateSEPoints;
|
|
735
|
+
private updateFontRatio;
|
|
736
|
+
private updateFontSize;
|
|
737
|
+
private preventInverseResize;
|
|
656
738
|
private getScaleRatio;
|
|
657
739
|
private getMaxText;
|
|
658
740
|
private setDragLimit;
|
|
659
741
|
private lineDraw;
|
|
660
742
|
private shapeCircle;
|
|
661
743
|
private drawOuterSelection;
|
|
662
|
-
private getZoomShape;
|
|
663
744
|
private drawObject;
|
|
745
|
+
private rotateShape;
|
|
664
746
|
private updateActiveObject;
|
|
665
747
|
private drawShapeObj;
|
|
666
748
|
private shapeLine;
|
|
@@ -671,42 +753,67 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
671
753
|
private drawCenterCircles;
|
|
672
754
|
private findTarget;
|
|
673
755
|
private findTargetObj;
|
|
756
|
+
private getCurrentFlipState;
|
|
757
|
+
private rotateDegree;
|
|
674
758
|
private updateCursorStyles;
|
|
675
759
|
private drawCropRatio;
|
|
676
760
|
private setDragDirection;
|
|
761
|
+
private updatePoints;
|
|
677
762
|
private calcShapeRatio;
|
|
678
763
|
private getScale;
|
|
679
|
-
private calcRatio;
|
|
680
764
|
private calcMaxDimension;
|
|
681
765
|
private setMaximumDimension;
|
|
682
766
|
private setCursor;
|
|
767
|
+
private setCursorForFreehandDrawing;
|
|
683
768
|
private setCursorFromObj;
|
|
684
|
-
private
|
|
769
|
+
private isInside;
|
|
770
|
+
private refreshDropDownBtn;
|
|
685
771
|
private downloadImg;
|
|
686
772
|
private toSVGImg;
|
|
687
773
|
private toBlobFn;
|
|
774
|
+
private exportChangesToCanvas;
|
|
775
|
+
private exportTransformedImage;
|
|
776
|
+
private exportRotate;
|
|
777
|
+
private exportHorizontalFlip;
|
|
778
|
+
private exportVerticalFlip;
|
|
779
|
+
private updateSaveContext;
|
|
688
780
|
private addLetter;
|
|
689
781
|
private updateFontStyles;
|
|
690
|
-
private updateInMemoryCanvas;
|
|
691
|
-
private calcPrevRatio;
|
|
692
782
|
private textFlipDegree;
|
|
693
783
|
private rotateText;
|
|
694
|
-
private redrawSelection;
|
|
695
784
|
private redrawObj;
|
|
696
785
|
private updateCurrentActiveObjPoint;
|
|
697
|
-
private
|
|
786
|
+
private rotateObjColl;
|
|
787
|
+
private setTextFontSize;
|
|
698
788
|
private redrawShape;
|
|
699
789
|
private applyActObj;
|
|
700
790
|
private apply;
|
|
701
791
|
private setCenterPoints;
|
|
702
792
|
private drawShape;
|
|
703
793
|
private drawShapeText;
|
|
704
|
-
private
|
|
794
|
+
private updateShapeChangeEventArgs;
|
|
705
795
|
private getObjDetails;
|
|
796
|
+
private getFreehandDrawDetails;
|
|
706
797
|
private isPointsInRange;
|
|
707
|
-
private updateInMemoryContext;
|
|
708
798
|
private clearActObj;
|
|
709
|
-
private
|
|
799
|
+
private applyPenDraw;
|
|
800
|
+
private drawRotatedImage;
|
|
801
|
+
private setClientTransformedDimension;
|
|
802
|
+
private popForDefaultTransformedState;
|
|
803
|
+
private popForDefaultFlipState;
|
|
804
|
+
private popForDefaultRotateState;
|
|
805
|
+
private alignRotateFlipColl;
|
|
806
|
+
private updateFlipColl;
|
|
807
|
+
private horizontalFlip;
|
|
808
|
+
private verticalFlip;
|
|
809
|
+
private updateFlipState;
|
|
810
|
+
private setDestinationPoints;
|
|
811
|
+
private rotatedFlip;
|
|
812
|
+
private getFilterValue;
|
|
813
|
+
private setFilterValue;
|
|
814
|
+
private getSaturationFilterValue;
|
|
815
|
+
private setSaturationFilterValue;
|
|
816
|
+
private getBlackAndWhiteData;
|
|
710
817
|
private setBrightness;
|
|
711
818
|
private setContrast;
|
|
712
819
|
private setHue;
|
|
@@ -715,16 +822,11 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
715
822
|
private setBlur;
|
|
716
823
|
private setExposure;
|
|
717
824
|
private setFilter;
|
|
718
|
-
private
|
|
719
|
-
private
|
|
720
|
-
private
|
|
721
|
-
private
|
|
722
|
-
private
|
|
723
|
-
private getFilterValue;
|
|
724
|
-
private setFilterValue;
|
|
725
|
-
private getSaturationFilterValue;
|
|
726
|
-
private setSaturationFilterValue;
|
|
727
|
-
private getBlackAndWhiteData;
|
|
825
|
+
private renderImage;
|
|
826
|
+
private updateTextBox;
|
|
827
|
+
private setAdjustment;
|
|
828
|
+
private updateFilter;
|
|
829
|
+
private drawNewSelection;
|
|
728
830
|
/**
|
|
729
831
|
* Clear a current selection.
|
|
730
832
|
*
|
|
@@ -832,6 +934,7 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
832
934
|
* @returns {void}.
|
|
833
935
|
*/
|
|
834
936
|
pan(value: boolean): void;
|
|
937
|
+
private setDestPointsForFlipState;
|
|
835
938
|
/**
|
|
836
939
|
* Increase / Decrease the magnification of an image.
|
|
837
940
|
*
|
|
@@ -992,13 +1095,6 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
992
1095
|
* @returns {void}.
|
|
993
1096
|
*/
|
|
994
1097
|
update(): void;
|
|
995
|
-
/**
|
|
996
|
-
* To apply the filters to an image
|
|
997
|
-
*
|
|
998
|
-
* @param {ImageFilterOptions } filterOption - Specifies the filter options to the image.
|
|
999
|
-
* @returns {void}.
|
|
1000
|
-
*/
|
|
1001
|
-
applyImageFilter(filterOption: ImageFilterOptions): void;
|
|
1002
1098
|
/**
|
|
1003
1099
|
* To apply the filters to an image
|
|
1004
1100
|
*
|
|
@@ -1009,100 +1105,26 @@ export declare class ImageEditor extends SignatureBase implements INotifyPropert
|
|
|
1009
1105
|
*/
|
|
1010
1106
|
finetuneImage(finetuneOption: ImageFinetuneOptions, value: number): void;
|
|
1011
1107
|
/**
|
|
1012
|
-
* To
|
|
1013
|
-
*
|
|
1014
|
-
* @returns {boolean}.
|
|
1015
|
-
* @private
|
|
1016
|
-
*/
|
|
1017
|
-
canUndo(): boolean;
|
|
1018
|
-
/**
|
|
1019
|
-
* To check whether the redo collection is empty or not.
|
|
1020
|
-
*
|
|
1021
|
-
* @returns {boolean}.
|
|
1022
|
-
* @private
|
|
1023
|
-
*/
|
|
1024
|
-
canRedo(): boolean;
|
|
1025
|
-
/**
|
|
1026
|
-
* Erases all the signature strokes signed by user.
|
|
1027
|
-
*
|
|
1028
|
-
* @returns {void}.
|
|
1029
|
-
* @private
|
|
1030
|
-
*/
|
|
1031
|
-
clear(): void;
|
|
1032
|
-
/**
|
|
1033
|
-
* To draw the signature based on the given text, with the font family and font size.
|
|
1034
|
-
*
|
|
1035
|
-
* @param {string} text - specify text to be drawn as signature.
|
|
1036
|
-
* @param {string} fontFamily - specify font family of a signature.
|
|
1037
|
-
* @param {number} fontSize - specify font size of a signature.
|
|
1038
|
-
*
|
|
1039
|
-
* @returns {void}.
|
|
1040
|
-
* @private
|
|
1041
|
-
*/
|
|
1042
|
-
draw(text: string, fontFamily?: string, fontSize?: number): void;
|
|
1043
|
-
/**
|
|
1044
|
-
* To get the signature as Blob.
|
|
1045
|
-
*
|
|
1046
|
-
* @param {string} url - specify the url/base 64 string to get blob of the signature.
|
|
1047
|
-
* @returns {Blob}.
|
|
1048
|
-
* @private
|
|
1049
|
-
*/
|
|
1050
|
-
getBlob(url: string): Blob;
|
|
1051
|
-
/**
|
|
1052
|
-
* To check whether the signature is empty or not.
|
|
1053
|
-
*
|
|
1054
|
-
* @returns {boolean}.
|
|
1055
|
-
* @private
|
|
1056
|
-
*/
|
|
1057
|
-
isEmpty(): boolean;
|
|
1058
|
-
/**
|
|
1059
|
-
* To load the signature with the given base 64 string, height and width.
|
|
1108
|
+
* To apply the filters to an image
|
|
1060
1109
|
*
|
|
1061
|
-
* @param {
|
|
1062
|
-
* @param {number} width - specify the width of the loaded signature image.
|
|
1063
|
-
* @param {number} height - specify the height of the loaded signature image.
|
|
1110
|
+
* @param {ImageFilterOptions } filterOption - Specifies the filter options to the image.
|
|
1064
1111
|
* @returns {void}.
|
|
1065
|
-
* @private
|
|
1066
1112
|
*/
|
|
1067
|
-
|
|
1113
|
+
applyImageFilter(filterOption: ImageFilterOptions): void;
|
|
1068
1114
|
/**
|
|
1069
1115
|
* Undo the last user action.
|
|
1070
1116
|
*
|
|
1071
|
-
* @returns {void}.
|
|
1072
1117
|
* @private
|
|
1118
|
+
* @returns {void}.
|
|
1073
1119
|
*/
|
|
1074
1120
|
undo(): void;
|
|
1075
1121
|
/**
|
|
1076
1122
|
* Redo the last user action.
|
|
1077
1123
|
*
|
|
1078
|
-
* @returns {void}.
|
|
1079
1124
|
* @private
|
|
1080
|
-
*/
|
|
1081
|
-
redo(): void;
|
|
1082
|
-
/**
|
|
1083
|
-
* To save the signature with the given file type and file name.
|
|
1084
|
-
*
|
|
1085
|
-
* @param {FileType} type - specify type of the file to be saved a signature.
|
|
1086
|
-
* @param {string} fileName - specify name of the file to be saved a signature.
|
|
1087
|
-
*
|
|
1088
1125
|
* @returns {void}.
|
|
1089
|
-
* @private
|
|
1090
|
-
*/
|
|
1091
|
-
save(type?: FileType, fileName?: string): void;
|
|
1092
|
-
/**
|
|
1093
|
-
* To save the signature as Blob.
|
|
1094
|
-
*
|
|
1095
|
-
* @returns {Blob}.
|
|
1096
|
-
* @private
|
|
1097
1126
|
*/
|
|
1098
|
-
|
|
1099
|
-
/**
|
|
1100
|
-
* Returns the persistence data for component.
|
|
1101
|
-
*
|
|
1102
|
-
* @returns {any}.
|
|
1103
|
-
* @private
|
|
1104
|
-
*/
|
|
1105
|
-
getLocalData(): any;
|
|
1127
|
+
redo(): void;
|
|
1106
1128
|
}
|
|
1107
1129
|
/**
|
|
1108
1130
|
* Defines the Image Editor file type.
|
|
@@ -1115,7 +1137,7 @@ export declare type Direction = 'Horizontal' | 'Vertical';
|
|
|
1115
1137
|
/**
|
|
1116
1138
|
* Defines the Image Editor shape type.
|
|
1117
1139
|
*/
|
|
1118
|
-
export declare type ShapeType = 'Rectangle' | 'Ellipse' | 'Line' | 'Text';
|
|
1140
|
+
export declare type ShapeType = 'Rectangle' | 'Ellipse' | 'Line' | 'Text' | 'FreehandDraw';
|
|
1119
1141
|
/**
|
|
1120
1142
|
* Defines the theme for Image Editor.
|
|
1121
1143
|
*/
|
|
@@ -1127,7 +1149,7 @@ export declare type ImageEditorCommands = 'Crop' | 'Transform' | 'Annotate' | 'Z
|
|
|
1127
1149
|
/**
|
|
1128
1150
|
* Defines the image filter options
|
|
1129
1151
|
*/
|
|
1130
|
-
export declare type ImageFilterOptions = 'Default' | 'Chrome' | 'Cold' | 'Warm' | '
|
|
1152
|
+
export declare type ImageFilterOptions = 'Default' | 'Chrome' | 'Cold' | 'Warm' | 'Grayscale' | 'Sepia' | 'Invert';
|
|
1131
1153
|
/**
|
|
1132
1154
|
* Defines the image filter options
|
|
1133
1155
|
*/
|
|
@@ -1200,11 +1222,11 @@ export interface ShapeChangeEventArgs {
|
|
|
1200
1222
|
/**
|
|
1201
1223
|
* Returns the object of shape before moved, resized, or customized the UI.
|
|
1202
1224
|
*/
|
|
1203
|
-
previousShapeSettings?:
|
|
1225
|
+
previousShapeSettings?: ShapeSettings;
|
|
1204
1226
|
/**
|
|
1205
1227
|
* Returns `the object of shape which is inserted or moved or deleted or resized or customized the UI.
|
|
1206
1228
|
*/
|
|
1207
|
-
currentShapeSettings?:
|
|
1229
|
+
currentShapeSettings?: ShapeSettings;
|
|
1208
1230
|
}
|
|
1209
1231
|
/**
|
|
1210
1232
|
* Interface for Toolbar events.
|
|
@@ -1228,15 +1250,15 @@ export interface ToolbarEventArgs {
|
|
|
1228
1250
|
toolbarItems?: (string | ItemModel)[];
|
|
1229
1251
|
}
|
|
1230
1252
|
/**
|
|
1231
|
-
* Interface for
|
|
1253
|
+
* Interface for opening the image.
|
|
1232
1254
|
*/
|
|
1233
|
-
export interface
|
|
1255
|
+
export interface OpenEventArgs {
|
|
1234
1256
|
/**
|
|
1235
|
-
*
|
|
1257
|
+
* Returns the file name of an image.
|
|
1236
1258
|
*/
|
|
1237
1259
|
fileName: string;
|
|
1238
1260
|
/**
|
|
1239
|
-
* Returns the file type
|
|
1261
|
+
* Returns the file type of an image.
|
|
1240
1262
|
*/
|
|
1241
1263
|
fileType: FileType;
|
|
1242
1264
|
}
|
|
@@ -1245,11 +1267,11 @@ export interface FileOpenEventArgs {
|
|
|
1245
1267
|
*/
|
|
1246
1268
|
export interface SaveEventArgs {
|
|
1247
1269
|
/**
|
|
1248
|
-
*
|
|
1270
|
+
* Returns the file name of an image.
|
|
1249
1271
|
*/
|
|
1250
1272
|
fileName: string;
|
|
1251
1273
|
/**
|
|
1252
|
-
* Returns the file type
|
|
1274
|
+
* Returns the file type of an image.
|
|
1253
1275
|
*/
|
|
1254
1276
|
fileType: FileType;
|
|
1255
1277
|
}
|
|
@@ -1283,6 +1305,24 @@ export interface Point {
|
|
|
1283
1305
|
* Returns y position in the canvas.
|
|
1284
1306
|
*/
|
|
1285
1307
|
y: number;
|
|
1308
|
+
/**
|
|
1309
|
+
* Returns the x ratio from in the image.
|
|
1310
|
+
*
|
|
1311
|
+
* @private
|
|
1312
|
+
*/
|
|
1313
|
+
ratioX?: number;
|
|
1314
|
+
/**
|
|
1315
|
+
* Returns y ratio from the image.
|
|
1316
|
+
*
|
|
1317
|
+
* @private
|
|
1318
|
+
*/
|
|
1319
|
+
ratioY?: number;
|
|
1320
|
+
/**
|
|
1321
|
+
* Gets or sets the time.
|
|
1322
|
+
*
|
|
1323
|
+
* @private
|
|
1324
|
+
*/
|
|
1325
|
+
time?: number;
|
|
1286
1326
|
}
|
|
1287
1327
|
/**
|
|
1288
1328
|
* Interface for ShapeSettings in the imageEditor.
|
|
@@ -1348,6 +1388,10 @@ export interface ShapeSettings {
|
|
|
1348
1388
|
* Returns the font color of the text.
|
|
1349
1389
|
*/
|
|
1350
1390
|
color?: string;
|
|
1391
|
+
/**
|
|
1392
|
+
* Returns the points collection of freehand drawing.
|
|
1393
|
+
*/
|
|
1394
|
+
points?: Point[];
|
|
1351
1395
|
}
|
|
1352
1396
|
/**
|
|
1353
1397
|
* Interface for filter option for the image.
|