ajax/getfoldercontents.php

@@ -31,6 +31,11 @@ function compareNames($a, $b) {
     return strnatcmp($a["name"], $b["name"]);
 }
 
+$data["compath"] = $compath;
+$pathparts = pathinfo($compath);
+$data["parentpath"] = $pathparts['dirname'];
+$data["foldername"] = $pathparts['basename'];
+
 $adultcomics = getAdultComics();
 
 $compath = $_SESSION['compath'];

ajax/setpath.php

@@ -29,6 +29,8 @@ if ( ($newpath == "/") || ($comicfull === false) || (substr($comicfull, 0, strle
 }
 $data["message"] = "New comic path: {$_SESSION["compath"]}";
 $pathparts = pathinfo($_SESSION['compath']);
+$data["parentpath"] = $pathparts["dirname"];
+$data["foldername"] = $pathparts["basename"];
 
 header('Content-Type: application/json');
 echo json_encode($data);

index.php

@@ -8,7 +8,7 @@ require_once 'htmlheader.php';
 ?>
 <div class='header' id='header'>
   <div class='sorter'>Sort: <span id="sortorder"></span></div>
-  <div id="path" class='name link'>/Comics/</div>
+  <div id="path" class='name link'></div>
 </div>
 <div id="list" class='list'></div>
 <?php

js/comics.js

@@ -1,8 +1,12 @@
 const NOREFRESH = false;
 
+var curpath = "/";
+var parentpath = "/";
+var foldername = "";
+
 // This function is executed after the page load completes on the client
 $(document).ready(function() {
-   $("#path").click(function() { changeFolder("/"); });
+   $("#path").click(function() { changeFolder(parentpath, parentpath); });
    $("#sortorder").on("click", cycleSortOrder);
    getSortOrder();
 });
@@ -93,10 +97,12 @@ function getFolderContents() {
                        redirectToLogin();
                        return;
                     }
+                    curpath = data.compath;
+                    updatePathNavigator();
                     data.contents.forEach(function(entry, index) {
                        $("#list").append(entry.div);
                     });
-                    $(".folder").click(function() { changeFolder($(this).data("path")); });
+                    $(".folder").click(function() { changeFolder($(this).data("name"), $(this).data("path")); });
                     $(".issue").click(function() { $(this).parent().addClass("readborder"); showComic($(this).data("relcomic"), $(this).data("comname")); });
                     toastr.remove();
       },
@@ -107,6 +113,23 @@ function getFolderContents() {
    });
 }
 
+/**
+ * Updates the navigation path displayed in the element with id "path".
+ * If the current path is the root ("/"), it sets the navigation path to "/".
+ * Otherwise, it sets the navigation path to "/Comics" followed by the parent path.
+ *
+ * Assumes the existence of global variables `curpath` and `parentpath`.
+ */
+function updatePathNavigator() {
+   var navpath = "";
+   if ( curpath == "/" ) {
+      navpath = "/";
+   } else {
+      navpath = "/Comics" + parentpath;
+   }
+   $("#path").html(navpath);
+}
+
 /**
  * Changes the current folder by sending an AJAX request to update the path on the server.
  * Displays a notification to the user and updates global variables upon success.
@@ -114,7 +137,7 @@ function getFolderContents() {
  * @param {string} name - The display name of the folder to open.
  * @param {string} path - The path of the folder to open.
  */
-function changeFolder(path) {
+function changeFolder(name, path) {
    $.ajax({
       url      : 'ajax/setpath.php',
       data     : {path: path},
@@ -124,6 +147,9 @@ function changeFolder(path) {
                        redirectToLogin();
                        return;
                     }
+                    curpath = path;
+                    parentpath = data.parentpath;
+                    foldername = data.foldername;
                     toastr.remove();
                     getFolderContents();
                  },