Question

I am developing this JavaScript game, that manages it’s loading of assets, prior anything happens. At first, the preloader class loads up an assets json file, that contains all listed assets to load. This file contains links to aprox. 30 images, 8 json files and 5 videos. Every single asset apart from the video files load fine in every major browser (firefox, safari, explorer, chrome), but the loading of those 5 video files are aborted by internet explorer.

I’m using HTML boilerplate, maybe that has something to do with it.

This is what I get, in network view:

Link to full size image file

Sometimes, the first two videos load, sometimes none of them do. Here’s an chunk of my code to load those videos:

case "ogv":
case "mp4":
    item = document.createElement('video');
    var itemSource = document.createElement('source');
    item.id = 'vid'; item.width = '600'; item.height = '450'; item.controls = false;
    if (extension == "mp4") {
        itemSource.id = 'mp4'; itemSource.type = 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"';
    } else if (extension == "ogv") {
        itemSource.id = 'ogv'; itemSource.type = 'video/ogg; codecs="theora, vorbis"';
    }
    itemSource.src = pathToAsset;
    item.appendChild(itemSource);
    item.addEventListener("canplaythrough", onVideoCanPlaythrough, false);
    item.load();
    break;

And here’s the listener handler:

var onVideoCanPlaythrough = function () {
    console.log("onVideoCanPlaythrough");
    item.removeEventListener("canplaythrough", onVideoCanPlaythrough, false);
    assets[assetID] = item;
    callback.call();
}

The console.log("onVideoPlaythrough) does not fire a single time on Internet Explorer.

I have checked to make sure, that every other thing is correct (I get right url’s in my pathToAsset variable and so on. This works on every other browser (except opera, which I haven’t really tested yet), but not on IE

Can anyone suggest how to approach debugging of this sort of problem?

Answer 1

Apparently you initiate loading of the videos with video.play() statement, not video.load() on internet explorer 9. That’s just great!