@fabioricali/siriwavejs/tests/basic-with-audiosources.html

The Siri wave replicated in a JS library.

<style>body { background: #000; }</style>
<script src="../siriwave.js"></script>
<div id="container" style="width: 900px; height: 300px; background: #000"></div>
<script>

	var SW = new SiriWave({
		style: 'ios',
		speed: 0.1,
		amplitude: 0,
		speedInterpolationSpeed: 0,
		container: document.getElementById('container'),
		autostart: true,
	});

	var ctx = new (window.AudioContext || window.webkitAudioContext)();
	var analyser = ctx.createAnalyser();
	analyser.connect(ctx.destination);
	analyser.fftSize = 2048;

	var bufferLength = analyser.frequencyBinCount;
	function getAverageVolume(data) {
		var values = 0;
		var length = data.length;
		for (var i = 0; i < data.length; i++) {
			values += data[i];
		}
		return values / data.length;
	}

	window.navigator.getUserMedia({ audio: true },
	function(stream) {
		var input = ctx.createMediaStreamSource(stream);
		input.connect(analyser);

		var processor = ctx.createScriptProcessor(2048, 1, 1);
		processor.connect(ctx.destination);
		
		processor.onaudioprocess = function() {
			var array =  new Uint8Array(analyser.frequencyBinCount);
			analyser.getByteFrequencyData(array);
			var average = getAverageVolume(array);
			SW.setAmplitude(average / 140);
		};
   },
	function(){}
	);


	

</script>