<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <script src=../media-file.js></script>
        <script src=../video-test.js></script>
        <script>
            var videoCanPlayThrough = false;
            var trackLoaded = false;

            var currentCue;
            var cueCount;
            var testTrack;

            function runTests()
            {
                if (!trackLoaded || !videoCanPlayThrough)
                    return;

                testTrack = document.getElementById("testTrack");
                testExpected("testTrack.track.cues.length", 7);

                for (cueCount = 2; cueCount < testTrack.track.cues.length; cueCount++) {
                    var cue = testTrack.track.cues[cueCount];

                    cue.addEventListener('enter', cueEnteredOrExited);
                    cue.addEventListener('exit', cueEnteredOrExited);
                }

                cueCount = 3;
                run("video.play()");
            }

            function cueEnteredOrExited()
            {
                consoleWrite("");
                consoleWrite("EVENT(" + event.type + ")");

                currentCue = event.target;
                testExpected("testTrack.track.cues.getCueById(cueCount).text", currentCue.text, "==");
                testExpected("currentCue.id", cueCount);

                if (event.type == 'exit') {
                    cueCount++;
                }
            }

            waitForEvent('ended', endTest);

            waitForEvent('canplaythrough', function() {
                video.currentTime = 5.00;
                videoCanPlayThrough = true;

                runTests();
            });

            function loaded()
            {
                trackLoaded = true;

                runTests();
            };

            function bodyLoaded()
            {
                findMediaElement();
                video.src = findMediaFile("video", "../content/test");
            }
        </script>
    </head>
    <body onload="bodyLoaded()">
        <p>Tests that events are triggered for missed (skipped) cues during normal playback.</p>
        <video controls>
            <track id="testTrack" src="captions-webvtt/missed-cues.vtt" onload="loaded()" default>
        </video>
    </body>
</html>