HTML and CSS Reference
In-Depth Information
} else if(audio.canPlayType("audio/wav") =="probably" ||
audio.canPlayType("audio/wav") == "maybe") {
returnExtension = "wav";
} else if(audio.canPlayType("audio/mp3") == "probably" ||
audio.canPlayType("audio/mp3") == "maybe") {
returnExtension = "mp3";
return returnExtension;
Notice that we do not check for a condition when no valid audio format is found and
the return value is “” . If that is the case, the code that has called this function might
need to be written in a way to catch that condition and alter the program execution.
We did that with the test of the return value and the alert() message, which we de-
scribed in the previous section.
If you want to test the error condition with no valid return value from
this function, simply add an extra character to the MIME type (e.g.,
audio / oggx ) to make sure an empty string is always returned.
Alternatively, you can use Modernizr to test for audio support. If you have included
the Modernizr JavaScript library in your HTML page (as we have done in every appli-
cation we have written thus far), you can access the static values of
dio.ogg , , and to test to see whether those
types are valid. These are not Booleans—they evaluate to the same probably , maybe ,
and “” values that we get from a call to canPlayType() . If you are comfortable using
Modernizr for all your tests, you can replace the test in the code with tests of these
Modernizr static values.
Playing the Sound
Finally, we get to the point where we can play a sound inside our canvasApp() function.
Since we preloaded the sound originally outside the context of this function into a
variable with a global scope, we just need to call the play() function audioElement to
start playing the sound:;
Figure 7-4 shows what this canvas application will look like when executed in an
HTML5-compliant web browser (notice that we have left the display of the audio
properties in this application).
Search WWH ::

Custom Search