Merge pull request #6 from nickrhalvorsen/snake-adjustments

Add multiple controller support by introducing a client id
JMU-CS · Oct 8, 2018 · 142711b · 142711b
2 parents b597cff + 2ac9f7b
commit 142711b
Show file tree

Hide file tree

Showing 6 changed files with 40 additions and 37 deletions.
diff --git a/framework/games/draw.js b/framework/games/draw.js
@@ -6,7 +6,7 @@ function gameMessageHandler(msg) {
 
 var touchX = 0, touchY = 0, lastTouchX = 0, lastTouchY = 0;
 
-function touchMove(x, y) {
+function touchMove(x, y, id) {
     touchX = x * windowWidth;
     touchY = y * windowHeight;
 }
@@ -21,7 +21,7 @@ function setup() {
 var currentColor = 0;
 
 function draw() {
-    colorMode(RGB, 255);    
+    colorMode(RGB, 255);
     fill(0,0,0,10.0);
     rect(0, 0, windowWidth, windowHeight);
     colorMode(HSB, 255);

diff --git a/framework/games/snake.js b/framework/games/snake.js
@@ -30,15 +30,12 @@ function setup() {
   canv.parent("bgCanvas");
 
   //Setup New Game
-  frameRate(gameSpeed); //TODO Change speed based on score?
+  frameRate(gameSpeed);
   generateFood();
   newGame();
 }
 
-//TODO Player Movement...
-
-function touchStart(x, y) {
-  console.log(x + " " + y);
+function touchStart(x, y, id) {
   if(y > x) {
     if(1-x > y) {
       if(dir !== "right") {

diff --git a/framework/games/splash-sketch.js b/framework/games/splash-sketch.js
@@ -7,15 +7,15 @@ function gameMessageHandler(msg) {
 
 var touchX = 0, touchY = 0;
 
-var showInteraction = false; 
-var interactionTimer = undefined; 
+var showInteraction = false;
+var interactionTimer = undefined;
 
-function touchMove(x, y) {
+function touchMove(x, y, id) {
   touchX = x * windowWidth;
   touchY = y * windowHeight;
   if (interactionTimer != undefined) clearTimeout(interactionTimer);
   interactionTimer = setTimeout(function () {
-    showInteraction = false; 
+    showInteraction = false;
   }, 60000);
   showInteraction = true;
 }
@@ -35,23 +35,23 @@ class Sparkler {
     update() {
         this.px += this.vx;
         this.py += this.vy;
-      
+
         if (this.px < 0) {
             this.px = 0;
             this.vx = -this.vx;
         } else if (this.px > windowWidth) {
             this.px = windowWidth;
             this.vx = -this.vx;
         }
-      
+
         if (this.py < 0) {
             this.py = 0;
             this.vy = -this.vy;
         } else if (this.py > windowHeight) {
             this.py = windowHeight;
             this.vy = -this.vy;
         }
-      
+
         if (Math.random(20) == 1) {
           var theta = Math.random()/10.0;
           this.vx = this.vx * Math.cos(theta) - this.vy * Math.sin(theta);
@@ -78,7 +78,7 @@ var mouseSparkler = new Sparkler();
 function setup() {
   var canv = createCanvas(windowWidth, windowHeight);
   canv.parent("bgCanvas");
-  
+
   colorMode(HSB, 255);
   for (var i = 0; i < 3; i++) {
     sparklers.push(new Sparkler());
@@ -105,9 +105,9 @@ function drawCircles(cx, cy, fillColor) {
 }
 
 function draw() {
-  if (whiteBackground) 
+  if (whiteBackground)
     background(255,0,255);
-  else 
+  else
     background(255,255,0);
   fill(254, 190, 190);
   textAlign(RIGHT);
@@ -125,7 +125,7 @@ function draw() {
 }
 
 function update() {
-  
+
     for (var i = 0; i < sparklers.length; i++) {
       sparklers[i].update();
     }
@@ -135,4 +135,4 @@ function update() {
 
 function mouseClicked() {
   //alert("hi");
-}
+}
diff --git a/framework/lib/player.js b/framework/lib/player.js
@@ -2,9 +2,9 @@ var p5functions = ['preload', 'setup', 'draw', 'keyPressed', 'keyReleased', 'key
 
 var activeSketch;
 var theGameMessageHandler = null;
-var touchStartHandler = function(x, y) {};
-var touchMoveHandler = function(x, y) {};
-var touchEndHandler = function(x, y) {};
+var touchStartHandler = function(x, y, id) {};
+var touchMoveHandler = function(x, y, id) {};
+var touchEndHandler = function(x, y, id) {};
 
 // adapted from p5js.org, originally by Lauren McCarthy
 // https://github.com/processing/p5.js-website/blob/master/js/render.js
@@ -31,7 +31,7 @@ function playCode(code) {
         if (typeof touchEnd !== "undefined") { touchEndHandler = touchEnd; }
 
         if (typeof githubAccount !== "undefined" && typeof userpic !== "undefined") {
-      
+
           $("#slides").hide();
           $("#branding").hide();
           $("#url").hide();

diff --git a/framework/player.html b/framework/player.html
@@ -106,10 +106,12 @@ <h1 id="branding" style="z-index: 200; margin-bottom: 0; left: 0.5em; position:f
         socket.on(
             "touch start",
             function(msg) {
-                var pos = msg.split(" ");
+                var split = msg.split(":");
+                var id = split[1];
+                var pos = split[0].split(" ");
                 var x = parseFloat(pos[0]);
                 var y = parseFloat(pos[1]);
-                touchStartHandler(x,y);
+                touchStartHandler(x,y,id);
                 if (sketch_reloader != undefined) {
                     clearTimeout(sketch_reloader);
                     sketch_reloader = setTimeout(function() {
@@ -122,10 +124,12 @@ <h1 id="branding" style="z-index: 200; margin-bottom: 0; left: 0.5em; position:f
         socket.on(
             "touch end",
             function(msg) {
-                var pos = msg.split(" ");
-                var x = parseFloat(pos[0]);
-                var y = parseFloat(pos[1]);
-                touchStartHandler(x,y);
+              var split = msg.split(":");
+              var id = split[1];
+              var pos = split[0].split(" ");
+              var x = parseFloat(pos[0]);
+              var y = parseFloat(pos[1]);
+                touchStartHandler(x,y,id);
                 if (sketch_reloader != undefined) {
                     clearTimeout(sketch_reloader);
                     sketch_reloader = setTimeout(function() {
@@ -138,10 +142,12 @@ <h1 id="branding" style="z-index: 200; margin-bottom: 0; left: 0.5em; position:f
         socket.on(
             "touch move",
             function(msg) {
-                var pos = msg.split(" ");
-                var x = parseFloat(pos[0]);
-                var y = parseFloat(pos[1]);
-                touchMoveHandler(x,y);
+              var split = msg.split(":");
+              var id = split[1];
+              var pos = split[0].split(" ");
+              var x = parseFloat(pos[0]);
+              var y = parseFloat(pos[1]);
+                touchMoveHandler(x,y,id);
                 if (sketch_reloader != undefined) {
                     clearTimeout(sketch_reloader);
                     sketch_reloader = setTimeout(function() {

diff --git a/index.js b/index.js
@@ -38,23 +38,23 @@ io.of("/controller").on('connection', function(socket) {
         if (playerSocket != null) {
             playerSocket.emit('load game', msg);
         }
-    });
+    })
 
     socket.on('touch start', function(msg) {
         if (playerSocket != null) {
-            playerSocket.emit('touch start', msg);
+            playerSocket.emit('touch start', msg + ":" + socket.id);
         }
     })
 
     socket.on('touch end', function(msg) {
         if (playerSocket != null) {
-            playerSocket.emit('touch end', msg);
+            playerSocket.emit('touch end', msg + ":" + socket.id);
         }
     })
 
     socket.on('touch move', function(msg) {
         if (playerSocket != null) {
-            playerSocket.emit('touch move', msg);
+            playerSocket.emit('touch move', msg + ":" + socket.id);
         }
     })