Improves undo/redo, fixes pinching and multitouch

This commit is contained in:
Steve Ruiz 2021-05-30 14:14:35 +01:00
parent bc6f5cf5b7
commit 76a4ccdfcb
15 changed files with 366 additions and 288 deletions

View file

@ -1,27 +1,29 @@
import { useCallback, useRef } from "react"
import state, { useSelector } from "state"
import inputs from "state/inputs"
import styled from "styles"
import { getPage } from "utils/utils"
import { useCallback, useRef } from 'react'
import state, { useSelector } from 'state'
import inputs from 'state/inputs'
import styled from 'styles'
import { getPage } from 'utils/utils'
function handlePointerDown(e: React.PointerEvent<SVGRectElement>) {
if (e.buttons !== 1) return
if (!inputs.canAccept(e.pointerId)) return
e.stopPropagation()
e.currentTarget.setPointerCapture(e.pointerId)
state.send("POINTED_BOUNDS", inputs.pointerDown(e, "bounds"))
state.send('POINTED_BOUNDS', inputs.pointerDown(e, 'bounds'))
}
function handlePointerUp(e: React.PointerEvent<SVGRectElement>) {
if (e.buttons !== 1) return
if (!inputs.canAccept(e.pointerId)) return
e.stopPropagation()
e.currentTarget.releasePointerCapture(e.pointerId)
state.send("STOPPED_POINTING", inputs.pointerUp(e))
state.send('STOPPED_POINTING', inputs.pointerUp(e))
}
export default function BoundsBg() {
const rBounds = useRef<SVGRectElement>(null)
const bounds = useSelector((state) => state.values.selectedBounds)
const isSelecting = useSelector((s) => s.isIn("selecting"))
const isSelecting = useSelector((s) => s.isIn('selecting'))
const rotation = useSelector((s) => {
if (s.data.selectedIds.size === 1) {
const { shapes } = getPage(s.data)
@ -53,6 +55,6 @@ export default function BoundsBg() {
)
}
const StyledBoundsBg = styled("rect", {
fill: "$boundsBg",
const StyledBoundsBg = styled('rect', {
fill: '$boundsBg',
})