From fdd528b1007b1cc3c7fa248bc880469fd400c00f Mon Sep 17 00:00:00 2001
From: bergware <bergware@users.noreply.github.com>
Date: Fri, 10 Feb 2023 13:52:59 +0100
Subject: [PATCH] Docker: filetree corrections

---
 .../include/CreateDocker.php                  | 22 ++++++--------
 plugins/dynamix/include/FileTree.php          | 30 ++++++++++---------
 plugins/dynamix/styles/jquery.filetree.css    |  2 +-
 3 files changed, 26 insertions(+), 28 deletions(-)

diff --git a/plugins/dynamix.docker.manager/include/CreateDocker.php b/plugins/dynamix.docker.manager/include/CreateDocker.php
index 487909a28..d6537f605 100644
--- a/plugins/dynamix.docker.manager/include/CreateDocker.php
+++ b/plugins/dynamix.docker.manager/include/CreateDocker.php
@@ -341,7 +341,7 @@ function makeConfig(opts) {
   if (opts.Type == "Path") {
     value.attr("onclick", "openFileBrowser(this,$(this).val(),$(this).val(),'',true,false);");
   } else if (opts.Type == "Device") {
-    value.attr("onclick", "openFileBrowser(this,'/dev','/dev','',false,true);")
+    value.attr("onclick", "openFileBrowser(this,'/dev','/dev','',true,true);")
   } else if (opts.Type == "Variable" && opts.Default.split("|").length > 1) {
     var valueOpts = opts.Default.split("|");
     var newValue = "<select name='confValue[]' class='selectVariable' default='"+valueOpts[0]+"'>";
@@ -571,7 +571,7 @@ function toggleMode(el,disabled) {
   switch ($(el)[0].selectedIndex) {
   case 0: // Path
     mode.html("<dl><dt>_(Access Mode)_:</dt><dd><select name='Mode'><option value='rw'>_(Read/Write)_</option><option value='rw,slave'>_(Read/Write - Slave)_</option><option value='rw,shared'>_(Read/Write - Shared)_</option><option value='ro'>_(Read Only)_</option><option value='ro,slave'>_(Read Only - Slave)_</option><option value='ro,shared'>_(Read Only - Shared)_</option></select></dd></dl>");
-    value.bind("click", function(){openFileBrowser(this, $(this).val(), $(this).val(), 'sh', true, false);});
+    value.bind("click", function(){openFileBrowser(this,$(this).val(),$(this).val(),'',true,false);});
     targetDiv.find('#dt1').text("_(Container Path)_");
     valueDiv.find('#dt2').text("_(Host Path)_");
     break;
@@ -605,7 +605,7 @@ function toggleMode(el,disabled) {
     targetDiv.hide();
     defaultDiv.hide();
     valueDiv.find('#dt2').text("_(Value)_");
-    value.bind("click", function(){openFileBrowser(this, '/dev', '/dev', '', true, true);});
+    value.bind("click", function(){openFileBrowser(this,'/dev','/dev','',true,true);});
     break;
   }
   reloadTriggers();
@@ -630,21 +630,17 @@ function openFileBrowser(el, top, root, filter, on_folders, on_files, close_on_s
   if (!filter && !on_files) filter = 'HIDE_FILES_FILTER';
   if (!root.trim()) {root = "/mnt/user/"; top = "/mnt/";}
   p = $(el);
-  // Skip is fileTree is already open
+  // Skip if fileTree is already open
   if (p.next().hasClass('fileTree')) return null;
   // create a random id
-  var r = Math.floor((Math.random()*1000)+1);
+  var r = Math.floor((Math.random()*10000)+1);
   // Add a new span and load fileTree
   p.after("<span id='fileTree"+r+"' class='textarea fileTree'></span>");
   var ft = $('#fileTree'+r);
-  ft.fileTree({
-    top: top,
-    root: root,
-    filter: filter,
-    allowBrowsing: true
-  },
-  function(file){if(on_files){p.val(file);p.trigger('change');if(close_on_select){ft.slideUp('fast',function(){ft.remove();});}}},
-  function(folder){if(on_folders){p.val(folder.replace(/\/\/+/g,'/'));p.trigger('change');if(close_on_select){$(ft).slideUp('fast',function(){$(ft).remove();});}}});
+  ft.fileTree({top:top, root:root, filter:filter, allowBrowsing:true},
+    function(file){if(on_files){p.val(file);p.trigger('change');if(close_on_select){ft.slideUp('fast',function(){ft.remove();});}}},
+    function(folder){if(on_folders){p.val(folder.replace(/\/\/+/g,'/'));p.trigger('change');if(close_on_select){$(ft).slideUp('fast',function(){$(ft).remove();});}}}
+  );
   // Format fileTree according to parent position, height and width
   ft.css({'left':p.position().left,'top':(p.position().top+p.outerHeight()),'width':(p.width())});
   // close if click elsewhere
diff --git a/plugins/dynamix/include/FileTree.php b/plugins/dynamix/include/FileTree.php
index 4f09c0955..f2e06a358 100644
--- a/plugins/dynamix/include/FileTree.php
+++ b/plugins/dynamix/include/FileTree.php
@@ -52,21 +52,23 @@ echo "<ul class='jqueryFileTree'>";
 if ($_POST['show_parent']=='true' && is_top($rootdir)) echo "<li class='directory collapsed'>$checkbox<a href='#' rel=\"".htmlspecialchars(dirname($rootdir))."\">..</a></li>";
 
 if (is_low($rootdir) && is_dir($rootdir)) {
-  $names = array_filter(scandir($rootdir),function($n){return $n!='.' && $n!='..';});
-  if (count($names)) {
-    natcasesort($names);
-    foreach ($names as $dir) if (is_dir($rootdir.$dir)) {
-      $htmlRel  = htmlspecialchars($rootdir.$dir);
-      $htmlName = htmlspecialchars(mb_strlen($dir)<=33 ? $dir : mb_substr($dir,0,30).'...');
-      if (empty($match)||preg_match("/$match/",$rootdir.$dir)) echo "<li class='directory collapsed'>$checkbox<a href='#' rel=\"$htmlRel/\">$htmlName</a></li>";
+  $dirs = $files = [];
+  $names = array_filter(scandir($rootdir,SCANDIR_SORT_NONE),function($n){return $n!='.' && $n!='..';});
+  natcasesort($names);
+  foreach ($names as $name) if (is_dir($rootdir.$name)) $dirs[] = $name; else $files[] = $name;
+  foreach ($dirs as $name) {
+    $htmlRel  = htmlspecialchars($rootdir.$name);
+    $htmlName = htmlspecialchars(mb_strlen($name)<=33 ? $name : mb_substr($name,0,30).'...');
+    if (is_dir($rootdir.$name)) {
+      if (empty($match)||preg_match("/$match/",$rootdir.$name)) echo "<li class='directory collapsed'>$checkbox<a href='#' rel=\"$htmlRel/\">$htmlName</a></li>";
     }
-    foreach ($names as $file) if (is_file($rootdir.$file)) {
-      $htmlRel  = htmlspecialchars($rootdir.$file);
-      $htmlName = htmlspecialchars($file);
-      $ext      = mb_strtolower(pathinfo($file)['extension']??'');
-      foreach ($filters as $filter) if (empty($filter)||$ext==$filter) {
-        if (empty($match)||preg_match("/$match/",$file)) echo "<li class='file ext_$ext'>$checkbox<a href='#' rel=\"$htmlRel\">$htmlName</a></li>";
-      }
+  }
+  foreach ($files as $name) {
+    $htmlRel  = htmlspecialchars($rootdir.$name);
+    $htmlName = htmlspecialchars($name);
+    $ext      = mb_strtolower(pathinfo($name)['extension']??'');
+    foreach ($filters as $filter) if (empty($filter)||$ext==$filter) {
+      if (empty($match)||preg_match("/$match/",$name)) echo "<li class='file ext_$ext'>$checkbox<a href='#' rel=\"$htmlRel\">$htmlName</a></li>";
     }
   }
 }
diff --git a/plugins/dynamix/styles/jquery.filetree.css b/plugins/dynamix/styles/jquery.filetree.css
index 866528e5f..b0400a333 100644
--- a/plugins/dynamix/styles/jquery.filetree.css
+++ b/plugins/dynamix/styles/jquery.filetree.css
@@ -1,5 +1,5 @@
 UL.jqueryFileTree{font-family:clear-sans;font-size:1.2rem;line-height:1.8rem;padding:0;margin:0;display:none}
-UL.jqueryFileTree LI{	list-style:none;padding:0;padding-left:20px;margin:0;white-space:nowrap}
+UL.jqueryFileTree LI{list-style:none;padding:0;padding-left:20px;margin:0;white-space:nowrap}
 UL.jqueryFileTree A{color:inherit;text-decoration:none;display:inline-block;padding:0 2px}
 UL.jqueryFileTree A:hover{background:#a0a0a0}
 /* Core Styles */