浏览代码

Improves behavior with locked shapes

main
Steve Ruiz 4 年前
父节点
当前提交
b0a260d6a6

+ 0
- 11
hooks/useZoomEvents.ts 查看文件

20
         if (event.ctrlKey) {
20
         if (event.ctrlKey) {
21
           const { point } = inputs.wheel(event as WheelEvent)
21
           const { point } = inputs.wheel(event as WheelEvent)
22
           fastZoomUpdate(point, delta[1])
22
           fastZoomUpdate(point, delta[1])
23
-          // state.send('ZOOMED_CAMERA', {
24
-          //   delta: delta[1],
25
-          //   ...inputs.wheel(event as WheelEvent),
26
-          // })
27
           return
23
           return
28
         }
24
         }
29
 
25
 
60
           angleDelta
56
           angleDelta
61
         )
57
         )
62
 
58
 
63
-        // state.send('PINCHED', {
64
-        //   delta: vec.sub(rPinchPoint.current, origin),
65
-        //   point: origin,
66
-        //   distanceDelta,
67
-        //   angleDelta,
68
-        // })
69
-
70
         rPinchDa.current = da
59
         rPinchDa.current = da
71
         rPinchPoint.current = origin
60
         rPinchPoint.current = origin
72
       },
61
       },

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

1
 import { uniqueId } from 'utils/utils'
1
 import { uniqueId } from 'utils/utils'
2
 import vec from 'utils/vec'
2
 import vec from 'utils/vec'
3
 import {
3
 import {
4
-  ease,
5
   getSvgPathFromStroke,
4
   getSvgPathFromStroke,
6
   rng,
5
   rng,
7
   getBoundsFromPoints,
6
   getBoundsFromPoints,
151
       body = <path d={path} />
150
       body = <path d={path} />
152
     }
151
     }
153
 
152
 
154
-    return (
155
-      <g id={id}>
156
-        {body}
157
-        {/* <circle
158
-          cx={start.point[0]}
159
-          cy={start.point[1]}
160
-          r={Math.max(4, +style.strokeWidth)}
161
-          fill={style.stroke}
162
-          strokeDasharray="none"
163
-        /> */}
164
-      </g>
165
-    )
153
+    return <g id={id}>{body}</g>
166
   },
154
   },
167
 
155
 
