add volume "level" indicator to demo
jywarren opened this issue · comments
to help in debugging -- it's good to see that, for example, something blinks when it hears anything. Maybe we can just include an existing module for this, and/or blink just one dot called "Volume" or "Sound detected"?
Here's one that's really helpful:
Could also link to https://test.webrtc.org/
That's an excellent idea, and maybe I can incorporate parts of it into a first-timer-only issue?
sure! Good idea, though maybe a help-wanted issue as a FTO issue should
be something you can spell out in a series of concrete steps. But if you
think it'll be that easy, go for it!
If you could point at a line in the decoder where there's a way to listen or query for activity -- it could just be a place to listen for a 1 or 0, instead of actually listening for volume -- that'd be really helpful -- could this line where state is changed to DATA work?
https://github.com/publiclab/webjack/blob/master/src/decoder.js#L178
Hm do we really want this stuff inside the code?
Maybe we can use this example, but only in the code of the demo site:
https://webaudiodemos.appspot.com/volume-meter/index.html
Agreed, this should be in the demo code, and can be pretty much separate from core WebJack.
I like https://webaudiodemos.appspot.com/volume-meter/ !!!
The code for it is here -- quite simple and we can probably strip some out for simplicity:
Update! I made a https://p5js.org sketch of an equalizer -- you can also hover your mouse to see the frequency:
https://editor.p5js.org/jywarren/sketches/TsICFM5ZO
It embeds, though maybe we'd need to run it from within the demo for cross- domain security reasons?
<iframe src="https://editor.p5js.org/jywarren/embed/TsICFM5ZO" style="border:0;width:100%;height:400px;"></iframe>Open in a new window here: https://editor.p5js.org/jywarren/full/TsICFM5ZO
I tuned it with this frequency generator: https://marcgg.com/blog/2016/11/01/javascript-audio/
I think i got this working!
I'll leave this open, because we could later expand the frequency range to include browser frequencies of 20,000Hz:
https://github.com/publiclab/webjack#profiles
I can't see how we can set the range the FFT p5JS plugin monitors using options here:
https://p5js.org/reference/#/p5.FFT
https://p5js.org/reference/#/p5.FFT/analyze
But perhaps we could propose an upstream change to set the range of the FFT -- building on this issue:
Done!!!