Explorar el Código

fix: pinching in LogseqPortalShape

Peng Xiao hace 3 años
padre
commit
7606fa1c04

+ 14 - 1
tldraw/apps/tldraw-logseq/src/lib/tools/LogseqPortalTool/LogseqPortalTool.tsx

@@ -1,5 +1,6 @@
-import { TLApp, TLTool } from '@tldraw/core'
+import { TLApp, TLEvents, TLTool } from '@tldraw/core'
 import type { TLReactEventMap } from '@tldraw/react'
+import Vec from '@tldraw/vec'
 import { LogseqPortalShape, Shape } from '~lib/shapes'
 import { CreatingState, IdleState } from './states'
 
@@ -14,4 +15,16 @@ export class LogseqPortalTool extends TLTool<
   static initial = 'idle'
 
   Shape = LogseqPortalShape
+
+  private pinchCamera(point: number[], delta: number[], zoom: number) {
+    const { camera } = this.app.viewport
+    const nextPoint = Vec.sub(camera.point, Vec.div(delta, camera.zoom))
+    const p0 = Vec.sub(Vec.div(point, camera.zoom), nextPoint)
+    const p1 = Vec.sub(Vec.div(point, zoom), nextPoint)
+    this.app.setCamera(Vec.toFixed(Vec.add(nextPoint, Vec.sub(p1, p0))), zoom)
+  }
+
+  onPinch: TLEvents<Shape>['pinch'] = info => {
+    this.pinchCamera(info.point, [0, 0], info.offset[0])
+  }
 }

+ 1 - 1
tldraw/apps/tldraw-logseq/src/lib/tools/LogseqPortalTool/states/IdleState.tsx

@@ -1,4 +1,4 @@
-import { TLApp, TLCursor, TLToolState } from '@tldraw/core'
+import { TLApp, TLCursor, TLStateEvents, TLToolState } from '@tldraw/core'
 import type { TLReactEventMap, TLReactEvents } from '@tldraw/react'
 import type { Shape } from '~lib/shapes'
 import type { LogseqPortalTool } from '../LogseqPortalTool'

+ 0 - 9
tldraw/packages/core/src/lib/tools/TLSelectTool/states/PinchingState.ts

@@ -19,10 +19,6 @@ export class PinchingState<
 > extends TLToolState<S, K, R, P> {
   static id = 'pinching'
 
-  private origin: number[] = [0, 0]
-
-  private prevDelta: number[] = [0, 0]
-
   private pinchCamera(point: number[], delta: number[], zoom: number) {
     const { camera } = this.app.viewport
     const nextPoint = Vec.sub(camera.point, Vec.div(delta, camera.zoom))
@@ -31,11 +27,6 @@ export class PinchingState<
     this.app.setCamera(Vec.toFixed(Vec.add(nextPoint, Vec.sub(p1, p0))), zoom)
   }
 
-  onEnter = (info: GestureInfo<S, K>) => {
-    this.prevDelta = info.info.delta
-    this.origin = info.info.point
-  }
-
   onPinch: TLEvents<S>['pinch'] = info => {
     this.pinchCamera(info.point, [0, 0], info.offset[0])
   }