@nmmty/lazycanvas 0.6.4 → 1.0.0-dev.3
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 -1
- package/biome.json +41 -0
- package/dist/core/Interpolation.d.ts +30 -0
- package/dist/core/Interpolation.js +200 -0
- package/dist/core/Scene.d.ts +96 -0
- package/dist/core/Scene.js +172 -0
- package/dist/core/Signal.d.ts +133 -0
- package/dist/core/Signal.js +255 -0
- package/dist/core/SignalUtils.d.ts +133 -0
- package/dist/core/SignalUtils.js +333 -0
- package/dist/core/ThreadScheduler.d.ts +38 -0
- package/dist/core/ThreadScheduler.js +74 -0
- package/dist/helpers/Filters.js +1 -1
- package/dist/helpers/FontsList.js +18 -18
- package/dist/helpers/Utlis.d.ts +3 -3
- package/dist/helpers/Utlis.js +15 -18
- package/dist/helpers/index.d.ts +3 -3
- package/dist/index.d.ts +10 -0
- package/dist/index.js +10 -0
- package/dist/jsx-runtime.d.ts +17 -0
- package/dist/jsx-runtime.js +111 -0
- package/dist/structures/LazyCanvas.d.ts +3 -45
- package/dist/structures/LazyCanvas.js +11 -74
- package/dist/structures/components/BaseLayer.d.ts +34 -12
- package/dist/structures/components/BaseLayer.js +68 -35
- package/dist/structures/components/BezierLayer.d.ts +18 -39
- package/dist/structures/components/BezierLayer.js +85 -48
- package/dist/structures/components/{Group.d.ts → Div.d.ts} +26 -20
- package/dist/structures/components/{Group.js → Div.js} +39 -40
- package/dist/structures/components/ImageLayer.d.ts +2 -2
- package/dist/structures/components/ImageLayer.js +25 -26
- package/dist/structures/components/LineLayer.d.ts +13 -39
- package/dist/structures/components/LineLayer.js +44 -44
- package/dist/structures/components/MorphLayer.d.ts +4 -33
- package/dist/structures/components/MorphLayer.js +33 -47
- package/dist/structures/components/Path2DLayer.d.ts +4 -32
- package/dist/structures/components/Path2DLayer.js +28 -33
- package/dist/structures/components/PolygonLayer.d.ts +95 -0
- package/dist/structures/components/PolygonLayer.js +205 -0
- package/dist/structures/components/QuadraticLayer.d.ts +27 -44
- package/dist/structures/components/QuadraticLayer.js +87 -49
- package/dist/structures/components/TextLayer.d.ts +16 -45
- package/dist/structures/components/TextLayer.js +66 -68
- package/dist/structures/components/index.d.ts +10 -10
- package/dist/structures/components/index.js +2 -2
- package/dist/structures/helpers/Exporter.d.ts +13 -4
- package/dist/structures/helpers/Exporter.js +79 -42
- package/dist/structures/helpers/Font.js +1 -17
- package/dist/structures/helpers/Gradient.js +32 -45
- package/dist/structures/helpers/Link.js +2 -14
- package/dist/structures/helpers/Pattern.js +9 -17
- package/dist/structures/helpers/index.d.ts +7 -7
- package/dist/structures/helpers/readers/JSONReader.d.ts +4 -4
- package/dist/structures/helpers/readers/JSONReader.js +34 -40
- package/dist/structures/helpers/readers/YAMLReader.js +5 -5
- package/dist/structures/managers/FontsManager.js +9 -18
- package/dist/structures/managers/LayersManager.d.ts +18 -28
- package/dist/structures/managers/LayersManager.js +14 -36
- package/dist/structures/managers/RenderManager.d.ts +1 -15
- package/dist/structures/managers/RenderManager.js +17 -110
- package/dist/structures/managers/index.d.ts +3 -5
- package/dist/structures/managers/index.js +0 -2
- package/dist/types/enum.d.ts +4 -3
- package/dist/types/enum.js +3 -2
- package/dist/types/index.d.ts +1 -1
- package/dist/utils/APNGEncoder.d.ts +67 -0
- package/dist/utils/APNGEncoder.js +205 -0
- package/dist/utils/DrawUtils.d.ts +9 -0
- package/dist/utils/DrawUtils.js +42 -0
- package/dist/utils/LazyUtil.js +1 -2
- package/dist/utils/utils.d.ts +5 -9
- package/dist/utils/utils.js +148 -77
- package/package.json +62 -59
- package/dist/structures/components/ClearLayer.d.ts +0 -147
- package/dist/structures/components/ClearLayer.js +0 -158
- package/dist/structures/managers/AnimationManager.d.ts +0 -120
- package/dist/structures/managers/AnimationManager.js +0 -99
- package/dist/structures/managers/PluginManager.d.ts +0 -230
- package/dist/structures/managers/PluginManager.js +0 -182
- package/dist/types/types.d.ts +0 -105
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
export * from
|
|
2
|
-
export * from
|
|
3
|
-
export * from
|
|
4
|
-
export * from
|
|
5
|
-
export * from
|
|
6
|
-
export * from
|
|
7
|
-
export * from
|
|
8
|
-
export * from
|
|
9
|
-
export * from
|
|
10
|
-
export * from
|
|
1
|
+
export * from "./BaseLayer";
|
|
2
|
+
export * from "./BezierLayer";
|
|
3
|
+
export * from "./ImageLayer";
|
|
4
|
+
export * from "./TextLayer";
|
|
5
|
+
export * from "./MorphLayer";
|
|
6
|
+
export * from "./Div";
|
|
7
|
+
export * from "./LineLayer";
|
|
8
|
+
export * from "./QuadraticLayer";
|
|
9
|
+
export * from "./Path2DLayer";
|
|
10
|
+
export * from "./PolygonLayer";
|
|
@@ -16,11 +16,11 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
17
|
__exportStar(require("./BaseLayer"), exports);
|
|
18
18
|
__exportStar(require("./BezierLayer"), exports);
|
|
19
|
-
__exportStar(require("./ClearLayer"), exports);
|
|
20
19
|
__exportStar(require("./ImageLayer"), exports);
|
|
21
20
|
__exportStar(require("./TextLayer"), exports);
|
|
22
21
|
__exportStar(require("./MorphLayer"), exports);
|
|
23
|
-
__exportStar(require("./
|
|
22
|
+
__exportStar(require("./Div"), exports);
|
|
24
23
|
__exportStar(require("./LineLayer"), exports);
|
|
25
24
|
__exportStar(require("./QuadraticLayer"), exports);
|
|
26
25
|
__exportStar(require("./Path2DLayer"), exports);
|
|
26
|
+
__exportStar(require("./PolygonLayer"), exports);
|
|
@@ -1,19 +1,24 @@
|
|
|
1
1
|
import { IOLazyCanvas, LazyCanvas } from "../LazyCanvas";
|
|
2
2
|
import { AnyExport } from "../../types";
|
|
3
3
|
import { Canvas, SKRSContext2D, SvgCanvas } from "@napi-rs/canvas";
|
|
4
|
+
import { Scene } from "../../core/Scene";
|
|
4
5
|
/**
|
|
5
|
-
* Class responsible for exporting a LazyCanvas instance to various formats.
|
|
6
|
+
* Class responsible for exporting a LazyCanvas or Scene instance to various formats.
|
|
6
7
|
*/
|
|
7
8
|
export declare class Exporter {
|
|
8
9
|
/**
|
|
9
10
|
* The LazyCanvas instance to be exported.
|
|
10
11
|
*/
|
|
11
|
-
canvas
|
|
12
|
+
canvas?: LazyCanvas;
|
|
13
|
+
/**
|
|
14
|
+
* The Scene instance to be exported.
|
|
15
|
+
*/
|
|
16
|
+
scene?: Scene;
|
|
12
17
|
/**
|
|
13
18
|
* Constructs a new Exporter instance.
|
|
14
|
-
* @param
|
|
19
|
+
* @param source {LazyCanvas | Scene} - The LazyCanvas or Scene instance to be exported.
|
|
15
20
|
*/
|
|
16
|
-
constructor(
|
|
21
|
+
constructor(source: LazyCanvas | Scene);
|
|
17
22
|
/**
|
|
18
23
|
* Saves a file to the filesystem.
|
|
19
24
|
* @param {any} [buffer] - The data to be saved.
|
|
@@ -34,12 +39,16 @@ export declare class Exporter {
|
|
|
34
39
|
* @param {Object} [opts] - Optional settings.
|
|
35
40
|
* @param {string} [opts.name] - The name of the file (optional).
|
|
36
41
|
* @param {boolean} [opts.saveAsFile] - Whether to save the export as a file (optional).
|
|
42
|
+
* @param {number} [opts.duration] - Duration of the animation in seconds (Scene only).
|
|
43
|
+
* @param {number} [opts.fps] - Frames per second for animation (default: 60, Scene only).
|
|
37
44
|
* @returns {Promise<Buffer | SKRSContext2D | Canvas | SvgCanvas | string>} The exported data.
|
|
38
45
|
* @throws {LazyError} If the export type is not supported.
|
|
39
46
|
*/
|
|
40
47
|
export(exportType: AnyExport, opts?: {
|
|
41
48
|
name?: string;
|
|
42
49
|
saveAsFile?: boolean;
|
|
50
|
+
duration?: number;
|
|
51
|
+
fps?: number;
|
|
43
52
|
}): Promise<Buffer | SKRSContext2D | Canvas | SvgCanvas | string>;
|
|
44
53
|
/**
|
|
45
54
|
* Synchronously exports the canvas to the specified format.
|
|
@@ -32,6 +32,9 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
32
32
|
return result;
|
|
33
33
|
};
|
|
34
34
|
})();
|
|
35
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
36
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
37
|
+
};
|
|
35
38
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
39
|
exports.Exporter = void 0;
|
|
37
40
|
const types_1 = require("../../types");
|
|
@@ -39,20 +42,24 @@ const LazyUtil_1 = require("../../utils/LazyUtil");
|
|
|
39
42
|
const fs = __importStar(require("fs"));
|
|
40
43
|
const utils_1 = require("../../utils/utils");
|
|
41
44
|
const _yaml = __importStar(require("js-yaml"));
|
|
45
|
+
const APNGEncoder_1 = __importDefault(require("../../utils/APNGEncoder"));
|
|
46
|
+
const Scene_1 = require("../../core/Scene");
|
|
42
47
|
/**
|
|
43
|
-
* Class responsible for exporting a LazyCanvas instance to various formats.
|
|
48
|
+
* Class responsible for exporting a LazyCanvas or Scene instance to various formats.
|
|
44
49
|
*/
|
|
45
50
|
class Exporter {
|
|
46
|
-
/**
|
|
47
|
-
* The LazyCanvas instance to be exported.
|
|
48
|
-
*/
|
|
49
|
-
canvas;
|
|
50
51
|
/**
|
|
51
52
|
* Constructs a new Exporter instance.
|
|
52
|
-
* @param
|
|
53
|
+
* @param source {LazyCanvas | Scene} - The LazyCanvas or Scene instance to be exported.
|
|
53
54
|
*/
|
|
54
|
-
constructor(
|
|
55
|
-
|
|
55
|
+
constructor(source) {
|
|
56
|
+
if (source instanceof Scene_1.Scene) {
|
|
57
|
+
this.scene = source;
|
|
58
|
+
this.canvas = source.lazyCanvas;
|
|
59
|
+
}
|
|
60
|
+
else {
|
|
61
|
+
this.canvas = source;
|
|
62
|
+
}
|
|
56
63
|
}
|
|
57
64
|
/**
|
|
58
65
|
* Saves a file to the filesystem.
|
|
@@ -63,9 +70,9 @@ class Exporter {
|
|
|
63
70
|
*/
|
|
64
71
|
async saveFile(buffer, extension, name) {
|
|
65
72
|
if (!buffer)
|
|
66
|
-
throw new LazyUtil_1.LazyError(
|
|
73
|
+
throw new LazyUtil_1.LazyError("Buffer must be provided");
|
|
67
74
|
if (!extension)
|
|
68
|
-
throw new LazyUtil_1.LazyError(
|
|
75
|
+
throw new LazyUtil_1.LazyError("Extension must be provided");
|
|
69
76
|
fs.writeFileSync(`${name === undefined ? (0, utils_1.generateRandomName)() : name}.${extension}`, buffer);
|
|
70
77
|
}
|
|
71
78
|
/**
|
|
@@ -86,12 +93,15 @@ class Exporter {
|
|
|
86
93
|
* @param {Object} [opts] - Optional settings.
|
|
87
94
|
* @param {string} [opts.name] - The name of the file (optional).
|
|
88
95
|
* @param {boolean} [opts.saveAsFile] - Whether to save the export as a file (optional).
|
|
96
|
+
* @param {number} [opts.duration] - Duration of the animation in seconds (Scene only).
|
|
97
|
+
* @param {number} [opts.fps] - Frames per second for animation (default: 60, Scene only).
|
|
89
98
|
* @returns {Promise<Buffer | SKRSContext2D | Canvas | SvgCanvas | string>} The exported data.
|
|
90
99
|
* @throws {LazyError} If the export type is not supported.
|
|
91
100
|
*/
|
|
92
101
|
async export(exportType, opts) {
|
|
93
|
-
|
|
94
|
-
|
|
102
|
+
if (!this.canvas) {
|
|
103
|
+
throw new LazyUtil_1.LazyError("Canvas is not initialized");
|
|
104
|
+
}
|
|
95
105
|
let result;
|
|
96
106
|
switch (exportType) {
|
|
97
107
|
case types_1.Export.CTX:
|
|
@@ -100,69 +110,94 @@ class Exporter {
|
|
|
100
110
|
break;
|
|
101
111
|
case types_1.Export.SVG:
|
|
102
112
|
case "svg":
|
|
103
|
-
result = await this.canvas.manager.render.render(
|
|
113
|
+
result = await this.canvas.manager.render.render("svg");
|
|
104
114
|
if (opts?.saveAsFile) {
|
|
105
|
-
await this.saveFile(result,
|
|
115
|
+
await this.saveFile(result, "svg", opts.name);
|
|
106
116
|
}
|
|
107
117
|
break;
|
|
108
118
|
case types_1.Export.BUFFER:
|
|
109
119
|
case "buffer":
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
120
|
+
if (this.scene) {
|
|
121
|
+
result = await this.scene.renderFirstFrame().then((frame) => frame.toBuffer("image/png"));
|
|
122
|
+
}
|
|
123
|
+
else {
|
|
124
|
+
result = (await this.canvas.manager.render.render("buffer"));
|
|
113
125
|
}
|
|
114
|
-
break;
|
|
115
|
-
case types_1.Export.GIF:
|
|
116
|
-
case "gif":
|
|
117
|
-
result = await this.canvas.manager.render.render('buffer');
|
|
118
126
|
if (opts?.saveAsFile) {
|
|
119
|
-
await this.saveFile(result,
|
|
127
|
+
await this.saveFile(result, "png", opts.name);
|
|
120
128
|
}
|
|
121
129
|
break;
|
|
122
130
|
case types_1.Export.WEBP:
|
|
123
131
|
case "webp":
|
|
124
|
-
|
|
132
|
+
if (this.scene) {
|
|
133
|
+
result = await this.scene
|
|
134
|
+
.renderFirstFrame()
|
|
135
|
+
.then((frame) => frame.toBuffer("image/webp"));
|
|
136
|
+
}
|
|
137
|
+
else {
|
|
138
|
+
result = await this.canvas.manager.render.render("webp");
|
|
139
|
+
}
|
|
125
140
|
if (opts?.saveAsFile) {
|
|
126
|
-
await this.saveFile(result,
|
|
141
|
+
await this.saveFile(result, "webp", opts.name);
|
|
127
142
|
}
|
|
128
143
|
break;
|
|
129
|
-
case types_1.Export.JPEG:
|
|
130
|
-
case "jpeg":
|
|
131
|
-
result = await this.canvas.manager.render.render('buffer');
|
|
132
|
-
await this.saveFile(result, 'jpeg', opts?.name);
|
|
133
|
-
break;
|
|
134
144
|
case types_1.Export.JPG:
|
|
135
145
|
case "jpg":
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
146
|
+
if (this.scene) {
|
|
147
|
+
result = await this.scene
|
|
148
|
+
.renderFirstFrame()
|
|
149
|
+
.then((frame) => frame.toBuffer("image/jpeg"));
|
|
150
|
+
}
|
|
151
|
+
else {
|
|
152
|
+
result = await this.canvas.manager.render.render("jpg");
|
|
153
|
+
}
|
|
154
|
+
await this.saveFile(result, "jpg", opts?.name);
|
|
155
|
+
return result;
|
|
139
156
|
case types_1.Export.PNG:
|
|
140
157
|
case "png":
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
158
|
+
if (this.scene) {
|
|
159
|
+
result = await this.scene.renderFirstFrame().then((frame) => frame.toBuffer("image/png"));
|
|
160
|
+
}
|
|
161
|
+
else {
|
|
162
|
+
result = await this.canvas.manager.render.render("png");
|
|
163
|
+
}
|
|
164
|
+
await this.saveFile(result, "png", opts?.name);
|
|
165
|
+
return result;
|
|
166
|
+
case types_1.Export.APNG:
|
|
167
|
+
case "apng":
|
|
168
|
+
if (!this.scene) {
|
|
169
|
+
throw new LazyUtil_1.LazyError("APNG export requires a Scene instance. Use: new Exporter(scene)");
|
|
170
|
+
}
|
|
171
|
+
const duration = opts?.duration ?? 0;
|
|
172
|
+
const timeNow = Date.now();
|
|
173
|
+
const fps = opts?.fps ?? 60;
|
|
174
|
+
const frameData = await this.scene.renderAnimationData(timeNow, timeNow + duration, fps);
|
|
175
|
+
const encoder = new APNGEncoder_1.default(this.scene.width, this.scene.height, fps).addFrames(...frameData);
|
|
176
|
+
const buffer = encoder.encode();
|
|
177
|
+
if (opts?.saveAsFile !== false) {
|
|
178
|
+
fs.writeFileSync(`${opts?.name ?? "animation"}.png`, buffer);
|
|
179
|
+
}
|
|
180
|
+
return buffer;
|
|
144
181
|
case types_1.Export.JSON:
|
|
145
182
|
case "json":
|
|
146
183
|
const json = this.syncExport(exportType);
|
|
147
184
|
if (opts?.saveAsFile) {
|
|
148
|
-
await this.saveFile(JSON.stringify(json),
|
|
185
|
+
await this.saveFile(JSON.stringify(json), "json", opts.name);
|
|
149
186
|
}
|
|
150
187
|
return JSON.stringify(json);
|
|
151
188
|
case types_1.Export.CANVAS:
|
|
152
189
|
case "canvas":
|
|
153
|
-
return await this.canvas.manager.render.render(exportType);
|
|
190
|
+
return (await this.canvas.manager.render.render(exportType));
|
|
154
191
|
case types_1.Export.YAML:
|
|
155
192
|
case "yaml":
|
|
156
193
|
const yaml = _yaml.dump(this.syncExport(types_1.Export.JSON));
|
|
157
194
|
if (opts?.saveAsFile) {
|
|
158
|
-
await this.saveFile(yaml,
|
|
195
|
+
await this.saveFile(yaml, "yaml", opts.name);
|
|
159
196
|
}
|
|
160
197
|
return yaml;
|
|
161
198
|
default:
|
|
162
199
|
throw new LazyUtil_1.LazyError(`Export type ${exportType} is not supported`);
|
|
163
200
|
}
|
|
164
|
-
// afterExport hook
|
|
165
|
-
this.canvas.manager.plugins.executeHook('afterExport', this.canvas, result);
|
|
166
201
|
return result;
|
|
167
202
|
}
|
|
168
203
|
/**
|
|
@@ -171,13 +206,15 @@ class Exporter {
|
|
|
171
206
|
* @returns {IOLazyCanvas | void} The exported data or void if the export type is unsupported.
|
|
172
207
|
*/
|
|
173
208
|
syncExport(exportType) {
|
|
209
|
+
if (!this.canvas) {
|
|
210
|
+
throw new LazyUtil_1.LazyError("Canvas is not initialized");
|
|
211
|
+
}
|
|
174
212
|
switch (exportType) {
|
|
175
213
|
case types_1.Export.JSON:
|
|
176
214
|
case "json":
|
|
177
215
|
return {
|
|
178
216
|
options: this.canvas.options,
|
|
179
|
-
|
|
180
|
-
layers: this.exportLayers(this.canvas.manager.layers)
|
|
217
|
+
layers: this.exportLayers(this.canvas.manager.layers),
|
|
181
218
|
};
|
|
182
219
|
}
|
|
183
220
|
}
|
|
@@ -6,22 +6,6 @@ const types_1 = require("../../types");
|
|
|
6
6
|
* Class representing a font with properties such as family, weight, path, and base64.
|
|
7
7
|
*/
|
|
8
8
|
class Font {
|
|
9
|
-
/**
|
|
10
|
-
* The font family.
|
|
11
|
-
*/
|
|
12
|
-
family;
|
|
13
|
-
/**
|
|
14
|
-
* The weight of the font.
|
|
15
|
-
*/
|
|
16
|
-
weight;
|
|
17
|
-
/**
|
|
18
|
-
* The file path of the font (optional).
|
|
19
|
-
*/
|
|
20
|
-
path;
|
|
21
|
-
/**
|
|
22
|
-
* The base64 representation of the font (optional).
|
|
23
|
-
*/
|
|
24
|
-
base64;
|
|
25
9
|
/**
|
|
26
10
|
* Constructs a new Font instance with default values.
|
|
27
11
|
*/
|
|
@@ -86,7 +70,7 @@ class Font {
|
|
|
86
70
|
family: this.family,
|
|
87
71
|
weight: this.weight,
|
|
88
72
|
path: this.path,
|
|
89
|
-
base64: this.base64
|
|
73
|
+
base64: this.base64,
|
|
90
74
|
};
|
|
91
75
|
}
|
|
92
76
|
}
|
|
@@ -8,32 +8,16 @@ const utils_1 = require("../../utils/utils");
|
|
|
8
8
|
* Class representing a gradient with properties and methods to manipulate it.
|
|
9
9
|
*/
|
|
10
10
|
class Gradient {
|
|
11
|
-
/**
|
|
12
|
-
* The type of fill, which is always `Gradient`.
|
|
13
|
-
*/
|
|
14
|
-
fillType = types_1.FillType.Gradient;
|
|
15
|
-
/**
|
|
16
|
-
* The type of gradient (e.g., linear, radial, conic).
|
|
17
|
-
*/
|
|
18
|
-
type;
|
|
19
|
-
/**
|
|
20
|
-
* The points defining the gradient.
|
|
21
|
-
*/
|
|
22
|
-
points;
|
|
23
|
-
/**
|
|
24
|
-
* The color stops for the gradient.
|
|
25
|
-
*/
|
|
26
|
-
stops;
|
|
27
|
-
/**
|
|
28
|
-
* The angle of the gradient (optional, used for linear gradients).
|
|
29
|
-
*/
|
|
30
|
-
angle;
|
|
31
11
|
/**
|
|
32
12
|
* Constructs a new Gradient instance.
|
|
33
13
|
* @param {Object} [opts] - Optional properties for the gradient.
|
|
34
14
|
* @param {IGradient} [opts.props] - The gradient properties.
|
|
35
15
|
*/
|
|
36
16
|
constructor(opts) {
|
|
17
|
+
/**
|
|
18
|
+
* The type of fill, which is always `Gradient`.
|
|
19
|
+
*/
|
|
20
|
+
this.fillType = types_1.FillType.Gradient;
|
|
37
21
|
this.type = opts?.props?.type || types_1.GradientType.Linear;
|
|
38
22
|
this.points = opts?.props?.points || [];
|
|
39
23
|
this.stops = opts?.props?.stops || [];
|
|
@@ -115,33 +99,36 @@ class Gradient {
|
|
|
115
99
|
let gradientData = this.toJSON();
|
|
116
100
|
let gradient;
|
|
117
101
|
if (opts.debug)
|
|
118
|
-
LazyUtil_1.LazyLog.log(
|
|
102
|
+
LazyUtil_1.LazyLog.log("none", `Gradient:`, gradientData);
|
|
119
103
|
const parse = (0, utils_1.parser)(ctx, ctx.canvas, opts.manager);
|
|
120
104
|
const { x0, y0, x1, y1 } = parse.parseBatch({
|
|
121
105
|
x0: { v: gradientData.points[0]?.x || 0 },
|
|
122
106
|
y0: { v: gradientData.points[0]?.y || 0, options: LazyUtil_1.defaultArg.vl(true) },
|
|
123
107
|
x1: { v: gradientData.points[1]?.x || 0 },
|
|
124
|
-
y1: { v: gradientData.points[1]?.y || 0, options: LazyUtil_1.defaultArg.vl(true) }
|
|
108
|
+
y1: { v: gradientData.points[1]?.y || 0, options: LazyUtil_1.defaultArg.vl(true) },
|
|
125
109
|
});
|
|
126
110
|
if (opts.debug)
|
|
127
|
-
LazyUtil_1.LazyLog.log(
|
|
111
|
+
LazyUtil_1.LazyLog.log("none", `Gradient points:`, { x0, y0, x1, y1 });
|
|
128
112
|
switch (gradientData.type) {
|
|
129
113
|
case types_1.GradientType.Linear:
|
|
130
114
|
case "linear":
|
|
131
|
-
if (gradientData.type === "linear" &&
|
|
115
|
+
if (gradientData.type === "linear" &&
|
|
116
|
+
(gradientData.angle || gradientData.angle === 0) &&
|
|
117
|
+
opts.layer &&
|
|
118
|
+
gradientData.points.length < 2) {
|
|
132
119
|
const { width, height, x, y, align } = opts.layer;
|
|
133
|
-
const cx = this.getPosition(x, width, align,
|
|
134
|
-
const cy = this.getPosition(y, height, align,
|
|
120
|
+
const cx = this.getPosition(x, width, align, "x");
|
|
121
|
+
const cy = this.getPosition(y, height, align, "y");
|
|
135
122
|
if (opts.debug)
|
|
136
|
-
LazyUtil_1.LazyLog.log(
|
|
123
|
+
LazyUtil_1.LazyLog.log("none", `Center for angle calculation:`, { cx, cy });
|
|
137
124
|
const [p1, p2] = this.getLinearGradientPoints(cx, cy, width, height, gradientData.angle);
|
|
138
125
|
if (opts.debug)
|
|
139
|
-
LazyUtil_1.LazyLog.log(
|
|
126
|
+
LazyUtil_1.LazyLog.log("none", `Linear Gradient Points from angle:`, { p1, p2 });
|
|
140
127
|
gradient = ctx.createLinearGradient(p1.x, p1.y, p2.x, p2.y);
|
|
141
128
|
}
|
|
142
129
|
else {
|
|
143
130
|
if (opts.debug)
|
|
144
|
-
LazyUtil_1.LazyLog.log(
|
|
131
|
+
LazyUtil_1.LazyLog.log("none", `Linear Gradient created from points.`);
|
|
145
132
|
gradient = ctx.createLinearGradient(x0, y0, x1 || x0, y1 || y0);
|
|
146
133
|
}
|
|
147
134
|
break;
|
|
@@ -156,8 +143,8 @@ class Gradient {
|
|
|
156
143
|
default:
|
|
157
144
|
if ((gradientData.angle || gradientData.angle === 0) && opts.layer) {
|
|
158
145
|
const { width, height, x, y, align } = opts.layer;
|
|
159
|
-
const cx = this.getPosition(x, width, align,
|
|
160
|
-
const cy = this.getPosition(y, height, align,
|
|
146
|
+
const cx = this.getPosition(x, width, align, "x");
|
|
147
|
+
const cy = this.getPosition(y, height, align, "y");
|
|
161
148
|
const [p1, p2] = this.getLinearGradientPoints(cx, cy, width, height, gradientData.angle);
|
|
162
149
|
gradient = ctx.createLinearGradient(p1.x, p1.y, p2.x, p2.y);
|
|
163
150
|
}
|
|
@@ -167,7 +154,7 @@ class Gradient {
|
|
|
167
154
|
break;
|
|
168
155
|
}
|
|
169
156
|
for (let stop of gradientData.stops) {
|
|
170
|
-
gradient.addColorStop(stop.offset, stop.color);
|
|
157
|
+
gradient.addColorStop(stop.offset, (0, utils_1.parseFillStyle)(ctx, stop.color, opts));
|
|
171
158
|
}
|
|
172
159
|
return gradient;
|
|
173
160
|
}
|
|
@@ -181,7 +168,7 @@ class Gradient {
|
|
|
181
168
|
type: this.type,
|
|
182
169
|
points: this.points,
|
|
183
170
|
stops: this.stops,
|
|
184
|
-
angle: this.angle
|
|
171
|
+
angle: this.angle,
|
|
185
172
|
};
|
|
186
173
|
}
|
|
187
174
|
getLinearGradientPoints(cx, cy, w, h, angleInDegrees) {
|
|
@@ -198,41 +185,41 @@ class Gradient {
|
|
|
198
185
|
const y2r = cy + (x2 - cx) * sin + (y2 - cy) * cos;
|
|
199
186
|
return [
|
|
200
187
|
{ x: x1r, y: y1r },
|
|
201
|
-
{ x: x2r, y: y2r }
|
|
188
|
+
{ x: x2r, y: y2r },
|
|
202
189
|
];
|
|
203
190
|
}
|
|
204
|
-
getPosition(pos, side, align, type =
|
|
191
|
+
getPosition(pos, side, align, type = "x") {
|
|
205
192
|
switch (align) {
|
|
206
193
|
case types_1.Centring.StartTop:
|
|
207
194
|
case "start-top":
|
|
208
|
-
return type ===
|
|
195
|
+
return type === "x" ? pos + side / 2 : pos + side / 2;
|
|
209
196
|
case types_1.Centring.Start:
|
|
210
197
|
case "start":
|
|
211
|
-
return type ===
|
|
198
|
+
return type === "x" ? pos + side / 2 : pos;
|
|
212
199
|
case types_1.Centring.StartBottom:
|
|
213
200
|
case "start-bottom":
|
|
214
|
-
return type ===
|
|
201
|
+
return type === "x" ? pos + side / 2 : pos - side / 2;
|
|
215
202
|
case types_1.Centring.CenterTop:
|
|
216
203
|
case "center-top":
|
|
217
|
-
return type ===
|
|
204
|
+
return type === "x" ? pos : pos - side / 2;
|
|
218
205
|
case types_1.Centring.Center:
|
|
219
206
|
case "center":
|
|
220
|
-
return type ===
|
|
207
|
+
return type === "x" ? pos : pos;
|
|
221
208
|
case types_1.Centring.CenterBottom:
|
|
222
209
|
case "center-bottom":
|
|
223
|
-
return type ===
|
|
210
|
+
return type === "x" ? pos : pos - side / 2;
|
|
224
211
|
case types_1.Centring.EndTop:
|
|
225
212
|
case "end-top":
|
|
226
|
-
return type ===
|
|
213
|
+
return type === "x" ? pos - side / 2 : pos + side / 2;
|
|
227
214
|
case types_1.Centring.End:
|
|
228
215
|
case "end":
|
|
229
|
-
return type ===
|
|
216
|
+
return type === "x" ? pos - side / 2 : pos;
|
|
230
217
|
case types_1.Centring.EndBottom:
|
|
231
218
|
case "end-bottom":
|
|
232
|
-
return type ===
|
|
219
|
+
return type === "x" ? pos - side / 2 : pos - side / 2;
|
|
233
220
|
case types_1.Centring.None:
|
|
234
221
|
case "none":
|
|
235
|
-
return type ===
|
|
222
|
+
return type === "x" ? pos + side / 2 : pos + side / 2;
|
|
236
223
|
default:
|
|
237
224
|
throw new LazyUtil_1.LazyError(`Invalid centring type: ${align}`);
|
|
238
225
|
}
|
|
@@ -6,25 +6,13 @@ const types_1 = require("../../types");
|
|
|
6
6
|
* Class representing a link between layers with properties and methods to manipulate it.
|
|
7
7
|
*/
|
|
8
8
|
class Link {
|
|
9
|
-
/**
|
|
10
|
-
* The source layers ID.
|
|
11
|
-
*/
|
|
12
|
-
source;
|
|
13
|
-
/**
|
|
14
|
-
* The type of the link (e.g., width, height, etc.).
|
|
15
|
-
*/
|
|
16
|
-
type;
|
|
17
|
-
/**
|
|
18
|
-
* The additional spacing applied to the link.
|
|
19
|
-
*/
|
|
20
|
-
additionalSpacing;
|
|
21
9
|
/**
|
|
22
10
|
* Constructs a new Link instance.
|
|
23
11
|
* @param {Object} [opts] - Optional properties for the link.
|
|
24
12
|
* @param {ILink} [opts.props] - The link properties.
|
|
25
13
|
*/
|
|
26
14
|
constructor(opts) {
|
|
27
|
-
this.source = opts?.props?.source ||
|
|
15
|
+
this.source = opts?.props?.source || "";
|
|
28
16
|
this.type = opts?.props?.type || types_1.LinkType.Width;
|
|
29
17
|
this.additionalSpacing = opts?.props?.additionalSpacing || 0;
|
|
30
18
|
}
|
|
@@ -63,7 +51,7 @@ class Link {
|
|
|
63
51
|
return {
|
|
64
52
|
source: this.source,
|
|
65
53
|
type: this.type,
|
|
66
|
-
additionalSpacing: this.additionalSpacing
|
|
54
|
+
additionalSpacing: this.additionalSpacing,
|
|
67
55
|
};
|
|
68
56
|
}
|
|
69
57
|
}
|
|
@@ -10,26 +10,18 @@ const LazyUtil_1 = require("../../utils/LazyUtil");
|
|
|
10
10
|
* Class representing a pattern with properties and methods to manipulate it.
|
|
11
11
|
*/
|
|
12
12
|
class Pattern {
|
|
13
|
-
/**
|
|
14
|
-
* The type of fill, which is always `Pattern`.
|
|
15
|
-
*/
|
|
16
|
-
fillType = types_1.FillType.Pattern;
|
|
17
|
-
/**
|
|
18
|
-
* The type of the pattern (e.g., repeat, no-repeat, etc.).
|
|
19
|
-
*/
|
|
20
|
-
type;
|
|
21
|
-
/**
|
|
22
|
-
* The source of the pattern, which can be a string (URL or path) or a LazyCanvas instance.
|
|
23
|
-
*/
|
|
24
|
-
src;
|
|
25
13
|
/**
|
|
26
14
|
* Constructs a new Pattern instance.
|
|
27
15
|
* @param {Object} [opts] - Optional properties for the pattern.
|
|
28
16
|
* @param {IPattern} [opts.props] - The pattern properties.
|
|
29
17
|
*/
|
|
30
18
|
constructor(opts) {
|
|
19
|
+
/**
|
|
20
|
+
* The type of fill, which is always `Pattern`.
|
|
21
|
+
*/
|
|
22
|
+
this.fillType = types_1.FillType.Pattern;
|
|
31
23
|
this.type = opts?.props?.type || types_1.PatternType.Repeat;
|
|
32
|
-
this.src = opts?.props?.src ||
|
|
24
|
+
this.src = opts?.props?.src || "";
|
|
33
25
|
}
|
|
34
26
|
/**
|
|
35
27
|
* Sets the type of the pattern.
|
|
@@ -56,9 +48,9 @@ class Pattern {
|
|
|
56
48
|
*/
|
|
57
49
|
async draw(ctx) {
|
|
58
50
|
if (!this.src)
|
|
59
|
-
throw new LazyUtil_1.LazyError(
|
|
51
|
+
throw new LazyUtil_1.LazyError("Pattern source is not set");
|
|
60
52
|
if (this.src instanceof LazyCanvas_1.LazyCanvas) {
|
|
61
|
-
return ctx.createPattern((await this.src.manager.render.render(
|
|
53
|
+
return ctx.createPattern((await this.src.manager.render.render("canvas")), this.type);
|
|
62
54
|
}
|
|
63
55
|
return ctx.createPattern(await (0, canvas_1.loadImage)(this.src), this.type);
|
|
64
56
|
}
|
|
@@ -70,12 +62,12 @@ class Pattern {
|
|
|
70
62
|
let src = this.src;
|
|
71
63
|
if (this.src instanceof LazyCanvas_1.LazyCanvas) {
|
|
72
64
|
// @ts-ignore
|
|
73
|
-
src = new Exporter_1.Exporter(this.src).syncExport(
|
|
65
|
+
src = new Exporter_1.Exporter(this.src).syncExport("json");
|
|
74
66
|
}
|
|
75
67
|
return {
|
|
76
68
|
fillType: this.fillType,
|
|
77
69
|
type: this.type,
|
|
78
|
-
src: src
|
|
70
|
+
src: src,
|
|
79
71
|
};
|
|
80
72
|
}
|
|
81
73
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export * from
|
|
2
|
-
export * from
|
|
3
|
-
export * from
|
|
4
|
-
export * from
|
|
5
|
-
export * from
|
|
6
|
-
export * from
|
|
7
|
-
export * from
|
|
1
|
+
export * from "./Exporter";
|
|
2
|
+
export * from "./Font";
|
|
3
|
+
export * from "./Gradient";
|
|
4
|
+
export * from "./Link";
|
|
5
|
+
export * from "./Pattern";
|
|
6
|
+
export * from "./readers/JSONReader";
|
|
7
|
+
export * from "./readers/YAMLReader";
|
|
@@ -27,17 +27,17 @@ export declare class JSONReader {
|
|
|
27
27
|
}): LazyCanvas;
|
|
28
28
|
/**
|
|
29
29
|
* Parses an array of JSON layers into an array of AnyLayer or Group instances.
|
|
30
|
-
* @param {Array<JSONLayer |
|
|
30
|
+
* @param {Array<JSONLayer | Div>} [data] - The array of JSON layers to parse.
|
|
31
31
|
* @param {Object} [opts] - Optional settings.
|
|
32
32
|
* @param {boolean} [opts.debug] - Whether to enable debug logging.
|
|
33
|
-
* @returns {Array<AnyLayer |
|
|
33
|
+
* @returns {Array<AnyLayer | Div>} The parsed layers.
|
|
34
34
|
*/
|
|
35
35
|
private static layersParse;
|
|
36
36
|
/**
|
|
37
37
|
* Parses a single JSON layer into an AnyLayer or Group instance.
|
|
38
|
-
* @param {JSONLayer |
|
|
38
|
+
* @param {JSONLayer | IDiv | Div} [layer] - The JSON layer to parse.
|
|
39
39
|
* @param {IBaseLayerMisc} [misc] - Miscellaneous options for the layer.
|
|
40
|
-
* @returns {AnyLayer |
|
|
40
|
+
* @returns {AnyLayer | Div} The parsed layer.
|
|
41
41
|
*/
|
|
42
42
|
private static layerParse;
|
|
43
43
|
/**
|