Allow users to show/hide hidden files in file chooser.

APTrust · Oct 13, 2023 · 143f9bd · 143f9bd
1 parent 5ae205f
commit 143f9bd
Show file tree

Hide file tree

Showing 6 changed files with 63 additions and 4 deletions.
diff --git a/server/assets/css/dart.css b/server/assets/css/dart.css
@@ -231,7 +231,13 @@ svg.fa-file-pdf {
     color: var(--red);
 }
 
+/* For ul and ol lists to display flush left with no list item marker */
 .flush-no-marker {
     list-style-type: none;
     padding-left: 0rem;
+}
+
+/* Used to mark hidden files and directories in the file chooser  */
+.is-hidden-file {
+    display: none
 }
diff --git a/server/controllers/files_controller.go b/server/controllers/files_controller.go
@@ -18,6 +18,7 @@ func ShowFileChooser(c *gin.Context) {
 }
 
 func InitFileChooser(c *gin.Context) (gin.H, error) {
+	showHiddenFiles := c.Query("showHiddenFiles")
 	directory := c.Query("directory")
 	defaultPaths, err := core.Dart.Paths.DefaultPaths()
 	if err != nil {
@@ -26,12 +27,14 @@ func InitFileChooser(c *gin.Context) (gin.H, error) {
 	parentDir, parentDirShortName := GetParentDir(directory)
 	showParentDirLink := directory != "" && directory != parentDir
 	showJumpMenu := directory != ""
+
 	return gin.H{
 		"parentDir":          parentDir,
 		"parentDirShortName": parentDirShortName,
 		"showParentDirLink":  showParentDirLink,
 		"defaultPaths":       defaultPaths,
 		"showJumpMenu":       showJumpMenu,
 		"currentDir":         directory,
+		"showHiddenFiles":    showHiddenFiles,
 	}, nil
 }
diff --git a/server/server.go b/server/server.go
@@ -60,6 +60,7 @@ func initTemplates(router *gin.Engine) {
 		"fileIconFor":    util.FileIconFor,
 		"humanSize":      util.HumanSize,
 		"strEq":          util.StrEq,
+		"strStartsWith":  util.StrStartsWith,
 		"truncate":       util.Truncate,
 		"truncateMiddle": util.TruncateMiddle,
 		"truncateStart":  util.TruncateStart,

diff --git a/server/views/partials/file_browser.html b/server/views/partials/file_browser.html
@@ -23,15 +23,23 @@
                 <option value="{{ $location.FullPath }}">{{ $location.FileInfo.Name }}</option>
                 {{ end }}
             </select>
+            <div class="form-check mt-2">
+                <label class="form-check-label" for="showHiddenFiles">
+                <input type="checkbox" class="form-check-input" name="showHiddenFiles" id="showHiddenFiles" value="true" {{ if strEq .showHiddenFiles "true" }}checked{{ end }}/>
+                    Show Hidden Files
+                </label>
+            </div>
         </div>
     </form>
     {{ end }}
 
+
+
     <p id="currentDir" title="{{ .currentDir }}"><b>{{ truncateMiddle .currentDir 36 }}</b></p>
 
     {{ if .showParentDirLink }}
     <div class="file-browser-item" title="Parent Directory">
-    <a href="/jobs/files/{{ .job.ID}}?directory={{ .parentDir }}"><i class="fas fa-angle-left"></i>{{ .parentDirShortName }}</a>
+    <a class="file-link" href="/jobs/files/{{ .job.ID}}?directory={{ .parentDir }}&showHiddenFiles={{ .showHiddenFiles }}"><i class="fas fa-angle-left"></i>{{ .parentDirShortName }}</a>
     </div>
     {{ end }}
 
@@ -43,14 +51,21 @@
 
     <div class="col-12">
         {{ $job := .job }}
+        {{ $showHiddenFiles := .showHiddenFiles }}
         {{ range $index, $item := .items}}
 
+            <!-- Mark dot files as hidden. Let user choose whether to show them. -->
+            {{ $cssClass := "file-browser-item" }}
+            {{ if strStartsWith $item.FileInfo.Name "." }}
+                {{ $cssClass = "file-browser-item is-hidden-file" }}
+            {{ end }}
+
             {{ if $item.FileInfo.IsDir }} 
-            <div class="file-browser-item" draggable="true" data-full-path="{{ $item.FullPath }}" data-item-type="directory" title="{{ $item.FileInfo.Name }} - Click link to open. Click icon to drag and drop."><i class="far fa-folder"></i>
-                <a href="/jobs/files/{{ $job.ID}}?directory={{ $item.FullPath }}">{{ $item.FileInfo.Name }}</a>
+            <div class="{{ $cssClass }}" draggable="true" data-full-path="{{ $item.FullPath }}" data-item-type="directory" title="{{ $item.FileInfo.Name }} - Click link to open. Click icon to drag and drop."><i class="far fa-folder"></i>
+                <a class="file-link" href="/jobs/files/{{ $job.ID}}?directory={{ $item.FullPath }}&showHiddenFiles={{ $showHiddenFiles }}">{{ $item.FileInfo.Name }}</a>
             </div>    
             {{ else }}
-            <div class="file-browser-item" draggable="true" title="{{ $item.FileInfo.Name }}" data-full-path="{{ $item.FullPath }}" data-item-type="file">{{ fileIconFor $item.FileInfo.Name }}{{ truncateMiddle $item.FileInfo.Name 36 }}</div>    
+            <div class="{{ $cssClass }}" draggable="true" title="{{ $item.FileInfo.Name }}" data-full-path="{{ $item.FullPath }}" data-item-type="file">{{ fileIconFor $item.FileInfo.Name }}{{ truncateMiddle $item.FileInfo.Name 36 }}</div>    
             {{ end }}
 
         {{ end }}
@@ -62,4 +77,27 @@
     </div>
 </div>
 
+<script>
+$(function(){
+    function toggleHiddenFiles() {
+        var showHidden = "false"
+        if ($("#showHiddenFiles").is(":checked")) {
+            $("div.is-hidden-file").show()
+            showHidden = "true"
+        } else {
+            $("div.is-hidden-file").hide()
+        }
+        $("a.file-link").each(function(i) {
+            var url = $(this)[0].href
+            $(this)[0].href = url.replace(/&showHiddenFiles=\w*$/, `&showHiddenFiles=${showHidden}`)
+        })
+    }
+    // Show/hide hidden files on page load
+    toggleHiddenFiles()
+
+    // And listen for the user changing their mind
+    $("#showHiddenFiles").on("click", toggleHiddenFiles)
+})
+</script>
+
 {{ end }}
diff --git a/util/template_helpers.go b/util/template_helpers.go
@@ -99,6 +99,12 @@ func StrEq(val1, val2 interface{}) bool {
 	return str1 == str2
 }
 
+// StrStartsWith returns true if string s starts with
+// the specified prefix.
+func StrStartsWith(s, prefix string) bool {
+	return strings.HasPrefix(s, prefix)
+}
+
 // EscapeAttr escapes an HTML attribute value.
 // This helps avoid the ZgotmplZ problem.
 func EscapeAttr(s string) template.HTMLAttr {

diff --git a/util/template_helpers_test.go b/util/template_helpers_test.go
@@ -56,6 +56,11 @@ func TestStrEq(t *testing.T) {
 	assert.False(t, util.StrEq("200", 909))
 }
 
+func TestStrStartsWith(t *testing.T) {
+	assert.True(t, util.StrStartsWith("alligator", "all"))
+	assert.False(t, util.StrStartsWith("crocodile", "all"))
+}
+
 func TestEscapeAttr(t *testing.T) {
 	assert.Equal(t, template.HTMLAttr("O'Blivion's"), util.EscapeAttr("O'Blivion's"))
 }