1 files changed, 24 insertions, 19 deletions

diff --git a/src/web/pinch.js b/src/web/pinch.js
index 935dfa0..bb06b0d 100644
--- a/src/web/pinch.js
+++ b/src/web/pinch.js
@@ -1,7 +1,6 @@
 class Pinch {
 	constructor(element) {
 		this.event_cache = [];
-		this.previous_diff = null;
 		this.onpinch = () => {};
 		this.onfinish = () => {};
 		this.onstart = () => {};
@@ -18,12 +17,17 @@ class Pinch {
 		this.event_cache.push(event);
 
 		if (this.event_cache.length === 2) {
+			const diff = Math.hypot(
+				this.event_cache[0].clientX - this.event_cache[1].clientX,
+				this.event_cache[0].clientY - this.event_cache[1].clientY,
+			);
+
 			const point = {
 				x: (this.event_cache[0].clientX + this.event_cache[1].clientX) / 2,
 				y: (this.event_cache[0].clientY + this.event_cache[1].clientY) / 2,
 			};
 
-			this.onstart({ point });
+			this.onstart({ point, distance: diff });
 		}
 	}
 
@@ -34,30 +38,35 @@ class Pinch {
 		this.event_cache[index] = event;
 
 		if (this.event_cache.length === 2) {
-			event.preventDefault();
-
 			const diff = Math.hypot(
 				this.event_cache[0].clientX - this.event_cache[1].clientX,
 				this.event_cache[0].clientY - this.event_cache[1].clientY,
 			);
 
-			if (this.previous_diff != null) {
-				const point = {
-					x: (this.event_cache[0].clientX + this.event_cache[1].clientX) / 2,
-					y: (this.event_cache[0].clientY + this.event_cache[1].clientY) / 2,
-				};
-
-				const delta = this.previous_diff - diff;
-				this.onpinch({ zoom_delta: delta, point });
-			}
+			const point = {
+				x: (this.event_cache[0].clientX + this.event_cache[1].clientX) / 2,
+				y: (this.event_cache[0].clientY + this.event_cache[1].clientY) / 2,
+			};
 
-			this.previous_diff = diff;
+			this.onpinch({ distance: diff, point });
 		}
 	}
 
 	pointer_up_handler(event) {
 		let cleanup = false;
+		const ev = {};
+
 		if (this.event_cache.length === 2) {
+			ev['distance'] = Math.hypot(
+				this.event_cache[0].clientX - this.event_cache[1].clientX,
+				this.event_cache[0].clientY - this.event_cache[1].clientY,
+			);
+
+			ev['point'] = {
+				x: (this.event_cache[0].clientX + this.event_cache[1].clientX) / 2,
+				y: (this.event_cache[0].clientY + this.event_cache[1].clientY) / 2,
+			};
+
 			cleanup = true;
 		}
 
@@ -66,12 +75,8 @@ class Pinch {
 		);
 		this.event_cache.splice(index, 1);
 
-		if (this.event_cache.length < 2) {
-			this.previous_diff = null;
-		}
-
 		if (cleanup) {
-			this.onfinish();
+			this.onfinish(ev);
 		}
 	}
 }