mic example

This commit is contained in:
Yotam Mann 2014-03-15 01:02:33 -04:00
parent c48f3d392a
commit 9e4075b90e
12 changed files with 167 additions and 53 deletions

View file

@ -1,6 +1,6 @@
<html> <html>
<head> <head>
<title>Ping Pong Delay</title> <title>Envelope</title>
<link rel="stylesheet" type="text/css" href="../style/GUI.css"> <link rel="stylesheet" type="text/css" href="../style/GUI.css">
@ -44,16 +44,16 @@
</style> </style>
<div id='Trigger'></div> <div id='Trigger'></div>
<script type="text/javascript"> <script type="text/javascript">
var env = new AudioUnit.Envelope(.05, .01, .1, .4); var env = new AudioUnit.Envelope(.05, .01, .7, .4);
var noise = new AudioUnit.Noise(); var noise = new AudioUnit.Noise();
noise.connect(env); noise.connect(env);
env.toMaster(); env.toMaster();
$("#Trigger").bind("mousedown touchstart", function(e){ $("#Trigger").bind("mousedown", function(e){
env.triggerAttack(); env.triggerAttack();
}); });
$("#Trigger").bind("mouseup touchend", function(e){ $("#Trigger").bind("mouseup", function(e){
env.triggerRelease(); env.triggerRelease();
}); });
</script> </script>

View file

@ -11,8 +11,8 @@
</head> </head>
<body> <body>
<script type="text/javascript"> <script type="text/javascript">
var lfo = new AudioUnit.LFO(undefined, 1, 0, 1);
var noise = new AudioUnit.Noise("brown"); var noise = new AudioUnit.Noise("brown");
var lfo = new AudioUnit.LFO(1);
noise.connect(lfo); noise.connect(lfo);
lfo.toMaster(); lfo.toMaster();

101
examples/microphone.html Normal file
View file

@ -0,0 +1,101 @@
<html>
<head>
<title>Mic to Delay</title>
<link rel="stylesheet" type="text/css" href="../style/GUI.css">
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="../src/core/AudioUnit.js"></script>
<script type="text/javascript" src="../src/components/Meter.js"></script>
<script type="text/javascript" src="../src/components/Envelope.js"></script>
<script type="text/javascript" src="../src/components/Noise.js"></script>
<script type="text/javascript" src="../src/components/Microphone.js"></script>
<script type="text/javascript" src="../src/effects/Effect.js"></script>
<script type="text/javascript" src="../src/effects/FeedbackEffect.js"></script>
<script type="text/javascript" src="../src/effects/FeedbackDelay.js"></script>
<script type="text/javascript" src="../src/GUI/GUI.js"></script>
<script type="text/javascript" src="../src/GUI/GUI.Bar.js"></script>
<script type="text/javascript" src="../src/GUI/GUI.Meter.js"></script>
<script type="text/javascript" src="../src/GUI/GUI.Fader.js"></script>
<script type="text/javascript" src="../src/GUI/GUI.ParamFader.js"></script>
<script type="text/javascript" src="../src/GUI/GUI.GainFader.js"></script>
</head>
<body>
<style type="text/css">
#meter {
width: auto;
text-align: center;
float: right;
position: absolute;
bottom: 10px;
right: 10px;
}
#fader {
position: absolute;
bottom: 10px;
right: 100px;
width: auto;
}
#MasterOut {
width: 160px;
height: 200px;
position: absolute;
bottom: 10px;
right: 0px;
}
#Trigger {
margin-left: -50px;
margin-top: -50px;
width: 100px;
height: 100px;
position: absolute;
top: 50%;
left: 50%;
background-color: blue;
}
#Trigger:after {
font-family: monospace;
position: absolute;
width: 100%;
content: "start mic";
color: white;
text-align: center;
line-height: 100px;
}
#Trigger:active {
background-color: white;
color: black;
}
</style>
<div id='Trigger'></div>
<div id='MasterOut'></div>
<script type="text/javascript">
var meter = new AudioUnit.Meter(2);
var mic = new AudioUnit.Microphone();
var env = new AudioUnit.Envelope(.05, .01, 0, 0);
var feedbackDelay = new AudioUnit.FeedbackDelay(.25);
var fader = new AudioUnit.GUI.GainFader($("#MasterOut"), AudioUnit.Master.output, "mstr");
var meterGui = new AudioUnit.GUI.Meter($("#MasterOut"), meter, "master", 20);
mic.connect(feedbackDelay);
feedbackDelay.setWet(1);
feedbackDelay.setFeedback(.5);
feedbackDelay.toMaster();
//the master output meter
AudioUnit.Master.connect(meter);
$("#Trigger").bind("mousedown touchstart", function(e){
mic.start();
$("#Trigger").remove();
});
</script>
</body>
</html>

