Merge pull request #130 from ssshooter/v1.1.1

V1.1.1
SSShooter · Oct 1, 2022 · 2a2e8ca · 2a2e8ca
2 parents 8d5784d + d2556c9
commit 2a2e8ca
Show file tree

Hide file tree

Showing 12 changed files with 116 additions and 116 deletions.
diff --git a/painter/index.foreignObject.js b/painter/index.foreignObject.js
@@ -65,13 +65,13 @@ function RootToSvg() {
   let rootOffsetY = root.offsetTop - maxTop
   let rootOffsetX = root.offsetLeft - maxLeft
 
-  let svg2ndEle = document.querySelector('.svg2nd')
+  let svg2ndEle = document.querySelector('.lines')
 
-  let svg2nd = `<g transform="translate(${imgPadding - maxLeft}, ${
+  let lines = `<g transform="translate(${imgPadding - maxLeft}, ${
     imgPadding - maxTop
     })">${svg2ndEle.innerHTML}</g>`
   return (
-    svg2nd +
+    lines +
     `<g id="root" transform="translate(${rootOffsetX + imgPadding}, ${
     rootOffsetY + imgPadding
     })">
@@ -93,11 +93,11 @@ function PrimaryToSvg(primaryNode) {
   let primaryNodeOffsetX = primaryNode.offsetLeft - maxLeft
 
   let svg = ''
-  let svg3rd = primaryNode.querySelector('.svg3rd')
+  let subLines = primaryNode.querySelector('.subLines')
   svg += `<g transform="translate(${primaryNodeOffsetX + imgPadding}, ${
     primaryNodeOffsetY + imgPadding
     })">`
-  svg += svg3rd ? svg3rd.innerHTML : ''
+  svg += subLines ? subLines.innerHTML : ''
   for (let i = 0; i < topics.length; i++) {
     let tpc = topics[i]
     let t = tpc.parentNode

diff --git a/painter/index.js b/painter/index.js
@@ -80,13 +80,13 @@ function RootToSvg() {
   let rootOffsetY = root.offsetTop - maxTop
   let rootOffsetX = root.offsetLeft - maxLeft
 
-  let svg2ndEle = $d.querySelector('.svg2nd')
+  let svg2ndEle = $d.querySelector('.lines')
 
-  let svg2nd = `<g transform="translate(${IMG_PADDING - maxLeft}, ${
+  let lines = `<g transform="translate(${IMG_PADDING - maxLeft}, ${
     IMG_PADDING - maxTop
   })">${svg2ndEle.innerHTML}</g>`
   return (
-    svg2nd +
+    lines +
     `<g id="root" transform="translate(${rootOffsetX + IMG_PADDING}, ${
       rootOffsetY + IMG_PADDING
     })">
@@ -108,11 +108,11 @@ function PrimaryToSvg(primaryNode) {
   let primaryNodeOffsetX = primaryNode.offsetLeft - maxLeft
 
   let svg = ''
-  let svg3rd = primaryNode.querySelector('.svg3rd')
+  let subLines = primaryNode.querySelector('.subLines')
   svg += `<g transform="translate(${primaryNodeOffsetX + IMG_PADDING}, ${
     primaryNodeOffsetY + IMG_PADDING
   })">`
-  svg += svg3rd ? svg3rd.innerHTML : ''
+  svg += subLines ? subLines.innerHTML : ''
   for (let i = 0; i < topics.length; i++) {
     let tpc = topics[i]
     let t = tpc.parentNode

diff --git a/src/dev.dist.js b/src/dev.dist.js
@@ -35,6 +35,7 @@ const mind = new MindElixir({
       return false
     },
     insertSibling(el, obj) {
+      console.log('insertSibling', el, obj)
       return true
     },
     async addChild(el, obj) {
@@ -46,7 +47,7 @@ const mind = new MindElixir({
   primaryNodeVerticalGap: 15, // 25
   primaryNodeHorizontalGap: 15, // 65
 })
-mind.init()
+mind.init(example)
 function sleep() {
   return new Promise((res, rej) => {
     setTimeout(() => res(), 1000)

diff --git a/src/dev.ts b/src/dev.ts
@@ -56,8 +56,8 @@ const options = {
     },
   },
   primaryLinkStyle: 1,
-  primaryNodeVerticalGap: 15, // 25
-  primaryNodeHorizontalGap: 15, // 65
+  primaryNodeVerticalGap: 25, // 25
+  primaryNodeHorizontalGap: 65, // 65
 }
 
 const mind = new (MindElixir as any)(options)

diff --git a/src/exampleData/2.js b/src/exampleData/2.js
@@ -72,7 +72,7 @@ export default {
                         ],
                         tags: ['createChildren return'],
                       },
-                      { topic: 'svg.svg3rd', id: '33908986b6336a4f' },
+                      { topic: 'svg.subLines', id: '33908986b6336a4f' },
                     ],
                     tags: ['have child'],
                   },
@@ -93,7 +93,7 @@ export default {
                   { topic: 'grp...', id: '33b61346707af71a' },
                 ],
               },
-              { topic: 'svg.svg2nd', id: '3390707d68c0779d' },
+              { topic: 'svg.lines', id: '3390707d68c0779d' },
               { topic: 'svg.linkcontroller', id: '339072cb6cf95295' },
               { topic: 'svg.topiclinks', id: '3390751acbdbdb9f' },
             ],

diff --git a/src/index.less b/src/index.less
@@ -1,4 +1,4 @@
-@GAP: 15px; // node horizontal gap
+@GAP: 15px; // child node horizontal gap
 
 .mind-elixir {
   position: relative;
@@ -178,8 +178,8 @@
     fill: currentColor;
     overflow: hidden;
   }
-  .svg2nd,
-  .svg3rd,
+  .lines,
+  .subLines,
   .topiclinks,
   .linkcontroller {
     position: absolute;
@@ -195,8 +195,8 @@
       pointer-events: all;
     }
   }
-  .svg2nd,
-  .svg3rd {
+  .lines,
+  .subLines {
     pointer-events: none;
     z-index: -1;
   }

diff --git a/src/index.lite.ts b/src/index.lite.ts
@@ -28,7 +28,7 @@ import {
   refresh,
 } from './interact'
 import {
-  processPrimaryNode,
+  judgeDirection,
   setNodeTopic,
 } from './nodeOperation'
 import {
@@ -72,7 +72,8 @@ export interface NodeObj {
 }
 export interface MindElixirData {
   nodeData: NodeObj,
-  linkData?: LinkObj
+  linkData?: LinkObj,
+  direction?: number,
 }
 export interface MindElixirInstance {
   mindElixirBox: HTMLElement,
@@ -112,13 +113,13 @@ export interface MindElixirInstance {
   map: HTMLElement,
   root: HTMLElement,
   box: HTMLElement,
-  svg2nd: SVGElement,
-  linkController:SVGElement,
+  lines: SVGElement,
+  linkController: SVGElement,
   P2: HTMLElement,
   P3: HTMLElement,
-  line1:SVGElement,
-  line2:SVGElement,
-  linkSvgGroup:SVGElement,
+  line1: SVGElement,
+  line2: SVGElement,
+  linkSvgGroup: SVGElement,
 }
 export interface Options {
   el: string | Element,
@@ -222,7 +223,7 @@ function MindElixir(this: MindElixirInstance, {
 
   // infrastructure
 
-  this.svg2nd = createLinkSvg('svg2nd') // main link container
+  this.lines = createLinkSvg('lines') // main link container
 
   this.linkController = createLinkSvg('linkcontroller') // bezier controller container
   this.P2 = $d.createElement('div') // bezier P2
@@ -237,7 +238,7 @@ function MindElixir(this: MindElixirInstance, {
 
   this.map.appendChild(this.root)
   this.map.appendChild(this.box)
-  this.map.appendChild(this.svg2nd)
+  this.map.appendChild(this.lines)
   this.map.appendChild(this.linkController)
   this.map.appendChild(this.linkSvgGroup)
   this.map.appendChild(this.P2)
@@ -252,7 +253,7 @@ MindElixir.prototype = {
   addParentLink,
   getObjById,
   // node operation
-  processPrimaryNode,
+  judgeDirection,
   setNodeTopic,
   createLink,
   layout,
@@ -280,7 +281,10 @@ MindElixir.prototype = {
   expandNode,
   refresh,
 
-  init: function(data:MindElixirData) {
+  init: function(data: MindElixirData) {
+    if (data.direction) {
+      this.direction = data.direction
+    }
     this.nodeData = data.nodeData
     this.linkData = data.linkData || {}
     // plugin

diff --git a/src/index.ts b/src/index.ts
@@ -46,7 +46,7 @@ import {
   updateNodeTags,
   updateNodeIcons,
   updateNodeHyperLink,
-  processPrimaryNode,
+  judgeDirection,
   setNodeTopic,
   moveNodeBefore,
   moveNodeAfter,
@@ -113,7 +113,8 @@ export interface NodeElement extends HTMLElement {
 }
 export interface MindElixirData {
   nodeData: NodeObj,
-  linkData?: LinkObj
+  linkData?: LinkObj,
+  direction?: number
 }
 export interface MindElixirInstance {
   mindElixirBox: HTMLElement,
@@ -153,7 +154,7 @@ export interface MindElixirInstance {
   map: HTMLElement,
   root: HTMLElement,
   box: HTMLElement,
-  svg2nd: SVGElement,
+  lines: SVGElement,
   linkController:SVGElement,
   P2: HTMLElement,
   P3: HTMLElement,
@@ -314,7 +315,7 @@ function MindElixir(this: MindElixirInstance, {
 
   // infrastructure
 
-  this.svg2nd = createLinkSvg('svg2nd') // main link container
+  this.lines = createLinkSvg('lines') // main link container
 
   this.linkController = createLinkSvg('linkcontroller') // bezier controller container
   this.P2 = $d.createElement('div') // bezier P2
@@ -329,7 +330,7 @@ function MindElixir(this: MindElixirInstance, {
 
   this.map.appendChild(this.root)
   this.map.appendChild(this.box)
-  this.map.appendChild(this.svg2nd)
+  this.map.appendChild(this.lines)
   this.map.appendChild(this.linkController)
   this.map.appendChild(this.linkSvgGroup)
   this.map.appendChild(this.P2)
@@ -340,11 +341,11 @@ function MindElixir(this: MindElixirInstance, {
   } else initMouseEvent(this)
 }
 
-function beforeHook(fn:(el:any, node?:any)=>void) {
+function beforeHook(fn:(el:any, node?:any)=>void, fnName:string) {
   return async function(...args:unknown[]) {
     if (
-      !this.before[fn.name] ||
-      (await this.before[fn.name].apply(this, args))
+      !this.before[fnName] ||
+      (await this.before[fnName].apply(this, args))
     ) {
       fn.apply(this, args)
     }
@@ -356,23 +357,23 @@ MindElixir.prototype = {
   getObjById,
   generateNewObj,
   // node operation
-  insertSibling: beforeHook(insertSibling),
-  insertBefore: beforeHook(insertBefore),
-  insertParent: beforeHook(insertParent),
-  addChild: beforeHook(addChild),
-  copyNode: beforeHook(copyNode),
-  moveNode: beforeHook(moveNode),
-  removeNode: beforeHook(removeNode),
-  moveUpNode: beforeHook(moveUpNode),
-  moveDownNode: beforeHook(moveDownNode),
-  beginEdit: beforeHook(beginEdit),
-  moveNodeBefore: beforeHook(moveNodeBefore),
-  moveNodeAfter: beforeHook(moveNodeAfter),
+  insertSibling: beforeHook(insertSibling, 'insertSibling'),
+  insertBefore: beforeHook(insertBefore, 'insertBefore'),
+  insertParent: beforeHook(insertParent, 'insertParent'),
+  addChild: beforeHook(addChild, 'addChild'),
+  copyNode: beforeHook(copyNode, 'copyNode'),
+  moveNode: beforeHook(moveNode, 'moveNode'),
+  removeNode: beforeHook(removeNode, 'removeNode'),
+  moveUpNode: beforeHook(moveUpNode, 'moveUpNode'),
+  moveDownNode: beforeHook(moveDownNode, 'moveDownNode'),
+  beginEdit: beforeHook(beginEdit, 'beginEdit'),
+  moveNodeBefore: beforeHook(moveNodeBefore, 'moveNodeBefore'),
+  moveNodeAfter: beforeHook(moveNodeAfter, 'moveNodeAfter'),
   updateNodeStyle,
   updateNodeTags,
   updateNodeIcons,
   updateNodeHyperLink,
-  processPrimaryNode,
+  judgeDirection,
   setNodeTopic,
 
   createLink,
@@ -413,6 +414,9 @@ MindElixir.prototype = {
   },
   init(data:MindElixirData) {
     if (!data || !data.nodeData) return new Error('MindElixir: `data` is required')
+    if (data.direction) {
+      this.direction = data.direction
+    }
     this.nodeData = data.nodeData
     this.linkData = data.linkData || {}
     // plugin

diff --git a/src/interact.ts b/src/interact.ts
@@ -115,6 +115,7 @@ export const getAllDataString = function() {
   const data = {
     nodeData: getData(this),
     linkData: this.linkData,
+    direction: this.direction,
   }
   return JSON.stringify(data, (k, v) => {
     if (k === 'parent') return undefined
@@ -135,6 +136,7 @@ export const getAllData = function(): object {
   const data = {
     nodeData: getData(this),
     linkData: this.linkData,
+    direction: this.direction,
   }
   return JSON.parse(
     JSON.stringify(data, (k, v) => {