Playing Sounds, the Mobile Achilles Heel - HTML5 Mobile Game Development - page 463

sprite names don't include the filenames in them, compared to the assets, which generally do); it then checks
that the sound is present.
With the sound found, the game can calculate the start time for the sound and how long it should play for. It
then simply scrubs the audio sheet to the point in the file where the sound starts and calls play on the audio
file again to force it to continue playing. The start time is set back slightly by 0.05 seconds because otherwise
short effects or effects that start right away can be skipped by both Android and iOS. Finally, it clears out the
silence timer timeout and resets it to trigger after the sound has finished playing.
Generating the Sprite File
In order to generate the combined sound file necessary for the game and the accompanying JSON data file, you
could open an audio editing program and manually place the sound effects with the proper silence gaps and then
manually create a JSON file. As things progress, however, this could become a maintenance nightmare.
Luckily, there is a tool that has been written to generate the combined files and output JSON for Zynga's
jukebox. Because the Quintus code you added earlier uses a subset of the features in jukebox, you can use that
tool, available at https://github.com/tonistiigi/audiosprite .
The library relies on the ffmpeg tool, which you need to install separately. It is available via the ffmpeg web-
site at http://ffmpeg.org/ or can be installed via Homebrew on OS X ( brew install ffmpeg ) or via your
package manager on Linux. Windows users need to download and run the installer.
After you have ffmpeg installed, to install audiosprite, use NPM and install it globally via the following:
npm installl -g audiosprite
This installs a command called audiosprite that generates the combined audio sprite files. To combine
the block.wav and paddle.wav files into the output file called audiosprites , you can run
audiosprite --silence 1 ~DHoutput audiosprites block.wav paddle.wav
This generates audiosprites.caf , audiosprites.mp3 , and audiosprites.json (along with
.ogg and.m4a files). The audiosprites.json file looks something like Listing 25-3 .
Listing 25-3: The audiosprites.json file
{
"resources": [
"audiosprites.caf",
"audiosprites.ac3",
"audiosprites.mp3",
"audiosprites.m4a",
"audiosprites.ogg"
],
"spritemap": {
"silence": {
"start": 0,
"end": 1,
"loop": true
},
"block": {
"start": 2,
"end": 2.03,