Class Canvas

constructor

• new Canvas(options?: Partial<Options>): Canvas

  Create a new canvas with the provided options

  Parameters

  • options: Partial<Options> = {}

    Configuration options

  Returns Canvas

Readonlyheight

Readonlywidth

clear

• clear(layer?: number): void

  Completely clears the canvas.

  Parameters

  • layer: number = -1

    The zero-indexed layer to clear, if unset, will clear all layers

  Returns void

clearData

• clearData(name?: string): void

  Clear all saved data. This action is permanent!

  Parameters

  • name: string = 'data'

    An optional "namespace" to clear data from.

  Returns void

draw

• draw(drawable: Drawable, layer?: number): void

  Draw an object onto the canvas.

  Parameters

  • drawable: Drawable

    Any drawable object

  • layer: number = 0

    The zero-indexed layer to draw to

  Returns void

getMousePosition

• getMousePosition(): [number, number]

  Get the current cursor position.

  Returns [number, number]

  Cursor position as [x, y]

isKeyDown

• isKeyDown(key: string): boolean

  Determine whether a key is currently pressed.

  Parameters

  • key: string

    The key to check

  Returns boolean

  True if key is down

isMouseButtonDown

• isMouseButtonDown(button: number): boolean

  Determine whether a mouse button is currently pressed.

  Parameters

  • button: number

    The button ID

  Returns boolean

  True if button is down

isMuted

• isMuted(): boolean

  Determines whether audio is muted

  Returns boolean

  True if currently muted

isRecording

• isRecording(): boolean

  Determines whether the media recorder is active

  Returns boolean

  True if currently recording

loadData

• loadData<T>(name?: string): Partial<T> | undefined

  Load arbitrary data from the browser storage. Warning: The loaded data object is not strictly type-checked or sanitized, so it may have missing fields or contain extra fields. It's good practice to manually validate the data once it's loaded from storage.

  Type Parameters

  • T

  Parameters

  • name: string = 'data'

    An optional "namespace" to load data from, assigned when saving data

  Returns Partial<T> | undefined

  The data object loaded from browser storage

mute

• mute(): void

  Mute all audio

  Returns void

playAudio

• playAudio(src: string, loop?: boolean, volume?: number, track?: number): void

  Play an audio file

  Parameters

  • src: string

    The path of the audio file

  • loop: boolean = false

    Whether to play the audio on loop

  • volume: number = 1

    The normalized [0-1] volume

  • track: number = 0

    The track number to play on

  Returns void

saveData

• saveData<T>(data: T, name?: string): void

  Save arbitrary data to the browser storage. Warning: This will overwrite any existing data under these object keys.

  Type Parameters

  • T

  Parameters

  • data: T

    The arbirary data object to save

  • name: string = 'data'

    An optional "namespace" to store the data, which can be assigned when a user has multiple profiles, for example

  Returns void

screenshot

• screenshot(name?: string): void

  Take a screenshot of the canvas contents and save to a .png file.

  Parameters

  • name: string = 'screenshot'

    The file name of the screenshot

  Returns void

startRecording

• startRecording(): void

  Start recording all layers on the canvas

  Returns void

stopAudio

• stopAudio(track?: number): void

  Stop all audio tracks from playing

  Parameters

  • track: number = -1

  Returns void

stopRecording

• stopRecording(): void

  Stop recording and download screen capture

  Returns void

unmute

• unmute(): void

  Unmute all audio

  Returns void