@nmmty/lazycanvas 0.2.0

package/dist/types/enum.js

@@ -0,0 +1,104 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PatternType = exports.Centring = exports.SaveFormat = exports.Export = exports.LineJoin = exports.LineCap = exports.TextDirection = exports.TextBaseline = exports.TextAlign = exports.FontWeight = exports.GradientType = exports.LayerScaleType = exports.LayerType = void 0;
+var LayerType;
+(function (LayerType) {
+    LayerType["Base"] = "base";
+    LayerType["Arc"] = "arc";
+    LayerType["ArcTo"] = "arcTo";
+    LayerType["BezierCurve"] = "bezierCurve";
+    LayerType["Clip"] = "clip";
+    LayerType["Image"] = "image";
+    LayerType["Line"] = "line";
+    LayerType["Path"] = "path";
+    LayerType["QuadraticCurve"] = "quadraticCurve";
+    LayerType["Morph"] = "morph";
+    LayerType["Text"] = "text";
+    LayerType["Group"] = "group";
+})(LayerType || (exports.LayerType = LayerType = {}));
+var LayerScaleType;
+(function (LayerScaleType) {
+    LayerScaleType["Pixel"] = "px";
+    LayerScaleType["Percent"] = "%";
+    LayerScaleType["Canvas"] = "canvas";
+    LayerScaleType["None"] = "none";
+})(LayerScaleType || (exports.LayerScaleType = LayerScaleType = {}));
+var GradientType;
+(function (GradientType) {
+    GradientType["Linear"] = "linear";
+    GradientType["Radial"] = "radial";
+    GradientType["Conic"] = "conic";
+})(GradientType || (exports.GradientType = GradientType = {}));
+var FontWeight;
+(function (FontWeight) {
+    FontWeight[FontWeight["Thin"] = 100] = "Thin";
+    FontWeight[FontWeight["ExtraLight"] = 200] = "ExtraLight";
+    FontWeight[FontWeight["Light"] = 300] = "Light";
+    FontWeight[FontWeight["Normal"] = 400] = "Normal";
+    FontWeight[FontWeight["Medium"] = 500] = "Medium";
+    FontWeight[FontWeight["SemiBold"] = 600] = "SemiBold";
+    FontWeight[FontWeight["Bold"] = 700] = "Bold";
+    FontWeight[FontWeight["ExtraBold"] = 800] = "ExtraBold";
+    FontWeight[FontWeight["Black"] = 900] = "Black";
+    FontWeight[FontWeight["ExtraBlack"] = 950] = "ExtraBlack";
+})(FontWeight || (exports.FontWeight = FontWeight = {}));
+var TextAlign;
+(function (TextAlign) {
+    TextAlign["Left"] = "left";
+    TextAlign["Right"] = "right";
+    TextAlign["Center"] = "center";
+    TextAlign["Start"] = "start";
+    TextAlign["End"] = "end";
+})(TextAlign || (exports.TextAlign = TextAlign = {}));
+var TextBaseline;
+(function (TextBaseline) {
+    TextBaseline["Top"] = "top";
+    TextBaseline["Hanging"] = "hanging";
+    TextBaseline["Middle"] = "middle";
+    TextBaseline["Alphabetic"] = "alphabetic";
+    TextBaseline["Ideographic"] = "ideographic";
+    TextBaseline["Bottom"] = "bottom";
+})(TextBaseline || (exports.TextBaseline = TextBaseline = {}));
+var TextDirection;
+(function (TextDirection) {
+    TextDirection["LeftToRight"] = "ltr";
+    TextDirection["RightToLeft"] = "rtl";
+    TextDirection["Inherit"] = "inherit";
+})(TextDirection || (exports.TextDirection = TextDirection = {}));
+var LineCap;
+(function (LineCap) {
+    LineCap["Butt"] = "butt";
+    LineCap["Round"] = "round";
+    LineCap["Square"] = "square";
+})(LineCap || (exports.LineCap = LineCap = {}));
+var LineJoin;
+(function (LineJoin) {
+    LineJoin["Bevel"] = "bevel";
+    LineJoin["Round"] = "round";
+    LineJoin["Miter"] = "miter";
+})(LineJoin || (exports.LineJoin = LineJoin = {}));
+var Export;
+(function (Export) {
+    Export["Buffer"] = "buffer";
+    Export["SVG"] = "svg";
+    Export["CTX"] = "ctx";
+})(Export || (exports.Export = Export = {}));
+var SaveFormat;
+(function (SaveFormat) {
+    SaveFormat["PNG"] = "png";
+    SaveFormat["JPEG"] = "jpeg";
+    SaveFormat["JPG"] = "jpg";
+    SaveFormat["SVG"] = "svg";
+})(SaveFormat || (exports.SaveFormat = SaveFormat = {}));
+var Centring;
+(function (Centring) {
+    Centring["Start"] = "start";
+    Centring["Center"] = "center";
+})(Centring || (exports.Centring = Centring = {}));
+var PatternType;
+(function (PatternType) {
+    PatternType["Repeat"] = "repeat";
+    PatternType["RepeatX"] = "repeat-x";
+    PatternType["RepeatY"] = "repeat-y";
+    PatternType["NoRepeat"] = "no-repeat";
+})(PatternType || (exports.PatternType = PatternType = {}));

