Set gain using setTargetAtTime

This commit is contained in:
Eric Rosenbaum 2017-12-20 12:07:53 -05:00
parent 44879d5965
commit 1c8a545a8a
2 changed files with 26 additions and 8 deletions

View file

@ -5,11 +5,12 @@
*/ */
class PanEffect { class PanEffect {
/** /**
* @param {AudioContext} audioContext - a webAudio context * @param {AudioEngine} audioEngine - the audio engine.
* @constructor * @constructor
*/ */
constructor (audioContext) { constructor (audioEngine) {
this.audioContext = audioContext; this.audioEngine = audioEngine;
this.audioContext = this.audioEngine.audioContext;
this.value = 0; this.value = 0;
this.input = this.audioContext.createGain(); this.input = this.audioContext.createGain();
@ -37,8 +38,11 @@ class PanEffect {
// Use trig functions for equal-loudness panning // Use trig functions for equal-loudness panning
// See e.g. https://docs.cycling74.com/max7/tutorials/13_panningchapter01 // See e.g. https://docs.cycling74.com/max7/tutorials/13_panningchapter01
this.leftGain.gain.value = Math.cos(p * Math.PI / 2); const leftVal = Math.cos(p * Math.PI / 2);
this.rightGain.gain.value = Math.sin(p * Math.PI / 2); const rightVal = Math.sin(p * Math.PI / 2);
this.leftGain.gain.setTargetAtTime(leftVal, 0, this.audioEngine.ONE_THIRD_FRAME);
this.rightGain.gain.setTargetAtTime(rightVal, 0, this.audioEngine.ONE_THIRD_FRAME);
} }
/** /**

View file

@ -28,7 +28,7 @@ class AudioPlayer {
// Create the audio effects // Create the audio effects
this.pitchEffect = new PitchEffect(); this.pitchEffect = new PitchEffect();
this.panEffect = new PanEffect(this.audioEngine.audioContext); this.panEffect = new PanEffect(this.audioEngine);
// Chain the audio effects together // Chain the audio effects together
// effectsNode -> panEffect -> audioEngine.input // effectsNode -> panEffect -> audioEngine.input
@ -121,7 +121,8 @@ class AudioPlayer {
clearEffects () { clearEffects () {
this.panEffect.set(0); this.panEffect.set(0);
this.pitchEffect.set(0, this.activeSoundPlayers); this.pitchEffect.set(0, this.activeSoundPlayers);
this.effectsNode.gain.value = 1; if (this.audioEngine === null) return;
this.effectsNode.gain.setTargetAtTime(1.0, 0, this.audioEngine.ONE_THIRD_FRAME);
} }
/** /**
@ -129,7 +130,8 @@ class AudioPlayer {
* @param {number} value - the volume in range 0-100 * @param {number} value - the volume in range 0-100
*/ */
setVolume (value) { setVolume (value) {
this.effectsNode.gain.value = value / 100; if (this.audioEngine === null) return;
this.effectsNode.gain.setTargetAtTime(value / 100, 0, this.audioEngine.ONE_THIRD_FRAME);
} }
} }
@ -164,6 +166,18 @@ class AudioEngine {
}; };
} }
/**
* The duration in seconds of one third of one frame, at 30 frames per second.
* This is useful for setting web audio time constants. For example, in order for
* a gain to reach 95% of its target value in one frame, use this time constant.
* See:
* https://developer.mozilla.org/en-US/docs/Web/API/AudioParam/setTargetAtTime
* @const {number}
*/
get ONE_THIRD_FRAME () {
return (1 / 30) / 3;
}
/** /**
* Decode a sound, decompressing it into audio samples. * Decode a sound, decompressing it into audio samples.
* Store a reference to it the sound in the audioBuffers dictionary, indexed by soundId * Store a reference to it the sound in the audioBuffers dictionary, indexed by soundId