Bootstrap shape generation

vocoder/static/vocoder.js

@@ -102,14 +102,14 @@ function getSoundInfo() {
   // nuance?
 }
 
-function generateNewShape() {
+class GeneratedShape {
+  constructor() {
     /**
-   * Create a new p5.js shape.
+     * Initialise the new shape.
      **/
-  ellipse(100, 100, 25, 25); // TODO: experimenting for now ...
-}
+    this.displayed = false;
+  }
 
-class GeneratedShape {
   move() {
     /**
      * Move the shape in some direction.
@@ -121,9 +121,17 @@ class GeneratedShape {
      * Show the shape on the canvas.
      **/
     ellipse(random(600), random(600), 10, 10); // TODO: experimenting for now ...
+    this.displayed = true;
   }
 }
 
+function generateNewShape() {
+  /**
+   * Create a new p5.js shape.
+   **/
+  return new GeneratedShape();
+}
+
 function setup() {
   /**
    * The p5.js initial setup function.
@@ -141,7 +149,10 @@ function draw() {
     newSoundJustRecorded = false;
   }
 
-  for (var shape of shapes) {
+  for (var i = 0; i < shapes.length; i++) {
+    var shape = shapes[i];
+    if (!shape.displayed) {
       shape.display();
     }
+  }
 }