@nmmty/lazycanvas 0.4.0 → 0.5.1
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/ReadMe.md +1 -0
- 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 +89 -43
- package/dist/structures/components/BezierLayer.d.ts +111 -33
- package/dist/structures/components/BezierLayer.js +72 -32
- package/dist/structures/components/ClearLayer.d.ts +120 -17
- package/dist/structures/components/ClearLayer.js +83 -22
- package/dist/structures/components/Group.d.ts +88 -20
- package/dist/structures/components/Group.js +69 -29
- package/dist/structures/components/ImageLayer.d.ts +76 -12
- package/dist/structures/components/ImageLayer.js +43 -39
- package/dist/structures/components/LineLayer.d.ts +111 -18
- package/dist/structures/components/LineLayer.js +57 -29
- package/dist/structures/components/MorphLayer.d.ts +109 -21
- package/dist/structures/components/MorphLayer.js +52 -33
- package/dist/structures/components/Path2DLayer.d.ts +164 -0
- package/dist/structures/components/Path2DLayer.js +293 -0
- package/dist/structures/components/QuadraticLayer.d.ts +108 -22
- package/dist/structures/components/QuadraticLayer.js +64 -38
- package/dist/structures/components/TextLayer.d.ts +201 -40
- package/dist/structures/components/TextLayer.js +98 -55
- 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 +49 -19
- 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 +48 -42
- 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 +9 -11
- package/dist/utils/utils.js +163 -234
- package/package.json +4 -5
package/dist/utils/utils.js
CHANGED
|
@@ -1,41 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
-
exports.
|
|
27
|
-
const
|
|
28
|
-
const
|
|
3
|
+
exports.resizeLayers = exports.resize = exports.getBoundingBoxBezier = exports.centring = exports.isImageUrlValid = exports.generateRandomName = exports.transform = exports.parseFillStyle = exports.filters = exports.opacity = exports.drawShadow = exports.parser = exports.parseToNormal = exports.isColor = exports.generateID = void 0;
|
|
4
|
+
const types_1 = require("../types");
|
|
5
|
+
const helpers_1 = require("../structures/helpers");
|
|
6
|
+
const canvas_1 = require("@napi-rs/canvas");
|
|
29
7
|
const LazyUtil_1 = require("./LazyUtil");
|
|
30
|
-
const
|
|
31
|
-
const jimp = __importStar(require("jimp"));
|
|
32
|
-
const Pattern_1 = require("../structures/helpers/Pattern");
|
|
33
|
-
const Link_1 = require("../structures/helpers/Link");
|
|
34
|
-
const Group_1 = require("../structures/components/Group");
|
|
35
|
-
const LineLayer_1 = require("../structures/components/LineLayer");
|
|
36
|
-
const BezierLayer_1 = require("../structures/components/BezierLayer");
|
|
37
|
-
const QuadraticLayer_1 = require("../structures/components/QuadraticLayer");
|
|
38
|
-
const TextLayer_1 = require("../structures/components/TextLayer");
|
|
8
|
+
const components_1 = require("../structures/components");
|
|
39
9
|
function generateID(type) {
|
|
40
10
|
return `${type}-${Math.random().toString(36).substr(2, 9)}`;
|
|
41
11
|
}
|
|
@@ -50,77 +20,9 @@ let rgbaReg = /^rgba\((\d+),\s*(\d+),\s*(\d+),\s*(0|0?\.\d+|1(\.0)?)\)$/;
|
|
|
50
20
|
let hslReg = /^hsl\((\d+),\s*(\d+)%,\s*(\d+)%\)$/;
|
|
51
21
|
let hslaReg = /^hsla\((\d+),\s*(\d+)%,\s*(\d+)%,\s*(0|0?\.\d+|1(\.0)?)\)$/;
|
|
52
22
|
function isColor(v) {
|
|
53
|
-
return typeof (v === 'string' && (hexReg.test(v) || rgbReg.test(v) || rgbaReg.test(v) || hslReg.test(v) || hslaReg.test(v))) || v instanceof
|
|
23
|
+
return typeof (v === 'string' && (hexReg.test(v) || rgbReg.test(v) || rgbaReg.test(v) || hslReg.test(v) || hslaReg.test(v))) || v instanceof helpers_1.Gradient || v instanceof helpers_1.Pattern;
|
|
54
24
|
}
|
|
55
25
|
exports.isColor = isColor;
|
|
56
|
-
function tooShort(v) {
|
|
57
|
-
return v.length < 2 ? `0${v}` : v;
|
|
58
|
-
}
|
|
59
|
-
function parseHex(v) {
|
|
60
|
-
if (hexReg.test(v)) {
|
|
61
|
-
return v;
|
|
62
|
-
}
|
|
63
|
-
else if (rgbReg.test(v)) {
|
|
64
|
-
let match = v.match(rgbReg);
|
|
65
|
-
let r = parseInt(match[1]);
|
|
66
|
-
let g = parseInt(match[2]);
|
|
67
|
-
let b = parseInt(match[3]);
|
|
68
|
-
return `#${tooShort(r.toString(16))}${tooShort(g.toString(16))}${tooShort(b.toString(16))}`;
|
|
69
|
-
}
|
|
70
|
-
else if (rgbaReg.test(v)) {
|
|
71
|
-
let match = v.match(rgbaReg);
|
|
72
|
-
let r = parseInt(match[1]);
|
|
73
|
-
let g = parseInt(match[2]);
|
|
74
|
-
let b = parseInt(match[3]);
|
|
75
|
-
let a = parseFloat(match[4]);
|
|
76
|
-
return `#${tooShort(r.toString(16))}${tooShort(g.toString(16))}${tooShort(b.toString(16))}:${a}`;
|
|
77
|
-
}
|
|
78
|
-
else if (hslReg.test(v)) {
|
|
79
|
-
let match = v.match(hslReg);
|
|
80
|
-
let h = parseInt(match[1]);
|
|
81
|
-
let s = parseInt(match[2]);
|
|
82
|
-
let l = parseInt(match[3]);
|
|
83
|
-
l /= 100;
|
|
84
|
-
const b = s * Math.min(l, 1 - l) / 100;
|
|
85
|
-
const f = (n) => {
|
|
86
|
-
const k = (n + h / 30) % 12;
|
|
87
|
-
const color = l - b * Math.max(Math.min(k - 3, 9 - k, 1), -1);
|
|
88
|
-
return Math.round(255 * color).toString(16).padStart(2, '0');
|
|
89
|
-
};
|
|
90
|
-
return `#${f(0)}${f(8)}${f(4)}`;
|
|
91
|
-
}
|
|
92
|
-
else if (hslaReg.test(v)) {
|
|
93
|
-
let match = v.match(hslaReg);
|
|
94
|
-
let h = parseInt(match[1]);
|
|
95
|
-
let s = parseInt(match[2]);
|
|
96
|
-
let l = parseInt(match[3]);
|
|
97
|
-
let a = parseFloat(match[4]);
|
|
98
|
-
l /= 100;
|
|
99
|
-
const b = s * Math.min(l, 1 - l) / 100;
|
|
100
|
-
const f = (n) => {
|
|
101
|
-
const k = (n + h / 30) % 12;
|
|
102
|
-
const color = l - b * Math.max(Math.min(k - 3, 9 - k, 1), -1);
|
|
103
|
-
return Math.round(255 * color).toString(16).padStart(2, '0');
|
|
104
|
-
};
|
|
105
|
-
return `#${f(0)}${f(8)}${f(4)}:${a}`;
|
|
106
|
-
}
|
|
107
|
-
else {
|
|
108
|
-
return '#000000';
|
|
109
|
-
}
|
|
110
|
-
}
|
|
111
|
-
exports.parseHex = parseHex;
|
|
112
|
-
function parseColor(v) {
|
|
113
|
-
if (typeof v === 'string') {
|
|
114
|
-
return parseHex(v);
|
|
115
|
-
}
|
|
116
|
-
else if (v instanceof Gradient_1.Gradient || v instanceof Pattern_1.Pattern) {
|
|
117
|
-
return v;
|
|
118
|
-
}
|
|
119
|
-
else {
|
|
120
|
-
return '#000000';
|
|
121
|
-
}
|
|
122
|
-
}
|
|
123
|
-
exports.parseColor = parseColor;
|
|
124
26
|
function parseToNormal(v, ctx, canvas, layer = { width: 0, height: 0 }, options = { vertical: false, layer: false }, manager) {
|
|
125
27
|
if (typeof v === 'number') {
|
|
126
28
|
return v;
|
|
@@ -151,117 +53,73 @@ function parseToNormal(v, ctx, canvas, layer = { width: 0, height: 0 }, options
|
|
|
151
53
|
if (!manager)
|
|
152
54
|
return 0;
|
|
153
55
|
let anyLayer = manager.get(match[2], true);
|
|
56
|
+
if (!anyLayer || anyLayer instanceof components_1.Group || anyLayer instanceof components_1.Path2DLayer)
|
|
57
|
+
return 0;
|
|
154
58
|
const parcer = parser(ctx, canvas, manager);
|
|
155
59
|
switch (match[1]) {
|
|
156
60
|
case 'link-w':
|
|
157
|
-
if (anyLayer
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
return anyLayer.measureText(ctx, canvas).width + (parseInt(match[3]) || 0);
|
|
163
|
-
}
|
|
164
|
-
else {
|
|
165
|
-
return (parcer.parse(anyLayer.props.size.width) || 0) + (parseInt(match[3]) || 0);
|
|
166
|
-
}
|
|
61
|
+
if (anyLayer instanceof components_1.LineLayer || anyLayer instanceof components_1.BezierLayer || anyLayer instanceof components_1.QuadraticLayer) {
|
|
62
|
+
return anyLayer.getBoundingBox(ctx, canvas, manager).width + (parseInt(match[3]) || 0);
|
|
63
|
+
}
|
|
64
|
+
else if (anyLayer instanceof components_1.TextLayer) {
|
|
65
|
+
return anyLayer.measureText(ctx, canvas).width + (parseInt(match[3]) || 0);
|
|
167
66
|
}
|
|
168
67
|
else {
|
|
169
|
-
return 0;
|
|
68
|
+
return (parcer.parse(anyLayer.props.size.width) || 0) + (parseInt(match[3]) || 0);
|
|
170
69
|
}
|
|
171
|
-
break;
|
|
172
70
|
case 'link-h':
|
|
173
|
-
if (anyLayer
|
|
174
|
-
|
|
175
|
-
return anyLayer.getBoundingBox(ctx, canvas, manager).height + (parseInt(match[3]) || 0);
|
|
176
|
-
}
|
|
177
|
-
else if (anyLayer instanceof TextLayer_1.TextLayer) {
|
|
178
|
-
return anyLayer.measureText(ctx, canvas).height + (parseInt(match[3]) || 0);
|
|
179
|
-
}
|
|
180
|
-
else {
|
|
181
|
-
return (parcer.parse(anyLayer.props.size.height, LazyUtil_1.defaultArg.wh(parcer.parse(anyLayer.props.size.width)), LazyUtil_1.defaultArg.vl(true)) || 0) + (parseInt(match[3]) || 0);
|
|
182
|
-
}
|
|
183
|
-
}
|
|
184
|
-
else {
|
|
185
|
-
return 0;
|
|
71
|
+
if (anyLayer instanceof components_1.LineLayer || anyLayer instanceof components_1.BezierLayer || anyLayer instanceof components_1.QuadraticLayer) {
|
|
72
|
+
return anyLayer.getBoundingBox(ctx, canvas, manager).height + (parseInt(match[3]) || 0);
|
|
186
73
|
}
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
if (anyLayer && !(anyLayer instanceof Group_1.Group)) {
|
|
190
|
-
return (parcer.parse(anyLayer.props.x) || 0) + (parseInt(match[3]) || 0);
|
|
74
|
+
else if (anyLayer instanceof components_1.TextLayer) {
|
|
75
|
+
return anyLayer.measureText(ctx, canvas).height + (parseInt(match[3]) || 0);
|
|
191
76
|
}
|
|
192
77
|
else {
|
|
193
|
-
return 0;
|
|
78
|
+
return (parcer.parse(anyLayer.props.size.height, LazyUtil_1.defaultArg.wh(parcer.parse(anyLayer.props.size.width)), LazyUtil_1.defaultArg.vl(true)) || 0) + (parseInt(match[3]) || 0);
|
|
194
79
|
}
|
|
195
|
-
|
|
80
|
+
case 'link-x':
|
|
81
|
+
return (parcer.parse(anyLayer.props.x) || 0) + (parseInt(match[3]) || 0);
|
|
196
82
|
case 'link-y':
|
|
197
|
-
|
|
198
|
-
return (parcer.parse(anyLayer.props.y, LazyUtil_1.defaultArg.wh(), LazyUtil_1.defaultArg.vl(true)) || 0) + (parseInt(match[3]) || 0);
|
|
199
|
-
}
|
|
200
|
-
else {
|
|
201
|
-
return 0;
|
|
202
|
-
}
|
|
203
|
-
break;
|
|
83
|
+
return (parcer.parse(anyLayer.props.y, LazyUtil_1.defaultArg.wh(), LazyUtil_1.defaultArg.vl(true)) || 0) + (parseInt(match[3]) || 0);
|
|
204
84
|
}
|
|
205
85
|
}
|
|
206
86
|
}
|
|
207
|
-
else if (v instanceof
|
|
87
|
+
else if (v instanceof helpers_1.Link) {
|
|
208
88
|
if (!manager)
|
|
209
89
|
return 0;
|
|
210
90
|
let anyLayer = manager.get(v.source, true);
|
|
91
|
+
if (!anyLayer || anyLayer instanceof components_1.Group || anyLayer instanceof components_1.Path2DLayer)
|
|
92
|
+
return 0;
|
|
211
93
|
const parcer = parser(ctx, canvas, manager);
|
|
212
94
|
switch (v.type) {
|
|
213
|
-
case
|
|
95
|
+
case types_1.LinkType.Width:
|
|
214
96
|
case 'width':
|
|
215
|
-
if (anyLayer
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
return anyLayer.measureText(ctx, canvas).width + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
221
|
-
}
|
|
222
|
-
else {
|
|
223
|
-
return (parcer.parse(anyLayer.props.size.width) || 0) + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
224
|
-
}
|
|
97
|
+
if (anyLayer instanceof components_1.LineLayer || anyLayer instanceof components_1.BezierLayer || anyLayer instanceof components_1.QuadraticLayer) {
|
|
98
|
+
return anyLayer.getBoundingBox(ctx, canvas, manager).width + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
99
|
+
}
|
|
100
|
+
else if (anyLayer instanceof components_1.TextLayer) {
|
|
101
|
+
return anyLayer.measureText(ctx, canvas).width + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
225
102
|
}
|
|
226
103
|
else {
|
|
227
|
-
return 0;
|
|
104
|
+
return (parcer.parse(anyLayer.props.size.width) || 0) + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
228
105
|
}
|
|
229
|
-
|
|
230
|
-
case enum_1.LinkType.Height:
|
|
106
|
+
case types_1.LinkType.Height:
|
|
231
107
|
case 'height':
|
|
232
|
-
if (anyLayer
|
|
233
|
-
|
|
234
|
-
return anyLayer.getBoundingBox(ctx, canvas, manager).height + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
235
|
-
}
|
|
236
|
-
else if (anyLayer instanceof TextLayer_1.TextLayer) {
|
|
237
|
-
return anyLayer.measureText(ctx, canvas).height + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
238
|
-
}
|
|
239
|
-
else {
|
|
240
|
-
return (parcer.parse(anyLayer.props.size.height, LazyUtil_1.defaultArg.wh(parcer.parse(anyLayer.props.size.width)), LazyUtil_1.defaultArg.vl(true)) || 0) + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
241
|
-
}
|
|
108
|
+
if (anyLayer instanceof components_1.LineLayer || anyLayer instanceof components_1.BezierLayer || anyLayer instanceof components_1.QuadraticLayer) {
|
|
109
|
+
return anyLayer.getBoundingBox(ctx, canvas, manager).height + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
242
110
|
}
|
|
243
|
-
else {
|
|
244
|
-
return 0;
|
|
245
|
-
}
|
|
246
|
-
break;
|
|
247
|
-
case enum_1.LinkType.X:
|
|
248
|
-
case 'x':
|
|
249
|
-
if (anyLayer && !(anyLayer instanceof Group_1.Group)) {
|
|
250
|
-
return (parcer.parse(anyLayer.props.x) || 0) + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
111
|
+
else if (anyLayer instanceof components_1.TextLayer) {
|
|
112
|
+
return anyLayer.measureText(ctx, canvas).height + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
251
113
|
}
|
|
252
114
|
else {
|
|
253
|
-
return 0;
|
|
115
|
+
return (parcer.parse(anyLayer.props.size.height, LazyUtil_1.defaultArg.wh(parcer.parse(anyLayer.props.size.width)), LazyUtil_1.defaultArg.vl(true)) || 0) + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
254
116
|
}
|
|
255
|
-
|
|
256
|
-
case
|
|
117
|
+
case types_1.LinkType.X:
|
|
118
|
+
case 'x':
|
|
119
|
+
return (parcer.parse(anyLayer.props.x) || 0) + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
120
|
+
case types_1.LinkType.Y:
|
|
257
121
|
case 'y':
|
|
258
|
-
|
|
259
|
-
return (parcer.parse(anyLayer.props.y) || 0) + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
260
|
-
}
|
|
261
|
-
else {
|
|
262
|
-
return 0;
|
|
263
|
-
}
|
|
264
|
-
break;
|
|
122
|
+
return (parcer.parse(anyLayer.props.y) || 0) + (parcer.parse(v.additionalSpacing, LazyUtil_1.defaultArg.wh(layer.width, layer.height), LazyUtil_1.defaultArg.vl(options.vertical, options.layer)) || 0);
|
|
265
123
|
default:
|
|
266
124
|
return 0;
|
|
267
125
|
}
|
|
@@ -310,48 +168,50 @@ function filters(ctx, filters) {
|
|
|
310
168
|
}
|
|
311
169
|
exports.filters = filters;
|
|
312
170
|
function parseFillStyle(ctx, color) {
|
|
313
|
-
if (
|
|
171
|
+
if (!ctx)
|
|
172
|
+
throw new LazyUtil_1.LazyError('The context is not defined');
|
|
173
|
+
if (!color)
|
|
174
|
+
throw new LazyUtil_1.LazyError('The color is not defined');
|
|
175
|
+
if (color instanceof helpers_1.Gradient || color instanceof helpers_1.Pattern) {
|
|
314
176
|
return color.draw(ctx);
|
|
315
177
|
}
|
|
316
|
-
|
|
317
|
-
return color;
|
|
318
|
-
}
|
|
178
|
+
return color;
|
|
319
179
|
}
|
|
320
180
|
exports.parseFillStyle = parseFillStyle;
|
|
321
|
-
function transform(ctx, transform, layer = { width: 0, height: 0, x: 0, y: 0, type:
|
|
181
|
+
function transform(ctx, transform, layer = { width: 0, height: 0, x: 0, y: 0, type: types_1.LayerType.Morph }, extra = { text: '', textAlign: types_1.TextAlign.Left, fontSize: 0, multiline: false }) {
|
|
322
182
|
if (transform) {
|
|
323
183
|
if (transform.translate) {
|
|
324
184
|
ctx.translate(transform.translate.x, transform.translate.y);
|
|
325
185
|
}
|
|
326
186
|
if (transform.rotate) {
|
|
327
187
|
switch (layer.type) {
|
|
328
|
-
case
|
|
329
|
-
case
|
|
330
|
-
case
|
|
331
|
-
case
|
|
332
|
-
case
|
|
188
|
+
case types_1.LayerType.Image:
|
|
189
|
+
case types_1.LayerType.Morph:
|
|
190
|
+
case types_1.LayerType.BezierCurve:
|
|
191
|
+
case types_1.LayerType.QuadraticCurve:
|
|
192
|
+
case types_1.LayerType.Line:
|
|
333
193
|
ctx.translate(layer.x + (layer.width / 2), layer.y + (layer.height / 2));
|
|
334
194
|
ctx.rotate((Math.PI / 180) * transform.rotate);
|
|
335
195
|
ctx.translate(-(layer.x + (layer.width / 2)), -(layer.y + (layer.height / 2)));
|
|
336
196
|
break;
|
|
337
|
-
case
|
|
197
|
+
case types_1.LayerType.Text:
|
|
338
198
|
if (extra.multiline) {
|
|
339
199
|
ctx.translate(layer.x + (layer.width / 2), layer.y + (layer.height / 2));
|
|
340
200
|
ctx.rotate((Math.PI / 180) * transform.rotate);
|
|
341
201
|
ctx.translate(-(layer.x + (layer.width / 2)), -(layer.y + (layer.height / 2)));
|
|
342
202
|
}
|
|
343
203
|
else {
|
|
344
|
-
if (extra.textAlign ===
|
|
204
|
+
if (extra.textAlign === types_1.TextAlign.Center) {
|
|
345
205
|
ctx.translate(layer.x, layer.y);
|
|
346
206
|
ctx.rotate((Math.PI / 180) * transform.rotate);
|
|
347
207
|
ctx.translate(-layer.x, -layer.y);
|
|
348
208
|
}
|
|
349
|
-
else if (extra.textAlign ===
|
|
209
|
+
else if (extra.textAlign === types_1.TextAlign.Left || extra.textAlign === types_1.TextAlign.Start) {
|
|
350
210
|
ctx.translate(layer.x + (extra.fontSize * extra.text.length) / 2, layer.y);
|
|
351
211
|
ctx.rotate((Math.PI / 180) * transform.rotate);
|
|
352
212
|
ctx.translate(-(layer.x + (extra.fontSize * extra.text.length) / 2), -layer.y);
|
|
353
213
|
}
|
|
354
|
-
else if (extra.textAlign ===
|
|
214
|
+
else if (extra.textAlign === types_1.TextAlign.Right || extra.textAlign === types_1.TextAlign.End) {
|
|
355
215
|
ctx.translate(layer.x - (extra.fontSize * extra.text.length) / 2, layer.y);
|
|
356
216
|
ctx.rotate((Math.PI / 180) * transform.rotate);
|
|
357
217
|
ctx.translate(-(layer.x - (extra.fontSize * extra.text.length) / 2), -layer.y);
|
|
@@ -371,21 +231,13 @@ function transform(ctx, transform, layer = { width: 0, height: 0, x: 0, y: 0, ty
|
|
|
371
231
|
}
|
|
372
232
|
}
|
|
373
233
|
exports.transform = transform;
|
|
374
|
-
async function saveFile(buffer, extension, name) {
|
|
375
|
-
if (!buffer)
|
|
376
|
-
throw new LazyUtil_1.LazyError('Buffer must be provided');
|
|
377
|
-
if (!extension)
|
|
378
|
-
throw new LazyUtil_1.LazyError('Extension must be provided');
|
|
379
|
-
fs.writeFileSync(`${name === undefined ? generateRandomName() : name}.${extension}`, buffer);
|
|
380
|
-
}
|
|
381
|
-
exports.saveFile = saveFile;
|
|
382
234
|
function generateRandomName() {
|
|
383
235
|
return Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
|
|
384
236
|
}
|
|
385
237
|
exports.generateRandomName = generateRandomName;
|
|
386
238
|
function isImageUrlValid(src) {
|
|
387
239
|
try {
|
|
388
|
-
|
|
240
|
+
(0, canvas_1.loadImage)(src);
|
|
389
241
|
return true;
|
|
390
242
|
}
|
|
391
243
|
catch (error) {
|
|
@@ -395,86 +247,94 @@ function isImageUrlValid(src) {
|
|
|
395
247
|
exports.isImageUrlValid = isImageUrlValid;
|
|
396
248
|
function centring(centring, type, width, height, x, y) {
|
|
397
249
|
switch (centring) {
|
|
398
|
-
case
|
|
250
|
+
case types_1.Centring.Center:
|
|
399
251
|
case "center":
|
|
400
252
|
switch (type) {
|
|
401
|
-
case
|
|
402
|
-
case
|
|
253
|
+
case types_1.LayerType.Image:
|
|
254
|
+
case types_1.LayerType.Morph:
|
|
255
|
+
case types_1.LayerType.Clear:
|
|
403
256
|
x -= width / 2;
|
|
404
257
|
y -= height / 2;
|
|
405
258
|
break;
|
|
406
259
|
}
|
|
407
260
|
return { x, y };
|
|
408
|
-
case
|
|
261
|
+
case types_1.Centring.CenterBottom:
|
|
409
262
|
case "center-bottom":
|
|
410
263
|
switch (type) {
|
|
411
|
-
case
|
|
412
|
-
case
|
|
264
|
+
case types_1.LayerType.Image:
|
|
265
|
+
case types_1.LayerType.Morph:
|
|
266
|
+
case types_1.LayerType.Clear:
|
|
413
267
|
x -= width / 2;
|
|
414
268
|
break;
|
|
415
269
|
}
|
|
416
270
|
return { x, y };
|
|
417
|
-
case
|
|
271
|
+
case types_1.Centring.CenterTop:
|
|
418
272
|
case "center-top":
|
|
419
273
|
switch (type) {
|
|
420
|
-
case
|
|
421
|
-
case
|
|
274
|
+
case types_1.LayerType.Image:
|
|
275
|
+
case types_1.LayerType.Morph:
|
|
276
|
+
case types_1.LayerType.Clear:
|
|
422
277
|
x -= width / 2;
|
|
423
278
|
y -= height;
|
|
424
279
|
break;
|
|
425
280
|
}
|
|
426
281
|
return { x, y };
|
|
427
|
-
case
|
|
282
|
+
case types_1.Centring.Start:
|
|
428
283
|
case "start":
|
|
429
284
|
switch (type) {
|
|
430
|
-
case
|
|
431
|
-
case
|
|
285
|
+
case types_1.LayerType.Image:
|
|
286
|
+
case types_1.LayerType.Morph:
|
|
287
|
+
case types_1.LayerType.Clear:
|
|
432
288
|
y -= height / 2;
|
|
433
289
|
break;
|
|
434
290
|
}
|
|
435
291
|
return { x, y };
|
|
436
|
-
case
|
|
292
|
+
case types_1.Centring.StartBottom:
|
|
437
293
|
case "start-bottom":
|
|
438
294
|
return { x, y };
|
|
439
|
-
case
|
|
295
|
+
case types_1.Centring.StartTop:
|
|
440
296
|
case "start-top":
|
|
441
297
|
switch (type) {
|
|
442
|
-
case
|
|
443
|
-
case
|
|
298
|
+
case types_1.LayerType.Image:
|
|
299
|
+
case types_1.LayerType.Morph:
|
|
300
|
+
case types_1.LayerType.Clear:
|
|
444
301
|
y -= height;
|
|
445
302
|
break;
|
|
446
303
|
}
|
|
447
304
|
return { x, y };
|
|
448
|
-
case
|
|
305
|
+
case types_1.Centring.End:
|
|
449
306
|
case "end":
|
|
450
307
|
switch (type) {
|
|
451
|
-
case
|
|
452
|
-
case
|
|
308
|
+
case types_1.LayerType.Image:
|
|
309
|
+
case types_1.LayerType.Morph:
|
|
310
|
+
case types_1.LayerType.Clear:
|
|
453
311
|
x -= width;
|
|
454
312
|
y -= height / 2;
|
|
455
313
|
break;
|
|
456
314
|
}
|
|
457
315
|
return { x, y };
|
|
458
|
-
case
|
|
316
|
+
case types_1.Centring.EndBottom:
|
|
459
317
|
case "end-bottom":
|
|
460
318
|
switch (type) {
|
|
461
|
-
case
|
|
462
|
-
case
|
|
319
|
+
case types_1.LayerType.Image:
|
|
320
|
+
case types_1.LayerType.Morph:
|
|
321
|
+
case types_1.LayerType.Clear:
|
|
463
322
|
x -= width;
|
|
464
323
|
break;
|
|
465
324
|
}
|
|
466
325
|
return { x, y };
|
|
467
|
-
case
|
|
326
|
+
case types_1.Centring.EndTop:
|
|
468
327
|
case "end-top":
|
|
469
328
|
switch (type) {
|
|
470
|
-
case
|
|
471
|
-
case
|
|
329
|
+
case types_1.LayerType.Image:
|
|
330
|
+
case types_1.LayerType.Morph:
|
|
331
|
+
case types_1.LayerType.Clear:
|
|
472
332
|
x -= width;
|
|
473
333
|
y -= height;
|
|
474
334
|
break;
|
|
475
335
|
}
|
|
476
336
|
return { x, y };
|
|
477
|
-
case
|
|
337
|
+
case types_1.Centring.None:
|
|
478
338
|
case "none":
|
|
479
339
|
return { x, y };
|
|
480
340
|
}
|
|
@@ -512,3 +372,72 @@ function getBoundingBoxBezier(points, steps = 100) {
|
|
|
512
372
|
return { min: { x: minX, y: minY }, max: { x: maxX, y: maxY }, center: { x: (minX + maxX) / 2, y: (minY + maxY) / 2 }, width: maxX - minX, height: maxY - minY };
|
|
513
373
|
}
|
|
514
374
|
exports.getBoundingBoxBezier = getBoundingBoxBezier;
|
|
375
|
+
function resize(value, ratio) {
|
|
376
|
+
if (typeof value === 'number') {
|
|
377
|
+
return value * ratio;
|
|
378
|
+
}
|
|
379
|
+
else if (typeof value === 'string') {
|
|
380
|
+
if (pxReg.test(value)) {
|
|
381
|
+
return parseFloat(value) * ratio;
|
|
382
|
+
}
|
|
383
|
+
else if (linkReg.test(value)) {
|
|
384
|
+
let match = value.match(linkReg);
|
|
385
|
+
return `${match[1]}-${match[2]}-${parseFloat(match[3]) * ratio}`;
|
|
386
|
+
}
|
|
387
|
+
}
|
|
388
|
+
else if (value instanceof helpers_1.Link) {
|
|
389
|
+
return `${value.type}-${value.source}-${resize(value.additionalSpacing, ratio)}`;
|
|
390
|
+
}
|
|
391
|
+
return value;
|
|
392
|
+
}
|
|
393
|
+
exports.resize = resize;
|
|
394
|
+
function resizeLayers(layers, ratio) {
|
|
395
|
+
let newLayers = [];
|
|
396
|
+
if (layers.length > 0) {
|
|
397
|
+
for (const layer of layers) {
|
|
398
|
+
if (!(layer instanceof components_1.Group || layer instanceof components_1.Path2DLayer)) {
|
|
399
|
+
layer.props.x = resize(layer.props.x, ratio);
|
|
400
|
+
layer.props.y = resize(layer.props.y, ratio);
|
|
401
|
+
if ('size' in layer.props) {
|
|
402
|
+
layer.props.size.width = resize(layer.props.size.width, ratio);
|
|
403
|
+
layer.props.size.height = resize(layer.props.size.height, ratio);
|
|
404
|
+
if ('radius' in layer.props.size) {
|
|
405
|
+
layer.props.size.radius = resize(layer.props.size.radius, ratio);
|
|
406
|
+
}
|
|
407
|
+
}
|
|
408
|
+
if ('stroke' in layer.props) {
|
|
409
|
+
layer.props.stroke.width = resize(layer.props.stroke.width, ratio);
|
|
410
|
+
}
|
|
411
|
+
if ('endPoint' in layer.props) {
|
|
412
|
+
layer.props.endPoint.x = resize(layer.props.endPoint.x, ratio);
|
|
413
|
+
layer.props.endPoint.y = resize(layer.props.endPoint.y, ratio);
|
|
414
|
+
}
|
|
415
|
+
if ('controlPoints' in layer.props) {
|
|
416
|
+
for (const point of layer.props.controlPoints) {
|
|
417
|
+
point.x = resize(point.x, ratio);
|
|
418
|
+
point.y = resize(point.y, ratio);
|
|
419
|
+
}
|
|
420
|
+
}
|
|
421
|
+
if ('font' in layer.props) {
|
|
422
|
+
layer.props.font.size = resize(layer.props.font.size, ratio);
|
|
423
|
+
}
|
|
424
|
+
if ('transform' in layer.props) {
|
|
425
|
+
if (layer.props.transform.translate) {
|
|
426
|
+
layer.props.transform.translate.x = resize(layer.props.transform.translate.x, ratio);
|
|
427
|
+
layer.props.transform.translate.y = resize(layer.props.transform.translate.y, ratio);
|
|
428
|
+
}
|
|
429
|
+
if (layer.props.transform.scale) {
|
|
430
|
+
layer.props.transform.scale.x = resize(layer.props.transform.scale.x, ratio);
|
|
431
|
+
layer.props.transform.scale.y = resize(layer.props.transform.scale.y, ratio);
|
|
432
|
+
}
|
|
433
|
+
}
|
|
434
|
+
}
|
|
435
|
+
else if (layer instanceof components_1.Group) {
|
|
436
|
+
layer.layers = resizeLayers(layer.layers, ratio);
|
|
437
|
+
}
|
|
438
|
+
newLayers.push(layer);
|
|
439
|
+
}
|
|
440
|
+
}
|
|
441
|
+
return newLayers;
|
|
442
|
+
}
|
|
443
|
+
exports.resizeLayers = resizeLayers;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nmmty/lazycanvas",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.5.1",
|
|
4
4
|
"description": "A simple way to interact with @napi-rs/canvas in an advanced way!",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
"logo": "tsc ./test/logo.ts && node ./test/logo.js",
|
|
11
11
|
"text": "tsc ./test/text.ts && node ./test/text.js",
|
|
12
12
|
"animation": "tsc ./test/animation.ts && node ./test/animation.js",
|
|
13
|
+
"iotest": "tsc ./test/iotest.ts && node ./test/iotest.js",
|
|
13
14
|
"doc": "tsx docgen.ts",
|
|
14
15
|
"font": "tsc ./scripts/font-gen.ts && node ./scripts/font-gen.js",
|
|
15
16
|
"build": "tsc"
|
|
@@ -34,20 +35,18 @@
|
|
|
34
35
|
"dependencies": {
|
|
35
36
|
"@napi-rs/canvas": "^0.1.68",
|
|
36
37
|
"gifenc": "^1.0.3",
|
|
37
|
-
"
|
|
38
|
+
"js-yaml": "^4.1.0",
|
|
38
39
|
"path": "^0.12.7",
|
|
39
40
|
"svgson": "^5.3.1"
|
|
40
41
|
},
|
|
41
42
|
"devDependencies": {
|
|
42
43
|
"@hitomihiumi/colors.ts": "^1.0.3",
|
|
43
44
|
"@hitomihiumi/micro-docgen": "^0.3.0",
|
|
44
|
-
"@types/
|
|
45
|
+
"@types/js-yaml": "^4.0.9",
|
|
45
46
|
"@types/node": "^22.10.2",
|
|
46
|
-
"@types/react": "^19.0.2",
|
|
47
47
|
"ava": "^6.2.0",
|
|
48
48
|
"eslint": "^9.23.0",
|
|
49
49
|
"eslint-config-neon": "^0.2.7",
|
|
50
|
-
"globals": "^15.14.0",
|
|
51
50
|
"lodash.merge": "^4.6.2",
|
|
52
51
|
"tslib": "^2.8.1",
|
|
53
52
|
"tsx": "^4.19.2",
|