Peer-to-peer nose interaction

By Joann Myung and Dror Margalit

In this project, we attempted to increase our online presence and create a feeling of proximity. Using PoseNet, we made users control their position on the screen based on their "real-life" location. When users bump into each other, there is a "ding" sound, creating a feeling of proximity.

Code: https://github.com/DrorMargalit/peer-to-peer-nose

One of the challenging aspects of this code was to consistently send the position of the clients between the clients. To do so, we created a "draw" function that sends each client's socket ID and position.

		function draw() {
			if (poses.length > 0) {
		let pose = poses[0].pose
		mappedX = map(pose.nose.x, 100, 150, 100, 0)
		mappedY = map(pose.nose.y, 100, 300, 0, 100)
		document.getElementById('myvideo').style.top = mappedY + "%";														
		document.getElementById('myvideo').style.left = mappedX + "%";
		let datatosend = { id: socket.id, x: mappedX, y: mappedY };
							
		sendData(JSON.stringify(datatosend));
		myPosX = mappedX
		myPosY = mappedY
	}
}

This, however, did not work when a few clients joined because some of the socket.io functions interfered with the draw function. To solve it, we called the draw function every time clients receive information. Doing so allowed us to make sure that as long as there is a connection, clients will keep sending information to one another.