(Gsoc'21)💚Fixes mic issues in recorder example

Author: satyasaibhushan

examples/record/sketch.js

@@ -7,17 +7,14 @@ var mic, recorder, soundFile;
 var state = 0; // mousePress will increment from Record, to Stop, to Play
 
 function setup() {
-  createCanvas(400,400);
+  createCanvas(400, 400);
   background(200);
   fill(0);
   text('Enable mic and click the mouse to begin recording', 20, 20);
 
   // create an audio in
   mic = new p5.AudioIn();
 
-  // users must manually enable their browser microphone for recording to work properly!
-  mic.start();
-
   // create a sound recorder
   recorder = new p5.SoundRecorder();
 
@@ -30,25 +27,23 @@ function setup() {
 
 function mousePressed() {
   // use the '.enabled' boolean to make sure user enabled the mic (otherwise we'd record silence)
-  if (state === 0 && mic.enabled) {
-
-    // Tell recorder to record to a p5.SoundFile which we will use for playback
-    recorder.record(soundFile);
-
-    background(255,0,0);
-    text('Recording now! Click to stop.', 20, 20);
-    state++;
-  }
-
-  else if (state === 1) {
+  if (state === 0) {
+    // users must manually enable their browser microphone for recording to work properly!
+    mic.start(function() {
+      // Tell recorder to record to a p5.SoundFile which we will use for playback
+      recorder.record(soundFile);
+
+      background(255, 0, 0);
+      text('Recording now! Click to stop.', 20, 20);
+      state++;
+    });
+  } else if (state === 1) {
     recorder.stop(); // stop recorder, and send the result to soundFile
-
-    background(0,255,0);
+    mic.dispose();
+    background(0, 255, 0);
     text('Recording stopped. Click to play', 20, 20);
     state++;
-  }
-
-  else if (state === 2) {
+  } else if (state === 2) {
     soundFile.play(); // play the result!
   }
 }

index.html

@@ -65,7 +65,6 @@ <h2>p5.sound
 <div><a href="examples/pause_soundfile">pause_soundfile</a></div>
 <div><a href="examples/peakDetect">peakDetect</a></div>
 <div><a href="examples/peakDetect_basic">peakDetect_basic</a></div>
-<div><a href="examples/peakDetection_offline">peakDetection_offline</a></div>
 <div><a href="examples/play_soundfile">play_soundfile</a></div>
 <div><a href="examples/playbackRate">playbackRate</a></div>
 <div><a href="examples/playbackRatePart">playbackRatePart</a></div>

src/looper.js

@@ -387,7 +387,7 @@ class Score {
   constructor() {
     // for all of the arguments
     this.parts = [];
-    this.currentPart = new Array(arguments.length);;
+    this.currentPart = new Array(arguments.length);
 
     var thisScore = this;
     for (var i in arguments) {
@@ -396,7 +396,7 @@ class Score {
       this.parts[i].onended = function () {
         thisScore.resetPart(i);
         playNextPart(thisScore);
-      };    
+      };
     }
     this.looping = false;
   }

src/soundRecorder.js

@@ -31,9 +31,6 @@ const ac = p5sound.audiocontext;
  *    // create an audio in
  *    mic = new p5.AudioIn();
  *
- *    // prompts user to enable their browser mic
- *    mic.start();
- *
  *    // create a sound recorder
  *    recorder = new p5.SoundRecorder();
  *
@@ -51,22 +48,26 @@ const ac = p5sound.audiocontext;
  *    // ensure audio is enabled
  *    userStartAudio();
  *
- *    // make sure user enabled the mic
- *    if (state === 0 && mic.enabled) {
- *
- *      // record to our p5.SoundFile
- *      recorder.record(soundFile);
+ *    if (state === 0) {
+ *    // make sure user enabled the mic by prompting to enable their browser mic
+ *    // start recording after the mic is enabled
+ *      mic.start(function() {
+ *        // record to our p5.SoundFile
+ *        recorder.record(soundFile);
  *
- *      background(255,0,0);
- *      text('Recording!', width/2, height/2);
- *      state++;
+ *        background(255,0,0);
+ *        text('Recording!', width/2, height/2);
+ *        state++;
+ *      });
  *    }
  *    else if (state === 1) {
  *      background(0,255,0);
  *
  *      // stop recorder and
  *      // send result to soundFile
  *      recorder.stop();
+ *      // stop browser from accessing the mic
+ *      mic.dispose();
  *
  *      text('Done! Tap to play and download', width/2, height/2, width - 20);
  *      state++;