P5.js sound and keyTyped() or keyPressed()

p5.js Libraries
1

hi! i’m trying to write a code where when i press a certain keyboard key, a sound will play. I’m using p5.js and have tried keyTyped() function and keyPressed() function but it’s not working. Need help as soon as possible thank you!

2

Is there any way that you could post the code that you have tried?

3 
function keyTyped() {
  if (key === 'a') {
    keyA.play ();
  } else myBackgroundMusic.play ();
  }
 
}
4

Missing bracket in syntax; should be if(){…} else {… } .
Fix that first and see what happens.

7

I have fixed that syntax as well but no sound is played.
I tried using normal if - else function as well
if (key == ‘a’) {
keyA.play ();
}
else {
myBackgroundMusic.play();
}

For this, only my background music is playing and when I press the A key the sound that is supposed to play doesn’t play.
I have also tried writing the code before function setup () and after but it doesn’t seem to make a difference.

8

Do have something similar to this:

<script src="path/to/p5.sound.js"></script>

in the index.html file?

What type of sound is ‘keyA’ and do you have it loaded?

9

Make sure that you are able to run this demo code found in p5.js reference:

let value = 0;
function draw() {
  fill(value);
  rect(25, 25, 50, 50);
}
function keyTyped() {
  if (key === 'a') {
    value = 255;
  } else if (key === 'b') {
    value = 0;
  }
  // uncomment to prevent any default behavior
  // return false;
}
10

I checked and I don’t have the exact same one as that but I do have keyA loaded.

11

I tried the exact thing and nothing changed, the rectangle does not change to white when I pressed A. I guess the code has been right all along but my laptop is not working?

12

It could be the browser; what browser are you using? Did you try uncommenting ‘return false’?

13

i’m using chrome and never really got into any problem before, how do I do return false?

14

Just remove the double slashes in front of it: i.e,(delete ‘//’).

15

oh that. Tried it and nothing change when I pressed the A or B key.

16

The demo runs on my Mac with a Chrome browser, but I have to click on the rectangle first, then it will change color when I type ‘a’.

17

Tried that. Now that works! But the the part where I clicked on A and it play a sound still doesn’t work.

18

May not make any difference, but you coded for lower case ‘a’ not upper case.

19

Have always used lowercase a for the keyTyped function

20

Is there any way you can post a link to the sound that you are trying to use, or alternatively find a sound that we can both test?

21

hi! the website won’t allow me to send back another response, I need to make a new account
I’ll upload this sound here as keyA now,
https://freemusicarchive.org/music/Yoko_Absorbing

22

Just tested it with an .mp3 file and the following works here;

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

let value = 0;
function draw() {
  fill(value);
  rect(25, 25, 50, 50);
}
function keyTyped() {
  if (key === 'a') {
    //value = 255;
    sound.play();
  } else if (key === 'b') {
    value = 0;
  }
}

I first created a folder name ‘assets’ then dragndropped an .mp3 file into it.