node-hmd
Version:
NodeJS interface for head mounted displays positional data. Currently supports the Oculus Rift development kits.
82 lines (69 loc) • 2.08 kB
HTML
<html>
<head>
<title>Example node-hmd transport via Socket.IO</title>
<script type="text/javascript" src="/socket.io/socket.io.js"></script>
<script type="text/javascript">;
function appendToParent (parent, text) {
var td = document.createElement('td');
td.appendChild(document.createTextNode(text));
parent.appendChild(td);
}
var socket = io.connect('http://localhost:3000');
socket.on('update', function (data) {
var tr = document.createElement('tr');
appendToParent(tr, new Date().getTime());
appendToParent(tr, data.orientation.pitch);
appendToParent(tr, data.orientation.roll);
appendToParent(tr, data.orientation.yaw);
appendToParent(tr, data.position.x);
appendToParent(tr, data.position.y);
appendToParent(tr, data.position.z);
var parent = document.getElementById('data');
parent.insertBefore(tr, parent.firstChild);
if(parent.children.length > 100) {
parent.removeChild(parent.lastChild);
}
});
function adjustDelay(control) {
document.getElementById('delayLabel').firstChild.nodeValue = control.value +' ms';
socket.emit('adjust', control.value);
}
</script>
<style type="text/css">
* { font-family: "Courier New"; }
td { text-align: center; }
#attrib {
padding: 3px;
float: right; border: 1px solid #bfbfbf;
background-color: white;
box-shadow: 2px 2px 3px #aaaaaa;
}
#attrib, #attrib * { font-family: "Arial"; font-size: 10pt; }
</style>
</head>
<body>
<div id="attrib">
Built with <a href ="http://nodejs.org/">Node.js</a> and <a href ="http://socket.io/">Socket.IO</a>
</div>
<div style="padding-bottom: 1em;">
<label for="delay">Polling Delay</label>
<input id="delay" name="delay" type="range" min="20" max="1000" step="20" value="500" onChange="adjustDelay(this);"/>
<span id="delayLabel">500 ms</span>
</div>
<table>
<thead>
<th>Timestamp</th>
<th>Pitch</th>
<th>Roll</th>
<th>Yaw</th>
<th>X</th>
<th>Y</th>
<th>Z</th>
</thead>
<tbody id="data">
</tbody>
</table>
</body>
</html>