src/chrome/test/data/media/encrypted_frame_size_change.html

   1 <!DOCTYPE html>
   2 <html>
   3   <body onload="load()">
   4     <p>Tests decoding and rendering encrypted video element that has a changing
   5       resolution.</p>
   6     <video width=320 controls></video>
   7     <video controls></video>
   8     <script src="media_utils.js" type="text/javascript"></script>
   9     <script src="media_source_utils.js" type="text/javascript"></script>
  10     <script src="encrypted_media_utils.js" type="text/javascript"></script>
  11     <script>
  12       var firstVideoSeek = false;
  13       var video_fixed_size = document.getElementsByTagName("video")[0];
  14       var video = document.getElementsByTagName("video")[1];
  15
  16       function load() {
  17         loadVideo(video_fixed_size);
  18         loadVideo(video);
  19       }
  20
  21       function loadVideo(video) {
  22         var mediaSource = loadEncryptedMediaFromURL(video);
  23
  24         video.addEventListener('playing', function() {
  25           // Make sure the video plays for a bit.
  26           video.addEventListener('timeupdate', function() {
  27             if (video.currentTime > 1.0) {
  28               video.pause();
  29             }
  30           });
  31         });
  32
  33         video.addEventListener('pause', function() {
  34           video.addEventListener('seeked', function() {
  35             if (!firstVideoSeek) {
  36               console.log('One video seeked.');
  37               firstVideoSeek = true;
  38               return;
  39             }
  40             setResultInTitle('ENDED');
  41           });
  42           video.currentTime = 0.5;
  43         });
  44
  45         video.addEventListener('canplay', oncanplay);
  46         video.play();
  47       }
  48     </script>
  49   </body>
  50 </html>