Skip to content

Instantly share code, notes, and snippets.

View notepadwebdev's full-sized avatar

Stephen Griffin notepadwebdev

20 followers · 13 following
View GitHub Profile
@notepadwebdev
notepadwebdev / onTick.js
Last active November 21, 2016 22:36
Recursive requestAnimationFrame loop
onTick() {
this.raf = requestAnimationFrame(this.onTick.bind(this));
this.analyser.getByteFrequencyData(this.dataArray);
// animations go here...
}
@notepadwebdev
notepadwebdev / getByteFrequencyData.js
Last active November 21, 2016 19:17
Call analyser node getByteFrequencyData method
this.analyser.getByteFrequencyData(this.dataArray);
@notepadwebdev
notepadwebdev / speaker-cone.html
Last active November 21, 2016 19:17
Speaker cone mark up
<div class="cone">
<div class="cone-outer"></div>
<div class="cone-mid"></div>
<div class="cone-inner"></div>
</div>
@notepadwebdev
notepadwebdev / speaker-cone-animations.js
Last active November 21, 2016 19:28
Animating speaker cone elements based on frequency bin volume data
// bin 3 : ~86 Hz
let percVol = this.dataArray[2] / 255;
TweenLite.to(this.wooferConeOuter, 0.001, {css:{scale: (1 + (percVol * 0.05)) }});
// bin 8 : ~301 Hz
percVol = this.dataArray[7] / 255;
TweenLite.to(this.wooferConeMid, 0.001, {css:{scale: (1 + (percVol * 0.1)) }});
// bin 17 : ~689 Hz
percVol = this.dataArray[16] / 255;