浏览代码

Fix page zoom bug

main
Steve Ruiz 4 年前
父节点
当前提交
7e03adcd52
共有 6 个文件被更改,包括 24 次插入6 次删除
  1. 1
    3
      components/canvas/selected.tsx
  2. 1
    1
      lib/shape-utils/arrow.tsx
  3. 2
    0
      lib/shape-utils/rectangle.tsx
  4. 4
    1
      state/hacks.ts
  5. 11
    1
      state/inputs.tsx
  6. 5
    0
      state/state.ts

+ 1
- 3
components/canvas/selected.tsx 查看文件

64
 })
64
 })
65
 
65
 
66
 const SelectIndicator = styled('path', {
66
 const SelectIndicator = styled('path', {
67
-  zStrokeWidth: 1,
67
+  zStrokeWidth: 2,
68
   strokeLineCap: 'round',
68
   strokeLineCap: 'round',
69
   strokeLinejoin: 'round',
69
   strokeLinejoin: 'round',
70
   stroke: '$selected',
70
   stroke: '$selected',
71
-  fill: 'transparent',
72
   pointerEvents: 'none',
71
   pointerEvents: 'none',
73
-  paintOrder: 'stroke fill markers',
74
 
72
 
75
   variants: {
73
   variants: {
76
     isLocked: {
74
     isLocked: {

+ 1
- 1
lib/shape-utils/arrow.tsx 查看文件

135
           <path
135
           <path
136
             d={getArrowArcPath(start, end, circle, bend)}
136
             d={getArrowArcPath(start, end, circle, bend)}
137
             fill="none"
137
             fill="none"
138
-            strokeWidth={+style.strokeWidth * 1.85}
138
+            strokeWidth={(+style.strokeWidth * 1.85).toString()}
139
             strokeLinecap="round"
139
             strokeLinecap="round"
140
           />
140
           />
141
           <path d={path} strokeWidth={+style.strokeWidth * 1.5} />
141
           <path d={path} strokeWidth={+style.strokeWidth * 1.5} />

+ 2
- 0
lib/shape-utils/rectangle.tsx 查看文件

51
     return (
51
     return (
52
       <g id={id}>
52
       <g id={id}>
53
         <rect
53
         <rect
54
+          className="hi"
54
           rx={radius}
55
           rx={radius}
55
           ry={radius}
56
           ry={radius}
56
           x={+styles.strokeWidth / 2}
57
           x={+styles.strokeWidth / 2}
58
           width={Math.max(0, size[0] + -styles.strokeWidth)}
59
           width={Math.max(0, size[0] + -styles.strokeWidth)}
59
           height={Math.max(0, size[1] + -styles.strokeWidth)}
60
           height={Math.max(0, size[1] + -styles.strokeWidth)}
60
           strokeWidth={0}
61
           strokeWidth={0}
62
+          fill={styles.fill}
61
         />
63
         />
62
         <path d={path} fill={styles.stroke} />
64
         <path d={path} fill={styles.stroke} />
63
       </g>
65
       </g>

+ 4
- 1
state/hacks.ts 查看文件

81
   const p1 = screenToWorld(point, data)
81
   const p1 = screenToWorld(point, data)
82
   camera.point = vec.add(camera.point, vec.sub(p1, p0))
82
   camera.point = vec.add(camera.point, vec.sub(p1, p0))
83
 
83
 
84
-  data.pageStates[data.currentPageId].camera = { ...camera }
84
+  const pageState = data.pageStates[data.currentPageId]
85
+  pageState.camera = { ...camera }
86
+
87
+  data.pageStates[data.currentPageId] = { ...pageState }
85
 
88
 
86
   state.forceData(Object.freeze(data))
89
   state.forceData(Object.freeze(data))
87
 }
90
 }

+ 11
- 1
state/inputs.tsx 查看文件

9
   activePointerId?: number
9
   activePointerId?: number
10
   lastPointerUpTime = 0
10
   lastPointerUpTime = 0
11
   points: Record<string, PointerInfo> = {}
11
   points: Record<string, PointerInfo> = {}
12
+  lastPointer: PointerInfo
12
 
13
 
13
   touchStart(e: TouchEvent | React.TouchEvent, target: string) {
14
   touchStart(e: TouchEvent | React.TouchEvent, target: string) {
14
     const { shiftKey, ctrlKey, metaKey, altKey } = e
15
     const { shiftKey, ctrlKey, metaKey, altKey } = e
30
     this.points[touch.identifier] = info
31
     this.points[touch.identifier] = info
31
     this.activePointerId = touch.identifier
32
     this.activePointerId = touch.identifier
32
 
33
 
34
+    this.lastPointer = info
33
     return info
35
     return info
34
   }
36
   }
35
 
37
 
55
       this.points[touch.identifier] = info
57
       this.points[touch.identifier] = info
56
     }
58
     }
57
 
59
 
60
+    this.lastPointer = info
58
     return info
61
     return info
59
   }
62
   }
60
 
63
 
76
     this.points[e.pointerId] = info
79
     this.points[e.pointerId] = info
77
     this.activePointerId = e.pointerId
80
     this.activePointerId = e.pointerId
78
 
81
 
82
+    this.lastPointer = info
79
     return info
83
     return info
80
   }
84
   }
81
 
85
 
94
       altKey,
98
       altKey,
95
     }
99
     }
96
 
100
 
101
+    this.lastPointer = info
97
     return info
102
     return info
98
   }
103
   }
99
 
104
 
117
       this.points[e.pointerId] = info
122
       this.points[e.pointerId] = info
118
     }
123
     }
119
 
124
 
125
+    this.lastPointer = info
120
     return info
126
     return info
121
   }
127
   }
122
 
128
 
143
       this.lastPointerUpTime = Date.now()
149
       this.lastPointerUpTime = Date.now()
144
     }
150
     }
145
 
151
 
152
+    this.lastPointer = info
146
     return info
153
     return info
147
   }
154
   }
148
 
155
 
158
   }
165
   }
159
 
166
 
160
   isDoubleClick() {
167
   isDoubleClick() {
161
-    const { origin, point } = this.pointer
168
+    if (!this.lastPointer) return
169
+
170
+    const { origin, point } = this.lastPointer
171
+
162
     return (
172
     return (
163
       Date.now() - this.lastPointerUpTime < DOUBLE_CLICK_DURATION &&
173
       Date.now() - this.lastPointerUpTime < DOUBLE_CLICK_DURATION &&
164
       vec.dist(origin, point) < 8
174
       vec.dist(origin, point) < 8

+ 5
- 0
state/state.ts 查看文件

319
             },
319
             },
320
             pointingBounds: {
320
             pointingBounds: {
321
               on: {
321
               on: {
322
+                STOPPED_POINTING_BOUNDS: [],
322
                 STOPPED_POINTING: [
323
                 STOPPED_POINTING: [
324
+                  {
325
+                    if: 'isPointingBounds',
326
+                    do: 'clearSelectedIds',
327
+                  },
323
                   {
328
                   {
324
                     if: 'isPressingShiftKey',
329
                     if: 'isPressingShiftKey',
325
                     then: [
330
                     then: [

正在加载...
取消
保存