diff --git a/assets/js/drawTree.js b/assets/js/drawTree.js index ff8daa98f..538cec13b 100644 --- a/assets/js/drawTree.js +++ b/assets/js/drawTree.js @@ -80,12 +80,35 @@ tree.forEach((el) => { parentEl.children = [...(parentEl.children || []), el]; }); -// display tree structure -// from https://www.cssscript.com/folder-tree-json/ - -// keep track of the original node objects const structure = root.children; +// a temporary function to traverse the tree and allowing to display something +function* traverse(o, path = []) { + for (var i in o) { + const itemPath = path.concat(i); + yield [i, o[i], itemPath, o]; + if (o[i] !== null && typeof o[i] == "object") { + //going one step down in the object tree!! + yield* traverse(o[i], itemPath); + } + } +} + +// console.log(structure) +for (var [key, value, path] of traverse(structure)) { + // console.log(key); + // console.log(value); + // console.log(path); + // console.log("---"); + let doc = document.getElementById("tree").innerHTML + if (value?.type == "folder") { + document.getElementById("tree").innerHTML = doc + '

'+value.name + '

' + } + if (value?.type == "page") { + document.getElementById("tree").innerHTML = doc + ' '+ value.name+'
' + } +} + return structure } diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 78a634db2..935a2a32d 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -156,61 +156,6 @@ throwOnError : false }); - const siteBaseURL = new URL(BASE_URL); - const pathBase = siteBaseURL.pathname; - - // a temporary function to traverse the tree and allowing to display something - function* traverse(o, path = []) { - for (var i in o) { - const itemPath = path.concat(i); - yield [i, o[i], itemPath, o]; - if (o[i] !== null && typeof o[i] == "object") { - //going one step down in the object tree!! - yield* traverse(o[i], itemPath); - } - } - } - - {{if $.Site.Data.config.enableColumnLayout}} - drawTree(pathBase).then( - function(structure) { - // console.log(structure) - for (var [key, value, path] of traverse(structure)) { - // console.log(key); - // console.log(value); - // console.log(path); - // console.log("---"); - let doc = document.getElementById("tree").innerHTML - if (value?.type == "folder") { - document.getElementById("tree").innerHTML = doc + '

'+value.name + '

' - } - if (value?.type == "page") { - document.getElementById("tree").innerHTML = doc + ' '+ value.name+'
' - } - } - } - ); - {{end}} - - // Get the modal - var modal = document.getElementById("myModal"); - - // Get the button that opens the modal - var btn = document.getElementById("myBtn"); - - // Get the element that closes the modal - var span = document.getElementsByClassName("close")[0]; - - // When the user clicks the button, open the modal - btn.onclick = function() { - modal.style.display = "block"; - } - - // When the user clicks on (x), close the modal - span.onclick = function() { - modal.style.display = "none"; - } - // When the user clicks anywhere outside of the modal, close it window.onclick = function(event) { if (event.target == modal) { @@ -218,8 +163,33 @@ } } - {{end}} + + {{if $.Site.Data.config.enableColumnLayout}} + const siteBaseURL = new URL(BASE_URL); + const pathBase = siteBaseURL.pathname; + drawTree(pathBase) + + // Get the modal + var modal = document.getElementById("myModal"); + + // Get the button that opens the modal + var btn = document.getElementById("myBtn"); + + // Get the element that closes the modal + var span = document.getElementsByClassName("close")[0]; + + // When the user clicks the button, open the modal + btn.onclick = function() { + modal.style.display = "block"; + } + + // When the user clicks on (x), close the modal + span.onclick = function() { + modal.style.display = "none"; + } + {{end}} + }; {{if $.Site.Data.config.enableSPA}}