Skip to content

Commit efae7f4

Browse files
authored
Update code and webpack config to build mindtree as a library (#16)
- Update name to mindtree - Update export default include: viewer, mindmap, layout, parsers - update webpack to build library - update example to include mindtree library - move example out of library source code close #15
1 parent 5ceb8a5 commit efae7f4

25 files changed

+128
-3633
lines changed

example/example.js

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
// import MindmapLayouts from "./layouts"
2+
// import MindMap from "./mindmap"
3+
// import MindMapViewer from './viewer'
4+
// import sample from './sample'
5+
// import { TextParser } from './parser'
6+
7+
// import * as $ from 'jquery'
8+
9+
let text = `
10+
Root
11+
12+
- branch 1
13+
+branch 1.1
14+
15+
- branch 2
16+
branch 2.1
17+
* branch 2.2
18+
branch 2.2.1
19+
20+
-Branch 3
21+
- alo
22+
- ola
23+
- ollala
24+
25+
-Branch 4
26+
- Branch 4.1
27+
- Branch 4.1.1
28+
- Branch 4.2
29+
- Branch 4.3`;
30+
31+
const formNode = document.getElementById("layout-props");
32+
const layoutTimeNode = document.getElementById("layout-time");
33+
const renderTimeNode = document.getElementById("render-time");
34+
35+
const viewer = new mindtree.Viewer("#drawing", {});
36+
37+
function render() {
38+
const count = formNode.dataSize.value;
39+
const layoutType = formNode.layoutType.value;
40+
const MindmapLayout = mindtree.MindmapLayouts[layoutType];
41+
const test = mindtree.Parsers.TextParser.parse(text);
42+
43+
const t0 = window.performance.now();
44+
const mindMap = new mindtree.MindMap(test.root, MindmapLayout, {});
45+
mindMap.build();
46+
const t1 = window.performance.now();
47+
viewer.render(mindMap);
48+
window.viewer = viewer;
49+
const t2 = window.performance.now();
50+
51+
layoutTimeNode.innerHTML = Math.round(t1 - t0);
52+
renderTimeNode.innerHTML = Math.round(t2 - t1);
53+
}
54+
55+
formNode.addEventListener("change", render);
56+
formNode.addEventListener("submit", (e) => {
57+
e.preventDefault();
58+
render();
59+
return false;
60+
});
61+
62+
function randomGraph() {
63+
render();
64+
}
65+
66+
window.onresize = () => {
67+
randomGraph();
68+
};
69+
70+
randomGraph();
File renamed without changes.

index.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -103,8 +103,8 @@
103103
<div class="container" id="container">
104104
<div id="drawing"></div>
105105
</div>
106-
<script src="./dist/js/commons.js"></script>
106+
<script src="./dist/js/mindtree.js"></script>
107107
<!-- <script src="./dist/js/minddown.js"></script> -->
108-
<script src="./dist/js/index.js"></script>
108+
<script src="./example/example.js"></script>
109109
</body>
110110
</html>

src/js/index.js

100755100644
Lines changed: 5 additions & 195 deletions
Original file line numberDiff line numberDiff line change
@@ -1,196 +1,6 @@
1-
import randomTree from './sample/random-tree'
2-
import MindmapLayouts from "./layouts"
3-
import MindMap from "./mindmap"
4-
import MindMapViewer from './viewer'
5-
import sample from './sample'
6-
import { TextParser } from './parser'
7-
8-
// import * as $ from 'jquery'
9-
10-
let text = `
11-
Root
12-
13-
- branch 1
14-
+branch 1.1
15-
16-
- branch 2
17-
branch 2.1
18-
* branch 2.2
19-
branch 2.2.1
20-
21-
-Branch 3
22-
- alo
23-
- ola
24-
- ollala
25-
26-
-Branch 4
27-
- Branch 4.1
28-
- Branch 4.1.1
29-
- Branch 4.2
30-
- Branch 4.3`
31-
32-
33-
const formNode = document.getElementById('layout-props')
34-
const layoutTimeNode = document.getElementById('layout-time')
35-
const renderTimeNode = document.getElementById('render-time')
36-
37-
const viewer = new MindMapViewer('#drawing', {})
38-
39-
40-
41-
42-
function render() {
43-
const count = formNode.dataSize.value
44-
const layoutType = formNode.layoutType.value
45-
// const root = randomTree(count)
46-
const MindmapLayout = MindmapLayouts[layoutType]
47-
const test = TextParser.parse(text)
48-
49-
const t0 = window.performance.now()
50-
const mindMap = new MindMap(test.root, MindmapLayout, {})
51-
mindMap.build()
52-
const t1 = window.performance.now()
53-
viewer.render(mindMap)
54-
window.viewer = viewer
55-
const t2 = window.performance.now()
56-
57-
layoutTimeNode.innerHTML = Math.round(t1 - t0)
58-
renderTimeNode.innerHTML = Math.round(t2 - t1)
59-
60-
}
61-
62-
formNode.addEventListener('change', render)
63-
formNode.addEventListener('submit', (e) => {
64-
e.preventDefault()
65-
render()
66-
return false
67-
})
68-
69-
// var radius = 40, editColor = 'rgb(79, 128, 255)';
70-
// function debug(anchor) {
71-
72-
// var p = two.makeCircle(0, 0, radius / 4);
73-
// var l = two.makeCircle(0, 0, radius / 4);
74-
// l.fill = "#fbc531"
75-
// var r = two.makeCircle(0, 0, radius / 4);
76-
// r.fill = "#44bd32"
77-
78-
// p.translation.copy(anchor);
79-
// l.translation.copy(anchor.controls.left).addSelf(anchor);
80-
// r.translation.copy(anchor.controls.right).addSelf(anchor);
81-
// p.noStroke().fill = editColor
82-
// l.noStroke()
83-
// r.noStroke();
84-
85-
// var ll = new Two.Path([
86-
// new Two.Anchor().copy(p.translation),
87-
// new Two.Anchor().copy(l.translation)
88-
// ]);
89-
// var rl = new Two.Path([
90-
// new Two.Anchor().copy(p.translation),
91-
// new Two.Anchor().copy(r.translation)
92-
// ]);
93-
// rl.noFill().stroke = ll.noFill().stroke = editColor;
94-
95-
// var g = two.makeGroup(rl, ll, p, l, r);
96-
97-
// // letter.add(g);
98-
99-
// p.translation.bind(Two.Events.change, function () {
100-
// anchor.copy(this);
101-
// l.translation.copy(anchor.controls.left).addSelf(this);
102-
// r.translation.copy(anchor.controls.right).addSelf(this);
103-
// ll.vertices[0].copy(this);
104-
// rl.vertices[0].copy(this);
105-
// ll.vertices[1].copy(l.translation);
106-
// rl.vertices[1].copy(r.translation);
107-
// });
108-
// l.translation.bind(Two.Events.change, function () {
109-
// anchor.controls.left.copy(this).subSelf(anchor);
110-
// ll.vertices[1].copy(this);
111-
// });
112-
// r.translation.bind(Two.Events.change, function () {
113-
// anchor.controls.right.copy(this).subSelf(anchor);
114-
// rl.vertices[1].copy(this);
115-
// });
116-
117-
// // Update the renderer in order to generate the actual elements.
118-
// two.update();
119-
120-
// // Add Interactivity
121-
// addInteractivity(p);
122-
// addInteractivity(l);
123-
// addInteractivity(r);
124-
125-
// }
126-
127-
// function addInteractivity(shape) {
128-
129-
// var offset = Two.Vector.add(shape.parent.parent.translation, shape.parent.translation);
130-
131-
// var drag = function (e) {
132-
// e.preventDefault();
133-
// var x = e.clientX - offset.x;
134-
// var y = e.clientY - offset.y;
135-
// shape.translation.set(x, y);
136-
// };
137-
// var touchDrag = function (e) {
138-
// e.preventDefault();
139-
// var touch = e.originalEvent.changedTouches[0];
140-
// drag({
141-
// preventDefault: function () { },
142-
// clientX: touch.pageX,
143-
// clientY: touch.pageY
144-
// });
145-
// return false;
146-
// };
147-
// var dragEnd = function (e) {
148-
// e.preventDefault();
149-
// $(window)
150-
// .unbind('mousemove', drag)
151-
// .unbind('mouseup', dragEnd);
152-
// };
153-
// var touchEnd = function (e) {
154-
// e.preventDefault();
155-
// $(window)
156-
// .unbind('touchmove', touchDrag)
157-
// .unbind('touchend', touchEnd);
158-
// return false;
159-
// };
160-
161-
// $(shape._renderer.elem)
162-
// .css({
163-
// cursor: 'pointer'
164-
// })
165-
// .bind('mousedown', function (e) {
166-
// e.preventDefault();
167-
// $(window)
168-
// .bind('mousemove', drag)
169-
// .bind('mouseup', dragEnd);
170-
// })
171-
// .bind('touchstart', function (e) {
172-
// e.preventDefault();
173-
// $(window)
174-
// .bind('touchmove', touchDrag)
175-
// .bind('touchend', touchEnd);
176-
// return false;
177-
// });
178-
179-
// }
180-
181-
function randomGraph() {
182-
render()
183-
}
184-
185-
186-
window.onresize = () => {
187-
randomGraph()
188-
}
189-
190-
randomGraph()
191-
192-
193-
194-
195-
1+
import Viewer from "./viewer";
2+
import MindMap from "./mindmap";
3+
import MindmapLayouts from "./layouts";
4+
import * as Parsers from "./parser";
1965

6+
export { Viewer, MindMap, MindmapLayouts, Parsers };

src/scss/index.scss

Lines changed: 0 additions & 43 deletions
This file was deleted.

src/scss/test.css

Lines changed: 0 additions & 3 deletions
This file was deleted.
-132 KB
Binary file not shown.
-162 KB
Binary file not shown.

0 commit comments

Comments
 (0)