illustrator.js documentation
  1. Classes
  2. Layer

File

src/layer/Layer.ts

Index

Properties
Methods
Accessors

Constructor

Public constructor(manager: LayerManager, id: number, options?: literal type)
Defined in src/layer/Layer.ts:31
Parameters :
Name Type Optional
manager LayerManager No
id number No
options literal type Yes

Properties

Public canvas
Type : Canvas
Defined in src/layer/Layer.ts:19
Public coordinates
Type : object
Default value : { x: 0, y: 0 }
Defined in src/layer/Layer.ts:26
Public ctx
Type : SKRSContext2D
Defined in src/layer/Layer.ts:20
Public height
Type : number
Defined in src/layer/Layer.ts:31
Public Readonly id
Type : number
Defined in src/layer/Layer.ts:35
Public Readonly manager
Type : LayerManager
Defined in src/layer/Layer.ts:34
Public tools
Default value : new LayerTools(this)
Defined in src/layer/Layer.ts:25
Public utils
Type : LayerUtils
Defined in src/layer/Layer.ts:24
Public width
Type : number
Defined in src/layer/Layer.ts:30

Methods

Public applyTool
applyTool(tool: ToolBox)
Defined in src/layer/Layer.ts:129
Parameters :
Name Type Optional
tool ToolBox No
Returns : void
Public createTransformation
createTransformation(data: LayerTransformationData)
Defined in src/layer/Layer.ts:68
Parameters :
Name Type Optional
data LayerTransformationData No
Returns : void
Public duplicate
duplicate(name)
Defined in src/layer/Layer.ts:118
Parameters :
Name Optional Default value
name No `${this.name} Copy`
Returns : any
Public hide
hide()
Defined in src/layer/Layer.ts:100
Returns : this
Public isHidden
isHidden()
Defined in src/layer/Layer.ts:92
Returns : boolean
Public isLocked
isLocked()
Defined in src/layer/Layer.ts:78
Returns : boolean
Public lock
lock()
Defined in src/layer/Layer.ts:82
Returns : this
Public Async render
render()
Defined in src/layer/Layer.ts:143
Returns : unknown
Public restore
restore()
Defined in src/layer/Layer.ts:114
Returns : void
Public save
save()
Defined in src/layer/Layer.ts:110
Returns : void
Public setHistory
setHistory(history: LayerToolHistory)
Defined in src/layer/Layer.ts:135
Parameters :
Name Type Optional
history LayerToolHistory No
Returns : void
Public setPosition
setPosition(position: number)
Defined in src/layer/Layer.ts:64
Parameters :
Name Type Optional
position number No
Returns : any
Public show
show()
Defined in src/layer/Layer.ts:105
Returns : this
Public unlock
unlock()
Defined in src/layer/Layer.ts:87
Returns : this

Accessors

name
getname()
Defined in src/layer/Layer.ts:48
illustrator
getillustrator()
Defined in src/layer/Layer.ts:52
context
getcontext()
Defined in src/layer/Layer.ts:56
position
getposition()
Defined in src/layer/Layer.ts:60
locked
getlocked()
Defined in src/layer/Layer.ts:74
hidden
gethidden()
Defined in src/layer/Layer.ts:96
 
import { Canvas, createCanvas, SKRSContext2D } from "@napi-rs/canvas";
import { ToolBox } from "../toolbox/base/ToolBox";
import { LayerManager } from "./LayerManager";
import { LayerTools } from "./LayerTools";
import { LayerUtils } from "./LayerUtils";

export type LayerToolHistory = Array<(ctx: SKRSContext2D) => Promise<void> | void>[];

export interface LayerTransformationData {
    coordinates?: {
        x: number;
        y: number;
    };
    height?: number;
    width?: number;
}

export class Layer {
    public canvas: Canvas;
    public ctx: SKRSContext2D;
    #locked = false;
    #hidden = false;
    #toolHistory: LayerToolHistory = [];
    public utils: LayerUtils;
    public tools = new LayerTools(this);
    public coordinates = {
        x: 0,
        y: 0
    };
    public width: number;
    public height: number;

    public constructor(
        public readonly manager: LayerManager,
        public readonly id: number,
        options?: {
            width?: number;
            height?: number;
        }
    ) {
        this.height = options?.height ?? this.manager.illustrator.height;
        this.width = options?.width ?? this.manager.illustrator.width;
        this.canvas = createCanvas(this.width, this.height);
        this.ctx = this.canvas.getContext("2d");
        this.utils = new LayerUtils(this.ctx);
    }

    public get name() {
        return this.manager.resolve(this)?.name as string;
    }

    public get illustrator() {
        return this.manager.illustrator;
    }

    public get context() {
        return this.ctx;
    }

    public get position() {
        return this.manager.getLayerPosition(this);
    }

    public setPosition(position: number) {
        return this.manager.setLayerPosition(this, position);
    }

    public createTransformation(data: LayerTransformationData) {
        if (data.coordinates) this.coordinates = data.coordinates;
        if (data.width) this.width = data.width;
        if (data.height) this.height = data.height;
    }

    public get locked() {
        return this.#locked;
    }

    public isLocked() {
        return this.locked;
    }

    public lock() {
        this.#locked = true;
        return this;
    }

    public unlock() {
        this.#locked = false;
        return this;
    }

    public isHidden() {
        return this.hidden;
    }

    public get hidden() {
        return this.#hidden;
    }

    public hide() {
        this.#hidden = true;
        return this;
    }

    public show() {
        this.#hidden = false;
        return this;
    }

    public save() {
        this.ctx.save();
    }

    public restore() {
        this.ctx.restore();
    }

    public duplicate(name = `${this.name} Copy`) {
        return this.manager.duplicateLayer(this, this.#toolHistory, {
            name,
            config: {
                height: this.height,
                width: this.width
            },
            position: this.position + 1
        });
    }

    public applyTool(tool: ToolBox) {
        this.#throwIfLocked();
        if (!(tool instanceof ToolBox)) throw new Error("tool must be a ToolBox instance");
        this.#toolHistory.push(tool.history);
    }

    public setHistory(history: LayerToolHistory) {
        this.#toolHistory = history;
    }

    #throwIfLocked() {
        if (this.#locked) throw new Error("Cannot perform operations on locked layer");
    }

    public async render() {
        if (this.#hidden) return null;
        await Promise.all(this.#toolHistory.flat(2).map((m) => m(this.ctx)));
        return this.canvas;
    }
}

results matching ""

    No results matching ""