canvas-compositor/Compositor/CanvasBuffer.ts

export default class CanvasBuffer
{
    public offscreen! : OffscreenCanvas;
    public context! : OffscreenCanvasRenderingContext2D;
    public width: number = 0;
    public height: number = 0;
    constructor(width?:number, height?:number){
        this.offscreen = new OffscreenCanvas(width || 0, height || 0);
        this.context = this.offscreen.getContext("2d") as OffscreenCanvasRenderingContext2D;
        this.width = width || 0;
        this.height = height || 0;
    }
    public resize(width: number, height: number)
    {
        if(this.width != width)
        {
            this.offscreen.width = width;
            this.width = width || 0;
        }
        if(this.height != height)
        {
            this.offscreen.height = height;
            this.height = height || 0;
        }
    }
    public clear()
    {
        this.context.clearRect(0, 0, this.offscreen.width, this.offscreen.height);
    }
    public writeFrom(
        canvas: OffscreenCanvas | OffscreenCanvasRenderingContext2D | HTMLCanvasElement | CanvasRenderingContext2D | CanvasBuffer,
        x?:number,
        y?:number,
        width?:number,
        height?:number,
        dx?:number,
        dy?:number,
        dwidth?:number,
        dheight?:number
    )
    {
        let args = [
            x,
            y,
            width,
            height,
            dx,
            dy,
            dwidth,
            dheight
        ];
        if(
            canvas instanceof OffscreenCanvas ||
            canvas instanceof HTMLCanvasElement
        )
        {
            _draw_content_to_canvas(
                this.context,
                canvas,
                ...args
            );
        }
        if(
            canvas instanceof OffscreenCanvasRenderingContext2D ||
            canvas instanceof CanvasRenderingContext2D
        )
        {
            _draw_content_to_canvas(
                this.context,
                canvas.canvas,
                ...args
            );
        }
        if(
            canvas instanceof CanvasBuffer
        )
        {
            _draw_content_to_canvas(
                this.context,
                canvas.offscreen,
                ...args
            );
        }
    }
    public writeTo(
        canvas: OffscreenCanvas | OffscreenCanvasRenderingContext2D | HTMLCanvasElement | CanvasRenderingContext2D | CanvasBuffer,
        x?:number,
        y?:number,
        width?:number,
        height?:number,
        dx?:number,
        dy?:number,
        dwidth?:number,
        dheight?:number
    )
    {
        let args = [
            x,
            y,
            width,
            height,
            dx,
            dy,
            dwidth,
            dheight
        ];
        if(
            canvas instanceof OffscreenCanvas ||
            canvas instanceof HTMLCanvasElement
        )
        {
            let content = canvas.getContext("2d") as OffscreenCanvasRenderingContext2D | CanvasRenderingContext2D;
           
            _draw_content_to_canvas(
                content,
                this.offscreen,
                ...args
            );
        }
        if(
            canvas instanceof OffscreenCanvasRenderingContext2D ||
            canvas instanceof CanvasRenderingContext2D
        )
        {
            _draw_content_to_canvas(
                canvas,
                this.offscreen,
                ...args
            );
        }
        if(
            canvas instanceof CanvasBuffer
        )
        {
            _draw_content_to_canvas(
                canvas.context,
                this.offscreen,
                ...args
            );
        }
    }
}

function _draw_content_to_canvas(
    context : OffscreenCanvasRenderingContext2D | CanvasRenderingContext2D,
    canvas : OffscreenCanvas | HTMLCanvasElement,
    x?:number,
    y?:number,
    width?:number,
    height?:number,
    dx?:number,
    dy?:number,
    dwidth?:number,
    dheight?:number
)
{
    if(
        canvas.width != 0 && canvas.height != 0 &&
        context.canvas.width != 0 && context.canvas.height != 0
    )
    {
        context.drawImage(
            canvas,
            x || 0,
            y || 0,
            width || canvas.width,
            height || canvas.height,
            dx || 0,
            dy || 0,
            dwidth || canvas.width,
            dheight || canvas.height
        )
    };
}