update demo [ci skip]

Author: mohayonao

demo/assets/sound/a11wlk01.wav

@@ -10,6 +10,7 @@
   <script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4/codemirror.min.js"></script>
   <script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/5.13.4/mode/javascript/javascript.min.js"></script>
   <script src="//cdnjs.cloudflare.com/ajax/libs/vue/1.0.21/vue.min.js"></script>
+  <script src="//mohayonao.github.io/web-audio-scheduler/build/web-audio-scheduler.min.js"></script>
   <script src="../build/web-audio-engine.js"></script>
   <style>
   .btn { width: 100px; outline: none !important }
@@ -189,7 +190,11 @@ <h1>web-audio-engine :: demo</h1>
         context = audioContext;
       }
 
-      var util = { end: vue.stop.bind(vue), fetchAudioBuffer: fetchAudioBuffer.bind(null, context) };
+      var util = {};
+
+      util.WebAudioScheduler = window.WebAudioScheduler;
+      util.fetchAudioBuffer = fetchAudioBuffer.bind(null, context);
+      util.end = vue.stop.bind(vue);
 
       (composeFn(context, util) || Promise.resolve()).then(function() {
         context.resume();
@@ -210,7 +215,7 @@ <h1>web-audio-engine :: demo</h1>
         isPlaying: false,
         engine: "web-audio-engine",
         selected: "sines",
-        list: [ "sines", "filter", "delay" ]
+        list: [ "metronome", "sines", "filter", "delay", "drum" ]
       },
       methods: {
         run: function() {

demo/assets/sound/amen.wav

@@ -62,7 +62,8 @@
   },
   "dependencies": {
     "optionator": "^0.8.1",
-    "tickable-timer": "^1.0.0"
+    "tickable-timer": "^1.0.0",
+    "web-audio-scheduler": "^1.0.1"
   },
   "license": "MIT",
   "main": "demo.js",

demo/assets/sound/hihat1.wav

@@ -3,6 +3,7 @@
 const wae = require("../..");
 const fs = require("fs");
 const tickable = require("tickable-timer");
+const WebAudioScheduler = require("web-audio-scheduler");
 const timerAPI = require("../util/timerAPI");
 const consoleAPI = require("../util/consoleAPI");
 const createContextOptions = require("../util/createContextOptions");
@@ -13,6 +14,7 @@ function runInRenderingAudioContext(func, opts) {
   const context = new AudioContext(createContextOptions(opts));
   const util = {};
 
+  util.WebAudioScheduler = WebAudioScheduler;
   util.fetchAudioBuffer = fetchAudioBuffer.bind(null, context);
   util.end = () => { opts.isEnded = true };
 

demo/assets/sound/hihat2.wav

@@ -1,6 +1,7 @@
 "use strict";
 
 const wae = require("../..");
+const WebAudioScheduler = require("web-audio-scheduler");
 const timerAPI = require("../util/timerAPI");
 const consoleAPI = require("../util/consoleAPI");
 const createContextOptions = require("../util/createContextOptions");
@@ -11,6 +12,7 @@ function runInStreamAudioContext(func, opts) {
   const context = new AudioContext(createContextOptions(opts));
   const util = {};
 
+  util.WebAudioScheduler = WebAudioScheduler;
   util.fetchAudioBuffer = fetchAudioBuffer.bind(null, context);
   util.end = () => { process.exit(0) };
 

demo/assets/sound/kick.wav

@@ -10,7 +10,7 @@ module.exports = function(context, util) {
   function synth(midi) {
     var osc = context.createOscillator();
     var amp = context.createGain();
-    var delay = context.createDelay(0.25);
+    var delay = context.createDelay(0.1);
     var out = context.createGain();
     var t0 = context.currentTime;
     var t1 = t0 + 0.125;
@@ -26,7 +26,7 @@ module.exports = function(context, util) {
     amp.connect(out);
     amp.connect(delay);
 
-    delay.delayTime.value = 0.0625;
+    delay.delayTime.value = 0.09375;
     delay.connect(out);
 
     return out;
@@ -41,22 +41,25 @@ module.exports = function(context, util) {
     input.connect(delay);
     input.connect(output);
 
-    delay.delayTime.value = 0.25;
+    delay.delayTime.value = 0.125;
     delay.connect(feedback);
 
     feedback.gain.value = 0.925;
     feedback.connect(input);
 
-    return { input: input, output: output };
+    return { input: input, output: output, feedback: feedback.gain };
   }
 
   var efx = createFeedbackDelay();
 
   function compose() {
     var midi = sample([ 64, 65, 65, 69, 72, 76 ]) + 12;
     var duration = sample([ 2, 2, 3, 4 ]);
+    var feedback = sample([ 0.4, 0.6, 0.8, 0.9, 0.975 ]);
     var nextTime = (duration * 1000) * Math.random();
 
+    efx.feedback.setTargetAtTime(feedback, context.currentTime, 1);
+
     synth(midi, duration).connect(efx.input);
 
     setTimeout(compose, nextTime);

demo/assets/sound/snare.wav

@@ -0,0 +1,77 @@
+module.exports = function(context, util) {
+  var sched = new util.WebAudioScheduler({ context: context });
+
+  function sample(list) {
+    return list[(Math.random() * list.length)|0];
+  }
+
+  function coin(ratio) {
+    return Math.random() < ratio;
+  }
+
+  return util.fetchAudioBuffer([ "kick.wav", "snare.wav", "hihat1.wav" ]).then(function(instruments) {
+    function shot(e) {
+      var inst = instruments[e.args.inst % instruments.length];
+      var t0 = e.playbackTime;
+      var t1 = t0 + inst.duration * e.args.duration;
+      var bufSrc = context.createBufferSource();
+      var gain = context.createGain();
+
+      bufSrc.buffer = inst;
+      bufSrc.start(t0);
+      bufSrc.stop(t1);
+      bufSrc.connect(gain);
+
+      gain.gain.setValueAtTime(0.4 * e.args.amp, t0);
+      gain.gain.linearRampToValueAtTime(0, t1);
+      gain.connect(context.destination);
+    }
+
+    function drum(e) {
+      var t0;
+
+      for (var i = 0; i < 16; i++) {
+        var t0 = e.playbackTime + i * 0.125;
+
+        // kick
+        if (i === 0) {
+          sched.insert(t0, shot, { inst: 0, amp: 1.0, duration: 1.00 });
+        } else if (i % 4 === 0 && coin(0.25)) {
+          sched.insert(t0, shot, { inst: 0, amp: 0.8, duration: 0.60 });
+        } else if (i % 2 === 0 && coin(0.15)) {
+          sched.insert(t0, shot, { inst: 0, amp: 0.6, duration: 0.40 });
+        } else if (coin(0.05)) {
+          sched.insert(t0, shot, { inst: 0, amp: 0.2, duration: 0.10 });
+        }
+
+        // snare
+        if (i % 8 === 4 && coin(0.95)) {
+          sched.insert(t0, shot, { inst: 1, amp: 1.0, duration: 1.00 });
+        } else if (i % 4 === 0 && coin(0.1)) {
+          sched.insert(t0, shot, { inst: 1, amp: 0.6, duration: 0.50 });
+        } else if (i % 4 === 3 && coin(0.1)) {
+          sched.insert(t0, shot, { inst: 1, amp: 0.6, duration: 0.75 });
+        } else if (coin(0.1)) {
+          sched.insert(t0, shot, { inst: 1, amp: 0.2, duration: 0.10 });
+        }
+
+        // hihat
+        if (i % 4 === 0) {
+          sched.insert(e.playbackTime + i * 0.125, shot, { inst: 2, amp: 0.40, duration: 1.00 });
+        } else if (i % 2 === 0 && coin(0.5)) {
+          sched.insert(e.playbackTime + i * 0.125, shot, { inst: 2, amp: 0.10, duration: 1.00 });
+        } else if (coin(0.25)) {
+          sched.insert(e.playbackTime + i * 0.125, shot, { inst: 2, amp: 0.10, duration: 0.10 });
+        } else if (coin(0.25)) {
+          sched.insert(e.playbackTime + i * 0.125, shot, { inst: 2, amp: 0.20, duration: 0.25 });
+        } else if (coin(0.8)) {
+          sched.insert(e.playbackTime + i * 0.125, shot, { inst: 2, amp: 0.05, duration: 0.85 });
+        }
+      }
+
+      sched.insert(e.playbackTime + 2.000, drum);
+    }
+
+    sched.start(drum);
+  });
+};

demo/assets/sound/tom1.wav

@@ -9,7 +9,6 @@ module.exports = function(context, util) {
 
   function synth(midi, duration) {
     var filter = context.createBiquadFilter();
-    var pan = context.createStereoPanner();
     var gain = context.createGain();
     var t0 = context.currentTime;
     var t1 = t0 + duration;
@@ -28,24 +27,16 @@ module.exports = function(context, util) {
       });
     });
 
-    var curveLength = sample([ 4, 24, 24, 32, 32, 32, 48, 128 ]);
-    var freqCurve = new Float32Array(curveLength).map(function() {
-      return freq * sample([ 0.25, 0.5, 1, 2, 2, 4, 4, 4, 6, 6, 8 ]);
-    });
+    var cutoff1 = freq * sample([ 0.25, 0.5, 1, 2, 2, 4, 4, 4, 6, 6, 8 ]);
+    var cutoff2 = freq * sample([ 0.25, 0.5, 1, 2, 2, 4, 4, 4, 6, 6, 8 ]);
 
     filter.type = "bandpass";
-    filter.frequency.setValueCurveAtTime(freqCurve, t0, t1 - t0);
+    filter.frequency.setValueAtTime(cutoff1, t0);
+    filter.frequency.exponentialRampToValueAtTime(cutoff2, t1);
     filter.Q.value = 4;
-    filter.connect(pan);
-
-    var panCurve = new Float32Array(curveLength * 8).map(function() {
-      return sample([ -0.6, -0.4, +0.4, +0.6 ]);
-    });
-
-    pan.pan.setValueCurveAtTime(panCurve, t0, t1 - t0);
-    pan.connect(gain);
+    filter.connect(gain);
 
-    gain.gain.setValueAtTime(0.125, t0);
+    gain.gain.setValueAtTime(0.1, t0);
     gain.gain.linearRampToValueAtTime(0, t1);
     gain.connect(context.destination);
   }

demo/assets/sound/tom2.wav

@@ -0,0 +1,29 @@
+module.exports = function(context, util) {
+  var sched = new util.WebAudioScheduler({ context: context });
+
+  function metronome(e) {
+    sched.insert(e.playbackTime + 0.000, ticktack, { frequency: 880, amp: 1.0, duration: 1.00 });
+    sched.insert(e.playbackTime + 0.500, ticktack, { frequency: 440, amp: 0.4, duration: 0.25 });
+    sched.insert(e.playbackTime + 1.000, ticktack, { frequency: 440, amp: 0.5, duration: 0.25 });
+    sched.insert(e.playbackTime + 1.500, ticktack, { frequency: 440, amp: 0.4, duration: 0.25 });
+    sched.insert(e.playbackTime + 2.000, metronome);
+  }
+
+  function ticktack(e) {
+    var t0 = e.playbackTime;
+    var t1 = t0 + e.args.duration;
+    var osc = context.createOscillator();
+    var amp = context.createGain();
+
+    osc.frequency.value = e.args.frequency;
+    osc.start(t0);
+    osc.stop(t1);
+    osc.connect(amp);
+
+    amp.gain.setValueAtTime(0.5 * e.args.amp, t0);
+    amp.gain.exponentialRampToValueAtTime(1e-6, t1);
+    amp.connect(context.destination);
+  }
+
+  sched.start(metronome);
+};