Add Support for Loading Audio Separate From Video

This is probably a very niche request but I need to use videojs-wavesurfer to display wavesurfer where the contents of the waveform are pulled from a different file/URL than is used for the video.

FWIW, I’ll briefly explain why I need this. I want to be able to extract audio from a video file of two people speaking and process it to separate it into two channels: Person 1 on the left, and Person 2 on the right. I already have this part working.

I then want to be able to use videojs-wavesurfer to display the original video while showing wavesurfer with the results of the splitChannel audio file. It doesn’t matter which version of the audio file is actually played back. I assume it would be the audio from the original non-split video, which is fine. But I need wavesurfer itself to show the splitChannel file.

I know I can do this by editing the original video to splice in the new audio, but I’m hoping to be able to avoid that approach.

I tried to use player.wavesurfer().surfer.load(url) after video.js loaded to swap in a new audio file. This does work but it seems to break the playback link between the video.js and wavesurfer so they are no longer in sync.

I looked at the code and it does seem like it might be a fairly minor change to support this, if you’re willing to offer a “url” config option to support this.

It might look something like this where you could check for a “url” property on the wavesurfer config object and use that to override the “src” being used with the video:

Note that I think this code should be above the switch case because it might apply to both backend types. In my case, I’m actually using MediaElement because of this bug in wavesurfer.

That being said, I’m happy if you can help provide a resolution to this for either backend type. So if there is some workaround that will work with the current code but not with MediaElement, that would be fine.

Any help or advice you can give would be appreciated. I’m happy to help with testing or a pull request if you can confirm there is no current workaround and that my suggested change would probably work. (Although to test it I’d need to figure out how to build this project)

Thanks, Dan

[dan24678]

I was using player.load() and not player.src() so let me try that and see if it works. If it does, then I should be all set. I am using 3.x.

[dan24678]

Using player.src() to swap in a different audio file results in the Video playback window resetting its duration counter to 00:00/00:00 and no longer playing the video when my wavesurfer play button is clicked, so this isn’t a working solution for me.