ugly but works

src/Scene.js

@@ -221,7 +221,7 @@ export class Scene {
 
     entry = new Sketch(this, entry)
     entry.obj3d.addEventListener('change', this.render)
-    
+
     return entry
   }
 
@@ -315,6 +315,7 @@ export class Scene {
     const { byId, tree } = this.store.getState().treeEntries
     while (idx < que.length) {
       curId = que[idx++]
+      console.log(curId,byId,'cc')
 
       const info = byId[curId].userData.featureInfo
       let newNode

src/Sketch.js

@@ -153,10 +153,12 @@ class Sketch {
 
 
   activate() {
-    console.log('activatee')
+    console.log('activate sketch')
     window.addEventListener('keydown', this.onKeyPress)
     this.canvas.addEventListener('pointerdown', this.onPick)
     this.canvas.addEventListener('pointermove', this.onHover)
+
+
     this.store.dispatch({ type: 'set-active-sketch', activeSketchId: this.obj3d.name })
 
     this.setDimLines()
@@ -168,6 +170,17 @@ class Sketch {
     this.scene.activeSketch = this
 
     window.sketcher = this
+
+    // overkill but good solution if this check was more costly
+    this.hasChanged = false
+    this.idOnActivate = id
+    const changeDetector = (e) => {
+      if (this.selected.length && e.buttons) {
+        this.canvas.removeEventListener('pointermove', changeDetector)
+        this.hasChanged = true
+      }
+    }
+    this.canvas.addEventListener('pointermove', changeDetector)
   }
 
   deactivate() {
@@ -321,9 +334,9 @@ class Sketch {
 
       // collect all coincident constraints to be reconnected
       // after deleting this point
-      let arr = []  
+      let arr = []
       let cons
-      for (let c_id of obj.userData.constraints.slice()) { 
+      for (let c_id of obj.userData.constraints.slice()) {
         // i hate js, slice is important because deleteContraints mutates constraints array
         cons = this.constraints.get(c_id)
         if (cons[0] == 'points_coincident') {
@@ -335,9 +348,9 @@ class Sketch {
       }
 
       for (let i = 0; i < arr.length - 1; i++) {
-        setCoincident.call(this,[
+        setCoincident.call(this, [
           this.obj3d.children[this.objIdx.get(arr[i])],
-          this.obj3d.children[this.objIdx.get(arr[i+1])]
+          this.obj3d.children[this.objIdx.get(arr[i + 1])]
         ])
       }
 

src/mouseEvents.js

@@ -190,9 +190,7 @@ export function onPick(e) {
       case 'point':
 
         this.canvas.addEventListener('pointermove', this.onDrag);
-        this.canvas.addEventListener('pointerup', () => {
-          this.onRelease()
-        })
+        this.canvas.addEventListener('pointerup', this.onRelease)
         break;
 
       default:
@@ -244,7 +242,7 @@ export function onDrag(e) {
 
 
 
-export function onRelease() {
+export function onRelease(e) {
   this.canvas.removeEventListener('pointermove', this.onDrag)
   this.canvas.removeEventListener('pointermove', this.onDragDim)
   this.canvas.removeEventListener('pointerup', this.onRelease)

src/react/app.jsx

@@ -1,6 +1,6 @@
 
 import ReactDOM from 'react-dom'
-import React, { useState } from 'react'
+import React, { } from 'react'
 
 import { createStore, applyMiddleware } from 'redux'
 import { Provider } from 'react-redux'
@@ -32,16 +32,13 @@ const store = createStore(reducer, {}, applyMiddleware(logger))
 // const store = createStore(reducer, sc.loadState(), applyMiddleware(logger))
 
 
-const App = ({ store }) => {
-
-
-  return <Provider store={store}>
-
+const App = ({ store }) => (
+  <Provider store={store}>
     <NavBar />
     <Tree />
     <ToolTip />
   </Provider>
-};
+)
 
 document.addEventListener('DOMContentLoaded', () => {
   ReactDOM.render(<App store={store} />, document.getElementById('react'));

src/react/dialog.jsx

@@ -49,18 +49,30 @@ export const Dialog = () => {
     case 'sketch':
       return <>
         <MdDone
-          // className="btn w-auto h-full p-3.5 mr-6"
           className="btn w-auto h-full p-3.5"
           onClick={() => {
+            if (sc.activeSketch.hasChanged || sc.activeSketch.idOnActivate != id) {
+              console.log(sc.activeSketch)
+              for (let k in sc.store.getState().treeEntries.tree[sc.activeSketch.obj3d.name]) {
+                console.log('circlllles',k)
+                sc.refreshNode(k)
+              }
+              sc.render()
+            }
             // dispatch({ type: 'update-descendents', sketch})
+
             sc.activeSketch.deactivate()
-            sc.render()
             dispatch({ type: "clear-dialog" })
           }}
         />
         <MdClose className="btn w-auto h-full p-3.5 mr-6"
           onClick={() => {
-            dispatch({ type: "cancel-sketch" })
+            if (sc.activeSketch.hasChanged || sc.activeSketch.idOnActivate != id) {
+              console.log('has changed')
+              dispatch({ type: "cancel-sketch" })
+              sc.render()
+            }
+
             sc.activeSketch.deactivate()
             dispatch({ type: "clear-dialog" })
           }

src/react/navBar.jsx

@@ -31,30 +31,9 @@ export const NavBar = () => {
     forceUpdate()
   }
 
-  useEffect(() => {
-    if (!activeSketchId) {
-      sc.canvas.addEventListener('pointermove', sc.onHover)
-      sc.canvas.addEventListener('pointerdown', sc.onPick)
-      return () => {
-        sc.canvas.removeEventListener('pointermove', sc.onHover)
-        sc.canvas.removeEventListener('pointerdown', sc.onPick)
-      }
-    }
-  }, [activeSketchId])
-
-  // useEffect(() => {
-  //   console.log(treeEntriesById)
-  // }, [treeEntriesById])
 
 
   const sketchModeButtons = [
-    // [MdDone, () => {
-    //   // dispatch({ type: 'update-descendents', sketch})
-
-    //   sc.activeSketch.deactivate()
-    //   sc.render()
-    //   forceUpdate()
-    // }, 'Finish'],
     [Icon.Extrude, () => {
       sc.activeSketch.deactivate()
       dispatch({ type: 'set-dialog', action: 'extrude', target: sc.activeSketch })

src/react/reducer.js

@@ -13,6 +13,7 @@ const defaultState = {
   activeSketchId: ""
 }
 
+let cache
 
 export function treeEntries(state = defaultState, action) {
   switch (action.type) {
@@ -32,7 +33,7 @@ export function treeEntries(state = defaultState, action) {
     }
 
     case 'set-active-sketch':
-      window.cache = JSON.stringify(state.byId[action.activeSketchId])
+      cache = JSON.stringify(state.byId[action.activeSketchId])
       return update(state, {
         visible: { [action.activeSketchId]: { $set: true } },
         activeSketchId: { $set: action.activeSketchId },
@@ -45,7 +46,6 @@ export function treeEntries(state = defaultState, action) {
     case 'cancel-sketch':
 
       const sketch = sc.loadSketch(cache)
-      console.log(cache, sketch)
 
       const deletedObj = sc.obj3d.children.splice(state.order[state.activeSketchId] + 1, 1,
         sketch.obj3d