Distorted sound when loading multiple MP3s

Hi all,

I’m trying to make an interface that crossfades between audio files depending on mouse position. The thing is, the sound is sounding terrible - like it’s being time stretched or something. Any ideas why this might be?


I tried a simple sketch that loads the same files and it seems to be playing back normally. I realize that the sounds are pretty dodgy to begin with - field recordings made with phones - but they shouldn’t sound as bad as they do.



I adapted the code from a Processing sketch, which works well, but I only realized that the minim library won’t run on the web after I’d finished. Is it even possible to run 30 audio files simultaneously from a browser??? Or should I just accept that this is a bad idea and link to the Processing app instead?

– i see no use to run 30 sounds same time

– also why at beginning you play every sound double ( by play() AND loop() )

– the concept for your program is to adjust the volume ?of all 30 ? sounds 60 times per sec.
better not this way…

please make a new version of your program and try first
( without all the fancy volume /mouse distance code )

all file from setup:

-b- on mousePressed use like

function mysong( go ) {
  if ( go && !song.isLooping() ) song.loop();
  if ( !go && song.isLooping() ) song.pause();


later you can build in a

fade (in / out )

over it again

Thanks, I’ll take a look at this. The reason for having them all playing at the same time is that I figured they wouldn’t load quickly enough as the mouse rolls over each vector. Also, they need to be synchronized, so I don’t think pausing or stopping them if they’re not active will work.

but like on my RPI i can’t even preload more as 6 files…

so after you get that running you can try to
step 2
make that loop / pause logic by a mouse distance / circle
what might mean overlapping possible

fading would be step 3

i try a simple volume mouse slider and it works fine

function mouseVolume() {
   if ( song.isLooping() ) {
     triangle(10,height-10, width-10,height-30,width-10,height-10);
     let amp = map(mouseX, 0, width,0,1);
     rect( amp*width,height-30,5,20);