Merge pull request #162 from ssshooter/v1.1.5

V1.1.5

Author: SSShooter

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mind-elixir",
-  "version": "1.1.4",
+  "version": "1.1.5",
   "description": "Mind elixir is a free open source mind map core.",
   "main": "dist/MindElixir.js",
   "scripts": {
@@ -16,8 +16,11 @@
     "beta": "npm run build && npm publish --tag beta"
   },
   "lint-staged": {
-    "src/**/*.{ts,js,json}": [
+    "src/**/*.{ts,js}": [
       "eslint --cache --fix"
+    ],
+    "src/**/*.{json,less}": [
+      "prettier --write"
     ]
   },
   "files": [

readme.md

@@ -31,9 +31,15 @@ Mind elixir is a free open source mind map core.
 
 - [Doc](#doc)
 - [Try now](#try-now)
-- [Playground](#playground)
+  - [Playground](#playground)
+    - [Vanilla JS](#vanilla-js)
+    - [Use with React](#use-with-react)
+    - [Use with Vue](#use-with-vue)
+    - [Use with Vue3](#use-with-vue3)
 - [Usage](#usage)
   - [Install](#install)
+    - [NPM](#npm)
+    - [Script tag](#script-tag)
   - [HTML structure](#html-structure)
   - [Init](#init)
   - [Data Structure](#data-structure)
@@ -110,7 +116,7 @@ import MindElixir, { E } from 'mind-elixir'
 
 ```javascript
 import MindElixir, { E } from 'mind-elixir'
-import example from '../dist/example1'
+import example from 'mind-elixir/dist/example1'
 
 let options = {
   el: '#map', // or HTMLDivElement

src/dev.ts

@@ -36,6 +36,7 @@ const options = {
       },
     ],
   },
+  mobileMenu: true,
   toolBar: true,
   nodeMenu: true,
   keypress: true,

src/index.ts

@@ -118,7 +118,9 @@ export interface MindElixirInstance {
   inputDiv: HTMLElement | null
   scaleVal: number
   tempDirection: number | null
-  bus: object // wip
+  bus: {
+    addListener: (type, handler) => void
+  } // wip
 
   // wip
   history: operation[]
@@ -253,7 +255,7 @@ function MindElixir(
   this.primaryNodeVerticalGap = primaryNodeVerticalGap
 
   this.bus = new Bus()
-  ;(this.bus as any).addListener('operation', (operation: operation) => {
+  this.bus.addListener('operation', (operation: operation) => {
     if (this.isUndo) {
       this.isUndo = false
       return

src/plugin/contextMenu.less

@@ -1,4 +1,4 @@
-cmenu {
+.mind-elixir .context-menu {
   position: fixed;
   top: 0;
   left: 0;

src/plugin/contextMenu.ts

@@ -52,7 +52,8 @@ export default function (mind, option) {
       }
     }
   }
-  const menuContainer = document.createElement('cmenu')
+  const menuContainer = document.createElement('div')
+  menuContainer.className = 'context-menu'
   menuContainer.appendChild(menuUl)
   menuContainer.hidden = true
 
@@ -107,44 +108,44 @@ export default function (mind, option) {
     if (e.target === menuContainer) menuContainer.hidden = true
   }
 
-  add_child.onclick = e => {
+  add_child.onclick = () => {
     mind.addChild()
     menuContainer.hidden = true
   }
-  add_parent.onclick = e => {
+  add_parent.onclick = () => {
     mind.insertParent()
     menuContainer.hidden = true
   }
-  add_sibling.onclick = e => {
+  add_sibling.onclick = () => {
     if (isRoot) return
     mind.insertSibling()
     menuContainer.hidden = true
   }
-  remove_child.onclick = e => {
+  remove_child.onclick = () => {
     if (isRoot) return
     mind.removeNode()
     menuContainer.hidden = true
   }
-  focus.onclick = e => {
+  focus.onclick = () => {
     if (isRoot) return
     mind.focusNode(mind.currentNode)
     menuContainer.hidden = true
   }
-  unfocus.onclick = e => {
+  unfocus.onclick = () => {
     mind.cancelFocus()
     menuContainer.hidden = true
   }
-  up.onclick = e => {
+  up.onclick = () => {
     if (isRoot) return
     mind.moveUpNode()
     menuContainer.hidden = true
   }
-  down.onclick = e => {
+  down.onclick = () => {
     if (isRoot) return
     mind.moveDownNode()
     menuContainer.hidden = true
   }
-  link.onclick = e => {
+  link.onclick = () => {
     menuContainer.hidden = true
     const from = mind.currentNode
     const tips = createTips(i18n[locale].clickTips)

src/plugin/mobileMenu.less

@@ -1,4 +1,4 @@
-mmenu {
+.mind-elixir .mobile-menu {
   position: absolute;
   left: 20px;
   bottom: 70px;

src/plugin/mobileMenu.ts

@@ -36,6 +36,7 @@ export default function (mind, option?) {
     }
   }
   const menuContainer = document.createElement('mmenu')
+  menuContainer.className = 'mobile-menu'
   menuContainer.appendChild(add_child)
   menuContainer.appendChild(add_sibling)
   menuContainer.appendChild(remove_child)

src/plugin/nodeMenu.less

@@ -1,4 +1,4 @@
-nmenu {
+.mind-elixir .node-menu {
   position: absolute;
   right: 20px;
   top: 20px;

src/plugin/nodeMenu.ts

@@ -72,7 +72,8 @@ export default function (mind) {
   const memoDiv = createDiv('nm-memo', `${i18n[locale].memo || 'Memo'}<textarea class="nm-memo" rows="5" tabindex="-1" />`)
 
   // create container
-  const menuContainer = document.createElement('nmenu')
+  const menuContainer = document.createElement('div')
+  menuContainer.className = 'node-menu'
   menuContainer.innerHTML = `
   <div class="button-container"><svg class="icon" aria-hidden="true">
   <use xlink:href="#icon-close"></use>