42 lines
1.1 KiB
JavaScript
42 lines
1.1 KiB
JavaScript
/**
|
|
* Build the filetree
|
|
* @param {HTMLElement} parent Root element of the filetree
|
|
* @param {{name: string, is_dir: boolean, children: any[]}} data FileNode
|
|
*/
|
|
const buildFileTree = (parent, data) => {
|
|
const ul = document.createElement("ul");
|
|
data.forEach((item) => {
|
|
const li = document.createElement("li");
|
|
li.textContent = item.name;
|
|
li.classList.add(item.is_dir ? "directory" : "file");
|
|
|
|
if (item.is_dir) {
|
|
li.classList.add("collapsed");
|
|
li.addEventListener("click", function (e) {
|
|
if (e.target === li) {
|
|
li.classList.toggle("collapsed");
|
|
}
|
|
});
|
|
}
|
|
|
|
ul.appendChild(li);
|
|
|
|
if (item.children && item.children.length > 0) {
|
|
buildFileTree(li, item.children);
|
|
}
|
|
});
|
|
|
|
parent.appendChild(ul);
|
|
};
|
|
|
|
window.addEventListener("load", () => {
|
|
const fileTreeElement = document.getElementsByTagName("aside")[0];
|
|
const dataElement = fileTreeElement.getElementsByTagName("div")[0];
|
|
|
|
buildFileTree(
|
|
fileTreeElement,
|
|
JSON.parse(dataElement.getAttribute("data-json")).children
|
|
);
|
|
|
|
dataElement.remove();
|
|
});
|