Record Save Audio
Record a sound, play it back and save it as a .wav file to the client's computer. We need three objects: a p5.AudioIn (mic / sound source), p5.SoundRecorder (records the sound), and a p5.SoundFile (play back / save).
To run this example locally, you will need the p5.sound library a sound file, and a running local server.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
let mic, recorder, soundFile;
let state = 0; // mousePress will increment from Record, to Stop, to Play
function setup() {
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();
// connect the mic to the recorder
recorder.setInput(mic);
// create an empty sound file that we will use to playback the recording
soundFile = new p5.SoundFile();
}
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) {
recorder.stop(); // stop recorder, and send the result to soundFile
background(0, 255, 0);
text('Recording stopped. Click to play & save', 20, 20);
state++;
} else if (state === 2) {
soundFile.play(); // play the result!
saveSound(soundFile, 'mySound.wav'); // save file
state++;
}
}
