wcheng81
/
jtBaseApp


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
							<!doctype html>
<link rel="stylesheet" href="/node_modules/video.js/dist/video-js/video-js.css">
<style>
  p {
    background-color: #cbcbcb;
    border-radius: 5px;
    border: thin solid #333;
    padding: 5px;
  }
</style>
<p>This page pushes random bytes into a SourceBuffer to allow easy testing of ExternalInterface bandwidth. If ExternalInterface cannot transmit bytes to the video.js SWF at a greater rate than the video bitrate without using up too much CPU, playback will be interrupted.</p>
<video
   class="video-js vjs-default-skin"
   width="960"
   height="400"
   controls>
  <source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
  <source src="http://vjs.zencdn.net/v/oceans.webm" type="video/webm">
  Your browser does not support HTML video.
</video>

<form>
  <legend>Test Parameters</legend>
  <label>
    Number of bytes per append:
    <input id="byte-count" type="number" min="1" value="1000">
  </label>
  <label>
    Number of appends:
    <input id="append-count" type="number" min="1" value="10000">
  </label>
</form>
<button disabled>Run Test</button>
<table>
  <caption>Test Results</caption>
  <thead>
    <tr><td>Bytes</td><td>Appends</td><td>Elapsed Milliseconds</td></tr>
  </thead>
  <tbody id="results"></tbody>
</table>
<script src="/node_modules/video.js/dist/video-js/video.js"></script>
<script src="/dist/videojs-contrib-media-sources.js"></script>
<script>
var player = videojs(document.querySelector('video'), {
  techOrder: ['flash', 'html']
}, function() {
  var mediaSource = new videojs.MediaSource();
  mediaSource.addEventListener('sourceopen', function(event) {
    var sourceBuffer = mediaSource.addSourceBuffer('video/flv; codecs="vp6,aac"'),
        button = document.querySelector('button');

    button.disabled = false;
    button.addEventListener('click', function() {
      var byteCount = +document.querySelector('#byte-count').value,
          bytes = new Uint8Array(byteCount),
          appendCount = +document.querySelector('#append-count').value,
          i = appendCount,
          result = document.createElement('tr'),
          printResults = function() {
            result.innerHTML = '<td>' + byteCount + '</td><td>' +
                               appendCount + '</td><td>' +
                               (Date.now() - start) + '</td>';
            document.querySelector('#results').appendChild(result);
            sourceBuffer.removeEventListener('updateend', printResults);
            button.disabled = false;
          },
          start;

      button.disabled = true;
      sourceBuffer.addEventListener('updateend', printResults);
      start = Date.now();
      while (i--) {
        sourceBuffer.appendBuffer(bytes, player);
      }
    }, false);
  }, false);

  player.src({
    src: videojs.URL.createObjectURL(mediaSource),
    type: "video/flv"
  });
});
</script>