Good evening all;
I am continuing working on a project, which is essentially a drum machine whose tempo you can adjust in real time using a slider. That is, you can set up the drum machine and play it and as it’s playing you can use a slider to affect its tempo in real-time. I successfully coded this in Processing 3 and 4, but I want to have it available on the web via p5.js, but am having some difficulty… I have gotten the drum machine setup in p5.js using Tone.js and WAAClock, but because I’ve set up the bpm variable in Setup() via a clockSetup() function (without otherwise I cannot get the drum machine to work), I can’t use a slider to change the tempo in real-time. Is there a way to affect the tempo, which is currently set to 60bpm, using a slider?
To use the drum machine, click on a square that you want to activate per the row item (e.g., bottom row is the Bass Drum, the middle row is the Snare Drum) and then press the spacebar.
Here is the code on OpenProcessing: Speed Trainer Test - OpenProcessing
Apologies if this is not the right way to request assistance, still new to asking for support. 
Also, to note, I’m using Tone.js instead of p5.sound, because Tone.js uses less RAM. p5.js causes the Sketch to crash within a minute of running the drum machine, but with Tone.js, I can run it for hours.
I tried to adjust ‘bpm’ in draw(), in a function, and to remove it from setup() and try to only set it up in draw(), but haven’t been able to figure it out.