Skip to Main Content
Building HTML5 Games with ImpactJS
book

Building HTML5 Games with ImpactJS

by Jesse Freeman
February 2012
Beginner to intermediate content levelBeginner to intermediate
140 pages
3h 16m
English
O'Reilly Media, Inc.
Content preview from Building HTML5 Games with ImpactJS

Chapter 6. Working With Sound

Impact also supports sound as well as background music for your game. In this chapter, we will learn how to add sound effects, background music, and learn a little more about browser compatibility issues.

Adding Sounds

In order to add sound to our game, we are going to have to use the ig.Sound class. Impact supports two file formats: Ogg Vorbis and MP3. The ig.SoundManager class can automatically detect which file to load based on the browser. Here are some examples of how to set up an ig.Sound instance:

var sound = new ig.Sound( 'media/sounds/jump.ogg' );
var sound = new ig.Sound( 'media/sounds/jump.mp3' );
var sound = new ig.Sound( 'media/sounds/jump.*' );

The last example is a wild card that lets the ig.SoundManager automatically load the correct file for us. Our sound files, just like images, should live inside the media directory. I also keep them in a subdirectory called sounds, so they stay organized. Let’s add some sound effects to our player. Open the player.js class and set up the following properties at the top of our player class:

jumpSFX: new ig.Sound( 'media/sounds/jump.*' ),
shootSFX: new ig.Sound( 'media/sounds/shoot.*' ),
deathSFX: new ig.Sound( 'media/sounds/death.*' ),

Now we need to play the sound for each of these actions. Add the following line to the code where our player jumps:

if( this.standing && ig.input.pressed('jump')){
    this.vel.y = -this.jump;
    this.jumpSFX.play();
}

Next, we want to add a sound effect to our shoot animation. Locate ...

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Start your free trial

You might also like

Cross Over to HTML5 Game Development: Use Your Programming Experience to Create Mobile Games

Cross Over to HTML5 Game Development: Use Your Programming Experience to Create Mobile Games

Zarrar Chishti
Pro Vue.js 2

Pro Vue.js 2

Adam Freeman
HTML5 Game Development Insights

HTML5 Game Development Insights

Colt McAnlis, Petter Lubbers, Brandon Jones, Duncan Tebbs, Andrzej Manzur, Sean Bennett, Florian d'Erfurth, Bruno Garcia, Shun Lin, Ivan Popelyshev, Jason Gauci, Jon Howard, Ian Ballantyne, Jesse Freeman, Takuo Kihira, Tyler Smith, Don Olmstead, John McCutchan, Chad Austin, Andres Pagella

Publisher Resources

ISBN: 9781449331207Supplemental ContentErrata