From c08f507dbf55cde0dd9e829c72d1b33299831804 Mon Sep 17 00:00:00 2001
From: Francis Lachapelle <flachapelle@inverse.ca>
Date: Mon, 21 Dec 2015 11:40:01 -0500
Subject: [PATCH] Fix multi-selection of cards in Firefox

---
 .../ContactsUI/UIxContactFoldersView.wox      | 38 +++++++++----------
 .../js/Contacts/AddressBook.service.js        | 11 ++++++
 UI/WebServerResources/scss/views/_view.scss   |  1 +
 3 files changed, 30 insertions(+), 20 deletions(-)

diff --git a/UI/Templates/ContactsUI/UIxContactFoldersView.wox b/UI/Templates/ContactsUI/UIxContactFoldersView.wox
index e02506793..d4fd52bdf 100644
--- a/UI/Templates/ContactsUI/UIxContactFoldersView.wox
+++ b/UI/Templates/ContactsUI/UIxContactFoldersView.wox
@@ -376,39 +376,37 @@
           </md-subheader>
           <md-virtual-repeat-container class="md-flex">
             <md-list class="sg-section-list">
-              <div md-virtual-repeat="currentCard in addressbook.selectedFolder.cards" md-item-size="56">
-                <md-list-item
-                    ng-class="{'sg-active': currentCard.id == addressbook.selectedFolder.selectedCard}"
-                    ng-click="addressbook.selectCard(currentCard)"
-                    ui-sref="app.addressbook.card.view({addressbookId: addressbook.selectedFolder.id, cardId: currentCard.id})"
-                    ui-sref-active="md-default-theme md-background md-bg md-hue-1">
+              <md-list-item
+                  class="md-default-theme md-background md-hue-1"
+                  ng-class="{'md-bg': addressbook.selectedFolder.isSelectedCard(currentCard.id)}"
+                  md-virtual-repeat="currentCard in addressbook.selectedFolder.cards" md-item-size="56"
+                  ng-click="addressbook.selectCard(currentCard)">
+                <div class="md-secondary"
+                     ng-click="addressbook.toggleCardSelection($event, currentCard)">
                   <div class="md-avatar sg-avatar-selected"
-                       ng-if="currentCard.selected"
-                       ng-click="addressbook.toggleCardSelection($event, currentCard)">
+                       ng-if="currentCard.selected">
                     <!-- selected avatar -->
                   </div>
                   <sg-avatar-image class="md-avatar"
                                    ng-if="addressbook.notSelectedComponent(currentCard, 'vcard')"
-                                   ng-click="addressbook.toggleCardSelection($event, currentCard)"
                                    sg-email="currentCard.$preferredEmail(addressbook.selectedFolder.constructor.$query)"
                                    size="40">
                     <!-- contact avatar -->
                   </sg-avatar-image>
                   <div class="md-avatar sg-avatar-list"
-                       ng-show="addressbook.notSelectedComponent(currentCard, 'vlist')"
-                       ng-click="currentCard.selected = !currentCard.selected">
+                       ng-show="addressbook.notSelectedComponent(currentCard, 'vlist')">
                     <!-- list avatar -->
                   </div>
-                  <div class="sg-tile-content">
-                    <div class="sg-md-subhead">
-                      <div ng-bind-html="currentCard.$fullname()"><!-- cn --></div>
-                    </div>
-                    <div class="sg-md-body">
-                      <div>{{currentCard.$preferredEmail(addressbook.selectedFolder.constructor.$query)}}</div>
-                    </div>
+                </div>
+                <div class="sg-tile-content">
+                  <div class="sg-md-subhead">
+                    <div ng-bind-html="currentCard.$fullname()"><!-- cn --></div>
                   </div>
-                </md-list-item>
-              </div>
+                  <div class="sg-md-body">
+                    <div>{{currentCard.$preferredEmail(addressbook.selectedFolder.constructor.$query)}}</div>
+                  </div>
+                </div>
+              </md-list-item>
             </md-list>
           </md-virtual-repeat-container>
           <div class="sg-progress-circular-floating"
diff --git a/UI/WebServerResources/js/Contacts/AddressBook.service.js b/UI/WebServerResources/js/Contacts/AddressBook.service.js
index 32be6a171..89b8d69a2 100644
--- a/UI/WebServerResources/js/Contacts/AddressBook.service.js
+++ b/UI/WebServerResources/js/Contacts/AddressBook.service.js
@@ -246,6 +246,17 @@
     }
   };
 
+  /**
+   * @function isSelectedCard
+   * @memberof AddressBook.prototype
+   * @desc Check if the specified card is selected.
+   * @param {string} CardId
+   * @returns true if the specified card is selected
+   */
+  AddressBook.prototype.isSelectedCard = function(cardId) {
+    return this.selectedCard == cardId;
+  };
+
   /**
    * @function $selectedCount
    * @memberof AddressBook.prototype
diff --git a/UI/WebServerResources/scss/views/_view.scss b/UI/WebServerResources/scss/views/_view.scss
index e02711a39..ba11a301a 100644
--- a/UI/WebServerResources/scss/views/_view.scss
+++ b/UI/WebServerResources/scss/views/_view.scss
@@ -66,6 +66,7 @@ $detailView-width: grid-step(8) !global;
   // side of the list item and add some padding to the main button (.md-no-style).
   .md-with-secondary {
     .md-no-style {
+      min-height: $baseline-grid * 7; // 56px
       padding-left: 40 + $baseline-grid * 3;
     }
     .md-secondary-container {