A simple sinewave with gain control. [You might need to clean the cache when you are testing your worklet processor code]
class CustomProcessor extends AudioWorkletProcessor { static get parameterDescriptors() { return [{ name: 'gain', defaultValue: 0.1 }]; } constructor() { super(); this.sampleRate = 44100; this.port.onmessage = (event) => { console.log(event.data); }; } process(inputs, outputs, parameters) { const speakers = outputs[0]; for (let i = 0; i < speakers[0].length; i++) { const func = Math.sin(i) + 0.4; const gain = parameters.gain[i]; speakers[0][i] = func * gain; speakers[1][i] = func * gain; } return true; } };
let audioContext = new AudioContext(); let customNode; let customProcessorName = 'custom-processor'; let customNodeName = 'custom-node'; let workletUrl = 'custom-processor.js'; class CustomAudioNode extends AudioWorkletNode { constructor(audioContext, processorName) { super(audioContext, processorName, { numberOfInputs: 0, numberOfOutputs: 1, outputChannelCount: [2] }); } } document.addEventListener("DOMContentLoaded", () => { setButtonEventHandlers(); }); function setButtonEventHandlers() { const playButton = document.getElementById('playButton'); playButton.addEventListener("click", () => playAudio()); const stopButton = document.getElementById('stopButton'); stopButton.addEventListener("click", () => stopAudio()); const plusButton = document.getElementById('plusButton'); plusButton.addEventListener("click", () => increaseVolume()); const minusButton = document.getElementById('minusButton'); minusButton.addEventListener("click", () => decreaseVolume()); } function playAudio() { try { // window.CustomAudioNode = audioContext.audioWorklet.addModule(workletUrl).then(() => { window.CustomAudioNode = audioContext.audioWorklet.addModule(workletUrl).then(() => { stopAudio(); customNode = new CustomAudioNode(audioContext, customProcessorName); customNode.port.onmessage = (event) => { // Handling data from the processor. console.log("from processor: " + event.data); }; customNode.connect(audioContext.destination); }); } catch (err) { console.log("AudioWorklet not supported in this browser: ", err.message); } } function stopAudio() { if (customNode !== undefined) { customNode.disconnect(audioContext.destination); customNode = undefined; } } function increaseVolume() { if (customNode !== undefined) { const gainParam = customNode.parameters.get('gain'); gainParam.value += 0.1; } } function decreaseVolume() { if (customNode !== undefined) { const gainParam = customNode.parameters.get('gain'); gainParam.value -= 0.1; } }