Search code examples
javascripthtmlp5.js

ReferenceError: soundFormats is not defined

I am trying to learn about p5 and have been going through the tutorials (https://p5js.org/reference/#/p5.SoundFile).

function preload() {
  soundFormats('mp3', 'ogg');
  mySound = loadSound('assets/cam.mp3');
}

function setup() {
  mySound.setVolume(0.1);
  mySound.play();
}

I have followed the documentation verbatim, except for the fact that I switched in my own test song. When I run this on my repl.it https://repl.it/@JacksonEnnis/Coloquial I get an error stating "ReferenceError: soundFormats is not defined". However, I know that this function IS defined, because it is from the documentation. I have googled the problem, but it does not seem like it is a common issue to experience.

If anyone understands why this is happening, please explain it to me so I may learn.

HTML:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>repl.it</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <script language="javascript" type="text/javascript" src="path/to/p5.sound.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/p5.js"></script>
    <script src="script.js"></script>
  </body>
</html>
Solution

  • Just to sum up the comments. Here's the solution that works:

    <!doctype HTML>
<html>
<head>
  <html><head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.16/p5.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.16/addons/p5.sound.js"></script>

</head>
<body>
  <script> 
    function preload() {
      soundFormats('ogg', 'mp3');
      mySound = loadSound('https://ia802508.us.archive.org/5/items/testmp3testfile/mpthreetest.mp3');
    }

    function setup() {
      mySound.setVolume(1);
      // mySound.play();
      mySound.loop();
    }
  </script>
</body>
</html>

    as you can see: the p5.sound.js file has to be included as well. It has to be a valid path and it has to be loaded after the p5.js.

    soundFormats is a function defined in p5.sound.js. And if this javascript file has not been loaded properly, an error message "soundFormats is not defined" comes up.