jeremywen/p5-download-multiple-audio-clips.html

## p5-download-multiple-audio-clips.html
<html>
  <head>
    <script src="p5.js"></script>
    <script src="addons/p5.sound.js"></script>
  </head>
<body>
  <script>
    var playing = false, recording = false;
    var mySound, recorder, recordedSound;
    var clips = [
      [0.01, 2.0], //seems like 0.01 is the lowest cue that works.
      [3.0, 6.0],
      [6.0, 9.0]
    ];

    function preload() {
      mySound = loadSound('test.wav');
    }

    function setup(){
      createCanvas(500, 500);
      background(0);
      recorder = new p5.SoundRecorder();
      mySound.setVolume(0.1);
      clips.forEach(function(clip){
        mySound.addCue(clip[0], function(){
          console.log("cue at "+clip[0]+" seconds");
          recordedSound = new p5.SoundFile();
          recorder.record(recordedSound);
          recording = true;
        });
        mySound.addCue(clip[1], function(){
          console.log("cue at "+clip[1]+" seconds");
          recorder.stop();

          //browser may ask if it is ok to download multiple files
          save(recordedSound, "recording-from-"+clip[0]+"-to-"+clip[1]+"-seconds.wav");
          recording = false;
        });

      });
    }

    function draw(){
      noStroke();
      fill(255);
      textAlign(CENTER);
      if(recording){
        background(100,0,0);
        text("Recording..", 250, 250);

      } else if(playing){
        background(0,100,0);
        text("Playing (click to stop)", 250, 250);

      } else {
        background(0);
        text("Click to start playback.", 250, 250);
      }
    }

    function mouseClicked(){
      if(recording){
        recorder.stop();
        recording = false;
      }
      playing ? mySound.stop() : mySound.play();
      playing = !playing;
    }
  </script>
</body>
</html>
	<html>
	<head>
	<script src="p5.js"></script>
	<script src="addons/p5.sound.js"></script>
	</head>
	<body>
	<script>
	var playing = false, recording = false;
	var mySound, recorder, recordedSound;
	var clips = [
	[0.01, 2.0], //seems like 0.01 is the lowest cue that works.
	[3.0, 6.0],
	[6.0, 9.0]
	];

	function preload() {
	mySound = loadSound('test.wav');
	}

	function setup(){
	createCanvas(500, 500);
	background(0);
	recorder = new p5.SoundRecorder();
	mySound.setVolume(0.1);
	clips.forEach(function(clip){
	mySound.addCue(clip[0], function(){
	console.log("cue at "+clip[0]+" seconds");
	recordedSound = new p5.SoundFile();
	recorder.record(recordedSound);
	recording = true;
	});
	mySound.addCue(clip[1], function(){
	console.log("cue at "+clip[1]+" seconds");
	recorder.stop();

	//browser may ask if it is ok to download multiple files
	save(recordedSound, "recording-from-"+clip[0]+"-to-"+clip[1]+"-seconds.wav");
	recording = false;
	});

	});
	}

	function draw(){
	noStroke();
	fill(255);
	textAlign(CENTER);
	if(recording){
	background(100,0,0);
	text("Recording..", 250, 250);

	} else if(playing){
	background(0,100,0);
	text("Playing (click to stop)", 250, 250);

	} else {
	background(0);
	text("Click to start playback.", 250, 250);
	}
	}

	function mouseClicked(){
	if(recording){
	recorder.stop();
	recording = false;
	}
	playing ? mySound.stop() : mySound.play();
	playing = !playing;
	}
	</script>
	</body>
	</html>