Skip to content

Module: src/visualizer/AnalyserAudio

The AnalyserAudio component forms the backbone for all audio visualizations in the player. It uses the Web Audio API to perform real-time frequency and time-domain analysis on audio streams. This base class is meant to be subclassed by visual components that make use of the analysis data to render visual effects. It is not intended to be used directly.

Version
1.0.0
Author
Frank Kudermann - alphanull
License
MIT
Requires
object
Looper
Source
AnalyserAudio.js, line 16

Constructor

new AnalyserAudio(player, config, apiKey)

Creates an instance of the AnalyserAudio component.

Parameters:
Name Type Description
player Player

Reference to the main player instance.

config Object

Configuration object for the AnalyserAudio component. This is passed from the subclass.

apiKey symbol

Token for extended access to the player API.

Members

Holds the instance configuration for this component. Config object extended by subclasses for specific visualizer settings.

Properties
Name Type Attributes Default Description
audioOnly boolean optional false

If true, analysis is active only for audio streams.

channels number optional 1

Number of audio channels.

hiPass number optional 0

High-pass filter cutoff value.

loPass number optional 0

Low-pass filter cutoff value.

fftSize number optional 512

FFT size for frequency analysis.

minDecibels number optional -120

Minimum decibels for analysis.

maxDecibels number optional 0

Maximum decibels for analysis.

smoothingTime number optional 0.8

Smoothing time constant for analysis.

stopDelay number optional 1000

Delay (in ms) after which the analysis loop is stopped when paused.

Type
Object
Source
AnalyserAudio.js, line 32

Reference to the main player instance.

Type
Player
Source
AnalyserAudio.js, line 38

Holds tokens of subscriptions to player events, for later unsubscribe.

Type
Array<number>
Source
AnalyserAudio.js, line 44

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
AnalyserAudio.js, line 51

Audio analysis data.

Properties
Name Type Description
splitter ChannelSplitterNode

The channel splitter node used to divide the audio signal into channels.

analysers Array<AudioNode>

Array of AnalyserNode objects for each channel.

frequencyData Array<Uint8Array>

Array of Uint8Array storing frequency data for each channel.

waveformData Array<Uint8Array>

Array of Uint8Array storing time-domain data for each channel.

Source
AnalyserAudio.js, line 60

Use the shared AudioContext from the player's Audio Manager.

Type
AudioContext
Source
AnalyserAudio.js, line 71

Flag indicating if the analyser loop is running.

Type
boolean
Source
AnalyserAudio.js, line 77

Render Loop Instance, used for updating the scrubber.

Type
Looper
Source
AnalyserAudio.js, line 83

ID of the stop delay timeout.

Type
number
Source
AnalyserAudio.js, line 89

Methods

private #onDataReady(mediaItem)

Handles "data/ready" events to activate audio analysis based on media type.

Parameters:
Name Type Description
mediaItem Data~mediaItem

Object containing media type info.

Parameters:
Name Type Description
mediaType string

Type of the media ('video' or 'audio').

Listens
data/ready
Source
AnalyserAudio.js, line 138

private #initAnalysers()

Initializes the audio analysers for each channel. Creates a ChannelSplitter and an Analyser for each channel, and connects them.

Source
AnalyserAudio.js, line 150

startLoop()

Starts the audio analysis loop.

Listens
media/play
Source
AnalyserAudio.js, line 176

stopLoop()

Stops the audio analysis loop after a configured delay. The delay is used to that the visualization can "cool down" without being frozen inplace.

Listens
media/pause
Source
AnalyserAudio.js, line 190

analyseLoop() → Object

Main loop for audio analysis. Retrieves frequency and time domain data, then schedules the next iteration. Used by subclasses in their own rendering loops for collecting data from the analyser.

Returns

Object containing both frequencyData and waveformData.

Type Object
Source
AnalyserAudio.js, line 202

destroy()

Tears down the AnalyserAudio component. Disconnects audio nodes, cancels timeouts/animation frames, unsubscribes from events, and releases references.

Source
AnalyserAudio.js, line 220

static reduceFrequencies(inputArray, targetSize) → Array<number>

Reduces the size of the frequency array to the target size by averaging groups of frequencyData.

Parameters:
Name Type Description
inputArray Array<number>

Original frequency data array.

targetSize number

Desired size of the output array.

Returns

The reduced frequency data array.

Type Array<number>
Source
AnalyserAudio.js, line 238