Sound not playing on mouseMoved

p5.js Libraries
1

Hi. I have the following code that I edited from an example. It worked in the example window but won’t work in dreamweaver or when I upload it to my server. Everything works except the sound effect, it won’t play. Are there any obvious mistakes?

let img;
let song;

function preload()
{
song = loadSound('assets/sound.mp3');
}

function setup() 
{
createCanvas(windowWidth, windowHeight);
  
img =  loadImage('assets/image1.png');
song = loadSound('assets/sound1.mp3');

frameRate(12);
}

function mousedMoved() 
  {
  song.play();
 }
  
function draw() 
{
  var mX=mouseX
  var mY=mouseY

image(img, mX, mY, img.width / 2,     
  img.height / 2);
 }
1 Like
2

p5js.org/reference/#/p5/preload

3

Sorry I originally WAS preloading the sound but it didn’t make a difference so I deleted it. But this is the example I was editing:
https://p5js.org/examples/sound-preload-soundfile.html

it works fine there once I make the changes above but I can’t get it to work locally or on my server. I’ve edited my code above to include the preload function.

4

Ok so I checked the error console and I’m getting this message:

“The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page. p5.sound.js:819”

and the error message links me to this page:

I don’t know much about coding yet, but does this mean that mouseMoved can’t be used to trigger audio?

1 Like
5


3 Likes
6

Thanks for the links. I tried everything mentioned and this is what worked:

function mousePressed() 
{ 
getAudioContext().resume() 
}

However, it’s not working on iPhone’s Safari browser, the sound still isn’t playing. Any idea why that might be? I tried replacing mousePressed() with touchStarted() but it still didn’t work.

1 Like
7

Sorry, I still haven’t used this library. You should try your luck and ask about it on its repo there. :musical_score:

1 Like
8

Thanks for trying. Also for the record I moved replaced mousePressed with mouseMoved and the above line of code does indeed work. Seems like a weird work around though.

Hopefully someone else will chime in who knows how to get it working on mobile…

1 Like
9

Ok update: I was able to get sound to play using the following code, I think the issue may have been that my phone was on mute when I tried it before.

HOWEVER, a lot of javascript sound stuff seems to work just fine when my phone is muted, I even went looking for some examples and that seems to be the default. (See: https://stackoverflow.com/questions/43440882/can-javascript-detect-if-a-mobile-device-is-muted) Should I file this on the github as a bug?

let img;
let song;

function windowResized() 
{
  resizeCanvas(windowWidth, windowHeight);
}


function preload()
{
song = loadSound('assets/sound.mp3');
}

function setup() 
{
createCanvas(windowWidth, windowHeight);

imageMode(CENTER);

img =  loadImage('assets/image.png');
song = loadSound('assets/sound.mp3');

frameRate(12);

}

function touchStarted() 
  {
  getAudioContext().resume() 
  song.play();
  }
  
function touchMoved() 
  {
  song.play();
  }
  
  
function draw() 
{
  var mX=mouseX
  var mY=mouseY

image(img, mX, mY, img.width / 2,     
  img.height / 2);
    
}