168
   rotateBy(shape, delta) {
156
   rotateBy(shape, delta) {
379
 
367
 
380
   const dist = vec.dist(start.point, end.point)
368
   const dist = vec.dist(start.point, end.point)
381
   const midPoint = vec.med(start.point, end.point)
369
   const midPoint = vec.med(start.point, end.point)
382
-  const bendDist = (dist / 2) * shape.bend * Math.min(1, dist / 128)
370
+  const bendDist = (dist / 2) * shape.bend
383
   const u = vec.uni(vec.vec(start.point, end.point))
371
   const u = vec.uni(vec.vec(start.point, end.point))
384
 
372
 
385
   return Math.abs(bendDist) < 10
373
   return Math.abs(bendDist) < 10
430
 
418
 
431
 function renderPath(shape: ArrowShape, endAngle = 0) {
419
 function renderPath(shape: ArrowShape, endAngle = 0) {
432
   const { style, id } = shape
420
   const { style, id } = shape
433
-  const { start, end, bend } = shape.handles
421
+  const { start, end } = shape.handles
434
 
422
 
435
   const getRandom = rng(id)
423
   const getRandom = rng(id)
436
-  const offsetA = getRandom()
437
 
424
 
438
   const strokeWidth = +getShapeStyle(style).strokeWidth * 2
425
   const strokeWidth = +getShapeStyle(style).strokeWidth * 2
439
 
426
 

+ 11
- 4
state/commands/delete-selected.ts 查看文件

5
 import {
5
 import {
6
   getDocumentBranch,
6
   getDocumentBranch,
7
   getPage,
7
   getPage,
8
+  getPageState,
8
   getSelectedIds,
9
   getSelectedIds,
10
+  getSelectedShapes,
9
   setSelectedIds,
11
   setSelectedIds,
10
   setToArray,
12
   setToArray,
11
   updateParents,
13
   updateParents,
16
 export default function deleteSelected(data: Data) {
18
 export default function deleteSelected(data: Data) {
17
   const { currentPageId } = data
19
   const { currentPageId } = data
18
 
20
 
19
-  const selectedIds = getSelectedIds(data)
20
-  const selectedIdsArr = setToArray(selectedIds)
21
+  const selectedShapes = getSelectedShapes(data)
22
+
23
+  const selectedIdsArr = selectedShapes
24
+    .filter((shape) => !shape.isLocked)
25
+    .map((shape) => shape.id)
21
 
26
 
22
   const page = getPage(current(data))
27
   const page = getPage(current(data))
23
 
28
 
25
     .flatMap((id) => getDocumentBranch(data, id))
30
     .flatMap((id) => getDocumentBranch(data, id))
26
     .map((id) => page.shapes[id])
31
     .map((id) => page.shapes[id])
27
 
32
 
28
-  selectedIds.clear()
33
+  const remainingIds = selectedShapes
34
+    .filter((shape) => shape.isLocked)
35
+    .map((shape) => shape.id)
29
 
36
 
30
   history.execute(
37
   history.execute(
31
     data,
38
     data,
62
           delete page.shapes[shape.id]
69
           delete page.shapes[shape.id]
63
         }
70
         }
64
 
71
 
65
-        setSelectedIds(data, [])
72
+        setSelectedIds(data, remainingIds)
66
       },
73
       },
67
       undo(data) {
74
       undo(data) {
68
         const page = getPage(data, currentPageId)
75
         const page = getPage(data, currentPageId)

+ 3
- 1
state/commands/distribute.ts 查看文件

12
 export default function distributeCommand(data: Data, type: DistributeType) {
12
 export default function distributeCommand(data: Data, type: DistributeType) {
13
   const { currentPageId } = data
13
   const { currentPageId } = data
14
 
14
 
15
-  const selectedShapes = getSelectedShapes(data)
15
+  const selectedShapes = getSelectedShapes(data).filter(
16
+    (shape) => !shape.isLocked
17
+  )
16
 
18
 
17
   const entries = selectedShapes.map(
19
   const entries = selectedShapes.map(
18
     (shape) => [shape.id, getShapeUtils(shape).getBounds(shape)] as const
20
     (shape) => [shape.id, getShapeUtils(shape).getBounds(shape)] as const

+ 1
- 1
state/commands/edit.ts 查看文件

15
     new Command({
15
     new Command({
16
       name: 'edited_shape',
16
       name: 'edited_shape',
17
       category: 'canvas',
17
       category: 'canvas',
18
-      do(data, isInitial) {
18
+      do(data) {
19
         const { initialShape, currentPageId } = after
19
         const { initialShape, currentPageId } = after
20
 
20
 
21
         const page = getPage(data, currentPageId)
21
         const page = getPage(data, currentPageId)

+ 2
- 0
state/commands/reset-bounds.ts 查看文件

17
       category: 'canvas',
17
       category: 'canvas',
18
       do(data) {
18
       do(data) {
19
         getSelectedShapes(data).forEach((shape) => {
19
         getSelectedShapes(data).forEach((shape) => {
20
+          if (shape.isLocked) return
20
           getShapeUtils(shape).onBoundsReset(shape)
21
           getShapeUtils(shape).onBoundsReset(shape)
21
         })
22
         })
22
 
23
 
25
       undo(data) {
26
       undo(data) {
26
         const page = getPage(data)
27
         const page = getPage(data)
27
         getSelectedShapes(data).forEach((shape) => {
28
         getSelectedShapes(data).forEach((shape) => {
29
+          if (shape.isLocked) return
28
           page.shapes[shape.id] = initialShapes[shape.id]
30
           page.shapes[shape.id] = initialShapes[shape.id]
29
         })
31
         })
30
 
32
 

+ 4
- 0
state/commands/rotate-ccw.ts 查看文件

67
 
67
 
68
         for (let id in nextShapes) {
68
         for (let id in nextShapes) {
69
           const shape = shapes[id]
69
           const shape = shapes[id]
70
+          if (shape.isLocked) continue
70
 
71
 
71
           getShapeUtils(shape)
72
           getShapeUtils(shape)
72
             .setProperty(shape, 'rotation', nextShapes[id].rotation)
73
             .setProperty(shape, 'rotation', nextShapes[id].rotation)
82
           const { point, rotation } = initialShapes[id]
83
           const { point, rotation } = initialShapes[id]
83
 
84
 
84
           const shape = shapes[id]
85
           const shape = shapes[id]
86
+
87
+          if (shape.isLocked) continue
88
+
85
           const utils = getShapeUtils(shape)
89
           const utils = getShapeUtils(shape)
86
           utils
90
           utils
87
             .setProperty(shape, 'rotation', rotation)
91
             .setProperty(shape, 'rotation', rotation)

+ 1
- 1
state/commands/toggle.ts 查看文件

19
   history.execute(
19
   history.execute(
20
     data,
20
     data,
21
     new Command({
21
     new Command({
22
-      name: 'hide_shapes',
22
+      name: 'toggle_shape_prop',
23
       category: 'canvas',
23
       category: 'canvas',
24
       do(data) {
24
       do(data) {
25
         const { shapes } = getPage(data, currentPageId)
25
         const { shapes } = getPage(data, currentPageId)

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

911
       return data.isReadOnly
911
       return data.isReadOnly
912
     },
912
     },
913
     canEditSelectedShape(data, payload, result: Shape) {
913
     canEditSelectedShape(data, payload, result: Shape) {
914
-      return getShapeUtils(result).canEdit
914
+      return getShapeUtils(result).canEdit && !result.isLocked
915
     },
915
     },
916
     distanceImpliesDrag(data, payload: PointerInfo) {
916
     distanceImpliesDrag(data, payload: PointerInfo) {
917
       return vec.dist2(payload.origin, payload.point) > 8
917
       return vec.dist2(payload.origin, payload.point) > 8

正在加载...
取消
保存