breadcrumbs

This commit is contained in:
John Hess 2024-06-05 14:16:00 -05:00
parent 1abbe63776
commit f3d3e77f0f
5 changed files with 293 additions and 5 deletions

View file

@ -96,8 +96,39 @@ window.onload = function () {
const { files, folders } = extractDirectoryListing();
console.log('Files:', files);
console.log('Folders:', folders);
const listDiv = document.querySelector('div.list');
// insert a new div before div.list
// Header with breadcrumbs
const usbRoot = "/usb-butter/";
const h2Path = document.querySelector('h2').textContent;
console.log("H2 Path:", h2Path);
const path = h2Path.replace('Index of ', '').replace(usbRoot, '');
console.log("Path:", path);
const breadcrumbs = document.createElement("div");
breadcrumbs.classList.add('breadcrumbs');
let breadcrumbHTML = `
<a href="/"><img class="home-icon" src="/assets/images/home.svg" alt="home"></a>
<a href="${usbRoot}" class="crumb"><img class="path-next" src="/assets/images/next.svg">Explore</a>
`;
pathSteps = path.split('/');
let pathToHere = usbRoot;
pathSteps.forEach((step, index) => {
pathToHere += step + '/';
if (step !== "") {
breadcrumbHTML += `
<a href="${pathToHere}" class="crumb"><img class="path-next" src="/assets/images/next.svg">${step}</a>`;
}
});
breadcrumbs.innerHTML = breadcrumbHTML;
listDiv.parentNode.insertBefore(breadcrumbs, listDiv);
// hr
const fullWithHR = document.createElement('hr');
fullWithHR.classList.add('full-width');
listDiv.parentNode.insertBefore(fullWithHR, listDiv);
// Create a folder listing
const folderListing = document.createElement("div");
folderListing.classList.add('folder-list');
folderListing.innerHTML = '<h2>Folders</h2>';
@ -111,7 +142,6 @@ window.onload = function () {
});
// do the insertion
const listDiv = document.querySelector('div.list');
listDiv.parentNode.insertBefore(folderListing, listDiv);
if (folders.length > 0 && files.length > 0) {