e
This commit is contained in:
+72
-72
@@ -1,72 +1,72 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Title</title>
|
||||
<style type="text/css">
|
||||
#format {
|
||||
word-break: break-all;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body style="background-color: #666;color: #fff;presentation-level: increment;">
|
||||
<video id="output" width="320" height="240" autoplay></video>
|
||||
<pre id="format"></pre>
|
||||
<script type="text/javascript">
|
||||
let sock, tick, format = document.getElementById('format');
|
||||
|
||||
|
||||
let buffer;
|
||||
let ms = new MediaSource()
|
||||
let output = document.getElementById('output')
|
||||
output.src = URL.createObjectURL(ms)
|
||||
ms.onsourceopen = () => {
|
||||
buffer = ms.addSourceBuffer('video/webm; codecs="vorbis,vp8"')
|
||||
}
|
||||
|
||||
function message(message) {
|
||||
// let div = document.createElement('div');
|
||||
// div.innerHTML = message.data;
|
||||
// div.style.cssText = 'padding:5px 10px;background-color:#222;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;word-break: break-all;word-wrap: break-word;';
|
||||
// div.style.marginBottom = '10px';
|
||||
// let count = format.getElementsByTagName('div');
|
||||
|
||||
buffer.appendBuffer(new Uint8Array(message.data))
|
||||
|
||||
// format.insertBefore(div, count[0]);
|
||||
}
|
||||
|
||||
function close(even) {
|
||||
setTimeout(function () {
|
||||
connect();
|
||||
sock.onmessage = message;
|
||||
sock.onclose = close;
|
||||
}, 3000);
|
||||
console.log(even, 'onClose')
|
||||
}
|
||||
|
||||
function connect() {
|
||||
sock = new WebSocket('ws://localhost:8080/websocket');
|
||||
sock.onopen = function () {
|
||||
if (tick) {
|
||||
clearInterval(tick)
|
||||
}
|
||||
tick = setInterval(function () {
|
||||
sock.send(JSON.stringify({'route': 'getUserPosition', 'tick': new Date().getTime()}));
|
||||
}, 3000)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
connect();
|
||||
sock.onmessage = message;
|
||||
sock.onclose = close;
|
||||
|
||||
// console.log(window);
|
||||
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Title</title>
|
||||
<style type="text/css">
|
||||
#format {
|
||||
word-break: break-all;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body style="background-color: #666;color: #fff;presentation-level: increment;">
|
||||
<video id="output" width="320" height="240" autoplay></video>
|
||||
<pre id="format"></pre>
|
||||
<script type="text/javascript">
|
||||
let sock, tick, format = document.getElementById('format');
|
||||
|
||||
|
||||
let buffer;
|
||||
let ms = new MediaSource()
|
||||
let output = document.getElementById('output')
|
||||
output.src = URL.createObjectURL(ms)
|
||||
ms.onsourceopen = () => {
|
||||
buffer = ms.addSourceBuffer('video/webm; codecs="vorbis,vp8"')
|
||||
}
|
||||
|
||||
function message(message) {
|
||||
// let div = document.createElement('div');
|
||||
// div.innerHTML = message.data;
|
||||
// div.style.cssText = 'padding:5px 10px;background-color:#222;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;word-break: break-all;word-wrap: break-word;';
|
||||
// div.style.marginBottom = '10px';
|
||||
// let count = format.getElementsByTagName('div');
|
||||
|
||||
buffer.appendBuffer(new Uint8Array(message.data))
|
||||
|
||||
// format.insertBefore(div, count[0]);
|
||||
}
|
||||
|
||||
function close(even) {
|
||||
setTimeout(function () {
|
||||
connect();
|
||||
sock.onmessage = message;
|
||||
sock.onclose = close;
|
||||
}, 3000);
|
||||
console.log(even, 'onClose')
|
||||
}
|
||||
|
||||
function connect() {
|
||||
sock = new WebSocket('ws://localhost:8080/websocket');
|
||||
sock.onopen = function () {
|
||||
if (tick) {
|
||||
clearInterval(tick)
|
||||
}
|
||||
tick = setInterval(function () {
|
||||
sock.send(JSON.stringify({'route': 'getUserPosition', 'tick': new Date().getTime()}));
|
||||
}, 3000)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
connect();
|
||||
sock.onmessage = message;
|
||||
sock.onclose = close;
|
||||
|
||||
// console.log(window);
|
||||
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user