-
Notifications
You must be signed in to change notification settings - Fork 0
/
demo.html
36 lines (33 loc) · 1.23 KB
/
demo.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
<!DOCTYPE html>
<html>
<body>
<div class="cont" style="border:2px solid black;width:500px;height:500px;margin:50px;word-break:break-all;"></div>
<script src="./src/ftree.js"></script>
<link rel="stylesheet" href="./src/ftree.css">
<script>
var jsonContent = {
Users: {
John: {
Documents: {
Notes: "Some notes",
Pictures: {
"Sunset.jpg": "Sunset in the mountains",
"Lighthouse.jpg": "View from the lighthouse",
}
},
Downloads: {
"javascript.js": "JavaScript",
"html.html": "HTML",
"css.css": "CSS",
}
}
}
};
new fTree(jsonContent,document.querySelector('.cont'))
// if you want file icons:
document.querySelectorAll('.file').forEach(file => {
file.innerHTML = '<img src="' + nameGenerator(file.innerText) + `" style="height:15px" onerror="this.src='https://raw.githubusercontent.com/PKief/vscode-material-icon-theme/main/icons/file.svg'"> ` + file.innerText
})
</script>
</body>
</html>