Wavesurfer.js: ready event fires before waveform appears

Created on 2 Jun 2016  ·  14Comments  ·  Source: katspaugh/wavesurfer.js

In the docs, it says that the 'ready' event should fire when "audio is loaded, decoded and the waveform drawn.". However, for me it is firing as soon as the audio starts playing (BEFORE the waveform is drawn).

Edit-

I see this is a duplicate of #429. Could we have a separate event fired for the waveform? From what I understand, the solution in #429 won't work for me as I need the track to start playing before the waveform is loaded.

bug

Most helpful comment

I really need an Event that is fired when the waveform is drawn, too. :(

All 14 comments

Do you have a proposal for the new event name?

Nothing nice and simple like the other event names!

waveformReady / waveformready ?

this seems to work in the meantime:

wavesurfer.once('redraw', ()=>{
      debugger;
});

I really need an Event that is fired when the waveform is drawn, too. :(

Any update on this issue :) ?

You can use the loading event and wait until it has load the track 100%.

wavesurfer.on('loading', function(e){ if(e == 100){ //doSomething; } });

Its nearly the same as to wait the waveform drawn, because it will be drawn immediately after the track is loaded 100%.

The mentioned didn't work for me :/ too bad; it would really help me build my peak cache system.

I found that having an event which fires when waveform is decoded from audio loaded with media element backend is very useful to create peaks file. No other native events works as nicely, so I think it could be good to have it.
https://github.com/X-Raym/wavesurfer.js/commit/250cde1410622b68d219f23ec2a3571cf1e30e26

I can make a pull request if you are interested :)

@katspaugh Hi,
Are you ok for a pull request with the event mentionned above ?
I use it for WaveSurfer-WP-Premium, and it is especially useful for peaks file creation, as this event is only trigger if wavesurfer is loaded with MediaElement and without peaks.

@X-Raym I'm all for it, but I don't get why you named it "noPeaks". In thedecodeArrayBuffer, callback peaks are, on the opposite – present.

@katspaugh 'noPeaks' because it is trigger only if no peaks have be passed as parameter of the load function. This event is called when waveform is drawn from audio analysis, and not from other sources (like a peaks file).

But really, you can choose another name which would fit more your actual events naming conventions.

I'm OK with what was suggested here before: waveform-ready.

@katspaugh
Sounds good,
I'm on it 🐙

Published version 1.2.3 on npm with the new event. Thanks @X-Raym!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

joshsmith picture joshsmith  ·  3Comments

thijstriemstra picture thijstriemstra  ·  5Comments

diegoiglesias picture diegoiglesias  ·  3Comments

SGDAT picture SGDAT  ·  3Comments

asdfang picture asdfang  ·  4Comments