Menu

Class WebglCanvas

Flipnote renderer for the WebGL API

Only available in browser contexts

Hierarchy

  • WebglCanvas

Implements

  • CanvasInterface

Index

Constructors

Properties

Methods

Object literals

Constructors

constructor

  • Creates a new WebGlCanvas instance

    Parameters

    • parent: Element
    • Default value width: number = 640

      Canvas width in CSS pixels

    • Default value height: number = 480

      Canvas height in CSS pixels

      The ratio between width and height should be 3:4 for best results

    • Default value options: Partial<WebglCanvasOptions> = {}

    Returns WebglCanvas

Properties

canvas

canvas: HTMLCanvasElement

Canvas HTML element being used as a rendering surface

dstHeight

dstHeight: number

Backing canvas height (real pixels) Note that this factors in device pixel ratio, so it may not reflect the size of the canvas in CSS pixels

dstWidth

dstWidth: number

Backing canvas width (real pixels) Note that this factors in device pixel ratio, so it may not reflect the size of the canvas in CSS pixels

frameIndex

frameIndex: number

gl

gl: WebGLRenderingContext

Rendering context - see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext

height

height: number

View height (CSS pixels)

note

note: FlipnoteParserBase

srcHeight

srcHeight: number

srcWidth

srcWidth: number

stereoscopeMode

stereoscopeMode: CanvasStereoscopicMode = CanvasStereoscopicMode.None

stereoscopeStrength

stereoscopeStrength: number = 0

supportedStereoscopeModes

supportedStereoscopeModes: CanvasStereoscopicMode[] = [CanvasStereoscopicMode.None,CanvasStereoscopicMode.Dual,// CanvasStereoscopicMode.Anaglyph, // couldn't get this working, despite spending lots of time on it :/]

width

width: number

View width (CSS pixels)

Methods

clear

  • clear(color?: [number, number, number, number]): void

  • Clear the canvas

    Parameters

    • Optional color: [number, number, number, number]

      optional RGBA color to use as a background color

    Returns void

destroy

  • destroy(): void

drawFrame

  • drawFrame(frameIndex: number): void

forceUpdate

  • forceUpdate(): void

getBlob

  • getBlob(type?: string, quality?: any): Promise<Blob>

getDataUrl

  • getDataUrl(type?: string, quality?: any): string

  • Parameters

    • Optional type: string

      image mime type (image/jpeg, image/png, etc)

    • Optional quality: any

      image quality where supported, between 0 and 1

    Returns string

isErrorState

  • isErrorState(): boolean

requestStereoScopeMode

setCanvasSize

  • setCanvasSize(width: number, height: number): void

  • Resize the canvas surface

    Parameters

    • width: number

      New canvas width, in CSS pixels

    • height: number

      New canvas height, in CSS pixels

      The ratio between width and height should be 3:4 for best results

    Returns void

setNote

Static isSupported

  • isSupported(): boolean

Object literals

Static defaultOptions

defaultOptions: object

useDpi

useDpi: true = true

onlost

  • onlost(): void

onrestored

  • onrestored(): void