feat: add configurable timer to emitter

backend/server.js

@@ -50,8 +50,11 @@ app.get('/receiver/json', function (req, res) {
 
 receiverIo.sockets.on('connection', (socket) =>{
 	console.log(`Connecté au client ${socket.id}`);
+
 	const dgramCallback = function (buf) {
-		// console.log(oscParser.decode(buf));
+		if (config.app.debug.receiver['osc-datagram']) {
+			console.log(oscParser.decode(buf));
+		}
 		socket.emit('osc', oscParser.decode(buf));
 	};
 
@@ -152,16 +155,32 @@ function getOrientation(dotTrio, topIndex) {
 	 //return length ;
 }
 
+let currentOscBundle = null;
+let hasPending = false;
+let waiting = false;
+
+const sendBundle = () => {
+	if (hasPending) {
+		emitterOscClient.send(currentOscBundle, () => {
+			hasPending = false;
+		});
+	}
+	setTimeout(() => {
+		sendBundle();
+	}, config.app.timerRefresh);
+};
+sendBundle();
+
 app.post('/emitter/json', function (req, res) {
-	if (req.body.debug) {
-		//console.log(req.body);
+	if (req.body.debug && config.app.debug.emitter['http-request']) {
+		console.log('## Emitter POST request ##');
 	}
 	let oscBundle;
 	if (req.body.event === 'touchend') {
 		fseq = fseq ? fseq + 1 : 1;
 
 		const aliveMessage = [ '/tuio/2Dcur', 'alive' ].concat(alive);
-		oscBundle = new Bundle(
+		currentOscBundle = new Bundle(
 			[ '/tuio/2Dcur', 'source', `tangibles${req.body.section.toString()}@127.0.0.1` ],
 			aliveMessage,
 			[ '/tuio/2Dcur', 'fseq', fseq ],
@@ -171,18 +190,19 @@ app.post('/emitter/json', function (req, res) {
 				req.body.changedTouches[0].identifier
 			]
 		);
-		emitterOscClient.send(oscBundle, () => {
+		emitterOscClient.send(currentOscBundle, () => {
 			const index = alive.indexOf(req.body.changedTouches[0].identifier);
 			alive.splice(index, 1);
 			if (alive.length === 0) {
-				oscBundle = new Bundle(
+				currentOscBundle = new Bundle(
 					[ '/tuio/2Dcur', 'source', `tangibles${req.body.section.toString()}@127.0.0.1` ],
 					[ '/tuio/2Dcur', 'alive' ],
 					[ '/tuio/2Dcur', 'fseq', fseq ]
 				);
-				emitterOscClient.send(oscBundle, () => {
+				emitterOscClient.send(currentOscBundle, () => {
 					res.status(200).send();
 					fseq = 0;
+					hasPending = false;
 				});
 			} else {
 				res.status(200).send();
@@ -201,10 +221,6 @@ app.post('/emitter/json', function (req, res) {
 				}
 			});
 
-
-
-
-
 			/* Listage de tous les points */
 			const dots = [];
 			touches.forEach(function(touch) {
@@ -214,7 +230,9 @@ app.post('/emitter/json', function (req, res) {
 					y: req.body.changedTouches[touch].clientY
 				});
 			});
-			// console.log(dots, dots.length);
+			if (req.body.debug && config.app.debug.emitter.dots) {
+				console.log('-- dots --', dots);
+			}
 
 			/* Listage des segments */
 			const segments = [];
@@ -244,7 +262,9 @@ app.post('/emitter/json', function (req, res) {
 					}
 				}
 			}
-			// console.log(segments, segments.length);
+			if (req.body.debug && config.app.debug.emitter.segments) {
+				console.log('-- segments --', segments);
+			}
 
 			/* Listage des triangles */
 			const triangles = [];
@@ -275,14 +295,16 @@ app.post('/emitter/json', function (req, res) {
 					}
 				}
 			});
-			 console.log(triangles, triangles.length);
+			if (req.body.debug && config.app.debug.emitter.triangles) {
+				console.log('-- triangles --', triangles);
+			}
 
 			//MOD TITI
 			//objet pour stocker les informations des triangles identifiés (points, centre, apexAngle, orientation, indice apex, width, height)
 
 			objTriangle = {} ;
 
-			/* Définition de l'apex */
+			/* Définition de l'apex, de la position du centre et de l'orientation */
 			triangles.forEach(triangle => {
 				objTriangle.dots = [];
 				objTriangle.dots[0] = dots[triangle[0]];
@@ -297,35 +319,11 @@ app.post('/emitter/json', function (req, res) {
 
 				objTriangle.angleApex = getAngleApex(objTriangle.dots, objTriangle.apex) ;
 				objTriangle.orientation = getOrientation(objTriangle.dots, objTriangle.apex) ;
-				// /* on récupère les 3 côtés (segments) du triangle */
-				// const segment1 = segments.find(segment => {
-				// 	return segment.identifiers.includes(triangle[0]) && segment.identifiers.includes(triangle[1]);
-				// });
-				// const segment2 = segments.find(segment => {
-				// 	return segment.identifiers.includes(triangle[1]) && segment.identifiers.includes(triangle[2]);
-				// });
-				// const segment3 = segments.find(segment => {
-				// 	return segment.identifiers.includes(triangle[0]) && segment.identifiers.includes(triangle[2]);
-				// });
-				// /* on trouve quel côté est le plus court
-				//  * NOTE: dans notre cas, l'apex sera toujours le point opposé au plus petit côté
-				//  * cette méthode n'est pas généralisable à d'autres projets */
-				// const smallestSegment = [segment1, segment2, segment3].reduce(function(prev, current) {
-				// 	return (prev.hyp < current.hyp) ? prev : current
-				// });
-
-				// /* on déduit quel point du triangle est l'apex */
-				// const apexDot = triangle.find(dot => {
-				// 	return dot !== smallestSegment.identifiers[0] && dot !== smallestSegment.identifiers[1];
-				// });
-				console.log(objTriangle.apex);
-				console.log('centerPos : ' + objTriangle.center + ' orientation : ' + objTriangle.orientation);
-
-				/* Reste à faire:
-				 * trouver la valeur de l'angle de l'apex (théorème des cosinus)
-				 * trouver le "centre" du triangle (via les orthocentres ou médianes??)
-				 * déduire l'orientation du triangle
-				 */
+
+				if (req.body.debug) {
+					console.log('-- apex --', objTriangle.apex);
+					console.log('centerPos : ' + objTriangle.center + ' orientation : ' + objTriangle.orientation);
+				}
 			});
 
 
@@ -394,36 +392,34 @@ app.post('/emitter/json', function (req, res) {
 			// 		]
 			// 	);
 			// });
-			oscBundle = new Bundle ;
-			oscBundle.append([ '/tuio/2Dobj', 'alive', 1 ]);
-			if (objTriangle.dots != undefined){
-				oscBundle.append([
-						'/tuio/2Dobj',
-						'set',
-						1,
-						1,
-						objTriangle.center[0],
-						objTriangle.center[1],
-						objTriangle.orientation,
-						0.0,
-						0.0,
-						0.0,
-						0.0,
-						0.0
-					]);
-				}
-				oscBundle.append([ '/tuio/2Dobj', 'fseq', fseq ]);
-				emitterOscClient.send(oscBundle, () => {
-					res.status(200).send();
-				});
-			} else {
-				res.status(400).send();
+			currentOscBundle = new Bundle ;
+			currentOscBundle.append([ '/tuio/2Dobj', 'alive', 1 ]);
+			if (objTriangle.dots != undefined) {
+				currentOscBundle.append([
+					'/tuio/2Dobj',
+					'set',
+					1,
+					1,
+					objTriangle.center[0],
+					objTriangle.center[1],
+					objTriangle.orientation,
+					0.0,
+					0.0,
+					0.0,
+					0.0,
+					0.0
+				]);
 			}
+
+			currentOscBundle.append(['/tuio/2Dobj', 'fseq', fseq]);
+			hasPending = true;
+			res.status(200).send();
+		} else {
+			res.status(400).send();
+		}
 	}
 });
 
-
-
 httpServer.listen(config.app.httpPort, function () {
  console.log(`Votre app est disponible sur localhost:${config.app.httpPort} !`)
 });

frontend/assets/config.json

@@ -1,10 +1,20 @@
 {
 	"app": {
-		"debug": 0,
 		"oscUdpPort": 3333,
 		"httpPort": 5000,
 		"timerRefresh": 50,
-		"maxDistanceBetweenPoints": 750
+		"maxDistanceBetweenPoints": 750,
+		"debug": {
+			"emitter": {
+				"http-request": true,
+				"dots": true,
+				"segments": true,
+				"triangles": true
+			},
+			"receiver": {
+				"osc-datagram": true
+			}
+		}
 	},
 	"triangles": []
 }