-
Notifications
You must be signed in to change notification settings - Fork 18
/
Copy pathindex.html
74 lines (69 loc) · 2.86 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>InspireTree - Inspired Javascript Tree UI Component</title>
<link rel="stylesheet" href="build/inspire-tree-light.css" />
<link rel="stylesheet" href="demos/demo.css" />
</head>
<body>
<article>
<header>
<h1>Inspire Tree</h1>
<p>Inspire Tree is a highly efficient javascript-based UI tree component, built for the modern web.</p>
<p>Other demos: <a href="demos/checkbox.html">Checkboxes</a>,
<a href="demos/bucket.html">Bucket</a>,
<a href="demos/dark.html">Dark Theme</a>,
<a href="demos/search.html">Search</a>,
<a href="demos/search-external.html">External Search</a>,
<a href="demos/dynamic-children.html">Dynamic Children</a>,
<a href="demos/deferred-render.html">Deferred Rendering</a>,
<a href="demos/deferred-load.html">Deferred Loading</a>,
<a href="demos/editing.html">Inline Editing</a>,
<a href="demos/drag-drop.html">Drag and Drop</a>,
<a href="demos/context-menu.html">Context Menu</a>,
<a href="demos/multiselect.html">Multiselect</a>,
<a href="demos/scroll.html">Scroll</a>.
</header>
<section>
<div class="wrap">
<div class="tree"></div>
<button class="log-selected">Log Selected</button>
<button class="clear-selected">Clear Selected</button>
</div>
<div class="log">
<ul></ul>
</div>
</section>
</article>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.2.0/require.min.js"></script>
<script>
require.config({
paths: {
jquery: 'https://code.jquery.com/jquery-3.2.1.min',
'inspire-tree': './node_modules/inspire-tree/dist/inspire-tree',
'inspire-tree-dom': './build/inspire-tree-dom',
lodash: 'https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.6.1/lodash'
}
});
require([
'jquery',
'lodash',
'inspire-tree',
'inspire-tree-dom'
], function($, _, InspireTree, InspireTreeDOM) {
var tree = new InspireTree({
data: $.getJSON('demos/sample-data/full.json')
});
var treeDOM = new InspireTreeDOM(tree, {
target: '.tree'
});
tree.mute('node.rendered');
tree.onAny(function() {
console.log(arguments);
});
console.log('api', tree);
});
</script>
</html>