diff --git a/src/client/InputHandler.ts b/src/client/InputHandler.ts index 61f4f9635..b80de46f1 100644 --- a/src/client/InputHandler.ts +++ b/src/client/InputHandler.ts @@ -206,10 +206,9 @@ export class InputHandler { this.canvas.addEventListener( "wheel", (e) => { - if (!this.onTrackpadPan(e)) { - this.onScroll(e); - } + this.onScroll(e); this.onShiftScroll(e); + this.onTrackpadPan(e); e.preventDefault(); }, { passive: false }, @@ -498,8 +497,20 @@ export class InputHandler { const realCtrl = this.activeKeys.has("ControlLeft") || this.activeKeys.has("ControlRight"); - const ratio = event.ctrlKey && !realCtrl ? 10 : 1; // Compensate pinch-zoom low sensitivity - this.eventBus.emit(new ZoomEvent(event.x, event.y, event.deltaY * ratio)); + + const isZoomGesture = + event.ctrlKey || + event.metaKey || + Math.abs(event.deltaZ) > 0 || + (event.deltaMode === 1 && Math.abs(event.deltaY) > 0) || + (event.deltaMode === 0 && Math.abs(event.deltaY) >= 50); + + if (isZoomGesture) { + const ratio = event.ctrlKey && !realCtrl ? 10 : 1; + this.eventBus.emit( + new ZoomEvent(event.x, event.y, event.deltaY * ratio), + ); + } } } @@ -511,25 +522,32 @@ export class InputHandler { } } - private onTrackpadPan(event: WheelEvent): boolean { - if (event.shiftKey || event.ctrlKey || event.metaKey) { - return false; + private onTrackpadPan(event: WheelEvent) { + if (event.shiftKey) { + return; } - const isTrackpadPan = event.deltaMode === 0 && event.deltaX !== 0; - - if (!isTrackpadPan) { - return false; + if (event.ctrlKey || event.metaKey) { + return; } - const panSensitivity = 1.0; - const deltaX = -event.deltaX * panSensitivity; - const deltaY = -event.deltaY * panSensitivity; + const isTrackpadPan = + event.deltaMode === 0 && + (Math.abs(event.deltaX) > 0 || Math.abs(event.deltaY) > 0) && + ((Math.abs(event.deltaX) > 0 && Math.abs(event.deltaY) > 0) || + event.deltaX % 1 !== 0 || + event.deltaY % 1 !== 0 || + (Math.abs(event.deltaX) < 30 && Math.abs(event.deltaY) < 30)); - if (Math.abs(deltaX) > 0.5 || Math.abs(deltaY) > 0.5) { - this.eventBus.emit(new DragEvent(deltaX, deltaY)); + if (isTrackpadPan) { + const panSensitivity = 1.0; + const deltaX = -event.deltaX * panSensitivity; + const deltaY = -event.deltaY * panSensitivity; + + if (Math.abs(deltaX) > 0.5 || Math.abs(deltaY) > 0.5) { + this.eventBus.emit(new DragEvent(deltaX, deltaY)); + } } - return true; } private onPointerMove(event: PointerEvent) { @@ -583,11 +601,6 @@ export class InputHandler { private onTouchStart(event: TouchEvent) { if (event.touches.length === 2) { event.preventDefault(); - // Solve screen jittering problem - const touch1 = event.touches[0]; - const touch2 = event.touches[1]; - this.lastPointerX = (touch1.clientX + touch2.clientX) / 2; - this.lastPointerY = (touch1.clientY + touch2.clientY) / 2; } }