View file

@ -11,6 +11,7 @@
<script type="text/javascript" src="../src/components/Noise.js"></script> <script type="text/javascript" src="../src/components/Noise.js"></script>
<script type="text/javascript" src="../src/components/StereoSplit.js"></script> <script type="text/javascript" src="../src/components/StereoSplit.js"></script>
<script type="text/javascript" src="../src/effects/Effect.js"></script> <script type="text/javascript" src="../src/effects/Effect.js"></script>
<script type="text/javascript" src="../src/effects/FeedbackEffect.js"></script>
<script type="text/javascript" src="../src/effects/FeedbackDelay.js"></script> <script type="text/javascript" src="../src/effects/FeedbackDelay.js"></script>
<script type="text/javascript" src="../src/effects/PingPongDelay.js"></script> <script type="text/javascript" src="../src/effects/PingPongDelay.js"></script>
<script type="text/javascript" src="../src/GUI/GUI.js"></script> <script type="text/javascript" src="../src/GUI/GUI.js"></script>

View file

@ -9,15 +9,20 @@ AudioUnit.Envelope = function(attack, decay, sustain, release, audioParam, minOu
//extend Unit //extend Unit
AudioUnit.call(this); AudioUnit.call(this);
//pass audio through
this.input.connect(this.output); this.input.connect(this.output);
//set the parameters
this.param = this.defaultArg(audioParam, this.input.gain); this.param = this.defaultArg(audioParam, this.input.gain);
this.attack = this.defaultArg(attack, .01); this.attack = this.defaultArg(attack, .01);
this.decay = this.defaultArg(decay, .1); this.decay = this.defaultArg(decay, .1);
this.release = this.defaultArg(release, 1); this.release = this.defaultArg(release, 1);
this.sustain = this.defaultArg(sustain, .5); // this.sustain = this.defaultArg(this.gainToPowScale(sustain), .1);
this.setSustain(this.defaultArg(sustain, .1));
this.min = this.defaultArg(minOutput, 0); this.min = this.defaultArg(minOutput, 0);
this.max = this.defaultArg(maxOutput, 1); this.max = this.defaultArg(maxOutput, 1);
//set the initial
//set the initial value
this.param.value = this.min; this.param.value = this.min;
} }
@ -37,7 +42,7 @@ AudioUnit.Envelope.prototype.triggerAttack = function(time){
this.param.linearRampToValueAtTime(sustainVal, time + this.decay + this.attack); this.param.linearRampToValueAtTime(sustainVal, time + this.decay + this.attack);
} }
//triggers the release portiion of the envelope //triggers the release of the envelope
AudioUnit.Envelope.prototype.triggerRelease = function(time){ AudioUnit.Envelope.prototype.triggerRelease = function(time){
var startVal = this.param.value; var startVal = this.param.value;
if (time){ if (time){
@ -54,32 +59,32 @@ AudioUnit.Envelope.prototype.triggerRelease = function(time){
/////////////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////////
//@param {number} attack (seconds) //@param {number} attack (seconds)
AudioUnit.Envelope.setAttack = function(attack){ AudioUnit.Envelope.prototype.setAttack = function(attack){
this.attack = attack; this.attack = attack;
} }
//@param {number} decay (seconds) //@param {number} decay (seconds)
AudioUnit.Envelope.setDecay = function(decay){ AudioUnit.Envelope.prototype.setDecay = function(decay){
this.decay = decay; this.decay = decay;
} }
//@param {number} release (seconds) //@param {number} release (seconds)
AudioUnit.Envelope.setRelease = function(release){ AudioUnit.Envelope.prototype.setRelease = function(release){
this.release = release; this.release = release;
} }
//@param {number} sustain (gain) //@param {number} sustain as a percentage (0-1);
AudioUnit.Envelope.setSustain = function(sustain){ AudioUnit.Envelope.prototype.setSustain = function(sustain){
this.sustain = sustain; this.sustain = this.gainToPowScale(sustain);
} }
//@param {number} min //@param {number} min
AudioUnit.Envelope.setMin = function(min){ AudioUnit.Envelope.prototype.setMin = function(min){
this.min = min; this.min = min;
} }
//@param {number} max //@param {number} max
AudioUnit.Envelope.setMax = function(max){ AudioUnit.Envelope.prototype.setMax = function(max){
this.max = max; this.max = max;
} }

View file

@ -4,7 +4,7 @@
// //
/////////////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////////
AudioUnit.LFO = function(param, rate, outputMin, outputMax){ AudioUnit.LFO = function(rate, outputMin, outputMax, param){
//extends Unit //extends Unit
AudioUnit.call(this); AudioUnit.call(this);
//pass audio through //pass audio through

View file

@ -18,7 +18,7 @@ AudioUnit.extend(AudioUnit.Player, AudioUnit);
//makes an xhr for the buffer at the url //makes an xhr for the buffer at the url
//invokes the callback at the end //invokes the callback at the end
//@param {function(AudioUnit.Player)=} callback //@param {function(AudioUnit.Player)} callback
AudioUnit.Player.prototype.load = function(callback){ AudioUnit.Player.prototype.load = function(callback){
var request = new XMLHttpRequest(); var request = new XMLHttpRequest();
request.open('GET', this.url, true); request.open('GET', this.url, true);
@ -26,13 +26,14 @@ AudioUnit.Player.prototype.load = function(callback){
// decode asynchronously // decode asynchronously
var self = this; var self = this;
request.onload = function() { request.onload = function() {
self.context.decodeAudioData(request.response, function(b) { self.context.decodeAudioData(request.response, function(buff) {
self.buffer = b; self.buffer = buff;
if (callback){ if (callback){
callback(self); callback(self);
} }
}); });
} }
//send the request
request.send(); request.send();
} }

View file

@ -1,11 +0,0 @@
///////////////////////////////////////////////////////////////////////////////
//
// PING PONG DELAY
//
///////////////////////////////////////////////////////////////////////////////
//@param {number=} delayTime
AudioUnit.StereoMeter = function(){
AudioUnit.StereoSplit.call(this);
}

View file

@ -47,16 +47,16 @@
/////////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////
var AudioUnit = function(){ var AudioUnit = function(){
this.context = audioContext;
this.input = audioContext.createGain(); this.input = audioContext.createGain();
this.output = audioContext.createGain(); this.output = audioContext.createGain();
} }
/////////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////
// STATIC VARS // CLASS VARS
/////////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////
AudioUnit.prototype.fadeTime = .001; //1ms AudioUnit.prototype.context = audioContext;
AudioUnit.prototype.fadeTime = .005; //5ms
AudioUnit.prototype.bufferSize = 1024; //default buffer size AudioUnit.prototype.bufferSize = 1024; //default buffer size
/////////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////
@ -221,15 +221,14 @@
// STATIC METHODS // STATIC METHODS
/////////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////
//A extends B
//based on closure library 'inherit' function //based on closure library 'inherit' function
AudioUnit.extend = function(childCtor, parentCtor){ AudioUnit.extend = function(child, parent){
/** @constructor */ /** @constructor */
function tempCtor() {}; function tempConstructor() {};
tempCtor.prototype = parentCtor.prototype; tempConstructor.prototype = parent.prototype;
childCtor.prototype = new tempCtor(); child.prototype = new tempConstructor();
/** @override */ /** @override */
childCtor.prototype.constructor = childCtor; child.prototype.constructor = child;
} }
/////////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////////
@ -243,7 +242,7 @@
//put a hard limiter on the output so we don't blow any eardrums //put a hard limiter on the output so we don't blow any eardrums
this.limiter = this.context.createDynamicsCompressor(); this.limiter = this.context.createDynamicsCompressor();
this.limiter.threshold.value = 0; this.limiter.threshold.value = 0;
this.limiter.ratio.value = 100; this.limiter.ratio.value = 20;
this.chain(this.input, this.limiter, this.output, this.context.destination); this.chain(this.input, this.limiter, this.output, this.context.destination);
} }
AudioUnit.extend(Master, AudioUnit); AudioUnit.extend(Master, AudioUnit);

View file

@ -14,17 +14,13 @@ AudioUnit.Effect = function(){
this.dry = this.context.createGain(); this.dry = this.context.createGain();
this.effectSend = this.context.createGain(); this.effectSend = this.context.createGain();
this.effectReturn = this.context.createGain(); this.effectReturn = this.context.createGain();
this.feedback = this.context.createGain();
this.feedback.gain.value = 0;
//connections //connections
this.input.connect(this.dry); this.input.connect(this.dry);
this.dry.connect(this.output); this.dry.connect(this.output);
this.input.connect(this.effectSend); this.input.connect(this.effectSend);
this.effectReturn.connect(this.output); this.effectReturn.connect(this.output);
//feedback loop
this.chain(this.effectReturn, this.feedback, this.effectSend);
//some initial values //some initial values
this.setDry(.5); this.setDry(.5);
} }
@ -50,10 +46,6 @@ AudioUnit.Effect.prototype.bypass = function(){
this.setDry(1); this.setDry(1);
} }
AudioUnit.Effect.prototype.setFeedback = function(fback){
this.rampToValue(this.feedback.gain, fback);
}
AudioUnit.Effect.prototype.connectEffect = function(effect){ AudioUnit.Effect.prototype.connectEffect = function(effect){
this.chain(this.effectSend, effect, this.effectReturn); this.chain(this.effectSend, effect, this.effectReturn);
} }

View file

@ -6,7 +6,7 @@
//@param {number} delayTime //@param {number} delayTime
AudioUnit.FeedbackDelay = function(delayTime){ AudioUnit.FeedbackDelay = function(delayTime){
AudioUnit.Effect.call(this); AudioUnit.FeedbackEffect.call(this);
this.delay = this.context.createDelay(4); this.delay = this.context.createDelay(4);
this.delay.delayTime.value = this.defaultArg(delayTime, .25); this.delay.delayTime.value = this.defaultArg(delayTime, .25);
@ -15,7 +15,7 @@ AudioUnit.FeedbackDelay = function(delayTime){
this.connectEffect(this.delay); this.connectEffect(this.delay);
} }
AudioUnit.extend(AudioUnit.FeedbackDelay, AudioUnit.Effect); AudioUnit.extend(AudioUnit.FeedbackDelay, AudioUnit.FeedbackEffect);
AudioUnit.FeedbackDelay.prototype.setDelayTime = function(delayTime){ AudioUnit.FeedbackDelay.prototype.setDelayTime = function(delayTime){
this.rampToValue(this.delay.delayTime, delayTime); this.rampToValue(this.delay.delayTime, delayTime);

View file

@ -0,0 +1,26 @@
///////////////////////////////////////////////////////////////////////////////
//
// FEEDBACK EFFECTS
//
// an effect with feedback
///////////////////////////////////////////////////////////////////////////////
AudioUnit.FeedbackEffect = function(){
//extends Unit
AudioUnit.Effect.call(this);
this.feedback = this.context.createGain();
//feedback loop
this.chain(this.effectReturn, this.feedback, this.effectSend);
//some initial values
this.setDry(.5);
}
AudioUnit.extend(AudioUnit.FeedbackEffect, AudioUnit.Effect);
AudioUnit.Effect.prototype.setFeedback = function(fback){
this.rampToValue(this.feedback.gain, fback);
}