Skip to content

Module: src/visualizer/time/VisualizerTime

VisualizerTime component for rendering a waveform visualization from audio time-domain data. It extends AnalyserAudio to capture and process audio analyser data and then renders the processed time-domain data onto a canvas as a waveform. Also uses a worker for rendering, if available.

Version
1.0.0
Author
Frank Kudermann - alphanull
License
MIT
Extends
AnalyserAudio
Requires
VisualizerTimeWorker
supportsWorkerModules
DomSmith
Source
VisualizerTime.js, line 19

Constructor

new VisualizerTime(player, parent, optionsopt)

Creates an instance of the VisualizerTime component.

Parameters:
Name Type Attributes Description
player Player

Reference to the VisionPlayer instance.
parent AudioChain

Reference to the parent instance.
options Object optional

Additional options.

Parameters:
Name Type Attributes Description
apiKey symbol optional

Token for extended access to the player API.

Members

Reference to the main player instance.

Type
Player
Source
VisualizerTime.js, line 25

Holds tokens of subscriptions (for this subclass only).

Type
Array<number>
Source
VisualizerTime.js, line 31

Secret key only known to the player instance and initialized components. Used to be able to restrict access to API methods in conjunction with secure mode.

Type
symbol
Source
VisualizerTime.js, line 38

Reference to the DomSmith Instance.

Type
DomSmith
Source
VisualizerTime.js, line 44

Local canvas element and 2D context for rendering when worker is not used.

Properties
Name Type Description
ele HTMLCanvasElement

The canvas element.
ctx CanvasRenderingContext2D

The 2D rendering context.
Type
Object
Source
VisualizerTime.js, line 52

Optional worker which renders the canvas offscreen.

Type
VisualizerTimeWorker
Source
VisualizerTime.js, line 58

Indicates if OffscreenCanvas worker rendering is used.

Type
OffscreenCanvas | undefined
Source
VisualizerTime.js, line 64

Methods

async, private #initWorker()

Initializes the worker for offloading rendering, if supported. If workers are not supported, sets up local canvas rendering.

Source
VisualizerTime.js, line 108

startLoop()

Starts the audio analysis loop.

Listens
media/play
Source
VisualizerTime.js, line 132

analyseLoop()

Overrides the parent's analyseLoop method to render time-domain data.

Listens
media/play
media/pause
Source
VisualizerTime.js, line 145

private #render(timeData)

Renders the time-domain data as a waveform on the canvas.

Parameters:
Name Type Description
timeData Array<Array<number>>

Array of time-domain data per channel.
Source
VisualizerTime.js, line 158

private #resize()

Invoked when window resizes. Sets the canvas dimensions accordingly.

Listens
ui/resize
Source
VisualizerTime.js, line 191

destroy()

This method removes all events, subscriptions and DOM nodes created by this component.

Source
VisualizerTime.js, line 211