| <html> |
| <head> |
| <title>Drawing to canvas using video</title> |
| <script src=media-file.js></script> |
| <script> |
| var video; |
| var numberOfSeeks = 4; |
| var requirePixelDump = true; |
| |
| if (window.testRunner) { |
| testRunner.dumpAsText(true); |
| testRunner.waitUntilDone(); |
| } |
| |
| function drawAndInsertFrame() |
| { |
| var canvas = document.createElement('canvas'); |
| canvas.width = video.videoWidth / 2; |
| canvas.height = video.videoHeight / 2; |
| canvas.getContext('2d').drawImage(video, 0, 0, canvas.width, canvas.height); |
| |
| document.getElementById('canvases').appendChild(canvas); |
| |
| if (--numberOfSeeks) { |
| video.currentTime += 1; |
| return; |
| } |
| |
| endTest(); |
| } |
| |
| function canplaythrough() |
| { |
| video.currentTime = 3; |
| } |
| |
| function start() |
| { |
| findMediaElement(); |
| waitForEvent('canplaythrough', canplaythrough); |
| waitForEvent('seeked', drawAndInsertFrame); |
| video.src = findMediaFile('video', 'content/counting'); |
| } |
| </script> |
| <script src=video-test.js></script> |
| </head> |
| <body onload="start()"> |
| <video id="video"></video> |
| <div id="canvases"></div> |
| </body> |
| </html> |