new Timeline(options)
Timeline displays a scrolling audio waveform.
Will display a waveform that scrolls over playback. If provided, BPM is visualised as vertical bars with emphasis on main beats according to time signature. It is interactive and will update the player's current time value to match the dragged one. This class extends VisuComponentMono only because it performs an offline analysis on audio and the stereo information are already held in audio buffer.
Parameters:
Name | Type | Description | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
options |
object | The timeline options Properties
|
- Since:
- 2020
- Source:
Extends
Members
(private) _audioCtx :object
The audio context
Type:
- object
- Inherited From:
- Source:
(private) _canvas :object
The canvas to rendered mono data to
Type:
- object
- Inherited From:
- Source:
(private) _ctx :object
The canvas associated context
Type:
- object
- Inherited From:
- Source:
(private) _dom :object
Contains all useful DOM objects
Type:
- object
- Inherited From:
- Source:
(private) _fftSize :number
FFT size used to analyse audio stream. Must be a power of 2
Type:
- number
- Inherited From:
- Source:
(private) _inputNode :object
The source node to chain from ; it will ignore the output of HTML audio player
Type:
- object
- Inherited From:
- Source:
(private) _isPlaying :boolean
The playing state of the player
Type:
- boolean
- Overrides:
- Source:
(private) _nodes :object
Audio nodes from web audio API to manipulate data with
Type:
- object
- Inherited From:
- Source:
(private) _parentDimension :object
Save container dimension to restore when closing fullscreen
Type:
- object
- Inherited From:
- Source:
(private) _player :object
The audio source (HTML audio player)
Type:
- object
- Inherited From:
- Source:
(private) _renderTo :object
Target div to render module in
Type:
- object
- Inherited From:
- Source:
(private) _resizeObserver :object
Resize observable to watch for any resize change
Type:
- object
- Inherited From:
- Source:
(private) _type :string
The component type. See supported componenets in AudioVisualizer factory
Type:
- string
- Inherited From:
- Source:
Methods
(private, static) _addEvents()
Add component events (resize, play, pause, dbclick).
- Since:
- 2020
- Source:
(private, static) _dblClick()
On double click event callback.
- Since:
- 2020
- Source:
(private, static) _drawBeatBar(beatCount, canvas, ctx, j)
Draw a beat bar with its triangle with color that depends on main beat or sub beat.
Parameters:
Name | Type | Description |
---|---|---|
beatCount |
object | The beat number from first |
canvas |
object | The canvas to draw in |
ctx |
object | The associated context |
j |
number | The y value |
- Since:
- 2020
- Source:
(private, static) _drawTimeline(time)
Draw timeline with a given progress.
Parameters:
Name | Type | Description |
---|---|---|
time |
number | Track current time |
- Since:
- 2020
- Source:
(private, static) _fillAttributes(options)
Internal method to fill internal properties from options object sent to constructor.
Parameters:
Name | Type | Description | |||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
options |
object | The frequency circle options Properties
|
- Since:
- 2020
- Source:
(private, static) _fillData()
Generate merged data from audio buffer.
- Since:
- 2020
- Source:
(private, static) _genScaledMonoData(buffer) → {Array.<number>}
Merged L/R Sub sample channel data to compute average value, depending on bar count.
Parameters:
Name | Type | Description |
---|---|---|
buffer |
object | Audio buffer |
- Since:
- 2020
- Source:
Returns:
Array of height per sub samples
- Type
- Array.<number>
(private, static) _getPlayerSourceFile()
Fetch audio file using xmlHTTP request.
- Since:
- 2020
- Source:
(private, static) _mouseDown(event)
Mouse down callback.
Parameters:
Name | Type | Description |
---|---|---|
event |
object | The mouse down event |
- Since:
- 2020
- Source:
(private, static) _mouseDown(event)
Mouse move callback.
Parameters:
Name | Type | Description |
---|---|---|
event |
object | The mouse move event |
- Since:
- 2020
- Source:
(private, static) _mouseUp()
Mouse up callback.
- Since:
- 2020
- Source:
(private, static) _onProgress()
On progress callback.
- Since:
- 2020
- Source:
(private, static) _onResize()
On resize event callback.
- Since:
- 2020
- Source:
(private, static) _processAudioBin()
Real time method called by WebAudioAPI to process PCM data. Here we make a 8 bit frequency and time analysis.
- Since:
- 2020
- Source:
(private, static) _processAudioFile(response)
Perform an offline analysis on whole track.
Parameters:
Name | Type | Description |
---|---|---|
response |
object | HTTP response for audio track to extract buffer from |
- Since:
- 2020
- Source:
(private, static) _removeEvents()
Remove component events (resize, play, pause, dbclick).
- Since:
- 2020
- Source:
(private, static) _trackLoaded()
Player callback on track loaded.
- Since:
- 2020
- Source:
(static) getClosestBeat()
- Since:
- 2020
- Source:
(static) setHotCuePoint() → {object}
Define a HotCue point. It will be attached to the nearest bar. It will only be attached if no hotcue is registered on the targeted bar.
- Since:
- 2020
- Source:
Returns:
The hotcue object with its information
- Type
- object
(static) updateBeatInfo(options)
Update the beat values. To be calle don change track
Parameters:
Name | Type | Description | ||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
options |
object | Track beat options Properties
|
- Since:
- 2020
- Source: