- improved touch events

Author: janbender

examples/particle_system.html

@@ -349,8 +349,8 @@ <h3>4. Time integration</h3>
 		{
 			let rect = canvas.getBoundingClientRect();
 			return {
-				x: event.clientX - rect.left,
-				y: event.clientY - rect.top
+				x: (event.clientX - rect.left) * canvas.width  / rect.width,
+				y: (event.clientY - rect.top)  * canvas.height / rect.height
 			};
 		}
 

examples/particle_system_rb.html

@@ -378,8 +378,8 @@ <h3>4. Time integration</h3>
 		{
 			let rect = canvas.getBoundingClientRect();
 			return {
-				x: event.clientX - rect.left,
-				y: event.clientY - rect.top
+				x: (event.clientX - rect.left) * canvas.width  / rect.width,
+				y: (event.clientY - rect.top)  * canvas.height / rect.height
 			};
 		}
 

examples/sdf_box_plot.html

@@ -319,8 +319,8 @@ <h3>Closest point on the surface</h3>
 		{
 			let rect = canvas.getBoundingClientRect();
 			return {
-				x: event.clientX - rect.left,
-				y: event.clientY - rect.top
+				x: (event.clientX - rect.left) * canvas.width  / rect.width,
+				y: (event.clientY - rect.top)  * canvas.height / rect.height
 			};
 		}
 
@@ -382,7 +382,7 @@ <h3>Closest point on the surface</h3>
 			else if (event.touches.length === 2)
 			{
 				// deselect any dragged particle while pinching
-				this.selectedParticle = -1;
+				this.selected = -1;
 				const dist = this.getPinchDist(event);
 				if (this.lastPinchDist !== null)
 				{

examples/sdf_sphere_plot.html

@@ -279,8 +279,8 @@ <h3>Closest point on the surface</h3>
 		{
 			let rect = canvas.getBoundingClientRect();
 			return {
-				x: event.clientX - rect.left,
-				y: event.clientY - rect.top
+				x: (event.clientX - rect.left) * canvas.width  / rect.width,
+				y: (event.clientY - rect.top)  * canvas.height / rect.height
 			};
 		}
 
@@ -342,7 +342,7 @@ <h3>Closest point on the surface</h3>
 			else if (event.touches.length === 2)
 			{
 				// deselect any dragged particle while pinching
-				this.selectedParticle = -1;
+				this.selected = -1;
 				const dist = this.getPinchDist(event);
 				if (this.lastPinchDist !== null)
 				{

examples/shape_matching.html

@@ -633,8 +633,8 @@ <h3>References</h3>
 		{
 			let rect = canvas.getBoundingClientRect();
 			return {
-				x: event.clientX - rect.left,
-				y: event.clientY - rect.top
+				x: (event.clientX - rect.left) * canvas.width  / rect.width,
+				y: (event.clientY - rect.top)  * canvas.height / rect.height
 			};
 		}