diff --git a/assets/css/butter-dir-listing.css b/assets/css/butter-dir-listing.css
index e258684..544fba9 100644
--- a/assets/css/butter-dir-listing.css
+++ b/assets/css/butter-dir-listing.css
@@ -43,6 +43,24 @@ div.foot {
font-size: 14px;
}
+.folder-name {
+ display: flex;
+ align-items: center;
+ height: 34px;
+ margin: 10px;
+ a {
+ display: flex;
+ align-items: center;
+
+ }
+ img.back {
+ width: 18px;
+ height: 18px;
+ rotate: 180deg;
+ margin-right: 10px;
+ }
+}
+
h2 {
font-size: 18px;
font-weight: 500;
diff --git a/assets/js/butter-dir-listing.js b/assets/js/butter-dir-listing.js
index 980b43c..fa5a7ec 100644
--- a/assets/js/butter-dir-listing.js
+++ b/assets/js/butter-dir-listing.js
@@ -8,7 +8,7 @@
console.log("butter-dir-listing.js loaded!");
-const supported_extensions = [".apk"];
+const supported_extensions = ["apk", "deb", "img", "pdf"];
const usbRoot = "usb-butter/";
const inferredBaseURL = window.location.pathname.split("/" + usbRoot)[0] + "/";
console.log("Inferred Base URL:", inferredBaseURL);
@@ -30,8 +30,9 @@ 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";
+ icon = "ext-" + extension + ".svg";
}
return `
@@ -113,11 +114,13 @@ window.onload = function () {
Explore
`;
- pathSteps = path.split('/');
+ const pathSteps = path.split('/');
+ let thisDirsName = "Explore";
let pathToHere = usbRoot;
pathSteps.forEach((step, index) => {
- pathToHere += step + '/';
if (step !== "") {
+ pathToHere += step + '/';
+ thisDirsName = step;
breadcrumbHTML += `
${step}`;
}
@@ -130,6 +133,13 @@ window.onload = function () {
fullWithHR.classList.add('full-width');
listDiv.parentNode.insertBefore(fullWithHR, listDiv);
+ // Secondary header
+ const secondaryHeader = document.createElement('div');
+ secondaryHeader.classList.add('folder-name');
+ secondaryHeader.innerHTML = `
`;
+ secondaryHeader.innerHTML += `${thisDirsName}`;
+ listDiv.parentNode.insertBefore(secondaryHeader, listDiv);
+
// Create a folder listing
const folderListing = document.createElement("div");
folderListing.classList.add('folder-list');
diff --git a/simulated-usb-butter/johns_folder/index.html b/simulated-usb-butter/johns_folder/index.html
index 964eb50..c0e0760 100644
--- a/simulated-usb-butter/johns_folder/index.html
+++ b/simulated-usb-butter/johns_folder/index.html
@@ -24,8 +24,9 @@ layout: empty