path clickable

ESIPFed · Sep 21, 2024 · 0e3c97b · 0e3c97b
1 parent 934ee1f
commit 0e3c97b
Show file tree

Hide file tree

Showing 2 changed files with 66 additions and 4 deletions.
diff --git a/src/main/resources/static/js/gw.result.browser.js b/src/main/resources/static/js/gw.result.browser.js
@@ -1,15 +1,77 @@
 
 GW.result.browser = {
 
+    current_path: "",
+
     init: function () {
 
         // GW.result.browser.loadFileList();
-        GW.result.browser.render_file_list()
+        GW.result.browser.render_file_list();
+        GW.result.browser.updateFolderPath("");
 
         $('#result-refresh-button').on('click', function() {
-            GW.result.browser.loadFolderContents("");; // Reload the data from the server
+            console.log("current path " + GW.result.browser.current_path);
+            GW.result.browser.changePath(GW.result.browser.current_path);
+        });
+
+    },
+
+    updateFolderPath: function(path) {
+        GW.result.browser.current_path = path;
+        const pathElement = $('#folder-path');
+        pathElement.empty(); // Clear the current folder path
+
+        // Create the "Root" link that navigates to the root folder
+        const rootLink = $('<span>')
+            .text('Root')
+            .css('cursor', 'pointer')
+            .on("click", function() {
+                // Load the root folder when clicked
+                GW.result.browser.changePath('');
+            });
+
+        pathElement.append(rootLink);
+        pathElement.append(' / '); // Add separator after "Root"
+
+        // Split and process each folder part
+        const pathParts = path.split('/');
+        console.log(pathParts)
+        let cumulativePath = '';
+
+        $.each(pathParts, function(index, folder) {
+            // Skip empty parts (before root '/')
+            if (folder === '') return;
+
+            // Update the cumulative path for each part
+            cumulativePath += (index === 0) ? '/' + folder : '/' + folder;
+
+            // Store the unique cumulative path for each folder part
+            const folderPartPath = cumulativePath;
+
+            // Create clickable folder link for each part
+            const folderLink = $('<span>')
+                .text(folder)
+                .css('cursor', 'pointer')
+                .on('click', function() {
+                    // Load folder contents for that specific part using the unique path
+                    GW.result.browser.changePath(folderPartPath);
+                });
+
+            pathElement.append(folderLink);
+
+            // Add separator for the path parts, except the last one
+            if (index < pathParts.length - 1) {
+                pathElement.append(' / ');
+            }
         });
+    },
 
+    // Function to handle path change
+    changePath: function(newPath) {
+        currentPath = newPath;
+        console.log('Navigating to: ' + currentPath);
+        GW.result.browser.updateFolderPath(currentPath);
+        GW.result.browser.loadFolderContents(currentPath); // Load new folder contents
     },
 
     render_file_list: function(){
@@ -85,7 +147,7 @@ GW.result.browser = {
             if (rowData.isDirectory) {
                 // If the row is a folder, navigate into it
                 var path = rowData.path;
-                GW.result.browser.loadFolderContents(path);
+                GW.result.browser.changePath(path);
             }
         });
 

diff --git a/src/main/resources/templates/fragments/content/workspace/result-browser.html b/src/main/resources/templates/fragments/content/workspace/result-browser.html
@@ -4,7 +4,7 @@
         <div class="card" style="padding:5px;">
             <div class="card-body">
                 <button id="result-refresh-button" class="btn btn-link"><i class="fas fa-sync-alt"></i></button>
-                <span id="refresh-text"> Files in $HOME/gw-workflow/results</span>
+                <span id="refresh-text"> Files in <span id="folder-path"></span></span>
                 <table id="file-list-table" class="display" style="width:100%;">
                     <thead>
                         <tr>