Add a UI to restore archived cards

2 files changed, 38 insertions, 3 deletions

diff --git a/client/components/lists/body.jade b/client/components/lists/body.jade
index f1159ce5..60e7a57e 100644
--- a/client/components/lists/body.jade
+++ b/client/components/lists/body.jade
@@ -5,7 +5,13 @@ template(name="listBody")
         +inlinedForm(autoclose=false position="top")
           +addCardForm(listId=_id position="top")
       each cards
-        +minicard(this)
+        a.minicard-wrapper.js-minicard(href=absoluteUrl
+          class="{{#if cardIsSelected}}is-selected{{/if}}"
+          class="{{#if MultiSelection.isSelected _id}}is-checked{{/if}}")
+          if MultiSelection.isActive
+            .materialCheckBox.multi-selection-checkbox.js-toggle-multi-selection(
+              class="{{#if MultiSelection.isSelected _id}}is-checked{{/if}}")
+          +minicard(this)
       if currentUser.isBoardMember
         +inlinedForm(autoclose=false position="bottom")
           +addCardForm(listId=_id position="bottom")
diff --git a/client/components/lists/body.js b/client/components/lists/body.js
index f2d780af..a91f0ca9 100644
--- a/client/components/lists/body.js
+++ b/client/components/lists/body.js
@@ -61,10 +61,39 @@ BlazeComponent.extendComponent({
     });
   },
 
+  clickOnMiniCard: function(evt) {
+    if (MultiSelection.isActive() || evt.shiftKey) {
+      evt.stopImmediatePropagation();
+      evt.preventDefault();
+      var methodName = evt.shiftKey ? 'toogleRange' : 'toogle';
+      MultiSelection[methodName](this.currentData()._id);
+
+    // If the card is already selected, we want to de-select it.
+    // XXX We should probably modify the minicard href attribute instead of
+    // overwriting the event in case the card is already selected.
+    } else if (Session.equals('currentCard', this.currentData()._id)) {
+      evt.stopImmediatePropagation();
+      evt.preventDefault();
+      Utils.goBoardId(Session.get('currentBoard'));
+    }
+  },
+
+  cardIsSelected: function() {
+    return Session.equals('currentCard', this.currentData()._id);
+  },
+
+  toggleMultiSelection: function(evt) {
+    evt.stopPropagation();
+    evt.preventDefault();
+    MultiSelection.toogle(this.currentData()._id);
+  },
+
   events: function() {
     return [{
-      submit: this.addCard,
-      'click .open-minicard-composer': this.scrollToBottom
+      'click .js-minicard': this.clickOnMiniCard,
+      'click .js-toggle-multi-selection': this.toggleMultiSelection,
+      'click .open-minicard-composer': this.scrollToBottom,
+      submit: this.addCard
     }];
   }
 }).register('listBody');