HTML and CSS Reference
In-Depth Information
}
else
else
{
soundIndex
++
;
}
}
}
iif
(
soundFound
) {
tempSound
=
soundPool
[
soundIndex
];
tempSound
.
setAttribute
(
"src"
,
sound
+
"."
+
audioType
);
tempSound
.
loop
=
false
false
;
tempSound
.
volume
=
volume
;
tempSound
.
play
();
If we don't find a sound, and if the size of the pool is less than
MAX_SOUNDS
, we go ahead and
create a new
HTMLAudioElement
object, call its
play()
function, and push it into the sound
pool. This keeps the pool from getting too large while making sure there are not too many
HTMLAudioElement
objects in the browser at any one time:
}
else
else iif
(
soundPool
.
length
<
MAX_SOUNDS
){
tempSound
=
document
.
createElement
(
"audio"
);
tempSound
.
setAttribute
(
"src"
,
sound
+
"."
+
audioType
);
tempSound
.
volume
=
volume
;
tempSound
.
play
();
soundPool
.
push
(
tempSound
);
}
}
You can go ahead and try this iteration by loading
CH7EX8.html
in your HTML5-compliant
web browser. In this case, it works! You hear every sound, and the browser doesn't die like it
would with iteration #2.
Unfortunately, there are some issues. On some browsers, there is still a pause before a sound
plays,justlikewithiteration#2.Again,thishappensmoreoftenwhenthepageisloadedfrom
an external website than when it is loaded locally in a web browser.
The worst manifestation of this comes in Google Chrome, where the sounds pause every time
they are played. Also, in Firefox, the
src
doesn't change for all the objects, making the shoot
sound play when the explode sound should play, and vice versa.
Uh-oh,itlookslikeweneedanotheriteration.
Figure 7-9
shows
SpaceRaiders
playingwitha
pool size governed by
MAX_SOUNDS
.
