get item count

This commit is contained in:
John Hess 2024-06-12 21:33:48 -05:00
parent f322c1cf08
commit c7646d99ce
2 changed files with 24 additions and 15 deletions

View file

@ -6,12 +6,10 @@
* INJECTION ATTACKS***. We just pop filenames and the like right into innerHTML.
*/
console.log("butter-dir-listing.js loaded!");
const supported_extensions = ["apk", "deb", "dmg", "pdf", "exe", "jpg", "png", "pptx", "ppt", "mp3"];
const usbRoot = "usb-butter/";
const inferredBaseURL = window.location.pathname.split("/" + usbRoot)[0] + "/";
console.log("Inferred Base URL:", inferredBaseURL);
const getFolderDivHTML = (directory_name, number_of_items, href) => {
return `
@ -21,7 +19,7 @@ const getFolderDivHTML = (directory_name, number_of_items, href) => {
</div>
<div class="text-filerow">
<div class="upper-text">${directory_name}</div>
<div class="lower-text">${number_of_items} items</div>
<div class="lower-text"><span id="${href}">${number_of_items}</span> items</div>
</div>
<div class="empty-block"></div>
</a>`;
@ -30,7 +28,6 @@ const getFolderDivHTML = (directory_name, number_of_items, href) => {
const getFileDivHTML = (file_name, size, date, href) => {
icon = "ext-unknown.svg";
extension = file_name.split('.').pop();
console.log("Extension:", extension);
if (supported_extensions.includes(extension)) {
icon = "ext-" + extension + ".svg";
}
@ -49,11 +46,26 @@ const getFileDivHTML = (file_name, size, date, href) => {
</a>`;
};
const getFolderItemCount = async (folder_href) => {
async function populateSpan(response) {
if (!response.ok) {
console.error("Failed to fetch " + folder_href);
return;
}
const text = await response.text();
const doc = new DOMParser().parseFromString(text, 'text/html');
const { files, folders } = extractDirectoryListing(doc);
const items = files.length + folders.length;
const span = document.getElementById(folder_href);
span.textContent = items;
}
const response = fetch(folder_href).then(populateSpan);
}
// Function to extract directory listing information
function extractDirectoryListing() {
function extractDirectoryListing(doc) {
// Get all rows in the table body
const rows = document.querySelectorAll('tbody tr');
console.log('Rows:', rows)
const rows = doc.querySelectorAll('tbody tr');
// Initialize arrays to hold file and folder information
const files = [];
@ -99,16 +111,12 @@ function extractDirectoryListing() {
window.onload = function () {
// Example usage
const { files, folders } = extractDirectoryListing();
console.log('Files:', files);
console.log('Folders:', folders);
const { files, folders } = extractDirectoryListing(window.document);
const listDiv = document.querySelector('div.list');
// Header with breadcrumbs
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');
@ -153,8 +161,9 @@ window.onload = function () {
folders.forEach(folder => {
const folderDiv = document.createElement('div');
folderDiv.classList.add('folder-row');
folderDiv.innerHTML = getFolderDivHTML(folder.name, 0, folder.href);
folderDiv.innerHTML = getFolderDivHTML(folder.name, "?", folder.href);
folderListing.appendChild(folderDiv);
getFolderItemCount(folder.href);
});
// do the insertion

View file

@ -10,14 +10,14 @@ layout: empty
<html>
<head>
<title>Index of /usb-butter/Download/Learn/</title>
<title>Index of /usb-butter/Learn/</title>
<meta name="viewport" content="initial-scale=1">
<link rel="stylesheet" type="text/css" href="{{ site.baseurl }}/assets/css/butter-dir-listing.css">
<script src="{{ site.baseurl }}/assets/js/butter-dir-listing.js"></script>
</head>
<body>
<h2>Index of /usb-butter/Download/Learn/</h2>
<h2>Index of /usb-butter/Learn/</h2>
<div class="list">
<table summary="Directory Listing" cellpadding="0" cellspacing="0">
<thead>