Audio Analyser Html5

The idea

Building a real time audio analysis and using that to generate "milkymist" like visualisations.

POC

Retrieved from http://jsbin.com/acolet/1/

WORKS WITH CHROM(E|IUM) ONLY

http://shortgreyz.org/test.html

Vizualisation

References https://mrdoob.github.io/three.js/examples/canvas_particles_sprites.html

http://iacopoapps.appspot.com/hopalongwebgl/

http://davidwalsh.name/canvas-demos

Winamp style

https://github.com/gattis/milkshake

https://butterchurn.neocities.org/demo.html

https://github.com/captbaritone/winamp2-js

https://github.com/azeem/webvs http://azeemarshad.in/webvs/

https://github.com/cggaurav/juicydrop http://cggaurav.github.io/juicydrop/

References

Frequencies

http://en.wikipedia.org/wiki/Audio_frequency

html5 audio

https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API

https://developer.mozilla.org/fr/docs/Web/API/AudioContext.createAnalyser

scripts / POCs

http://mdn.github.io/voice-change-o-matic/ (live audio, works with Firefox)

http://stackoverflow.com/questions/14958175/html5-audio-api-audio-resources-unavailable-for-audiocontext-construction

(old) http://0xfe.blogspot.fr/2011/08/web-audio-spectrum-analyzer.html

cheatsheets

http://cheatsheetworld.com/programming/html5-canvas-cheat-sheet/