Problem
Currently, when the player fails to fetch or decode an audio file (e.g. due to CORS restrictions, 404s, network errors/etc.), it silently falls back to rendering random placeholder peaks.
While this allows playback to continue, the parent application (such as WordPress Gutenberg: WordPress/gutenberg#80534) has no way of programmatically knowing that a placeholder waveform is being shown.
Proposed Solution
Expose the failure state to the DOM by adding/removing a class on the player container (e.g. .waveform-is-placeholder).
Toggling a state class on the player container when analysis fails or resets would allow parent applications to cleanly hide/re-style the fake random peaks via CSS (e.g., fallback to a flat seekbar).
- Add
waveform-is-placeholder class to the container upon analysis failure in load().
- Remove the
waveform-is-placeholder class at the beginning of load() to reset the state for reused player instances.
Proposal PR: #20
Problem
Currently, when the player fails to fetch or decode an audio file (e.g. due to CORS restrictions, 404s, network errors/etc.), it silently falls back to rendering random placeholder peaks.
While this allows playback to continue, the parent application (such as WordPress Gutenberg: WordPress/gutenberg#80534) has no way of programmatically knowing that a placeholder waveform is being shown.
Proposed Solution
Expose the failure state to the DOM by adding/removing a class on the player container (e.g.
.waveform-is-placeholder).Toggling a state class on the player container when analysis fails or resets would allow parent applications to cleanly hide/re-style the fake random peaks via CSS (e.g., fallback to a flat seekbar).
waveform-is-placeholderclass to the container upon analysis failure inload().waveform-is-placeholderclass at the beginning ofload()to reset the state for reused player instances.Proposal PR: #20