package/dist/types/helpers/Font.d.ts

@@ -0,0 +1,12 @@
+import { FontWeight } from "../enum";
+
+export interface IFont {
+    family: string;
+    weight: FontWeight;
+    path?: string;
+    base64?: Buffer;
+}
+
+export interface IFonts {
+    [family: string]: Record<number, Buffer>;
+}

package/dist/types/helpers/Gradient.d.ts

@@ -0,0 +1,19 @@
+import { GradientType } from "../enum";
+
+export interface IGradient {
+    type: GradientType;
+    points: Array<GradientPoint>;
+    stops: Array<GradientColorStop>;
+}
+
+export interface GradientColorStop {
+    color: string;
+    offset: number;
+}
+
+export interface GradientPoint {
+    x: number;
+    y: number;
+    r?: number;
+    startAngle?: number;
+}

package/dist/types/helpers/Pattern.d.ts

@@ -0,0 +1,7 @@
+import { LazyCanvas } from '../../';
+import { PatternType } from '../enum';
+
+export interface IPattern {
+    type: PatternType;
+    src: string | LazyCanvas;
+}

package/dist/types/index.d.ts

@@ -0,0 +1,13 @@
+export * from "./types";
+export * from "./components/BaseLayer";
+export * from "./components/TextLayer";
+export * from "./components/ImageLayer";
+export * from "./components/MorphLayer";
+export * from "./components/Group";
+export * from "./helpers/Font";
+export * from "./helpers/Gradient";
+export * from "./helpers/Pattern";
+export * from "./managers/LayersManager";
+export * from "./managers/RenderManager";
+export * from "./managers/FontsManager";
+export * from "./LazyCanvas";

package/dist/types/managers/FontsManager.d.ts

@@ -0,0 +1,5 @@
+import { Font } from "../../structures/helpers/Font";
+
+export interface IFontsManager {
+    map: Map<string, Font>;
+}

package/dist/types/managers/LayersManager.d.ts

@@ -0,0 +1,6 @@
+import { AnyLayer } from "../";
+import { Group } from "../../structures/components/Group";
+
+export interface ILayersManager {
+    map: Map<string, AnyLayer | Group>;
+}

package/dist/types/managers/RenderManager.d.ts

@@ -0,0 +1,5 @@
+import { LazyCanvas } from "../../structures/LazyCanvas";
+
+export interface IRenderManager {
+    lazyCanvas: LazyCanvas;
+}

package/dist/types/types.d.ts

@@ -0,0 +1,12 @@
+import { Gradient } from "../structures/helpers/Gradient";
+import { Pattern } from "../structures/helpers/Pattern";
+import { MorphLayer } from "../structures/components/MorphLayer";
+import { ImageLayer } from "../structures/components/ImageLayer";
+import { TextLayer } from "../structures/components/TextLayer";
+import { Group } from "../structures/components/Group";
+
+export type ScaleType = string | number;
+
+export type ColorType = string | Gradient | Pattern;
+
+export type AnyLayer = MorphLayer | ImageLayer | TextLayer | Group;

package/dist/utils/LazyUtil.d.ts

@@ -0,0 +1,7 @@
+export declare class LazyError extends Error {
+    message: string;
+    constructor(message: string);
+}
+export declare class LazyLog {
+    static log(message: string, type?: string): void;
+}

package/dist/utils/LazyUtil.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LazyLog = exports.LazyError = void 0;
+class LazyError extends Error {
+    message;
+    constructor(message) {
+        super(message);
+        this.message = "[LazyCanvas] [ERROR] " + message;
+    }
+}
+exports.LazyError = LazyError;
+class LazyLog {
+    static log(message, type = "info") {
+        switch (type) {
+            case "info":
+                console.log("[LazyCanvas] [INFO] " + message);
+                break;
+            case "warn":
+                console.warn("[LazyCanvas] [WARN] " + message);
+                break;
+            default:
+                console.log("[LazyCanvas] [INFO] " + message);
+                break;
+        }
+    }
+}
+exports.LazyLog = LazyLog;

package/dist/utils/utils.d.ts

@@ -0,0 +1,39 @@
+import { Centring, LayerType, SaveFormat, TextAlign } from "../types/enum";
+import { Transform, ScaleType, ColorType } from "../types";
+import { Gradient } from "../structures/helpers/Gradient";
+import { Canvas, SKRSContext2D } from "@napi-rs/canvas";
+import { Pattern } from "../structures/helpers/Pattern";
+export declare function generateID(type: string): string;
+export declare function isColor(v: ColorType): "string" | "number" | "bigint" | "boolean" | "symbol" | "undefined" | "object" | "function";
+export declare function parseHex(v: string): string;
+export declare function parseColor(v: ColorType): string | Pattern | Gradient;
+export declare function parseToNormal(v: ScaleType, canvas: Canvas, layer?: {
+    width: number;
+    height: number;
+}, options?: {
+    vertical?: boolean;
+    layer?: boolean;
+}): number;
+export declare function drawShadow(ctx: SKRSContext2D, shadow: any): void;
+export declare function opacity(ctx: SKRSContext2D, opacity: number): void;
+export declare function filters(ctx: SKRSContext2D, filters: string): void;
+export declare function parseFillStyle(ctx: SKRSContext2D, color: ColorType): string | Promise<CanvasPattern> | CanvasGradient;
+export declare function transform(ctx: SKRSContext2D, transform: Transform, layer?: {
+    width: number;
+    height: number;
+    x: number;
+    y: number;
+    type: LayerType;
+}, extra?: {
+    text: string;
+    textAlign: TextAlign;
+    fontSize: number;
+    multiline: boolean;
+}): void;
+export declare function saveFile(buffer: any, extension: SaveFormat, name: string): Promise<void>;
+export declare function generateRandomName(): string;
+export declare function isImageUrlValid(src: string): boolean;
+export declare function centring(centring: Centring, type: LayerType, width: number, height: number, x: number, y: number): {
+    x: number;
+    y: number;
+};

package/dist/utils/utils.js

