I am working on making an interface for a Leap motion controlled robot. From the server side node.js, I am emitting an event 'action' which contains the data to be displayed on a HTML page. I have implemented a modified version of the leap rigged hand (original code: http://ift.tt/1HGVe0V).
<html>
<head>
<title>Locomotion</title>
<script src="http://ift.tt/1JVcsqq"></script>
<script src="http://ift.tt/1HGVfSq"></script>
<script src="http://ift.tt/1JVcq1X"></script>
<script src="http://ift.tt/1HGVe0X"></script>
<script src="jquery.js"></script>
<script src="/http://ift.tt/1aeIZU4"></script>
<style>
body {
font-family: 'Myriad Pro', Helvetica, Arial, 'Lucida Grande', sans-serif;
font-size: 24pt;
color: white;
background-color: #348cb2;
}
#display {
position: fixed;
height: 50px;
width: 300px;
background: #fdd;
bottom: 10;
left: 10;
padding: 5px;
}
#direction {
color: #f77;
display: block;
height: 100%;
width: 200px;
padding-top: 5px;
margin: 0 auto;
text-align: center;
}
</style>
</head>
<body>
<div id="display"><span id="direction">undefined</span></div>
</body>
<script type="text/javascript">
var riggedHandPlugin,
socket = io();
socket.on('action', function(data) {
$('#display').html(data);
});
/*
Leap.loop({
hand: function(hand){
var handMesh = hand.data('riggedHand.mesh');
handMesh.material.opacity = 1;
handMesh.material.color.set('#7b4b2a');
handMesh.material.ambient = handMesh.material.color;
var screenPosition = handMesh.screenPosition(
hand.palmPosition,
riggedHandPlugin.camera
);
}
})
.use('riggedHand', {
scale: 1.5,
opacity : 1
});
riggedHandPlugin = Leap.loopController.plugins.riggedHand; */
</script>
With the above commented version, socket displays the 'action' data. However, the leap rigged hand won't be displayed.
Whereas, uncommenting would show the leap rigged hand, but wouldn't change the 'action' data in the
I'm stuck with this for a couple of days and I can't think of what to do.
Kindly help
Aucun commentaire:
Enregistrer un commentaire