Delay
Click the mouse to hear the p5.Delay process a SoundFile. MouseX controls the p5.Delay Filter Frequency. MouseY controls both the p5.Delay Time and Resonance. Visualize the resulting sound's volume with an Amplitude object. *
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
let soundFile, analyzer, delay;
function preload() {
soundFormats('ogg', 'mp3');
soundFile = loadSound('assets/beatbox.mp3');
}
function setup() {
createCanvas(710, 400);
soundFile.disconnect(); // so we'll only hear delay
delay = new p5.Delay();
delay.process(soundFile, 0.12, 0.7, 2300);
delay.setType('pingPong'); // a stereo effect
analyzer = new p5.Amplitude();
}
function draw() {
background(0);
// get volume reading from the p5.Amplitude analyzer
let level = analyzer.getLevel();
// use level to draw a green rectangle
let levelHeight = map(level, 0, 0.1, 0, height);
fill(100, 250, 100);
rect(0, height, width, -levelHeight);
let filterFreq = map(mouseX, 0, width, 60, 15000);
filterFreq = constrain(filterFreq, 60, 15000);
let filterRes = map(mouseY, 0, height, 3, 0.01);
filterRes = constrain(filterRes, 0.01, 3);
delay.filter(filterFreq, filterRes);
let delTime = map(mouseY, 0, width, 0.2, 0.01);
delTime = constrain(delTime, 0.01, 0.2);
delay.delayTime(delTime);
}
function mousePressed() {
soundFile.play();
}
