Class Html5Canvas

packages/alphatab/src/platform/javascript/Html5Canvas.ts:13–299

 * @internal
 */
export class Html5Canvas implements ICanvas {
    private _measureCanvas: HTMLCanvasElement;
    private _measureContext: CanvasRenderingContext2D;
    private _canvas: HTMLCanvasElement | null = null;
    private _context!: CanvasRenderingContext2D;
    private _color: Color = new Color(0, 0, 0, 0xff);
    private _font: Font = new Font('Arial', 10, FontStyle.Plain);
    private _musicFont?: Font;
    private _lineWidth: number = 0;

    public settings!: Settings;

    public constructor() {
        this._measureCanvas = document.createElement('canvas');
        this._measureCanvas.width = 10;
        this._measureCanvas.height = 10;
        this._measureCanvas.style.width = '10px';
        this._measureCanvas.style.height = '10px';
        this._measureContext = this._measureCanvas.getContext('2d')!;
        this._measureContext.textBaseline = 'hanging';
    }

    public destroy() {}

    public onRenderFinished(): unknown {
        return null;
    }

    public beginRender(width: number, height: number): void {
        this._musicFont = new Font(
            this.settings.display.resources.smuflFontFamilyName!,
            this.settings.display.resources.engravingSettings.musicFontSize,
            FontStyle.Plain,
            FontWeight.Regular
        );


        const scale = this.settings.display.scale;

        this._canvas = document.createElement('canvas');
        this._canvas.width = (width * Environment.highDpiFactor) | 0;
        this._canvas.height = (height * Environment.highDpiFactor) | 0;
        this._canvas.style.width = `${width}px`;
        this._canvas.style.height = `${height}px`;
        this._context = this._canvas.getContext('2d')!;
        this._context.textBaseline = 'hanging';
        this._context.scale(Environment.highDpiFactor * scale, Environment.highDpiFactor * scale);
        this._context.lineWidth = this._lineWidth;
    }

    public endRender(): unknown {
        const result: HTMLCanvasElement = this._canvas!;
        this._canvas = null;
        return result;
    }

    public get color(): Color {
        return this._color;