Leave without saving?

Your editor changes will be lost.

Pong-8 adds sound to the game.

Important Functions

  • new Audio(path)
    • This function creates an Audio object that we can play back at any point in our program. You can control the volume and whether or not the file loops (ex. your game’s background music).
    • We will use this functionality to play a sound whenever there is a collision and when a player scores.

What is jsfxr?

  • jsfxr is a simple program for generating random sounds. We will use it to generate all sound effects for our Pong game.
  • We’ve created 3 sound files and stored them in a sub-directory within Pong-8.

Important Code

You’ll notice in main.js and Ball.js that we’ve created an object with references to the 3 sound files we’ve added to our project directory:

main.js
const sounds = {
score: new Audio('./sounds/score.wav'),
};
Ball.js
this.sounds = {
paddleHit: new Audio('./sounds/paddle_hit.wav'),
wallHit: new Audio('./sounds/wall_hit.wav'),
};

The sound objects are ready to use. Your job is to play the appropriate sound at the moment when each event happens collision, wall collision, and scoring.

And with that, we have a fully functioning game of Pong!

🧩 Challenge: Play sound effects

Trigger the paddle, wall, and score sound effects at the collision and scoring moments.

Powered by WebContainers
Files
Preparing Environment