Skip to content

Instantly share code, notes, and snippets.

@galbarm

galbarm/index.html

Created June 21, 2015 05:41
Show Gist options
  • Star 6 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save galbarm/8cb1b684652de648ded3 to your computer and use it in GitHub Desktop.
Save galbarm/8cb1b684652de648ded3 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html>
<body>
<section>
<video> controls autoplay width="1920"></video>
</section>
<script type="text/javascript">
var buffer;
var queue = [];
var mediaSource = new MediaSource();
var video = document.querySelector('video');
video.src = window.URL.createObjectURL(mediaSource);
mediaSource.addEventListener('sourceopen', function(e) {
video.play();
//buffer = mediaSource.addSourceBuffer('video/mp4');
buffer = mediaSource.addSourceBuffer('video/mp4;codecs="avc1.4d401f"');
//buffer = mediaSource.addSourceBuffer('video/mp4;codecs="avc1.640029"');
//buffer = mediaSource.addSourceBuffer('video/webm; codecs="vp8"');
//buffer = mediaSource.addSourceBuffer('video/mp4; codecs="avc1.42E01E,mp4a.40.2"');
buffer.addEventListener('update', function() {
if (queue.length > 0 && !buffer.updating) {
buffer.appendBuffer(queue.shift());
}
});
var websocket = new WebSocket('ws://localhost:8181');
websocket.binaryType = 'arraybuffer';
websocket.addEventListener('message', function(e) {
if (typeof e.data !== 'string') {
if (buffer.updating || queue.length > 0) {
queue.push(e.data);
} else {
buffer.appendBuffer(e.data);
}
}
}, false);
}, false);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment