feat: allow redo/undo summary

Author: SSShooter

src/interact.ts

@@ -344,6 +344,7 @@ export const refresh = function (this: MindElixirInstance, data?: MindElixirData
     data = JSON.parse(JSON.stringify(data)) as MindElixirData // it shouldn't contanimate the original data
     this.nodeData = data.nodeData
     this.linkData = data.linkData || {}
+    this.summaries = data.summaries || []
   }
   fillParent(this.nodeData)
   // create dom element for every node

src/plugin/keypress.ts

@@ -150,12 +150,10 @@ export default function (mind: MindElixirInstance) {
       // bug
       if (mind.currentLink) mind.removeLink()
       else if (mind.currentSummary) mind.removeSummary(mind.currentSummary.summaryObj.id)
-      else {
-        if (mind.currentNode) {
-          mind.removeNode()
-        } else if (mind.currentNodes) {
-          mind.removeNodes(mind.currentNodes)
-        }
+      else if (mind.currentNode) {
+        mind.removeNode()
+      } else if (mind.currentNodes) {
+        mind.removeNodes(mind.currentNodes)
       }
     } else {
       const keyHandler = key2func[e.keyCode]

src/plugin/operationHistory.ts

@@ -1,12 +1,39 @@
-import type { MindElixirData } from '../index'
+import type { MindElixirData, NodeObj } from '../index'
 import { type MindElixirInstance } from '../index'
 import { findEle } from '../utils/dom'
 import type { Operation } from '../utils/pubsub'
 
 type History = {
   prev: MindElixirData
-  currentNodeId: string | undefined
   next: MindElixirData
+  currentObject:
+    | {
+        type: 'node' | 'summary' | 'customLink'
+        value: string
+      }
+    | {
+        type: 'nodes'
+        value: string[]
+      }
+}
+
+const calcCurentObject = function (operation: Operation): History['currentObject'] {
+  if (['createSummary', 'removeSummary', 'finishEditSummary'].includes(operation.name)) {
+    return {
+      type: 'summary',
+      value: (operation as any).obj.id,
+    }
+  } else if (['removeNodes'].includes(operation.name)) {
+    return {
+      type: 'nodes',
+      value: (operation as any).objs.map((obj: NodeObj) => obj.id),
+    }
+  } else {
+    return {
+      type: 'node',
+      value: (operation as any).obj.id,
+    }
+  }
 }
 
 export default function (mei: MindElixirInstance) {
@@ -17,9 +44,7 @@ export default function (mei: MindElixirInstance) {
     if (operation.name === 'beginEdit') return
     history = history.slice(0, currentIndex + 1)
     const next = mei.getData()
-    let currentNodeId = undefined
-    if ('obj' in operation) currentNodeId = operation.obj.id
-    history.push({ prev: current, currentNodeId, next })
+    history.push({ prev: current, currentObject: calcCurentObject(operation), next })
     current = next
     currentIndex = history.length - 1
     // console.log('operation', operation.obj.id, history)
@@ -29,7 +54,7 @@ export default function (mei: MindElixirInstance) {
       const h = history[currentIndex]
       current = h.prev
       mei.refresh(h.prev)
-      if (h.currentNodeId) mei.selectNode(findEle(h.currentNodeId))
+      if (h.currentObject.type === 'node') mei.selectNode(findEle(h.currentObject.value))
       currentIndex--
       console.log('current', current)
     }
@@ -40,7 +65,7 @@ export default function (mei: MindElixirInstance) {
       const h = history[currentIndex]
       current = h.next
       mei.refresh(h.next)
-      if (h.currentNodeId) mei.selectNode(findEle(h.currentNodeId))
+      if (h.currentObject.type === 'node') mei.selectNode(findEle(h.currentObject.value))
     }
   }
   mei.map.addEventListener('keydown', (e: KeyboardEvent) => {

src/summary.ts

@@ -169,6 +169,10 @@ export const createSummary = function (this: MindElixirInstance) {
   const g = drawSummary(this, summary) as SummarySvgGroup
   this.summaries.push(summary)
   this.editSummary(g)
+  this.bus.fire('operation', {
+    name: 'createSummary',
+    obj: summary,
+  })
 }
 
 export const removeSummary = function (this: MindElixirInstance, id: string) {
@@ -177,6 +181,10 @@ export const removeSummary = function (this: MindElixirInstance, id: string) {
     this.summaries.splice(index, 1)
     document.querySelector('#s-' + id)?.remove()
   }
+  this.bus.fire('operation', {
+    name: 'removeSummary',
+    obj: { id },
+  })
 }
 
 export const selectSummary = function (this: MindElixirInstance, el: SummarySvgGroup) {
@@ -228,7 +236,6 @@ export const editSummary = function (this: MindElixirInstance, el: SummarySvgGro
     this.bus.fire('operation', {
       name: 'finishEditSummary',
       obj: node,
-      origin,
     })
   })
   console.timeEnd('editSummary')

src/utils/pubsub.ts

@@ -1,23 +1,7 @@
 import type { Summary } from '../summary'
 import type { NodeObj } from '../types/index'
-export type OperationType =
-  | 'moveNode'
-  | 'moveNodeAfter'
-  | 'moveNodeBefore'
-  | 'removeNode'
-  | 'removeNodes'
-  | 'addChild'
-  | 'copyNode'
-  | 'reshapeNode'
-  | 'insertSibling'
-  | 'insertBefore'
-  | 'insertParent'
-  | 'moveUpNode'
-  | 'moveDownNode'
-  | 'beginEdit'
-  | 'finishEdit'
 
-export type Operation =
+type NodeOperation =
   | {
       name: 'moveNode' | 'moveDownNode' | 'moveUpNode' | 'copyNode' | 'addChild' | 'insertParent' | 'insertBefore' | 'insertSibling' | 'beginEdit'
       obj: NodeObj
@@ -32,11 +16,6 @@ export type Operation =
       obj: NodeObj
       origin: string
     }
-  | {
-      name: 'finishEditSummary'
-      obj: Summary
-      origin: string
-    }
   | {
       name: 'moveNodeAfter' | 'moveNodeBefore' | 'moveNode'
       obj: NodeObj
@@ -54,6 +33,23 @@ export type Operation =
       objs: NodeObj[]
     }
 
+export type SummaryOperation =
+  | {
+      name: 'createSummary'
+      obj: Summary
+    }
+  | {
+      name: 'removeSummary'
+      obj: { id: string }
+    }
+  | {
+      name: 'finishEditSummary'
+      obj: Summary
+    }
+
+export type Operation = NodeOperation | SummaryOperation
+export type OperationType = Operation['name']
+
 export type EventMap = {
   operation: (info: Operation) => void
   selectNode: (nodeObj: NodeObj, e?: MouseEvent) => void