WebglCanvas

Defined in: src/renderers/WebGlCanvas.ts:67

Flipnote renderer for the WebGL API.

Only available in browser contexts.

Implements

• CanvasInterface

Constructors

new WebglCanvas()

new WebglCanvas(parent, width, height, options): WebglCanvas

Defined in: src/renderers/WebGlCanvas.ts:184

Creates a new WebGlCanvas instance

Parameters

Parameter	Type	Default value	Description
parent	Element	undefined	-
width	number	640	Canvas width in CSS pixels
height	number	480	Canvas height in CSS pixels The ratio between width and height should be 3:4 for best results
options	Partial<WebglCanvasOptions>	{}	-

Returns

WebglCanvas

Properties

defaultOptions

static defaultOptions: WebglCanvasOptions

Defined in: src/renderers/WebGlCanvas.ts:69

---

note

note: BaseParser

Defined in: src/renderers/WebGlCanvas.ts:92

Flipnote parser object for the Flipnote being played.

Implementation of

CanvasInterface.note

---

canvas

canvas: HTMLCanvasElement

Defined in: src/renderers/WebGlCanvas.ts:96

Canvas HTML element being used as a rendering surface.

---

gl

gl: WebGLRenderingContext

Defined in: src/renderers/WebGlCanvas.ts:100

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

---

width

width: number

Defined in: src/renderers/WebGlCanvas.ts:104

View width (CSS pixels)

Implementation of

CanvasInterface.width

---

height

height: number

Defined in: src/renderers/WebGlCanvas.ts:108

View height (CSS pixels)

Implementation of

CanvasInterface.height

---

srcWidth

srcWidth: number

Defined in: src/renderers/WebGlCanvas.ts:112

Flipnote width (pixels).

Implementation of

CanvasInterface.srcWidth

---

srcHeight

srcHeight: number

Defined in: src/renderers/WebGlCanvas.ts:116

Flipnote height (pixels).

Implementation of

CanvasInterface.srcHeight

---

dstWidth

dstWidth: number

Defined in: src/renderers/WebGlCanvas.ts:121

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

Implementation of

CanvasInterface.dstWidth

---

dstHeight

dstHeight: number

Defined in: src/renderers/WebGlCanvas.ts:126

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

Implementation of

CanvasInterface.dstHeight

---

frameIndex

frameIndex: number

Defined in: src/renderers/WebGlCanvas.ts:130

Implementation of

CanvasInterface.frameIndex

---

supportedStereoscopeModes

supportedStereoscopeModes: CanvasStereoscopicMode[]

Defined in: src/renderers/WebGlCanvas.ts:134

Implementation of

CanvasInterface.supportedStereoscopeModes

---

stereoscopeMode

stereoscopeMode: CanvasStereoscopicMode = CanvasStereoscopicMode.None

Defined in: src/renderers/WebGlCanvas.ts:142

Implementation of

CanvasInterface.stereoscopeMode

---

stereoscopeStrength

stereoscopeStrength: number = 0

Defined in: src/renderers/WebGlCanvas.ts:146

Implementation of

CanvasInterface.stereoscopeStrength

Methods

isSupported()

static isSupported(): boolean

Defined in: src/renderers/WebGlCanvas.ts:75

Returns

boolean

---

setCanvasSize()

setCanvasSize(width, height): void

Defined in: src/renderers/WebGlCanvas.ts:208

Resize the canvas surface

Parameters

Parameter	Type	Description
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

Implementation of

CanvasInterface.setCanvasSize

---

setNote()

setNote(note): void

Defined in: src/renderers/WebGlCanvas.ts:226

Sets the note to use for this player

Parameters

Parameter	Type
note	BaseParser

Returns

void

Implementation of

CanvasInterface.setNote

---

clear()

clear(color?): void

Defined in: src/renderers/WebGlCanvas.ts:246

Clear the canvas

Parameters

Parameter	Type	Description
color?	[number, number, number, number]	optional RGBA color to use as a background color

Returns

void

Implementation of

CanvasInterface.clear

---

drawFrame()

drawFrame(frameIndex): void

Defined in: src/renderers/WebGlCanvas.ts:259

Draw a frame from the currently loaded Flipnote

Parameters

Parameter	Type	Description
frameIndex	number

Returns

void

Implementation of

CanvasInterface.drawFrame

---

requestStereoScopeMode()

requestStereoScopeMode(mode): void

Defined in: src/renderers/WebGlCanvas.ts:283

Parameters

Parameter	Type
mode	CanvasStereoscopicMode

Returns

void

Implementation of

CanvasInterface.requestStereoScopeMode

---

forceUpdate()

forceUpdate(): void

Defined in: src/renderers/WebGlCanvas.ts:291

Returns

void

Implementation of

CanvasInterface.forceUpdate

---

isErrorState()

isErrorState(): boolean

Defined in: src/renderers/WebGlCanvas.ts:299

Returns true if the webGL context has returned an error

Returns

boolean

---

getDataUrl()

getDataUrl(type?, quality?): string

Defined in: src/renderers/WebGlCanvas.ts:310

Get the contents of the canvas as a data URL.

Parameters

Parameter	Type	Description
type?	string	image mime type (image/jpeg, image/png, etc)
quality?	any	image quality where supported, between 0 and 1

Returns

string

Implementation of

CanvasInterface.getDataUrl

---

getBlob()

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

Defined in: src/renderers/WebGlCanvas.ts:320

Get the contents of the canvas as a blob.

Parameters

Parameter	Type	Description
type?	string	image mime type (image/jpeg, image/png, etc)
quality?	any	image quality where supported, between 0 and 1

Returns

Promise<Blob>

Implementation of

CanvasInterface.getBlob

---

destroy()

destroy(): void

Defined in: src/renderers/WebGlCanvas.ts:327

Frees any resources used by this canvas instance

Returns

void

Implementation of

CanvasInterface.destroy