From cdaf3cb428d99bf78938e61fde60a2eb549330b6 Mon Sep 17 00:00:00 2001
From: Kyle Spearrin <kyle.spearrin@gmail.com>
Date: Fri, 9 Jun 2017 12:30:47 -0400
Subject: [PATCH] ux improvements for bulk actions

---
 src/app/vault/vaultController.js | 22 +++++++++++++++++-----
 src/app/vault/views/vault.html   | 20 +++++++++++++++++---
 2 files changed, 34 insertions(+), 8 deletions(-)

diff --git a/src/app/vault/vaultController.js b/src/app/vault/vaultController.js
index 2eac272a8f..b00fb84236 100644
--- a/src/app/vault/vaultController.js
+++ b/src/app/vault/vaultController.js
@@ -312,8 +312,17 @@
             return $scope.folderIdFilter === undefined || folder.id === $scope.folderIdFilter;
         };
 
+        $scope.unselectAll = function () {
+            selectAll(false);
+        };
+
+        $scope.selectFolder = function (folder, $event) {
+            var checkbox = $($event.currentTarget).closest('.box').find('input[name="loginSelection"]');
+            checkbox.prop('checked', true);
+        };
+
         $scope.select = function ($event) {
-            var checkbox = $($event.currentTarget).parent().find('input[name="loginSelection"]');
+            var checkbox = $($event.currentTarget).closest('tr').find('input[name="loginSelection"]');
             checkbox.prop('checked', !checkbox.prop('checked'));
         };
 
@@ -327,8 +336,8 @@
             }).get().filter(distinct);
         }
 
-        function clearLoginSelections() {
-            $('input[name="loginSelection"]').prop('checked', false);
+        function selectAll(select) {
+            $('input[name="loginSelection"]').prop('checked', select);
         }
 
         $scope.bulkMove = function () {
@@ -356,8 +365,9 @@
                     }
                 }
 
-                clearLoginSelections();
+                selectAll(false);
                 sortScopedLoginData();
+                toastr.success('Items have been moved!');
             });
         };
 
@@ -383,9 +393,11 @@
                     }
                 }
 
-                clearLoginSelections();
+                selectAll(false);
                 $scope.bulkActionLoading = false;
+                toastr.success('Items have been deleted!');
             }, function () {
+                toastr.error('An error occurred.');
                 $scope.bulkActionLoading = false;
             });
         };
diff --git a/src/app/vault/views/vault.html b/src/app/vault/views/vault.html
index 1e53dde415..8e05acb165 100644
--- a/src/app/vault/views/vault.html
+++ b/src/app/vault/views/vault.html
@@ -16,6 +16,12 @@
                     <i class="fa fa-fw fa-trash"></i> Delete Selected
                 </a>
             </li>
+            <li role="separator" class="divider"></li>
+            <li>
+                <a href="#" stop-click ng-click="unselectAll()">
+                    <i class="fa fa-fw fa-minus-square-o"></i> Unselect All
+                </a>
+            </li>
         </ul>
     </div>
     <h1>
@@ -144,6 +150,11 @@
                                 <i class="fa fa-fw fa-pencil"></i> Edit Folder
                             </a>
                         </li>
+                        <li>
+                            <a href="#" stop-click ng-click="selectFolder(folder, $event)">
+                                <i class="fa fa-fw fa-check-square-o"></i> Select All
+                            </a>
+                        </li>
                         <li ng-show="canDeleteFolder(folder)">
                             <a href="#" stop-click ng-click="deleteFolder(folder)" class="text-red">
                                 <i class="fa fa-fw fa-trash"></i> Delete Folder
@@ -202,8 +213,8 @@
                                     </ul>
                                 </div>
                             </td>
-                            <td class="action-select">
-                                <input type="checkbox" value="{{::login.id}}" name="loginSelection" />
+                            <td class="action-select" ng-click="select($event)">
+                                <input type="checkbox" value="{{::login.id}}" name="loginSelection" stop-prop />
                             </td>
                             <td ng-click="select($event)">
                                 <a href="#" stop-click ng-click="editLogin(login)" stop-prop>{{login.name}}</a>
@@ -231,7 +242,10 @@
         <h3 class="control-sidebar-heading">
             <i class="fa fa-folder fa-fw"></i> Folders
         </h3>
-        <ul class="control-sidebar-menu">
+        <div ng-show="loading && !vaultFolders.length">
+            <p>Loading...</p>
+        </div>
+        <ul class="control-sidebar-menu" ng-show="!loading && vaultFolders.length">
             <li ng-repeat="folder in vaultFolders track by folder.id">
                 <a href="#" stop-click ng-click="filterFolder(folder)">
                     <i class="fa fa-check" ng-if="folder.id === folderIdFilter"></i>