Help get this topic noticed by sharing it on Twitter, Facebook, or email.

HTML5 Canvas - Example 6-6 doesn't work as 'claimed to be'

Book: HTML5 Canvas...The example code doesn't work in terms of playing the video. Example 6-6 code has this, but unless i have a webm video it will not play, even though the ogg is there. In order for this to work i have to switch the statement to start with the ogg. This defeats the purpose of this function....any help to fix??
function supportedVideoFormat(video){
var returnExtension = "";
if(video.canPlayType("video/webm")=="probably" || video.canPlayType("video/webm")=="maybe"){
returnExtension = "webm";
}else if(video.canPlayType("video/mp4")=="probably" || video.canPlayType("video/mp4")=="maybe"){
returnExtension = "mp4";
}else if(video.canPlayType("video/ogg")=="probably" || video.canPlayType("video/ogg")=="maybe"){
returnExtension = "ogg";
return returnExtension;
1 person has
this question
  • Hi Johannes,

    I passed this on to the authors, and one of them replied the he needed more info to help with this. He said:
    I have this working locally with a .ogg file, so I need to know the
    1. What browser/version is he/she using?
    2. What Operating System is he/she using?
    3. What does he/she expect to happen? The function simply tries to play a
    video type the browser supports. If the browser supports webm, it will play
    it. Does .ogg not work at all, or only work if it is the first in "if"


    -Steve Fulton
  • (some HTML allowed)
    How does this make you feel?
    Add Image

    e.g. happy, confident, thankful, excited indifferent, undecided, unconcerned kidding, amused, unsure, silly sad, anxious, confused, frustrated