1
    2
    3
    4
    5
    6
    7
    8
    9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
  100
  101
  102
  103
  104
  105
  106
  107
  108
  109
  110
  111
  112
  113
  114
  115
  116
  117
  118
  119
  120
  121
  122
  123
  124
  125
  126
  127
  128
  129
  130
  131
  132
  133
  134
  135
  136
  137
  138
  139
  140
  141
  142
  143
  144
  145
  146
  147
  148
  149
  150
  151
  152
  153
  154
  155
  156
  157
  158
  159
  160
  161
  162

media / test / data / mse_config_change.html [blame]

<html>
  <head>
    <title>Test media source config changes.</title>
  </head>
  <body onload="runTest();">
    <video controls></video>
    <script src='eme_player_js/app_loader.js' type='text/javascript'></script>
    <script type="text/javascript">
      var testConfig;

      var video = document.querySelector('video');
      var mediaType = 'video/webm; codecs="vorbis, vp8"';

      const CLEAR_MEDIA_1 = 'bear-320x240.webm';
      const CLEAR_MEDIA_2 = 'bear-640x360.webm';
      const ENCRYPTED_MEDIA_1 = 'bear-320x240-av_enc-av.webm';
      const ENCRYPTED_MEDIA_2 = 'bear-640x360-av_enc-av.webm';
      const MEDIA_2_LENGTH = 2.75;

      // The time in secs to append the second media source.
      var APPEND_TIME = 1;
      // DELTA is the time after APPEND_TIME where the second video dimensions
      // are guaranteed to take effect.
      var DELTA = 0.1;
      // Append MEDIA_2 source at APPEND_TIME, so expected total duration is:
      var TOTAL_DURATION = APPEND_TIME + MEDIA_2_LENGTH;

      var firstFile;
      var firstWidth = 320;
      var firstHeight = 240;

      var secondFile;
      var secondWidth = 640;
      var secondHeight = 360;

      function initTestConfig() {
        testConfig = new TestConfig();
        testConfig.loadQueryParams();
      }

      function setMediaFiles() {
        switch (testConfig.configChangeType) {
          case CONFIG_CHANGE_TYPE.CLEAR_TO_CLEAR:
            console.log('Config change type: clear to clear.');
            firstFile = CLEAR_MEDIA_1;
            secondFile = CLEAR_MEDIA_2;
            if ('avFile1' in testConfig) {
              mediaType = testConfig.avFormat;
              firstFile = testConfig.avFile1;
              secondFile = testConfig.avFile2;
              [firstWidth, firstHeight] =
                  testConfig.avResolution1.split('x').map(s => parseInt(s, 10));
              [secondWidth, secondHeight] =
                  testConfig.avResolution2.split('x').map(s => parseInt(s, 10));
            }

            break;
          case CONFIG_CHANGE_TYPE.CLEAR_TO_ENCRYPTED:
            console.log('Config change type: clear to encrypted.');
            firstFile = CLEAR_MEDIA_1;
            secondFile = ENCRYPTED_MEDIA_2;
            break;
          case CONFIG_CHANGE_TYPE.ENCRYPTED_TO_CLEAR:
            console.log('Config change type: encrypted to clear.');
            firstFile = ENCRYPTED_MEDIA_1;
            secondFile = CLEAR_MEDIA_2;
            break;
          case CONFIG_CHANGE_TYPE.ENCRYPTED_TO_ENCRYPTED:
            console.log('Config change type: encrypted to encrypted.');
            firstFile = ENCRYPTED_MEDIA_1;
            secondFile = ENCRYPTED_MEDIA_2;
            break;
        }
      }

      function appendNextSource(mediaSource) {
        console.log('Appending next media source at ' + APPEND_TIME + 'sec.');
        var xhr = new XMLHttpRequest();
        xhr.open("GET", secondFile);
        xhr.responseType = 'arraybuffer';
        xhr.addEventListener('load', function(e) {
          var onUpdateEnd = function(e) {
            console.log('Second buffer append ended.');
            srcBuffer.removeEventListener('updateend', onUpdateEnd);
            mediaSource.endOfStream();
            if (!mediaSource.duration ||
                Math.abs(mediaSource.duration - TOTAL_DURATION) > DELTA) {
              Utils.failTest('Unexpected mediaSource.duration = ' +
                       mediaSource.duration + ', expected duration = ' +
                       TOTAL_DURATION);
              return;
            }
            video.play();
          };
          console.log('Appending next media source at ' + APPEND_TIME + 'sec.');
          var srcBuffer = mediaSource.sourceBuffers[0];
          srcBuffer.addEventListener('updateend', onUpdateEnd);
          srcBuffer.timestampOffset = APPEND_TIME;
          srcBuffer.appendBuffer(new Uint8Array(e.target.response));
        });
        xhr.send();
      }

      function onTimeUpdate() {
        logVideoDimensions();

        // Seek to APPEND_TIME because after a seek a timeUpdate event is fired
        // before video width and height properties get updated.
        if (video.currentTime < APPEND_TIME - DELTA) {
          // Seek to save test execution time (about 1 secs) and to test seek
          // on the first buffer.
          video.currentTime = APPEND_TIME - DELTA;
        } else if (video.currentTime > APPEND_TIME + DELTA) {
          // Check video duration here to guarantee that second segment has been
          // appended and video total duration is updated.
          // Video duration is a float value so we check it within a range.
          if (!video.duration ||
              Math.abs(video.duration - TOTAL_DURATION) > DELTA) {
            Utils.failTest('Unexpected video.duration = ' + video.duration +
                     ', expected duration = ' + TOTAL_DURATION);
            return;
          }

          video.removeEventListener('timeupdate', onTimeUpdate);
          video.removeEventListener('ended', Utils.failTest);
          Utils.installTitleEventHandler(video, 'ended');
          // Seek to save test execution time and to test seek on second buffer.
          video.currentTime = APPEND_TIME + MEDIA_2_LENGTH * 0.9;
        }
      }

      function logVideoDimensions() {
        console.log('video.currentTime = ' + video.currentTime +
                    ', video dimensions = ' + video.videoWidth + 'x' +
                    video.videoHeight + '.');
      }

      function runTest() {
        initTestConfig();
        setMediaFiles();
        testConfig.mediaFile = firstFile;
        testConfig.mediaType = mediaType;
        video.addEventListener('timeupdate', onTimeUpdate);
        video.addEventListener('ended', Utils.failTest);
        var mediaSource = MediaSourceUtils.loadMediaSourceFromTestConfig(
            testConfig, appendNextSource);
        if (testConfig.configChangeType != CONFIG_CHANGE_TYPE.CLEAR_TO_CLEAR) {
          var emePlayer = PlayerUtils.createPlayer(video, testConfig);
          emePlayer.registerEventListeners()
              .then(function(player) {
                video.src = window.URL.createObjectURL(mediaSource);
              })
              .catch(function(error) {
                Utils.failTest('Unable to register event listeners.');
              });
        } else {
          video.src = window.URL.createObjectURL(mediaSource);
        }
      }
      </script>
  </body>
</html>