On Friday I gave a talk on the new Audio API in Firefox 4 at FSOSS. I was showing my youngest daughter some of the demos I presented today, and she said, "Dad, that song is so beautiful, draw some more of it." I really like this song too (Life's Things is the track), and since it's CC licensed, I made an ogg version and put 3 basic visualizations of it online:
- Signal using Processing.js (original code by moi, love the wave form at 0:22-0:27)
- Spectrum using dsp.js (original code by @corban)
- Simple canvas based spectrum (original code by @thomassturm, I love how simple but powerful this is)
Here's what I am asking, dear interwebs. Grab a Firefox 4 Beta. Take this song. Take the code above, View Source. Make something using these as a base. Make something new. Throw a link in the comments.
The web that's coming when Firefox 4 launches is a web where music is a first class, scriptable citizen. You need to know how to code it, visualize it, generate it, mutate it. Now's the time to start. If you know JS or Processing, canvas, html, css, that's all you need. Nothing I did above is more than 50-100 lines of script.
I've got the first 3 up, we need 47 more. Go.
UPDATE: awesome, some people are already doing this! One common question coming in, "Why am I getting NSERRORDOMSECURITYERR?". If you're working locally, you have to flip a security pref for access to file:///. See docs here.
UPDATE 2: "What if I can't host this?" If you don't have a server to host this, just email me your code and I'll host for you.