Wavesurfer.js: Need to modify waveColor and progressColor after the player has initialized.

[danielfaust]

Is it possible to change the values of waveColor and progressColor after the player object has been created?

My problem is that the website background changes dynamically where under a certain condition it is bright and under another it is dark. This bright/dark change occurs with a button press. In that button handler I need to toggle the colors of the waveform from "rgba(0,0,0,0.3)" for the bright background and "rgba(255,255,255,0.3)" for the dark one.

Any ideas on how I can archive this?

[entonbiba]

@danielfaust can you link to the site?

[danielfaust]

@entonbiba Not currently, as it's under development in the intranet and the data it contains is personal.

Basically I track a bike ride and record audio at the same time.

When Google Maps is in google.maps.MapTypeId.ROADMAP, I need a dark waveform, when it is in google.maps.MapTypeId.HYBRID mode, I need a bright one.

Since the recordings are pretty long, rebuilding the entire wavesurfer.js object isn't that great. I need to switch the colors when I change the map type.

google.maps.MapTypeId.ROADMAP

google.maps.MapTypeId.HYBRID Bad:

google.maps.MapTypeId.HYBRID Good:

[DawsonSeibold]

Would katspaugh answer to this question work? #864
wavesurfer.params.progressColor = 'red'; wavesurfer.drawBuffer();
Or would the drawBuffer cause too much to be redrawn?

[katspaugh]

Wow, that app looks cool. @danielfaust, out of curiosity, why do you record the audio while biking? A noise pollution research?

What @SmileAppDev suggests would work, I think. Redrawing the canvas is a bit expensive, but that's actually the only way.

[danielfaust]

@SmileAppDev thanks, that works, but not on the minimap. I would need to change that too. Performance-wise wavesurfer.drawBuffer(); is really good, but that may be because the non-minimap has a zoom factor of 20.

@katspaugh It's just for fun. I started with it because of the 5 ideas I had while riding the bike I only remembered about 2 of them. So I played with Tasker and Hi-Q MP3 Recorder and recorded one ride just to see if it's worth it. That then took me to create an FFT and think about the possiblilities of maybe analyzing my respiratory rate. So now I'm always recording it for the memos but also because I want to have that audio track in case I want to try the respiratory rate analysis thing. You can see the the breathing pretty good in the waveform, so possibly no FFT required there.

[thijstriemstra]

Use wavesurfer.setProgressColor(color) and wavesurfer.setWaveColor(color).