I'm very much a P5.js newbie so apologies if this is obvious.
I'm trying to build a music visualiser type animation where the amplitude of different audio files control various parameters. However I only want the use to hear the audio file containing the full mastered track.
In this simple example I want the amplitude of the 'kick', 'Hats_1' and 'tb303' files to control the size of the 3 circles. However I don't want these sounds to be output to the speakers (essentially they would be muted, but the amplitude still usable) - instead I only want the user to hear the file 'full track clip'.
`
let kick, kick_amp;
let hats_1, hats_1_amp;
let tb303, tb303_amp;
let full_track, full_track_amp;
let smoothing = 0.4;
function preload() {
kick = loadSound('kick.mp3');
hats_1 = loadSound('Hats 1.mp3');
tb303 = loadSound('303.mp3');
full_track = loadSound('full track clip.mp3');
}
function setup() {
createCanvas(600, 600)
kick.play();
kick_amp = new p5.Amplitude();
kick_amp.setInput(kick);
kick_amp.smooth(smoothing);
hats_1.play();
hats_1_amp = new p5.Amplitude();
hats_1_amp.setInput(hats_1);
kick_amp.smooth(smoothing);
tb303.play();
tb303_amp = new p5.Amplitude();
tb303_amp.setInput(tb303);
tb303_amp.smooth(smoothing);
full_track.play();
full_track_amp = new p5.Amplitude();
full_track_amp.setInput(full_track);
full_track_amp.smooth(smoothing);
}
function draw() {
background(0);
let kick_vol = kick_amp.getLevel();
ellipse( width*0.25,height/2, kick_vol*100, kick_vol*100);
let hats_1_vol = hats_1_amp.getLevel();
ellipse(width*0.75, height/2, hats_1_vol*100, hats_1_vol*100);
let tb303_vol = tb303_amp.getLevel();
ellipse(width*0.5, height*0.25, tb303_vol*100, tb303_vol*100);
}
// Click on the web page to start audio
function touchStarted() {
getAudioContext().resume();
}
`
Is this possible, and if so how do I do it?
Thanks in advance, Joe
I've tried looking through the P5.Amplitude reference and searching SO but no dice.