Adds undo for drawn shapes, zoom scales rdp

lib/code/control.ts

@@ -5,7 +5,6 @@ import {
   VectorCodeControl,
 } from "types"
 import { v4 as uuid } from "uuid"
-import Vector from "./vector"
 
 export const controls: Record<string, any> = {}
 

state/commands/draw.ts

@@ -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)
+        }
+      },
+    })
+  )
+}

state/commands/index.ts

@@ -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,

state/commands/points.ts

@@ -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)
-      },
-    })
-  )
-}

state/sessions/draw-session.ts

@@ -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,
       ])

state/state.ts

@@ -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) {