From 5a02ab8aba60a4f1cb3bb8815b7e0d8f728b9cf3 Mon Sep 17 00:00:00 2001
From: Johannes Zellner <johannes@cloudron.io>
Date: Thu, 29 Sep 2022 17:29:42 +0200
Subject: [PATCH] Select entry on context menu in filemanager

---
 src/components/filetree.html | 14 +++++++-------
 src/components/filetree.js   | 31 +++++++++++--------------------
 2 files changed, 18 insertions(+), 27 deletions(-)

diff --git a/src/components/filetree.html b/src/components/filetree.html
index 473daa4ff..5c9bcb973 100644
--- a/src/components/filetree.html
+++ b/src/components/filetree.html
@@ -53,7 +53,7 @@
   </table>
 </div>
 
-<div class="file-list" ng-class="{ 'entry-hovered': dropToBody, 'busy': busy }" context-menu="menuOptionsBlank" ng-mousedown="select($event, null)" ng-drop="drop($event, null)" ng-dragleave="dragExit($event, null)" ng-dragover="dragEnter($event, null)">
+<div class="file-list" ng-class="{ 'entry-hovered': dropToBody, 'busy': busy }" context-menu="menuOptionsBlank" ng-mousedown="onClearSelection($event)" ng-drop="drop($event, null)" ng-dragleave="dragExit($event, null)" ng-dragover="dragEnter($event, null)">
   <table class="table table-hover" style="margin: 0;">
     <tbody>
       <tr ng-show="busy && !busyRefresh">
@@ -62,15 +62,15 @@
       <tr ng-show="!(busy && !busyRefresh) && entries.length === 0">
         <td colspan="" class="text-center">{{ 'filemanager.list.empty' | tr }}</td>
       </tr>
-      <tr ng-hide="busy && !busyRefresh" entry-hashkey="{{ entry['$$hashKey'] }}" ng-repeat="entry in entries" draggable="true" ng-dragstart="dragStart($event, entry)" ng-drop="drop($event, entry)" context-menu="menuOptions" model="entry" ng-dragleave="dragExit($event, entry)" ng-dragover="dragEnter($event, entry)" ng-class="{ 'entry-hovered': entry.hovered, 'entry-selected': isSelected(entry) }">
-        <td style="width: 42px; height: 42px" ng-click="select($event, entry)" ng-dblclick="open(entry)" class="text-center">
+      <tr ng-hide="busy && !busyRefresh" entry-hashkey="{{ entry['$$hashKey'] }}" ng-repeat="entry in entries" ng-mousedown="onMousedown($event, entry)" draggable="true" ng-dragstart="dragStart($event, entry)" ng-drop="drop($event, entry)" context-menu="menuOptions" model="entry" ng-dragleave="dragExit($event, entry)" ng-dragover="dragEnter($event, entry)" ng-class="{ 'entry-hovered': entry.hovered, 'entry-selected': isSelected(entry) }">
+        <td style="width: 42px; height: 42px" ng-dblclick="open(entry)" class="text-center">
           <i ng-show="!entry.previewUrl" class="fas fa-lg {{ entry.icon }}" ng-class="{ 'text-primary': entry.isDirectory && !isSelected(entry) }"></i>
           <img ng-show="entry.previewUrl" ng-src="{{ entry.previewUrl }}" height="42" width="42" style="object-fit: cover;"/>
         </td>
-        <td class="elide-table-cell" ng-click="select($event, entry)" ng-dblclick="open(entry)">{{ entry.fileName }}<span ng-show="entry.isSymbolicLink" class="text-muted" style="margin-left: 20px;">{{ 'filemanager.list.symlink' | tr:{ target: entry.target } }}</span></td>
-        <td style="width:100px" class="elide-table-cell" ng-click="select($event, entry)" ng-dblclick="open(entry)">{{ entry.uid | prettyOwner }}</td>
-        <td style="width: 80px" class="elide-table-cell" ng-click="select($event, entry)" ng-dblclick="open(entry)">{{ entry.size | prettyByteSize }}</td>
-        <td style="width:100px" class="elide-table-cell" ng-click="select($event, entry)" ng-dblclick="open(entry)" uib-tooltip="{{ entry.mtime | prettyLongDate }}" tooltip-append-to-body="true">{{ entry.mtime | prettyDate }}</td>
+        <td class="elide-table-cell" ng-dblclick="open(entry)">{{ entry.fileName }}<span ng-show="entry.isSymbolicLink" class="text-muted" style="margin-left: 20px;">{{ 'filemanager.list.symlink' | tr:{ target: entry.target } }}</span></td>
+        <td style="width:100px" class="elide-table-cell" ng-dblclick="open(entry)">{{ entry.uid | prettyOwner }}</td>
+        <td style="width: 80px" class="elide-table-cell" ng-dblclick="open(entry)">{{ entry.size | prettyByteSize }}</td>
+        <td style="width:100px" class="elide-table-cell" ng-dblclick="open(entry)" uib-tooltip="{{ entry.mtime | prettyLongDate }}" tooltip-append-to-body="true">{{ entry.mtime | prettyDate }}</td>
         <td style="width: 45px">
           <button type="button" class="btn btn-xs btn-default context-menu-action" context-menu="menuOptions" model="entry" context-menu-on="click" ng-click="onEntryContextMenu($event, entry)"><i class="fas fa-ellipsis-h"></i></button>
         </td>
diff --git a/src/components/filetree.js b/src/components/filetree.js
index 8ae38affd..f525fd94d 100644
--- a/src/components/filetree.js
+++ b/src/components/filetree.js
@@ -319,34 +319,25 @@ function FileTreeController($scope, $translate, $timeout, Client) {
         openPath(sanitize(path));
     };
 
-    $scope.select = function ($event, entry) {
-        // we don't stop propagation for context menu closing, but if targets don't match we got the whole list click event
+    $scope.onClearSelection = function ($event) {
+        // we don't stop propagation if targets don't match we got the whole list click event
         if ($event.currentTarget !== $event.target) return;
 
-        if (!entry) {
-            $scope.selected = [];
-            return;
-        }
+        $scope.selected = [];
+    };
 
+    $scope.onMousedown = function ($event, entry) {
         var i = $scope.selected.indexOf(entry);
         var multi = ($event.ctrlKey || $event.metaKey);
 
-        if ($event.button === 0) {
-            // left click
-
-            if (multi) {
-                if (i === -1) $scope.selected.push(entry);
-                else $scope.selected.splice(i, 1);
-            } else {
-                $scope.selected = [ entry ];
-            }
-        } else if ($event.button === 2) {
-            // right click
-
+        if (multi) {
             if (i === -1) {
-                if (multi) $scope.selected.push(entry);
-                else $scope.selected = [ entry ];
+                $scope.selected.push(entry);
+            } else if ($event.button === 0) { // only do this on left click
+                $scope.selected.splice(i, 1);
             }
+        } else {
+            $scope.selected = [ entry ];
         }
     };