@@ -0,0 +1,261 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.centring = exports.isImageUrlValid = exports.generateRandomName = exports.saveFile = exports.transform = exports.parseFillStyle = exports.filters = exports.opacity = exports.drawShadow = exports.parseToNormal = exports.parseColor = exports.parseHex = exports.isColor = exports.generateID = void 0;
+const enum_1 = require("../types/enum");
+const Gradient_1 = require("../structures/helpers/Gradient");
+const LazyUtil_1 = require("./LazyUtil");
+const fs = __importStar(require("fs"));
+const jimp = __importStar(require("jimp"));
+const Pattern_1 = require("../structures/helpers/Pattern");
+function generateID(type) {
+    return `${type}-${Math.random().toString(36).substr(2, 9)}`;
+}
+exports.generateID = generateID;
+let percentReg = /^(\d+)%$/;
+let pxReg = /^(\d+)px$/;
+let canvasReg = /^(vw|vh|vmin|vmax)$/;
+let hexReg = /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/;
+let rgbReg = /^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/;
+let rgbaReg = /^rgba\((\d+),\s*(\d+),\s*(\d+),\s*(0|0?\.\d+|1(\.0)?)\)$/;
+let hslReg = /^hsl\((\d+),\s*(\d+)%,\s*(\d+)%\)$/;
+let hslaReg = /^hsla\((\d+),\s*(\d+)%,\s*(\d+)%,\s*(0|0?\.\d+|1(\.0)?)\)$/;
+function isColor(v) {
+    return typeof (v === 'string' && (hexReg.test(v) || rgbReg.test(v) || rgbaReg.test(v) || hslReg.test(v) || hslaReg.test(v))) || v instanceof Gradient_1.Gradient || v instanceof Pattern_1.Pattern;
+}
+exports.isColor = isColor;
+function tooShort(v) {
+    return v.length < 2 ? `0${v}` : v;
+}
+function parseHex(v) {
+    if (hexReg.test(v)) {
+        return v;
+    }
+    else if (rgbReg.test(v)) {
+        let match = v.match(rgbReg);
+        let r = parseInt(match[1]);
+        let g = parseInt(match[2]);
+        let b = parseInt(match[3]);
+        return `#${tooShort(r.toString(16))}${tooShort(g.toString(16))}${tooShort(b.toString(16))}`;
+    }
+    else if (rgbaReg.test(v)) {
+        let match = v.match(rgbaReg);
+        let r = parseInt(match[1]);
+        let g = parseInt(match[2]);
+        let b = parseInt(match[3]);
+        let a = parseFloat(match[4]);
+        return `#${tooShort(r.toString(16))}${tooShort(g.toString(16))}${tooShort(b.toString(16))}:${a}`;
+    }
+    else if (hslReg.test(v)) {
+        let match = v.match(hslReg);
+        let h = parseInt(match[1]);
+        let s = parseInt(match[2]);
+        let l = parseInt(match[3]);
+        l /= 100;
+        const b = s * Math.min(l, 1 - l) / 100;
+        const f = (n) => {
+            const k = (n + h / 30) % 12;
+            const color = l - b * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+            return Math.round(255 * color).toString(16).padStart(2, '0');
+        };
+        return `#${f(0)}${f(8)}${f(4)}`;
+    }
+    else if (hslaReg.test(v)) {
+        let match = v.match(hslaReg);
+        let h = parseInt(match[1]);
+        let s = parseInt(match[2]);
+        let l = parseInt(match[3]);
+        let a = parseFloat(match[4]);
+        l /= 100;
+        const b = s * Math.min(l, 1 - l) / 100;
+        const f = (n) => {
+            const k = (n + h / 30) % 12;
+            const color = l - b * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+            return Math.round(255 * color).toString(16).padStart(2, '0');
+        };
+        return `#${f(0)}${f(8)}${f(4)}:${a}`;
+    }
+    else {
+        return '#000000';
+    }
+}
+exports.parseHex = parseHex;
+function parseColor(v) {
+    if (typeof v === 'string') {
+        return parseHex(v);
+    }
+    else if (v instanceof Gradient_1.Gradient || v instanceof Pattern_1.Pattern) {
+        return v;
+    }
+    else {
+        return '#000000';
+    }
+}
+exports.parseColor = parseColor;
+function parseToNormal(v, canvas, layer = { width: 0, height: 0 }, options = { vertical: false, layer: false }) {
+    if (typeof v === 'number') {
+        return v;
+    }
+    else if (percentReg.test(v)) {
+        return parseFloat(v) * (options.layer ? (options.vertical ? layer.width : layer.height) : (options.vertical ? canvas.width : canvas.height));
+    }
+    else if (pxReg.test(v)) {
+        return parseFloat(v);
+    }
+    else if (canvasReg.test(v)) {
+        if (v === 'vw') {
+            return (options.layer ? layer.width : canvas.width);
+        }
+        else if (v === 'vh') {
+            return (options.layer ? layer.height : canvas.height);
+        }
+        else if (v === 'vmin') {
+            return (options.layer ? Math.max(layer.width, layer.height) : Math.min(canvas.width, canvas.height));
+        }
+        else if (v === 'vmax') {
+            return (options.layer ? Math.max(layer.width, layer.height) : Math.max(canvas.width, canvas.height));
+        }
+    }
+    return 0;
+}
+exports.parseToNormal = parseToNormal;
+function drawShadow(ctx, shadow) {
+    if (shadow) {
+        ctx.shadowColor = shadow.color;
+        ctx.shadowBlur = shadow.blur || 0;
+        ctx.shadowOffsetX = shadow.offsetX || 0;
+        ctx.shadowOffsetY = shadow.offsetY || 0;
+    }
+}
+exports.drawShadow = drawShadow;
+function opacity(ctx, opacity) {
+    if (opacity < 1) {
+        ctx.globalAlpha = opacity;
+    }
+}
+exports.opacity = opacity;
+function filters(ctx, filters) {
+    if (filters) {
+        ctx.filter = filters;
+    }
+}
+exports.filters = filters;
+function parseFillStyle(ctx, color) {
+    if (color instanceof Gradient_1.Gradient || color instanceof Pattern_1.Pattern) {
+        return color.draw(ctx);
+    }
+    else {
+        return color;
+    }
+}
+exports.parseFillStyle = parseFillStyle;
+function transform(ctx, transform, layer = { width: 0, height: 0, x: 0, y: 0, type: enum_1.LayerType.Morph }, extra = { text: '', textAlign: enum_1.TextAlign.Left, fontSize: 0, multiline: false }) {
+    if (transform) {
+        if (transform.translate) {
+            ctx.translate(transform.translate.x, transform.translate.y);
+        }
+        if (transform.rotate) {
+            switch (layer.type) {
+                case enum_1.LayerType.Image:
+                case enum_1.LayerType.Morph:
+                    ctx.translate(layer.x + (layer.width / 2), layer.y + (layer.height / 2));
+                    ctx.rotate((Math.PI / 180) * transform.rotate);
+                    ctx.translate(-(layer.x + (layer.width / 2)), -(layer.y + (layer.height / 2)));
+                    break;
+                case enum_1.LayerType.Text:
+                    if (extra.multiline) {
+                        ctx.translate(layer.x + (layer.width / 2), layer.y + (layer.height / 2));
+                        ctx.rotate((Math.PI / 180) * transform.rotate);
+                        ctx.translate(-(layer.x + (layer.width / 2)), -(layer.y + (layer.height / 2)));
+                    }
+                    else {
+                        if (extra.textAlign === enum_1.TextAlign.Center) {
+                            ctx.translate(layer.x, layer.y);
+                            ctx.rotate((Math.PI / 180) * transform.rotate);
+                            ctx.translate(-layer.x, -layer.y);
+                        }
+                        else if (extra.textAlign === enum_1.TextAlign.Left || extra.textAlign === enum_1.TextAlign.Start) {
+                            ctx.translate(layer.x + (extra.fontSize * extra.text.length) / 2, layer.y);
+                            ctx.rotate((Math.PI / 180) * transform.rotate);
+                            ctx.translate(-(layer.x + (extra.fontSize * extra.text.length) / 2), -layer.y);
+                        }
+                        else if (extra.textAlign === enum_1.TextAlign.Right || extra.textAlign === enum_1.TextAlign.End) {
+                            ctx.translate(layer.x - (extra.fontSize * extra.text.length) / 2, layer.y);
+                            ctx.rotate((Math.PI / 180) * transform.rotate);
+                            ctx.translate(-(layer.x - (extra.fontSize * extra.text.length) / 2), -layer.y);
+                        }
+                    }
+                    break;
+            }
+        }
+        if (transform.scale) {
+            ctx.scale(transform.scale.x, transform.scale.y);
+        }
+        if (transform.matrix) {
+            if (!transform.matrix.a || !transform.matrix.b || !transform.matrix.c || !transform.matrix.d || !transform.matrix.e || !transform.matrix.f)
+                throw new LazyUtil_1.LazyError('The matrix transformation must be a valid matrix');
+            ctx.transform(transform.matrix.a, transform.matrix.b, transform.matrix.c, transform.matrix.d, transform.matrix.e, transform.matrix.f);
+        }
+    }
+}
+exports.transform = transform;
+async function saveFile(buffer, extension, name) {
+    if (!buffer)
+        throw new LazyUtil_1.LazyError('Buffer must be provided');
+    if (!extension)
+        throw new LazyUtil_1.LazyError('Extension must be provided');
+    fs.writeFileSync(`${name === undefined ? generateRandomName() : name}.${extension}`, buffer);
+}
+exports.saveFile = saveFile;
+function generateRandomName() {
+    return Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
+}
+exports.generateRandomName = generateRandomName;
+function isImageUrlValid(src) {
+    try {
+        jimp.read(src);
+        return true;
+    }
+    catch (error) {
+        return false;
+    }
+}
+exports.isImageUrlValid = isImageUrlValid;
+function centring(centring, type, width, height, x, y) {
+    if (centring === enum_1.Centring.Center) {
+        switch (type) {
+            case enum_1.LayerType.Image:
+            case enum_1.LayerType.Morph:
+                x -= width / 2;
+                y -= height / 2;
+                break;
+        }
+        return { x, y };
+    }
+    else {
+        return { x, y };
+    }
+}
+exports.centring = centring;

