make nodejs sample use p5

stimulant · Nov 25, 2014 · 9ba6d21 · 9ba6d21
1 parent 5d66950
commit 9ba6d21
Show file tree

Hide file tree

Showing 15 changed files with 78 additions and 111 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,5 +1,5 @@
 # Node modules
-Samples/NodeJSSample/node_modules/
+Samples/P5NodeJSSample/node_modules/
 
 # Compiled Object files
 *.slo

diff --git a/Samples/NodeJSSample/web/application.js b/Samples/NodeJSSample/web/application.js
diff --git a/Samples/NodeJSSample/lib/tcpServer.js → Samples/P5NodeJSSample/lib/tcpServer.js b/Samples/NodeJSSample/lib/tcpServer.js → Samples/P5NodeJSSample/lib/tcpServer.js
diff --git a/Samples/NodeJSSample/lib/webServer.js → Samples/P5NodeJSSample/lib/webServer.js b/Samples/NodeJSSample/lib/webServer.js → Samples/P5NodeJSSample/lib/webServer.js
diff --git a/Samples/NodeJSSample/package.json → Samples/P5NodeJSSample/package.json b/Samples/NodeJSSample/package.json → Samples/P5NodeJSSample/package.json
diff --git a/Samples/NodeJSSample/server.bat → Samples/P5NodeJSSample/server.bat b/Samples/NodeJSSample/server.bat → Samples/P5NodeJSSample/server.bat
diff --git a/Samples/NodeJSSample/server.js → Samples/P5NodeJSSample/server.js b/Samples/NodeJSSample/server.js → Samples/P5NodeJSSample/server.js
diff --git a/Samples/NodeJSSample/web/Logo.png → Samples/P5NodeJSSample/web/Logo.png b/Samples/NodeJSSample/web/Logo.png → Samples/P5NodeJSSample/web/Logo.png
diff --git a/Samples/P5NodeJSSample/web/application.js b/Samples/P5NodeJSSample/web/application.js
@@ -0,0 +1,20 @@
+var socket = io.connect( jQuery.data( $("head")[0], "data").server_url );
+$.timeago.settings.strings.seconds = "%d seconds";
+
+//
+// DO ACTUAL STARTUP
+//
+socket.on('connect', function(){});
+
+// update depth buffer
+var timeSinceUpdateDepth = 0;
+socket.on('updateDepth', function(data) {
+	var imgArray = new Uint8Array(data.buffer);
+	updateDepth(imgArray);
+});
+
+// update clients list
+var timeSinceUpdateBodies = 0;
+socket.on('updateBodies', function(data) {
+	updateBodies(data);
+});
diff --git a/Samples/NodeJSSample/web/servers.html → Samples/P5NodeJSSample/web/servers.html b/Samples/NodeJSSample/web/servers.html → Samples/P5NodeJSSample/web/servers.html
@@ -2,6 +2,7 @@
 <html>
 <head>
 <script src="/socket.io/socket.io.js" type="text/javascript"></script>
+<script src="vendor/p5.min.js" type="text/javascript"7></script>
 <script src="vendor/jquery.min.js" type="text/javascript"7></script>
 <script src="vendor/jquery.timeago.js" type="text/javascript"></script>
 <script>
@@ -10,9 +11,14 @@
 });
 </script>
 <script src="application.js" type="text/javascript"></script>
+<script src="sketch.js" type="text/javascript"></script>
 <link rel="stylesheet" type="text/css" href="styles.css">
 </head>
 <body>
+
+
+
+	<!--
 	<h1>Kinect Debug</h1>
 	<section style="height: 434px;">
 		<div style="position: relative; width: 50%; margin: 0 auto;">
@@ -59,6 +65,6 @@ <h1>Kinect Debug</h1>
 				<tr><td>24</td><td id="joint_x_24"/><td id="joint_y_24"/><td id="joint_z_24"/></tr>
 			</tbody>
 		</table>
-	</section>
+	</section>-->
 </body>
 </html>
diff --git a/Samples/P5NodeJSSample/web/sketch.js b/Samples/P5NodeJSSample/web/sketch.js
@@ -0,0 +1,45 @@
+var img;
+var bodyData;
+
+function setup() {
+  createCanvas(512, 424); 
+  img = createImage(512, 424);
+}
+
+function updateDepth(imgArray) {
+	img.loadPixels();
+	  for(var x = 0; x < 512; x++) {
+	    for(var y = 0; y < 424; y++) {
+	    	var avg = imgArray[y*512 + x];
+	      img.set(x, y, [avg, avg, avg, 255]); 
+	    }
+	  }
+	  img.updatePixels();
+}
+
+function updateBodies(data) {
+	bodyData = data;
+}
+
+function drawBodies() {
+	if (bodyData != undefined) {
+		noStroke();
+		fill(255,50);
+		ellipseMode(CENTER);
+
+		for (var b in bodyData.bodies) {
+			if (bodyData.bodyTrackingIds[b] != 0) {
+				for (var i in bodyData.bodies[b]) {
+				  ellipse(bodyData.bodies[b][i].x * canvas.width/2 + canvas.width/2.0,
+								(1.0-bodyData.bodies[b][i].y) * canvas.height/2,16,16);
+				}
+			}
+		}
+	}
+}
+
+function draw() {
+  background(0);
+  image(img, 0, 0, 512, 424);
+  drawBodies();
+}
diff --git a/Samples/NodeJSSample/web/styles.css → Samples/P5NodeJSSample/web/styles.css b/Samples/NodeJSSample/web/styles.css → Samples/P5NodeJSSample/web/styles.css
diff --git a/...les/NodeJSSample/web/vendor/jquery.min.js → ...s/P5NodeJSSample/web/vendor/jquery.min.js b/...les/NodeJSSample/web/vendor/jquery.min.js → ...s/P5NodeJSSample/web/vendor/jquery.min.js
diff --git a/...NodeJSSample/web/vendor/jquery.timeago.js → ...NodeJSSample/web/vendor/jquery.timeago.js b/...NodeJSSample/web/vendor/jquery.timeago.js → ...NodeJSSample/web/vendor/jquery.timeago.js
diff --git a/Samples/P5NodeJSSample/web/vendor/p5.min.js b/Samples/P5NodeJSSample/web/vendor/p5.min.js