From db71f75236e4893463d0a227d27a97f34bf6f30a Mon Sep 17 00:00:00 2001
From: sigoden <sigoden@gmail.com>
Date: Sun, 19 Jun 2022 21:23:19 +0800
Subject: [PATCH] feat: ui hidden root dirname (#58)

close #56
---
 assets/index.css |  3 +--
 assets/index.js  | 35 +++++++++++++++++++----------------
 src/server.rs    | 18 +++++++-----------
 3 files changed, 27 insertions(+), 29 deletions(-)

diff --git a/assets/index.css b/assets/index.css
index 3e56634..65aa42e 100644
--- a/assets/index.css
+++ b/assets/index.css
@@ -21,6 +21,7 @@ body {
 
 .breadcrumb {
   font-size: 1.25em;
+  padding-right: 0.6em;
 }
 
 .breadcrumb > a {
@@ -45,8 +46,6 @@ body {
 .breadcrumb svg {
   height: 100%;
   fill: rgba(3,47,98,0.5);
-  padding-right: 0.5em;
-  padding-left: 0.5em;
 }
 
 .toolbox {
diff --git a/assets/index.js b/assets/index.js
index b96f7f8..e812d35 100644
--- a/assets/index.js
+++ b/assets/index.js
@@ -29,10 +29,6 @@ let $uploadersTable;
  * @type Element
  */
 let $emptyFolder;
-/**
- * @type string
- */
-let baseDir;
 
 class Uploader {
   /**
@@ -122,27 +118,34 @@ class Uploader {
 
 /**
  * Add breadcrumb
- * @param {string} value 
+ * @param {string} href 
+ * @param {string} uri_prefix
  */
-function addBreadcrumb(value) {
+function addBreadcrumb(href, uri_prefix) {
   const $breadcrumb = document.querySelector(".breadcrumb");
-  const parts = value.split("/").filter(v => !!v);
+  let parts = [];
+  if (href === "/") {
+    parts = [""];
+  } else {
+    parts = href.split("/");
+  }
   const len = parts.length;
-  let path = "";
+  let path = uri_prefix.slice(0, -1);
   for (let i = 0; i < len; i++) {
     const name = parts[i];
     if (i > 0) {
-      path  += "/" + name;
+      path  += "/" + encodeURI(name);
     }
-    if (i === len - 1) {
+    if (i === 0) {
+      $breadcrumb.insertAdjacentHTML("beforeend", `<a href="${path}"><svg width="16" height="16" viewBox="0 0 16 16"><path d="M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z"/></svg></a>`);
+    } else if (i === len - 1) {
       $breadcrumb.insertAdjacentHTML("beforeend", `<b>${name}</b>`);
-      baseDir = name;
-    } else if (i === 0) {
-      $breadcrumb.insertAdjacentHTML("beforeend", `<a href="/"><b>${name}</b></a>`);
     } else {
-      $breadcrumb.insertAdjacentHTML("beforeend", `<a href="${encodeURI(path)}">${name}</a>`);
+      $breadcrumb.insertAdjacentHTML("beforeend", `<a href="${path}">${name}</a>`);
+    }
+    if (i !== len - 1) {
+      $breadcrumb.insertAdjacentHTML("beforeend", `<span class="separator">/</span>`);
     }
-    $breadcrumb.insertAdjacentHTML("beforeend", `<span class="separator">/</span>`);
   }
 }
 
@@ -333,7 +336,7 @@ function ready() {
     document.getElementById('search').value = params.q;
   }
 
-  addBreadcrumb(DATA.breadcrumb);
+  addBreadcrumb(DATA.href, DATA.uri_prefix);
   if (Array.isArray(DATA.paths)) {
     const len = DATA.paths.length;
     if (len > 0) {
diff --git a/src/server.rs b/src/server.rs
index 8ded493..81460d7 100644
--- a/src/server.rs
+++ b/src/server.rs
@@ -684,12 +684,10 @@ impl Server {
         res: &mut Response,
     ) -> BoxResult<()> {
         paths.sort_unstable();
-        let rel_path = match self.args.path.parent() {
-            Some(p) => path.strip_prefix(p).unwrap(),
-            None => path,
-        };
+        let href = format!("/{}", normalize_path(path.strip_prefix(&self.args.path)?));
         let data = IndexData {
-            breadcrumb: normalize_path(rel_path),
+            href: href.clone(),
+            uri_prefix: self.args.uri_prefix.clone(),
             paths,
             allow_upload: self.args.allow_upload,
             allow_delete: self.args.allow_delete,
@@ -700,17 +698,14 @@ impl Server {
             "__SLOT__",
             &format!(
                 r#"
-<title>Files in {}/ - Duf</title>
+<title>Index of {} - Duf</title>
 <style>{}</style>
 <script>
 const DATA = 
 {}
 {}</script>
 "#,
-                rel_path.display(),
-                INDEX_CSS,
-                data,
-                INDEX_JS
+                href, INDEX_CSS, data, INDEX_JS
             ),
         );
         res.headers_mut()
@@ -819,7 +814,8 @@ const DATA =
 
 #[derive(Debug, Serialize)]
 struct IndexData {
-    breadcrumb: String,
+    href: String,
+    uri_prefix: String,
     paths: Vec<PathItem>,
     allow_upload: bool,
     allow_delete: bool,