package/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@nmmty/lazycanvas",
+  "version": "0.2.0",
+  "description": "A simple way to interact with @napi-rs/canvas in an advanced way!",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "scripts": {
+    "test": "tsc ./test/test.ts && node ./test/test.js",
+    "logo": "tsc ./test/logo.ts && node ./test/logo.js",
+    "text": "tsc ./test/text.ts && node ./test/text.js",
+    "doc": "tsx docgen.ts",
+    "build": "tsc"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/NMMTY/LazyCanvas.git"
+  },
+  "keywords": [
+    "canvas",
+    "@napi-rs/canvas",
+    "node-canvas",
+    "easy",
+    "simple"
+  ],
+  "author": "NMMTY",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/NMMTY/LazyCanvas/issues"
+  },
+  "homepage": "https://github.com/NMMTY/LazyCanvas#readme",
+  "dependencies": {
+    "@napi-rs/canvas": "^0.1.65",
+    "jimp": "0.22.12",
+    "path": "^0.12.7",
+    "svgson": "^5.3.1"
+  },
+  "devDependencies": {
+    "@hitomihiumi/micro-docgen": "^0.3.0",
+    "@types/jimp": "^0.2.28",
+    "@types/node": "^22.10.2",
+    "@types/react": "^19.0.2",
+    "ava": "^6.2.0",
+    "globals": "^15.14.0",
+    "tslib": "^2.8.1",
+    "tsx": "^4.19.2",
+    "typescript": "^5.4.5"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}