<html>
    <head>
        <!-- LayoutTests location is hard-coded to avoid duplication of code. -->
        <script src="http://svn.webkit.org/repository/webkit/trunk/LayoutTests/media/media-file.js"></script>
        <script src="http://svn.webkit.org/repository/webkit/trunk/LayoutTests/media/video-test.js"></script>

        <script>
            var expectedRates = { "defaultPlaybackRate" : 1, "playbackRate" : 1};
            var playingFromScript = false;
            var changedRate = false;

            function absoluteUrl(url)
            {
                var a = document.createElement('a');
                a.href = url;
                return a.href;
            }

            function testRates()
            {
                consoleWrite("");
                var playWithControllerButton = !changedRate && !playingFromScript;
                testExpected("video.playbackRate", playWithControllerButton ? expectedRates['defaultPlaybackRate'] : expectedRates['playbackRate']);
                testExpected("video.defaultPlaybackRate", expectedRates['defaultPlaybackRate']);
                changedRate = false;
            }

            function playing()
            {
                consoleWrite("<br>'playing' event");
                expectedRates['playbackRate'] = playingFromScript ? video.playbackRate : video.defaultPlaybackRate;
                testRates();
                playingFromScript = false;
            }

            function ratechange()
            {
                consoleWrite("<br>'ratechange' event");
                testRates();
            }

            function start()
            {
                findMediaElement();
                video.addEventListener('ratechange', ratechange);
                video.addEventListener('playing', playing);

                // Use the video file from the svn repository to avoid duplicating the file.
                video.src = absoluteUrl(findMediaFile('video', 'http://svn.webkit.org/repository/webkit/trunk/LayoutTests/media/content/test'));
                testRates();
            }

            function play()
            {
                playingFromScript = true;
                video.play();
            }

            function setRate(which, rate)
            {
                changedRate = true;
                video[which] = rate;
                expectedRates[which] = rate;
            }

        </script>
    </head>

    <body onload="start()">
        
        <video controls > </video>
        <ul>
            <li>The current 'playbackRate' and 'defaultPlaybackRate' should be logged every time either changes.</li>
            <li>'playbackRate' should be set to 'defaultPlaybackRate' when the Play button in the built-in controls is pressed</li>
            <li>'playbackRate' should NOT when play() is called from script.</li>
        </ul>
        <div>
            <button id="controls" onclick="setRate('defaultPlaybackRate', 2)">defaultPlaybackRate = 2</button>
            <button id="controls" onclick="setRate('defaultPlaybackRate', 1)">defaultPlaybackRate = 1</button>
            <button id="controls" onclick="setRate('playbackRate', 2)">playbackRate = 2</button>
            <button id="controls" onclick="setRate('playbackRate', 1)">playbackRate = 1</button>
        </div>
        <div>
            <button id="controls" onclick="play()">play()</button>
            <button id="controls" onclick="video.pause()">pause()</button>
        </div>
        <br>
    </body>
</html>