|
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"; |
196 | 5 |
|
| 6 | +export { Viewer, MindMap, MindmapLayouts, Parsers }; |
0 commit comments