render relabi wave to canvas

1 files changed, 42 insertions, 13 deletions

diff --git a/src/relabi/index.js b/src/relabi/index.js
index ad5b11d..e392a27 100644
--- a/src/relabi/index.js
+++ b/src/relabi/index.js
@@ -1,4 +1,9 @@
+/**
+ * Relabi event generator
+ */
+
 import * as Tone from "tone";
+import RelabiCanvas from "./canvas";
 
 const TWO_PI = 2 * Math.PI;
 
@@ -24,8 +29,8 @@ export default class Relabi {
   /**
    * Initialize generator
    */
-  constructor({ waves, bounds }) {
-    this.updateTime = 0.5;
+  constructor({ waves, bounds, parent }) {
+    this.updateTime = 1;
     this.steps = 50;
     this.waves = waves || [
       { type: "sine", frequency: randrange(0.5, 1.5) },
@@ -34,6 +39,8 @@ export default class Relabi {
       { type: "sine", frequency: randrange(2, 4) },
     ];
     this.bounds = bounds;
+    this.previousValue = 0;
+    this.canvas = new RelabiCanvas({ relabi: this, parent });
   }
 
   /**
@@ -42,7 +49,11 @@ export default class Relabi {
   start() {
     console.log("Start Relabi");
     this.stop();
-    this.clock = new Tone.Clock((time) => this.step(time), this.updateTime);
+    this.clock = new Tone.Clock((time) => {
+      const values = this.generate(time);
+      this.canvas.append(time, values);
+      this.play(values);
+    }, this.updateTime);
     this.clock.start();
   }
 
@@ -59,19 +70,17 @@ export default class Relabi {
   /**
    * Generate relabi events
    */
-  step(time) {
+  generate(time) {
     const waveCount = this.waves.length;
-    const boundsCount = this.bounds.length;
-    let previousValue = this.previousValue;
     let index;
     let step;
     let value;
-    let noteCount = 0;
+    let values = [];
 
     // Generate several events per second
     for (step = 0; step < this.steps; step += 1) {
       // Time offset for this event
-      const offset = time + (step * this.updateTime) / this.steps;
+      const timeOffset = time + (step * this.updateTime) / this.steps;
 
       // Initialize value
       value = 0;
@@ -79,22 +88,42 @@ export default class Relabi {
       // Compute the wave functions for this event
       for (index = 0; index < waveCount; index += 1) {
         const wave = this.waves[index];
-        value += WAVE_FUNCTIONS[wave.type](offset * wave.frequency);
+        value += WAVE_FUNCTIONS[wave.type](timeOffset * wave.frequency);
       }
 
       // Scale to [-1, 1]
-      value /= waveCount / Math.PI;
+      value /= waveCount;
+
+      values.push([timeOffset, value]);
+    }
+
+    return values;
+  }
+
+  /**
+   * Schedule relabi events
+   */
+  play(values) {
+    const boundsCount = this.bounds.length;
+    let previousValue = this.previousValue;
+    let index;
+    let step;
+    let noteCount = 0;
+
+    for (step = 0; step < this.steps; step += 1) {
+      // Get the next value
+      const [time, value] = values[step];
 
       // Compute whether we crossed a boundary, and which direction
       for (index = 0; index < boundsCount; index += 1) {
         const bound = this.bounds[index];
         if (value < bound.level && bound.level < previousValue) {
           // Going down
-          this.trigger(offset, bound.sounds[0]);
+          this.trigger(time, bound.sounds[0]);
           noteCount += 1;
         } else if (value > bound.level && bound.level > previousValue) {
           // Going up
-          this.trigger(offset, bound.sounds[1]);
+          this.trigger(time, bound.sounds[1]);
           noteCount += 1;
         }
       }
@@ -104,7 +133,7 @@ export default class Relabi {
     }
 
     // Store the latest value
-    this.previousValue = value;
+    this.previousValue = previousValue;
   }
 
   /**