2015-05-22 16:59:33 +02:00
|
|
|
extends ../../../views/main
|
2015-05-05 16:30:51 +02:00
|
|
|
|
|
|
|
block title
|
2015-06-10 11:53:00 +02:00
|
|
|
title #{title} - Sphere streaming
|
2015-05-05 16:30:51 +02:00
|
|
|
|
|
|
|
block extrajs
|
|
|
|
script params = {}; params.get= {}; params.get.res = #{resolution}
|
2015-05-22 16:59:33 +02:00
|
|
|
script(src="/static/js/three.min.js")
|
2015-06-09 17:36:21 +02:00
|
|
|
script(src="/static/js/socket.io.min.js")
|
2015-07-01 15:03:11 +02:00
|
|
|
script(src="/static/js/l3d.min.js")
|
2015-05-22 16:59:33 +02:00
|
|
|
script(src="/static/js/streamingsimulator.min.js")
|
2015-06-25 18:07:19 +02:00
|
|
|
script(type='text/javascript').
|
|
|
|
$(function() {
|
|
|
|
var filterInt = function (value) {
|
|
|
|
if(/^(\-|\+)?([0-9]+|Infinity)$/.test(value))
|
|
|
|
return Number(value);
|
|
|
|
return NaN;
|
|
|
|
}
|
|
|
|
|
|
|
|
$('#form').submit(function(e) {
|
|
|
|
e.preventDefault();
|
|
|
|
var val = filterInt(document.getElementById('num').value);
|
|
|
|
console.log(val);
|
|
|
|
window.location.href = "/stream/" + val;
|
|
|
|
});
|
|
|
|
});
|
2015-05-05 16:30:51 +02:00
|
|
|
|
|
|
|
block content
|
2015-06-10 11:53:00 +02:00
|
|
|
h2 Sphere streaming
|
2015-05-05 16:30:51 +02:00
|
|
|
|
|
|
|
p.
|
2015-06-10 12:01:51 +02:00
|
|
|
<s>In fact, it's not really streaming. The sphere is fully preloaded
|
|
|
|
and then, a mesh is created and vertices and faces are dynamically
|
|
|
|
added to this mesh as time goes by.</s>
|
2015-06-10 11:31:28 +02:00
|
|
|
|
|
|
|
p.
|
2015-06-10 12:01:51 +02:00
|
|
|
In fact, it is acutally streaming. If you web browser supports
|
|
|
|
WebSocket, you'll connect to the server and the mesh will be streamed
|
|
|
|
onto the socket and the faces will be displayed as soon as you receive
|
|
|
|
them.
|
2015-05-05 16:30:51 +02:00
|
|
|
|
2015-06-25 18:07:19 +02:00
|
|
|
form.form-inline#form
|
|
|
|
.form-group
|
|
|
|
label Try another resolution (between 1 and 25)
|
|
|
|
input#num(type='number', min=1, max=25, value=5, style={"margin-left":"10px"})
|
|
|
|
.form-group
|
|
|
|
button#submit.btn.btn-primary(type='submit', style={"margin-left":"10px"}) Go
|
|
|
|
|
2015-05-05 16:30:51 +02:00
|
|
|
#container
|