From 488dbb6715c638aeb044f0cd676f0daedec12e3b Mon Sep 17 00:00:00 2001
From: Kyle Spearrin <kyle.spearrin@gmail.com>
Date: Fri, 9 Jun 2017 01:10:53 -0400
Subject: [PATCH] toggle checkboxes by clicking whole cell

---
 src/app/directives/stopPropDirective.js | 10 ++++++++++
 src/app/vault/vaultController.js        |  7 ++++++-
 src/app/vault/views/vault.html          | 20 +++++++++++---------
 src/index.html                          |  1 +
 4 files changed, 28 insertions(+), 10 deletions(-)
 create mode 100644 src/app/directives/stopPropDirective.js

diff --git a/src/app/directives/stopPropDirective.js b/src/app/directives/stopPropDirective.js
new file mode 100644
index 0000000000..5b0f606029
--- /dev/null
+++ b/src/app/directives/stopPropDirective.js
@@ -0,0 +1,10 @@
+angular
+    .module('bit.directives')
+
+    .directive('stopProp', function () {
+        return function (scope, element, attrs) {
+            $(element).click(function (event) {
+                event.stopPropagation();
+            });
+        };
+    });
diff --git a/src/app/vault/vaultController.js b/src/app/vault/vaultController.js
index f1bbe875a1..6e479dd93c 100644
--- a/src/app/vault/vaultController.js
+++ b/src/app/vault/vaultController.js
@@ -312,6 +312,11 @@
             return $scope.folderIdFilter === undefined || folder.id === $scope.folderIdFilter;
         };
 
+        $scope.select = function ($event) {
+            var checkbox = $($event.currentTarget).parent().find('input[name="loginSelection"]');
+            checkbox.prop('checked', !checkbox.prop('checked'));
+        };
+
         function distinct(value, index, self) {
             return self.indexOf(value) === index;
         }
@@ -323,7 +328,7 @@
         }
 
         function clearLoginSelections() {
-            $('input[name="loginSelection"]').attr('checked', false);
+            $('input[name="loginSelection"]').prop('checked', false);
         }
 
         $scope.bulkMove = function () {
diff --git a/src/app/vault/views/vault.html b/src/app/vault/views/vault.html
index 85fc259b86..1e53dde415 100644
--- a/src/app/vault/views/vault.html
+++ b/src/app/vault/views/vault.html
@@ -107,10 +107,11 @@
                             <td class="action-select">
                                 <input type="checkbox" value="{{::login.id}}" name="loginSelection" />
                             </td>
-                            <td>
-                                <a href="#" stop-click ng-click="editLogin(login)">{{login.name}}</a>
-                                <i class="fa fa-share-alt text-muted" title="Shared" ng-show="login.organizationId"></i>
-                                <div class="text-sm text-muted">{{login.username}}</div>
+                            <td ng-click="select($event)">
+                                <a href="#" stop-click ng-click="editLogin(login)" stop-prop>{{login.name}}</a>
+                                <i class="fa fa-share-alt text-muted" title="Shared" ng-show="login.organizationId"
+                                   stop-prop></i><br />
+                                <span class="text-sm text-muted" stop-prop>{{login.username}}</span>
                             </td>
                         </tr>
                     </tbody>
@@ -204,11 +205,12 @@
                             <td class="action-select">
                                 <input type="checkbox" value="{{::login.id}}" name="loginSelection" />
                             </td>
-                            <td>
-                                <a href="#" stop-click ng-click="editLogin(login)">{{login.name}}</a>
-                                <i class="fa fa-star text-muted" title="Favorite" ng-show="login.favorite"></i>
-                                <i class="fa fa-share-alt text-muted" title="Shared" ng-show="login.organizationId"></i>
-                                <div class="text-sm text-muted">{{login.username}}</div>
+                            <td ng-click="select($event)">
+                                <a href="#" stop-click ng-click="editLogin(login)" stop-prop>{{login.name}}</a>
+                                <i class="fa fa-star text-muted" title="Favorite" ng-show="login.favorite" stop-prop></i>
+                                <i class="fa fa-share-alt text-muted" title="Shared" ng-show="login.organizationId" stop-prop></i>
+                                <br />
+                                <span class="text-sm text-muted" stop-prop>{{login.username}}</span>
                             </td>
                         </tr>
                     </tbody>
diff --git a/src/index.html b/src/index.html
index f34aa2f3c4..52085a2552 100644
--- a/src/index.html
+++ b/src/index.html
@@ -120,6 +120,7 @@
     <script src="app/directives/passwordViewerDirective.js"></script>
     <script src="app/directives/letterAvatarDirective.js"></script>
     <script src="app/directives/stopClickDirective.js"></script>
+    <script src="app/directives/stopPropDirective.js"></script>
 
     <script src="app/filters/filtersModule.js"></script>
     <script src="app/filters/enumNameFilter.js"></script>