HTML and CSS Reference
In-Depth Information
Q.audio.active[s] = true
setTimeout(function() {
delete Q.audio.active[s];
},debounce);
};
for (var i=0;i<Q.audio.channels.length;i++) {
var now = new Date();
if (Q.audio.channels[i]['finished'] < now.getTime()) {
Q.audio.channels[i]['finished'] = now.getTime() +
Q.asset(s).duration*1000;
Q.audio.channels[i]['channel'].src = Q.asset(s).src;
Q.audio.channels[i]['channel'].load();
Q.audio.channels[i]['channel'].play();
break;
}
}
}
}
Q.audio.enableMobileSound = function() {
// TODO: Add mobile support
}
};
As you can see, the audio system code, at least for the desktop is fairly short and consists primarily of a
few configuration variables and dummy methods followed by the
enableSound
method, which checks if this
is a touch device and determines which sound system to load. If it's a desktop browser, the code calls
en-
ableDesktopSound
, which sets up the audio channels and adds the real
play
method (one that actually
plays sounds) onto
Q
. The dummy
play
and
audioSprites
methods are present so that games can still call
those methods even if the audio system isn't enabled.
Setting up the audio channels consists of creating an array of sound objects paired with a
finished
prop-
erty that indicates the time that the sound will finish playing. Because no sounds are playing to start with, the
property is initialized to -1 for all channels.
Next up is the real
play
method, which has the main job to find an open channel; in other words, one that
has a finished time less than the current time, grabbing the
src
for a preloaded audio file from
Q.asset
,
loading, and playing it. To make it slightly more useful, the method takes a second parameter that is a debounce
time, which prevents the same sound from being played for approximately that number of milliseconds. This is
useful for situations in which
play
might be called repeatedly in a short period of time, but it should trigger
only a single sound effect.
Adding Sound Effects to Block Break
To add the sound effects to Block Break, you need to add the
quintus_audio.js
file to
block-
break.html
and make three small changes to
blockbreak.js
.