add some knobs for effects
authorFrédéric Péters <fpeters@0d.be>
Wed, 22 Feb 2017 12:15:13 +0000 (13:15 +0100)
committerFrédéric Péters <fpeters@0d.be>
Sat, 1 Apr 2017 10:37:18 +0000 (12:37 +0200)
index.html
nanofun.css
nanofun.js

index 55897f2..039f0f3 100644 (file)
   <div id="msg"></div>
   <div id="midiinputs"></div>
   <div id="midioutputs"></div>
+
   <form>
-    <br><input id="master-gain" type="range" min="0" max="127" value="127">
+    <div><label>Master</label> <input id="master-gain" type="range" min="0" max="127" value="127"></div>
+    <br>
+    <div><label>Delay</label> <input id="delay" type="range" min="0" max="5" value="0" step="0.1"></div>
+    <div><label>Feedback</label> <input id="feedback" type="range" min="0" max="1" value="0.8" step="0.1"></div>
+    <div><label>Filter</label> <input id="filter" type="range" min="0" max="5000" value="1000" step="100"></div>
   </form>
+
   <div id="gitclone">Source code at <a href="https://git.0d.be/?p=nanofun.git">https://git.0d.be/?p=nanofun.git</a></div>
  </body>
 </html>
index 158fa7f..99c357e 100644 (file)
@@ -75,3 +75,12 @@ div#gitclone {
   bottom: 1ex;
   right: 1ex;
 }
+
+form {
+  margin: 1em;
+}
+
+form label {
+  display: inline-block;
+  width: 10em;
+}
index fd4dcbd..6b8ba95 100644 (file)
@@ -303,6 +303,21 @@ var nanofun = function() {
       self.touchGainNodes[i].connect(self.masterGainNode);
     }
     self.masterGainNode.connect(self.audioCtx.destination);
+
+    self.delay = self.audioCtx.createDelay(maxDelayTime=5);
+    self.delay.delayTime.value = 0.5;
+
+    self.feedback = self.audioCtx.createGain();
+    self.feedback.gain.value = 0.8;
+
+    self.filter = self.audioCtx.createBiquadFilter();
+    self.filter.frequency.value = 1000;
+
+    self.delay.connect(self.feedback);
+    self.feedback.connect(self.filter);
+    self.filter.connect(self.delay);
+
+    self.masterGainNode.connect(self.delay);
   }
 
   self.initMIDI = function() {
@@ -374,6 +389,24 @@ var nanofun = function() {
       self.masterGainNode.gain.value = fraction * fraction;
     });
 
+    $('#delay').on('change', function() {
+      var value = this.value;
+      if (value == 0) {
+        self.delay.disconnect();
+      } else {
+        self.delay.delayTime.value = value;
+        self.delay.connect(self.audioCtx.destination);
+      }
+    });
+
+    $('#feedback').on('change', function() {
+      self.feedback.gain.value = this.value;
+    });
+
+    $('#filter').on('change', function() {
+      self.filter.frequency.value = this.value;
+    });
+
     $('.touch-gain').on('change', function() {
       var fraction = parseInt(this.value) / parseInt(127);
       var touchIdx = parseInt($(this).parent().data('touch'));