@nmmty/lazycanvas 0.4.0 → 0.5.0
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/dist/helpers/Filters.d.ts +10 -10
- package/dist/helpers/Fonts.d.ts +1 -1
- package/dist/helpers/FontsList.d.ts +1 -1
- package/dist/helpers/FontsList.js +19 -19
- package/dist/index.d.ts +11 -20
- package/dist/index.js +40 -47
- package/dist/structures/LazyCanvas.d.ts +126 -19
- package/dist/structures/LazyCanvas.js +100 -35
- package/dist/structures/components/BaseLayer.d.ts +188 -38
- package/dist/structures/components/BaseLayer.js +88 -41
- package/dist/structures/components/BezierLayer.d.ts +108 -21
- package/dist/structures/components/BezierLayer.js +73 -24
- package/dist/structures/components/ClearLayer.d.ts +120 -17
- package/dist/structures/components/ClearLayer.js +83 -22
- package/dist/structures/components/Group.d.ts +86 -18
- package/dist/structures/components/Group.js +69 -29
- package/dist/structures/components/ImageLayer.d.ts +85 -12
- package/dist/structures/components/ImageLayer.js +52 -39
- package/dist/structures/components/LineLayer.d.ts +111 -18
- package/dist/structures/components/LineLayer.js +58 -21
- package/dist/structures/components/MorphLayer.d.ts +109 -21
- package/dist/structures/components/MorphLayer.js +53 -25
- package/dist/structures/components/Path2DLayer.d.ts +191 -0
- package/dist/structures/components/Path2DLayer.js +318 -0
- package/dist/structures/components/QuadraticLayer.d.ts +108 -22
- package/dist/structures/components/QuadraticLayer.js +65 -30
- package/dist/structures/components/TextLayer.d.ts +201 -40
- package/dist/structures/components/TextLayer.js +99 -47
- package/dist/structures/components/index.d.ts +10 -0
- package/dist/structures/components/index.js +26 -0
- package/dist/structures/helpers/Exporter.d.ts +52 -0
- package/dist/structures/helpers/Exporter.js +168 -0
- package/dist/structures/helpers/Font.d.ts +64 -10
- package/dist/structures/helpers/Font.js +38 -11
- package/dist/structures/helpers/Gradient.d.ts +96 -9
- package/dist/structures/helpers/Gradient.js +48 -17
- package/dist/structures/helpers/Link.d.ts +52 -8
- package/dist/structures/helpers/Link.js +42 -11
- package/dist/structures/helpers/Pattern.d.ts +52 -7
- package/dist/structures/helpers/Pattern.js +45 -40
- package/dist/structures/helpers/index.d.ts +6 -0
- package/dist/structures/helpers/index.js +22 -0
- package/dist/structures/helpers/readers/JSONReader.d.ts +49 -0
- package/dist/structures/helpers/readers/JSONReader.js +172 -0
- package/dist/structures/helpers/readers/SVGReader.d.ts +20 -0
- package/dist/structures/helpers/readers/SVGReader.js +577 -0
- package/dist/structures/helpers/readers/YAMLReader.d.ts +0 -0
- package/dist/structures/helpers/readers/YAMLReader.js +1 -0
- package/dist/structures/managers/AnimationManager.d.ts +96 -20
- package/dist/structures/managers/AnimationManager.js +54 -26
- package/dist/structures/managers/FontsManager.d.ts +76 -32
- package/dist/structures/managers/FontsManager.js +70 -45
- package/dist/structures/managers/LayersManager.d.ts +84 -32
- package/dist/structures/managers/LayersManager.js +66 -28
- package/dist/structures/managers/RenderManager.d.ts +60 -6
- package/dist/structures/managers/RenderManager.js +120 -40
- package/dist/types/enum.d.ts +11 -6
- package/dist/types/enum.js +17 -12
- package/dist/types/index.d.ts +2 -19
- package/dist/types/index.js +17 -0
- package/dist/utils/LazyUtil.js +2 -2
- package/dist/utils/utils.d.ts +10 -9
- package/dist/utils/utils.js +159 -164
- package/package.json +4 -5
|
@@ -1,86 +1,236 @@
|
|
|
1
|
-
import { ScaleType,
|
|
2
|
-
|
|
1
|
+
import { ScaleType, AnyCentring, AnyGlobalCompositeOperation, ColorType, Transform, AnyFilter, LayerType } from "../../types";
|
|
2
|
+
/**
|
|
3
|
+
* Interface representing the base structure of a layer.
|
|
4
|
+
*/
|
|
5
|
+
export interface IBaseLayer {
|
|
6
|
+
/**
|
|
7
|
+
* The unique identifier of the layer.
|
|
8
|
+
*/
|
|
9
|
+
id: string;
|
|
10
|
+
/**
|
|
11
|
+
* The type of the layer.
|
|
12
|
+
*/
|
|
13
|
+
type: LayerType;
|
|
14
|
+
/**
|
|
15
|
+
* The z-index of the layer, determining its stacking order.
|
|
16
|
+
*/
|
|
17
|
+
zIndex: number;
|
|
18
|
+
/**
|
|
19
|
+
* Whether the layer is visible.
|
|
20
|
+
*/
|
|
21
|
+
visible: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* The properties of the layer.
|
|
24
|
+
*/
|
|
25
|
+
props: IBaseLayerProps;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* Interface representing the properties of a base layer.
|
|
29
|
+
*/
|
|
30
|
+
export interface IBaseLayerProps {
|
|
31
|
+
/**
|
|
32
|
+
* The x-coordinate of the layer.
|
|
33
|
+
*/
|
|
34
|
+
x: ScaleType;
|
|
35
|
+
/**
|
|
36
|
+
* The y-coordinate of the layer.
|
|
37
|
+
*/
|
|
38
|
+
y: ScaleType;
|
|
39
|
+
/**
|
|
40
|
+
* The centring type of the layer.
|
|
41
|
+
*/
|
|
42
|
+
centring: AnyCentring;
|
|
43
|
+
/**
|
|
44
|
+
* The filter effects applied to the layer.
|
|
45
|
+
*/
|
|
46
|
+
filter: string;
|
|
47
|
+
/**
|
|
48
|
+
* The opacity of the layer, ranging from 0 to 1.
|
|
49
|
+
*/
|
|
50
|
+
opacity: number;
|
|
51
|
+
/**
|
|
52
|
+
* Whether the layer is filled.
|
|
53
|
+
*/
|
|
54
|
+
filled: boolean;
|
|
55
|
+
/**
|
|
56
|
+
* The fill style (color or pattern) of the layer.
|
|
57
|
+
*/
|
|
58
|
+
fillStyle: ColorType;
|
|
59
|
+
/**
|
|
60
|
+
* The shadow properties of the layer.
|
|
61
|
+
*/
|
|
62
|
+
shadow: {
|
|
63
|
+
/**
|
|
64
|
+
* The color of the shadow.
|
|
65
|
+
*/
|
|
66
|
+
color: string;
|
|
67
|
+
/**
|
|
68
|
+
* The blur radius of the shadow.
|
|
69
|
+
*/
|
|
70
|
+
blur: number;
|
|
71
|
+
/**
|
|
72
|
+
* The horizontal offset of the shadow.
|
|
73
|
+
*/
|
|
74
|
+
offsetX: number;
|
|
75
|
+
/**
|
|
76
|
+
* The vertical offset of the shadow.
|
|
77
|
+
*/
|
|
78
|
+
offsetY: number;
|
|
79
|
+
};
|
|
80
|
+
/**
|
|
81
|
+
* The transformation properties of the layer.
|
|
82
|
+
*/
|
|
83
|
+
transform: Transform;
|
|
84
|
+
/**
|
|
85
|
+
* The global composite operation applied to the layer.
|
|
86
|
+
*/
|
|
87
|
+
globalComposite: AnyGlobalCompositeOperation;
|
|
88
|
+
}
|
|
89
|
+
/**
|
|
90
|
+
* Interface representing miscellaneous options for a base layer.
|
|
91
|
+
*/
|
|
92
|
+
export interface IBaseLayerMisc {
|
|
93
|
+
/**
|
|
94
|
+
* The unique identifier of the layer (optional).
|
|
95
|
+
*/
|
|
96
|
+
id?: string;
|
|
97
|
+
/**
|
|
98
|
+
* The z-index of the layer (optional).
|
|
99
|
+
*/
|
|
100
|
+
zIndex?: number;
|
|
101
|
+
/**
|
|
102
|
+
* Whether the layer is visible (optional).
|
|
103
|
+
*/
|
|
104
|
+
visible?: boolean;
|
|
105
|
+
}
|
|
106
|
+
/**
|
|
107
|
+
* Represents a base layer with generic properties and methods for managing
|
|
108
|
+
* its position, visibility, transformations, and other attributes.
|
|
109
|
+
*
|
|
110
|
+
* @template T - A type extending `IBaseLayerProps` that defines the properties of the layer.
|
|
111
|
+
*/
|
|
3
112
|
export declare class BaseLayer<T extends IBaseLayerProps> {
|
|
113
|
+
/**
|
|
114
|
+
* The unique identifier of the layer.
|
|
115
|
+
* @type {string}
|
|
116
|
+
*/
|
|
4
117
|
id: string;
|
|
118
|
+
/**
|
|
119
|
+
* The type of the layer.
|
|
120
|
+
* @type {LayerType}
|
|
121
|
+
*/
|
|
5
122
|
type: LayerType;
|
|
123
|
+
/**
|
|
124
|
+
* The z-index of the layer, determining its stacking order.
|
|
125
|
+
* @type {number}
|
|
126
|
+
*/
|
|
6
127
|
zIndex: number;
|
|
128
|
+
/**
|
|
129
|
+
* The visibility of the layer.
|
|
130
|
+
* @type {boolean}
|
|
131
|
+
*/
|
|
7
132
|
visible: boolean;
|
|
133
|
+
/**
|
|
134
|
+
* The properties of the layer, defined by the generic type `T`.
|
|
135
|
+
* @type {T}
|
|
136
|
+
*/
|
|
8
137
|
props: T;
|
|
9
|
-
constructor(type?: LayerType, props?: T);
|
|
10
138
|
/**
|
|
11
|
-
*
|
|
12
|
-
* @param
|
|
13
|
-
* @param
|
|
139
|
+
* Constructs a new `BaseLayer` instance.
|
|
140
|
+
* @param {LayerType} [type] - The type of the layer.
|
|
141
|
+
* @param {T} [props] - The properties of the layer.
|
|
142
|
+
* @param {IBaseLayerMisc} [misc] - Miscellaneous options for the layer.
|
|
143
|
+
*/
|
|
144
|
+
constructor(type?: LayerType, props?: T, misc?: IBaseLayerMisc);
|
|
145
|
+
/**
|
|
146
|
+
* Sets the position of the layer in the 2D plane.
|
|
147
|
+
* @param {ScaleType} x - The x-coordinate of the layer.
|
|
148
|
+
* @param {ScaleType} y - The y-coordinate of the layer.
|
|
149
|
+
* @returns {this} The current instance for chaining.
|
|
14
150
|
*/
|
|
15
151
|
setPosition(x: ScaleType, y: ScaleType): this;
|
|
16
152
|
/**
|
|
17
|
-
*
|
|
18
|
-
* @param
|
|
153
|
+
* Sets the opacity of the layer.
|
|
154
|
+
* @param {number} opacity - The opacity value, between 0 and 1.
|
|
155
|
+
* @returns {this} The current instance for chaining.
|
|
19
156
|
*/
|
|
20
157
|
setOpacity(opacity: number): this;
|
|
21
158
|
/**
|
|
22
|
-
*
|
|
23
|
-
*
|
|
159
|
+
* Sets the unique identifier of the layer.
|
|
160
|
+
*
|
|
161
|
+
* @param {string} id - The unique identifier.
|
|
162
|
+
* @returns {this} The current instance for chaining.
|
|
24
163
|
*/
|
|
25
164
|
setID(id: string): this;
|
|
26
165
|
/**
|
|
27
|
-
*
|
|
28
|
-
* @param
|
|
29
|
-
* @param
|
|
30
|
-
* @param
|
|
31
|
-
* @param
|
|
166
|
+
* Sets the shadow properties of the layer.
|
|
167
|
+
* @param {string} color - The color of the shadow.
|
|
168
|
+
* @param {number} [blur] - The blur radius of the shadow.
|
|
169
|
+
* @param {number} [offsetX] - The horizontal offset of the shadow.
|
|
170
|
+
* @param {number} [offsetY] - The vertical offset of the shadow.
|
|
171
|
+
* @returns {this} The current instance for chaining.
|
|
172
|
+
* @throws {LazyError} If the color is invalid or not provided.
|
|
32
173
|
*/
|
|
33
174
|
setShadow(color: string, blur?: number, offsetX?: number, offsetY?: number): this;
|
|
34
175
|
/**
|
|
35
|
-
*
|
|
36
|
-
* @param
|
|
176
|
+
* Sets the transformation matrix of the layer.
|
|
177
|
+
* @param {DOMMatrix2DInit} matrix - The transformation matrix.
|
|
178
|
+
* @returns {this} The current instance for chaining.
|
|
37
179
|
*/
|
|
38
180
|
setMatrix(matrix: DOMMatrix2DInit): this;
|
|
39
181
|
/**
|
|
40
|
-
*
|
|
41
|
-
* @param
|
|
42
|
-
* @param
|
|
182
|
+
* Sets the scale of the layer in the x and y directions.
|
|
183
|
+
* @param {number} x - The scale factor in the x direction.
|
|
184
|
+
* @param {number} y - The scale factor in the y direction.
|
|
185
|
+
* @returns {this} The current instance for chaining.
|
|
43
186
|
*/
|
|
44
187
|
setScale(x: number, y: number): this;
|
|
45
188
|
/**
|
|
46
|
-
*
|
|
47
|
-
* @param
|
|
189
|
+
* Sets the rotation of the layer.
|
|
190
|
+
* @param {number} rotate - The rotation angle in degrees.
|
|
191
|
+
* @returns {this} The current instance for chaining.
|
|
48
192
|
*/
|
|
49
193
|
setRotate(rotate: number): this;
|
|
50
194
|
/**
|
|
51
|
-
*
|
|
52
|
-
* @param
|
|
53
|
-
* @param
|
|
195
|
+
* Sets the translation of the layer in the x and y directions.
|
|
196
|
+
* @param {number} x - The translation in the x direction.
|
|
197
|
+
* @param {number} y - The translation in the y direction.
|
|
198
|
+
* @returns {this} The current instance for chaining.
|
|
54
199
|
*/
|
|
55
200
|
setTranslate(x: number, y: number): this;
|
|
56
201
|
/**
|
|
57
|
-
*
|
|
58
|
-
*
|
|
59
|
-
* @
|
|
202
|
+
* Sets the filter effects for the layer.
|
|
203
|
+
* @param {...AnyFilter} filter - The filter effects to apply.
|
|
204
|
+
* @returns {this} The current instance for chaining.
|
|
60
205
|
*/
|
|
61
|
-
setFilters(...filter:
|
|
206
|
+
setFilters(...filter: AnyFilter[]): this;
|
|
62
207
|
/**
|
|
63
|
-
*
|
|
64
|
-
* @param
|
|
208
|
+
* Sets the centring type of the layer. **Don't affect on Bezier, Line, Quadratic and Text layers**.
|
|
209
|
+
* @param {AnyCentring} centring - The centring type.
|
|
210
|
+
* @returns {this} The current instance for chaining.
|
|
65
211
|
*/
|
|
66
212
|
setCentring(centring: AnyCentring): this;
|
|
67
213
|
/**
|
|
68
|
-
*
|
|
69
|
-
* @param
|
|
214
|
+
* Sets the visibility of the layer.
|
|
215
|
+
* @param {boolean} visible - The visibility state.
|
|
216
|
+
* @returns {this} The current instance for chaining.
|
|
70
217
|
*/
|
|
71
218
|
setVisible(visible: boolean): this;
|
|
72
219
|
/**
|
|
73
|
-
*
|
|
74
|
-
* @param
|
|
220
|
+
* Sets the z-index of the layer.
|
|
221
|
+
* @param {number} zIndex - The z-index value.
|
|
222
|
+
* @returns {this} The current instance for chaining.
|
|
75
223
|
*/
|
|
76
224
|
setZIndex(zIndex: number): this;
|
|
77
225
|
/**
|
|
78
|
-
*
|
|
79
|
-
* @param
|
|
226
|
+
* Sets the global composite operation for the layer.
|
|
227
|
+
* @param {AnyGlobalCompositeOperation} operation - The composite operation.
|
|
228
|
+
* @returns {this} The current instance for chaining.
|
|
80
229
|
*/
|
|
81
230
|
setGlobalCompositeOperation(operation: AnyGlobalCompositeOperation): this;
|
|
82
231
|
/**
|
|
83
|
-
*
|
|
232
|
+
* Converts the layer to a JSON representation.
|
|
233
|
+
* @returns {IBaseLayer} The JSON representation of the layer.
|
|
84
234
|
*/
|
|
85
235
|
toJSON(): IBaseLayer;
|
|
86
236
|
}
|
|
@@ -1,20 +1,52 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.BaseLayer = void 0;
|
|
4
|
-
const
|
|
4
|
+
const types_1 = require("../../types");
|
|
5
5
|
const utils_1 = require("../../utils/utils");
|
|
6
6
|
const LazyUtil_1 = require("../../utils/LazyUtil");
|
|
7
|
+
/**
|
|
8
|
+
* Represents a base layer with generic properties and methods for managing
|
|
9
|
+
* its position, visibility, transformations, and other attributes.
|
|
10
|
+
*
|
|
11
|
+
* @template T - A type extending `IBaseLayerProps` that defines the properties of the layer.
|
|
12
|
+
*/
|
|
7
13
|
class BaseLayer {
|
|
14
|
+
/**
|
|
15
|
+
* The unique identifier of the layer.
|
|
16
|
+
* @type {string}
|
|
17
|
+
*/
|
|
8
18
|
id;
|
|
19
|
+
/**
|
|
20
|
+
* The type of the layer.
|
|
21
|
+
* @type {LayerType}
|
|
22
|
+
*/
|
|
9
23
|
type;
|
|
24
|
+
/**
|
|
25
|
+
* The z-index of the layer, determining its stacking order.
|
|
26
|
+
* @type {number}
|
|
27
|
+
*/
|
|
10
28
|
zIndex;
|
|
29
|
+
/**
|
|
30
|
+
* The visibility of the layer.
|
|
31
|
+
* @type {boolean}
|
|
32
|
+
*/
|
|
11
33
|
visible;
|
|
34
|
+
/**
|
|
35
|
+
* The properties of the layer, defined by the generic type `T`.
|
|
36
|
+
* @type {T}
|
|
37
|
+
*/
|
|
12
38
|
props;
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
39
|
+
/**
|
|
40
|
+
* Constructs a new `BaseLayer` instance.
|
|
41
|
+
* @param {LayerType} [type] - The type of the layer.
|
|
42
|
+
* @param {T} [props] - The properties of the layer.
|
|
43
|
+
* @param {IBaseLayerMisc} [misc] - Miscellaneous options for the layer.
|
|
44
|
+
*/
|
|
45
|
+
constructor(type, props, misc) {
|
|
46
|
+
this.id = misc?.id || (0, utils_1.generateID)(type ? type : types_1.LayerType.Base);
|
|
47
|
+
this.type = type ? type : types_1.LayerType.Base;
|
|
48
|
+
this.zIndex = misc?.zIndex || 1;
|
|
49
|
+
this.visible = misc?.visible || true;
|
|
18
50
|
this.props = props ? props : {};
|
|
19
51
|
if (!this.props.x)
|
|
20
52
|
this.props.x = 0;
|
|
@@ -23,14 +55,15 @@ class BaseLayer {
|
|
|
23
55
|
if (!this.props.opacity)
|
|
24
56
|
this.props.opacity = 1;
|
|
25
57
|
if (!this.props.centring)
|
|
26
|
-
this.props.centring =
|
|
58
|
+
this.props.centring = types_1.Centring.Center;
|
|
27
59
|
if (!this.props.transform)
|
|
28
60
|
this.props.transform = {};
|
|
29
61
|
}
|
|
30
62
|
/**
|
|
31
|
-
*
|
|
32
|
-
* @param
|
|
33
|
-
* @param
|
|
63
|
+
* Sets the position of the layer in the 2D plane.
|
|
64
|
+
* @param {ScaleType} x - The x-coordinate of the layer.
|
|
65
|
+
* @param {ScaleType} y - The y-coordinate of the layer.
|
|
66
|
+
* @returns {this} The current instance for chaining.
|
|
34
67
|
*/
|
|
35
68
|
setPosition(x, y) {
|
|
36
69
|
this.props.x = x;
|
|
@@ -38,27 +71,32 @@ class BaseLayer {
|
|
|
38
71
|
return this;
|
|
39
72
|
}
|
|
40
73
|
/**
|
|
41
|
-
*
|
|
42
|
-
* @param
|
|
74
|
+
* Sets the opacity of the layer.
|
|
75
|
+
* @param {number} opacity - The opacity value, between 0 and 1.
|
|
76
|
+
* @returns {this} The current instance for chaining.
|
|
43
77
|
*/
|
|
44
78
|
setOpacity(opacity) {
|
|
45
79
|
this.props.opacity = opacity;
|
|
46
80
|
return this;
|
|
47
81
|
}
|
|
48
82
|
/**
|
|
49
|
-
*
|
|
50
|
-
*
|
|
83
|
+
* Sets the unique identifier of the layer.
|
|
84
|
+
*
|
|
85
|
+
* @param {string} id - The unique identifier.
|
|
86
|
+
* @returns {this} The current instance for chaining.
|
|
51
87
|
*/
|
|
52
88
|
setID(id) {
|
|
53
89
|
this.id = id;
|
|
54
90
|
return this;
|
|
55
91
|
}
|
|
56
92
|
/**
|
|
57
|
-
*
|
|
58
|
-
* @param
|
|
59
|
-
* @param
|
|
60
|
-
* @param
|
|
61
|
-
* @param
|
|
93
|
+
* Sets the shadow properties of the layer.
|
|
94
|
+
* @param {string} color - The color of the shadow.
|
|
95
|
+
* @param {number} [blur] - The blur radius of the shadow.
|
|
96
|
+
* @param {number} [offsetX] - The horizontal offset of the shadow.
|
|
97
|
+
* @param {number} [offsetY] - The vertical offset of the shadow.
|
|
98
|
+
* @returns {this} The current instance for chaining.
|
|
99
|
+
* @throws {LazyError} If the color is invalid or not provided.
|
|
62
100
|
*/
|
|
63
101
|
setShadow(color, blur, offsetX, offsetY) {
|
|
64
102
|
if (!color)
|
|
@@ -75,82 +113,91 @@ class BaseLayer {
|
|
|
75
113
|
return this;
|
|
76
114
|
}
|
|
77
115
|
/**
|
|
78
|
-
*
|
|
79
|
-
* @param
|
|
116
|
+
* Sets the transformation matrix of the layer.
|
|
117
|
+
* @param {DOMMatrix2DInit} matrix - The transformation matrix.
|
|
118
|
+
* @returns {this} The current instance for chaining.
|
|
80
119
|
*/
|
|
81
120
|
setMatrix(matrix) {
|
|
82
121
|
this.props.transform = { ...this.props.transform, matrix };
|
|
83
122
|
return this;
|
|
84
123
|
}
|
|
85
124
|
/**
|
|
86
|
-
*
|
|
87
|
-
* @param
|
|
88
|
-
* @param
|
|
125
|
+
* Sets the scale of the layer in the x and y directions.
|
|
126
|
+
* @param {number} x - The scale factor in the x direction.
|
|
127
|
+
* @param {number} y - The scale factor in the y direction.
|
|
128
|
+
* @returns {this} The current instance for chaining.
|
|
89
129
|
*/
|
|
90
130
|
setScale(x, y) {
|
|
91
131
|
this.props.transform = { ...this.props.transform, scale: { x, y } };
|
|
92
132
|
return this;
|
|
93
133
|
}
|
|
94
134
|
/**
|
|
95
|
-
*
|
|
96
|
-
* @param
|
|
135
|
+
* Sets the rotation of the layer.
|
|
136
|
+
* @param {number} rotate - The rotation angle in degrees.
|
|
137
|
+
* @returns {this} The current instance for chaining.
|
|
97
138
|
*/
|
|
98
139
|
setRotate(rotate) {
|
|
99
140
|
this.props.transform = { ...this.props.transform, rotate };
|
|
100
141
|
return this;
|
|
101
142
|
}
|
|
102
143
|
/**
|
|
103
|
-
*
|
|
104
|
-
* @param
|
|
105
|
-
* @param
|
|
144
|
+
* Sets the translation of the layer in the x and y directions.
|
|
145
|
+
* @param {number} x - The translation in the x direction.
|
|
146
|
+
* @param {number} y - The translation in the y direction.
|
|
147
|
+
* @returns {this} The current instance for chaining.
|
|
106
148
|
*/
|
|
107
149
|
setTranslate(x, y) {
|
|
108
150
|
this.props.transform = { ...this.props.transform, translate: { x, y } };
|
|
109
151
|
return this;
|
|
110
152
|
}
|
|
111
153
|
/**
|
|
112
|
-
*
|
|
113
|
-
*
|
|
114
|
-
* @
|
|
154
|
+
* Sets the filter effects for the layer.
|
|
155
|
+
* @param {...AnyFilter} filter - The filter effects to apply.
|
|
156
|
+
* @returns {this} The current instance for chaining.
|
|
115
157
|
*/
|
|
116
158
|
setFilters(...filter) {
|
|
117
159
|
this.props.filter = filter.join(' ');
|
|
118
160
|
return this;
|
|
119
161
|
}
|
|
120
162
|
/**
|
|
121
|
-
*
|
|
122
|
-
* @param
|
|
163
|
+
* Sets the centring type of the layer. **Don't affect on Bezier, Line, Quadratic and Text layers**.
|
|
164
|
+
* @param {AnyCentring} centring - The centring type.
|
|
165
|
+
* @returns {this} The current instance for chaining.
|
|
123
166
|
*/
|
|
124
167
|
setCentring(centring) {
|
|
125
168
|
this.props.centring = centring;
|
|
126
169
|
return this;
|
|
127
170
|
}
|
|
128
171
|
/**
|
|
129
|
-
*
|
|
130
|
-
* @param
|
|
172
|
+
* Sets the visibility of the layer.
|
|
173
|
+
* @param {boolean} visible - The visibility state.
|
|
174
|
+
* @returns {this} The current instance for chaining.
|
|
131
175
|
*/
|
|
132
176
|
setVisible(visible) {
|
|
133
177
|
this.visible = visible;
|
|
134
178
|
return this;
|
|
135
179
|
}
|
|
136
180
|
/**
|
|
137
|
-
*
|
|
138
|
-
* @param
|
|
181
|
+
* Sets the z-index of the layer.
|
|
182
|
+
* @param {number} zIndex - The z-index value.
|
|
183
|
+
* @returns {this} The current instance for chaining.
|
|
139
184
|
*/
|
|
140
185
|
setZIndex(zIndex) {
|
|
141
186
|
this.zIndex = zIndex;
|
|
142
187
|
return this;
|
|
143
188
|
}
|
|
144
189
|
/**
|
|
145
|
-
*
|
|
146
|
-
* @param
|
|
190
|
+
* Sets the global composite operation for the layer.
|
|
191
|
+
* @param {AnyGlobalCompositeOperation} operation - The composite operation.
|
|
192
|
+
* @returns {this} The current instance for chaining.
|
|
147
193
|
*/
|
|
148
194
|
setGlobalCompositeOperation(operation) {
|
|
149
195
|
this.props.globalComposite = operation;
|
|
150
196
|
return this;
|
|
151
197
|
}
|
|
152
198
|
/**
|
|
153
|
-
*
|
|
199
|
+
* Converts the layer to a JSON representation.
|
|
200
|
+
* @returns {IBaseLayer} The JSON representation of the layer.
|
|
154
201
|
*/
|
|
155
202
|
toJSON() {
|
|
156
203
|
return {
|
|
@@ -1,40 +1,119 @@
|
|
|
1
|
-
import { BaseLayer } from "./BaseLayer";
|
|
2
|
-
import { ColorType,
|
|
3
|
-
import { Canvas, SKRSContext2D } from "@napi-rs/canvas";
|
|
1
|
+
import { BaseLayer, IBaseLayer, IBaseLayerMisc, IBaseLayerProps } from "./BaseLayer";
|
|
2
|
+
import { ColorType, Point, ScaleType, LayerType } from "../../types";
|
|
3
|
+
import { Canvas, SKRSContext2D, SvgCanvas } from "@napi-rs/canvas";
|
|
4
4
|
import { LayersManager } from "../managers/LayersManager";
|
|
5
|
+
/**
|
|
6
|
+
* Interface representing a Bezier layer.
|
|
7
|
+
*/
|
|
8
|
+
export interface IBezierLayer extends IBaseLayer {
|
|
9
|
+
/**
|
|
10
|
+
* The type of the layer, which is a Bézier curve.
|
|
11
|
+
*/
|
|
12
|
+
type: LayerType.BezierCurve;
|
|
13
|
+
/**
|
|
14
|
+
* The properties specific to the Bezier layer.
|
|
15
|
+
*/
|
|
16
|
+
props: IBezierLayerProps;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* Interface representing the properties of a Bezier layer.
|
|
20
|
+
*/
|
|
21
|
+
export interface IBezierLayerProps extends IBaseLayerProps {
|
|
22
|
+
/**
|
|
23
|
+
* The control points of the Bézier curve.
|
|
24
|
+
*/
|
|
25
|
+
controlPoints: Array<Point>;
|
|
26
|
+
/**
|
|
27
|
+
* The end point of the Bézier curve.
|
|
28
|
+
*/
|
|
29
|
+
endPoint: Point;
|
|
30
|
+
/**
|
|
31
|
+
* The stroke properties of the Bézier curve.
|
|
32
|
+
*/
|
|
33
|
+
stroke: {
|
|
34
|
+
/**
|
|
35
|
+
* The width of the stroke.
|
|
36
|
+
*/
|
|
37
|
+
width: number;
|
|
38
|
+
/**
|
|
39
|
+
* The cap style of the stroke.
|
|
40
|
+
*/
|
|
41
|
+
cap: CanvasLineCap;
|
|
42
|
+
/**
|
|
43
|
+
* The join style of the stroke.
|
|
44
|
+
*/
|
|
45
|
+
join: CanvasLineJoin;
|
|
46
|
+
/**
|
|
47
|
+
* The dash offset of the stroke.
|
|
48
|
+
*/
|
|
49
|
+
dashOffset: number;
|
|
50
|
+
/**
|
|
51
|
+
* The dash pattern of the stroke.
|
|
52
|
+
*/
|
|
53
|
+
dash: number[];
|
|
54
|
+
/**
|
|
55
|
+
* The miter limit of the stroke.
|
|
56
|
+
*/
|
|
57
|
+
miterLimit: number;
|
|
58
|
+
};
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* Class representing a Bezier layer, extending the BaseLayer class.
|
|
62
|
+
*/
|
|
5
63
|
export declare class BezierLayer extends BaseLayer<IBezierLayerProps> {
|
|
64
|
+
/**
|
|
65
|
+
* The properties of the Bezier layer.
|
|
66
|
+
*/
|
|
6
67
|
props: IBezierLayerProps;
|
|
7
|
-
constructor(props?: IBezierLayerProps);
|
|
8
68
|
/**
|
|
9
|
-
*
|
|
10
|
-
* @param
|
|
69
|
+
* Constructs a new BezierLayer instance.
|
|
70
|
+
* @param props {IBezierLayerProps} - The properties of the Bezier layer.
|
|
71
|
+
* @param misc {IBaseLayerMisc} - Miscellaneous options for the layer.
|
|
72
|
+
*/
|
|
73
|
+
constructor(props?: IBezierLayerProps, misc?: IBaseLayerMisc);
|
|
74
|
+
/**
|
|
75
|
+
* Sets the control points of the Bezier layer.
|
|
76
|
+
* @param controlPoints {Array<{ x: ScaleType, y: ScaleType }>} - The control points of the Bezier layer.
|
|
77
|
+
* @returns {this} The current instance for chaining.
|
|
78
|
+
* @throws {LazyError} If the number of control points is not exactly 2.
|
|
11
79
|
*/
|
|
12
80
|
setControlPoints(...controlPoints: {
|
|
13
81
|
x: ScaleType;
|
|
14
82
|
y: ScaleType;
|
|
15
83
|
}[]): this;
|
|
16
84
|
/**
|
|
17
|
-
*
|
|
18
|
-
* @param x {ScaleType} - The
|
|
19
|
-
* @param y {ScaleType} - The
|
|
85
|
+
* Sets the end position of the Bezier layer.
|
|
86
|
+
* @param x {ScaleType} - The x-coordinate of the end point.
|
|
87
|
+
* @param y {ScaleType} - The y-coordinate of the end point.
|
|
88
|
+
* @returns {this} The current instance for chaining.
|
|
20
89
|
*/
|
|
21
90
|
setEndPosition(x: ScaleType, y: ScaleType): this;
|
|
22
91
|
/**
|
|
23
|
-
*
|
|
24
|
-
* @param color {
|
|
92
|
+
* Sets the color of the Bezier layer.
|
|
93
|
+
* @param color {ColorType} - The color of the layer.
|
|
94
|
+
* @returns {this} The current instance for chaining.
|
|
95
|
+
* @throws {LazyError} If the color is not provided or invalid.
|
|
25
96
|
*/
|
|
26
97
|
setColor(color: ColorType): this;
|
|
27
98
|
/**
|
|
28
|
-
*
|
|
29
|
-
* @param width {number} - The
|
|
30
|
-
* @param cap {string} - The
|
|
31
|
-
* @param join {string} - The
|
|
32
|
-
* @param dash {number[]} - The
|
|
33
|
-
* @param dashOffset {number} - The
|
|
34
|
-
* @param miterLimit {number} - The
|
|
99
|
+
* Sets the stroke properties of the Bezier layer.
|
|
100
|
+
* @param width {number} - The width of the stroke.
|
|
101
|
+
* @param cap {string} - The cap style of the stroke.
|
|
102
|
+
* @param join {string} - The join style of the stroke.
|
|
103
|
+
* @param dash {number[]} - The dash pattern of the stroke.
|
|
104
|
+
* @param dashOffset {number} - The dash offset of the stroke.
|
|
105
|
+
* @param miterLimit {number} - The miter limit of the stroke.
|
|
106
|
+
* @returns {this} The current instance for chaining.
|
|
35
107
|
*/
|
|
36
108
|
setStroke(width: number, cap?: CanvasLineCap, join?: CanvasLineJoin, dash?: number[], dashOffset?: number, miterLimit?: number): this;
|
|
37
|
-
|
|
109
|
+
/**
|
|
110
|
+
* Calculates the bounding box of the Bezier layer.
|
|
111
|
+
* @param ctx {SKRSContext2D} - The canvas rendering context.
|
|
112
|
+
* @param canvas {Canvas | SvgCanvas} - The canvas instance.
|
|
113
|
+
* @param manager {LayersManager} - The layers manager.
|
|
114
|
+
* @returns {Object} The bounding box details including max, min, center, width, and height.
|
|
115
|
+
*/
|
|
116
|
+
getBoundingBox(ctx: SKRSContext2D, canvas: Canvas | SvgCanvas, manager: LayersManager): {
|
|
38
117
|
max: {
|
|
39
118
|
x: number;
|
|
40
119
|
y: number;
|
|
@@ -50,9 +129,17 @@ export declare class BezierLayer extends BaseLayer<IBezierLayerProps> {
|
|
|
50
129
|
width: number;
|
|
51
130
|
height: number;
|
|
52
131
|
};
|
|
53
|
-
draw(ctx: SKRSContext2D, canvas: Canvas, manager: LayersManager, debug: boolean): Promise<void>;
|
|
54
132
|
/**
|
|
55
|
-
*
|
|
133
|
+
* Draws the Bezier layer on the canvas.
|
|
134
|
+
* @param ctx {SKRSContext2D} - The canvas rendering context.
|
|
135
|
+
* @param canvas {Canvas | SvgCanvas} - The canvas instance.
|
|
136
|
+
* @param manager {LayersManager} - The layers manager.
|
|
137
|
+
* @param debug {boolean} - Whether to enable debug logging.
|
|
138
|
+
*/
|
|
139
|
+
draw(ctx: SKRSContext2D, canvas: Canvas | SvgCanvas, manager: LayersManager, debug: boolean): Promise<void>;
|
|
140
|
+
/**
|
|
141
|
+
* Converts the Bezier layer to a JSON representation.
|
|
142
|
+
* @returns {IBezierLayer} The JSON representation of the Bezier layer.
|
|
56
143
|
*/
|
|
57
144
|
toJSON(): IBezierLayer;
|
|
58
145
|
}
|