Soundtouch + Wavesurfer, issue applying filters

[ahsanabbasi404]

Hello,

I'm having trouble applying SoundTouch.js to WaveSurfer. Since setFilter is no longer available, I can't connect SoundTouch.js with WaveSurfer's audio element. I tried using Audio Worklet but couldn't sync them properly.

Could you guide me on how to connect SoundTouch.js with WaveSurfer? I’ve seen older examples, but they reference outdated versions. Here's the approach I tried:

st = new soundtouch.SoundTouch(sampleRate); filter = new soundtouch.SimpleFilter(new soundtouch.WebAudioBufferSource(source), st); node = soundtouch.getWebAudioNode(context, filter); node.connect(context.destination); // now how to connect with wavesurfer?
(I am trying to change pitchSemitones and tempo using soundtouchjs)

Any help would be much appreciated!

[katspaugh]

Here’s an example of how to put wavesurfer audio into a Web Audio context: https://wavesurfer.xyz/examples/?webaudio.js

It should be similar for sound touch.

[ahsanabbasi404]

Well, I tried that but still getting some errors. Here is one of the attempt I tried:
`const handleFileChange = async (e) => {
const selectedFile = e.target.files[0];
setFile(selectedFile);

const arrayBuffer = await selectedFile.arrayBuffer();
const audioBuffer = await audioContext.current.decodeAudioData(arrayBuffer);

wavesurfer.current.loadBlob(selectedFile);

// Create a WebAudioBufferSource with the decoded audio
const source = new WebAudioBufferSource(audioBuffer);
soundTouch.current = new SoundTouch(audioContext.current.sampleRate);

// Apply pitch and tempo adjustments to SoundTouch
soundTouch.current.tempo = speed;
soundTouch.current.pitch = Math.pow(2, pitch / 12); // Convert semitone pitch shift

const filter = new SimpleFilter(source, soundTouch.current);

const mediaElement = wavesurfer.current.getMediaElement();
const mediaNode = audioContext.current.createMediaElementSource(mediaElement);
mediaNode.connect(filter.input); // mediaNode -> filter -> destination, getting error here, even by .connect(filter) same

};`

Uncaught (in promise) TypeError: Failed to execute 'connect' on 'AudioNode': Overload resolution failed.
at handleFileChange (App.js:77:1)