kopia lustrzana https://github.com/Tldraw/Tldraw
Adds undo for drawn shapes, zoom scales rdp
rodzic
c41def99d3
commit
bd02ca4fd9
|
@ -5,7 +5,6 @@ import {
|
|||
VectorCodeControl,
|
||||
} from "types"
|
||||
import { v4 as uuid } from "uuid"
|
||||
import Vector from "./vector"
|
||||
|
||||
export const controls: Record<string, any> = {}
|
||||
|
||||
|
|
|
@ -0,0 +1,40 @@
|
|||
import Command from "./command"
|
||||
import history from "../history"
|
||||
import { Data } from "types"
|
||||
import { getPage } from "utils/utils"
|
||||
import { getShapeUtils } from "lib/shape-utils"
|
||||
import { current } from "immer"
|
||||
|
||||
export default function drawCommand(
|
||||
data: Data,
|
||||
id: string,
|
||||
before: number[][],
|
||||
after: number[][]
|
||||
) {
|
||||
const selectedIds = Array.from(data.selectedIds.values())
|
||||
const restoreShape = current(getPage(data).shapes[id])
|
||||
getShapeUtils(restoreShape).setPoints!(restoreShape, after)
|
||||
|
||||
history.execute(
|
||||
data,
|
||||
new Command({
|
||||
name: "set_points",
|
||||
category: "canvas",
|
||||
manualSelection: true,
|
||||
do(data, initial) {
|
||||
if (!initial) {
|
||||
getPage(data).shapes[id] = restoreShape
|
||||
}
|
||||
|
||||
data.selectedIds.clear()
|
||||
},
|
||||
undo(data) {
|
||||
delete getPage(data).shapes[id]
|
||||
data.selectedIds.clear()
|
||||
for (let id of selectedIds) {
|
||||
data.selectedIds.add(id)
|
||||
}
|
||||
},
|
||||
})
|
||||
)
|
||||
}
|
|
@ -4,7 +4,7 @@ import direct from "./direct"
|
|||
import distribute from "./distribute"
|
||||
import generate from "./generate"
|
||||
import move from "./move"
|
||||
import points from "./points"
|
||||
import draw from "./draw"
|
||||
import rotate from "./rotate"
|
||||
import stretch from "./stretch"
|
||||
import style from "./style"
|
||||
|
@ -19,7 +19,7 @@ const commands = {
|
|||
distribute,
|
||||
generate,
|
||||
move,
|
||||
points,
|
||||
draw,
|
||||
rotate,
|
||||
stretch,
|
||||
style,
|
||||
|
|
|
@ -1,28 +0,0 @@
|
|||
import Command from "./command"
|
||||
import history from "../history"
|
||||
import { Data } from "types"
|
||||
import { getPage } from "utils/utils"
|
||||
import { getShapeUtils } from "lib/shape-utils"
|
||||
|
||||
export default function pointsCommand(
|
||||
data: Data,
|
||||
id: string,
|
||||
before: number[][],
|
||||
after: number[][]
|
||||
) {
|
||||
history.execute(
|
||||
data,
|
||||
new Command({
|
||||
name: "set_points",
|
||||
category: "canvas",
|
||||
do(data) {
|
||||
const shape = getPage(data).shapes[id]
|
||||
getShapeUtils(shape).setPoints!(shape, after)
|
||||
},
|
||||
undo(data) {
|
||||
const shape = getPage(data).shapes[id]
|
||||
getShapeUtils(shape).setPoints!(shape, before)
|
||||
},
|
||||
})
|
||||
)
|
||||
}
|
|
@ -8,6 +8,7 @@ import commands from "state/commands"
|
|||
|
||||
export default class BrushSession extends BaseSession {
|
||||
origin: number[]
|
||||
previous: number[]
|
||||
points: number[][]
|
||||
snapshot: DrawSnapshot
|
||||
shapeId: string
|
||||
|
@ -16,7 +17,8 @@ export default class BrushSession extends BaseSession {
|
|||
super(data)
|
||||
this.shapeId = id
|
||||
this.origin = point
|
||||
this.points = [[0, 0]]
|
||||
this.previous = point
|
||||
this.points = []
|
||||
this.snapshot = getDrawSnapshot(data, id)
|
||||
|
||||
const page = getPage(data)
|
||||
|
@ -27,7 +29,9 @@ export default class BrushSession extends BaseSession {
|
|||
update = (data: Data, point: number[]) => {
|
||||
const { shapeId } = this
|
||||
|
||||
this.points.push(vec.sub(point, this.origin))
|
||||
const lp = vec.med(this.previous, point)
|
||||
this.points.push(vec.sub(lp, this.origin))
|
||||
this.previous = lp
|
||||
|
||||
const page = getPage(data)
|
||||
const shape = page.shapes[shapeId]
|
||||
|
@ -42,11 +46,11 @@ export default class BrushSession extends BaseSession {
|
|||
}
|
||||
|
||||
complete = (data: Data) => {
|
||||
commands.points(
|
||||
commands.draw(
|
||||
data,
|
||||
this.shapeId,
|
||||
this.snapshot.points,
|
||||
simplify(this.points, 1).map(([x, y]) => [
|
||||
simplify(this.points, 0.1 / data.camera.zoom).map(([x, y]) => [
|
||||
Math.trunc(x * 100) / 100,
|
||||
Math.trunc(y * 100) / 100,
|
||||
])
|
||||
|
|
|
@ -31,7 +31,6 @@ import {
|
|||
DistributeType,
|
||||
AlignType,
|
||||
StretchType,
|
||||
DrawShape,
|
||||
} from "types"
|
||||
|
||||
const initialData: Data = {
|
||||
|
@ -928,7 +927,7 @@ const state = createState({
|
|||
},
|
||||
|
||||
restoreSavedData(data) {
|
||||
history.load(data)
|
||||
// history.load(data)
|
||||
},
|
||||
|
||||
clearBoundsRotation(data) {
|
||||
|
|
Ładowanie…
Reference in New Issue