Apply effects to a live audio feed in JS

stream.html

<audio crossorigin="anonymous" id="audio_source" controls preload="none" style="width:16em;padding:0;">
        <source src="http://www.example.com:8000/sample?type=http&amp;nocache=4" type='audio/mpeg'>
</audio>

<script>
const AudioContext = window.AudioContext || window.webkitAudioContext;
const audio = document.querySelector( "audio" );

var convolverBuffer;
var convolverNode;
var panNode;
var gainNode;
var biquadFilter;

fetch( "/scala-milan.wav" ).then( async function ( data ) {
	convolverBuffer = await data.arrayBuffer( );
	console.log( "Loaded impulse response waveform." );
} );

audio.addEventListener( "play", function ( ) {
	var context = new AudioContext( );
	var sourceNode = context.createMediaElementSource( audio );

	convolverNode = context.createConvolver( );
	filterNode = context.createBiquadFilter( );
	wetGainNode = context.createGain( );
	dryGainNode = context.createGain( );
	panNode = context.createStereoPanner( );

	sourceNode.connect( dryGainNode );
	sourceNode.connect( convolverNode );
	convolverNode.connect( wetGainNode );
	wetGainNode.connect( filterNode );
	dryGainNode.connect( filterNode );
	filterNode.connect( panNode );
	panNode.connect( context.destination );

	context.decodeAudioData( convolverBuffer, function ( buffer ) {
		convolverNode.buffer = buffer
	} );

	filterNode.type.value = "lowpass";
	filterNode.frequency.value = 20000;  // full range to start
	filterNode.Q.value = 1.0;

	wetGainNode.gain.value = 0.0;
	dryGainNode.gain.value = 1.0;
} );
</script>

<button onclick="panNode.pan.value = -1.0;">Left</button>
<button onclick="panNode.pan.value = 0.0;">Middle</button>
<button onclick="panNode.pan.value = 1.0;">Right</button>

<button onclick="audio.volume = 0.0;">Mute</button>
<button onclick="audio.volume = 1.0;">Unmute</button>

<button onclick="filterNode.frequency.value = 120;">Filter</button>
<button onclick="filterNode.frequency.value = 20000;">Unfilter</button>

<button onclick="wetGainNode.gain.value = 0.0; dryGainNode.gain.value = 1.0;">Dry</button>
<button onclick="wetGainNode.gain.value = 0.5; dryGainNode.gain.value = 0.5;">Mix</button>
<button onclick="wetGainNode.gain.value = 1.0; dryGainNode.gain.value = 0.0;">Wet</button>