From 2c0030da62b9a1e59a55e3429fe514bbd51e1ee3 Mon Sep 17 00:00:00 2001
From: Maxime Quandalle <maxime@quandalle.com>
Date: Fri, 29 May 2015 23:35:30 +0200
Subject: Implement multi-selection

The UI and the internal APIs are still rough around the edges but the
feature is basically working. You can now select multiple cards and
move them together or (un|)assign them a label.
---
 client/components/sidebar/sidebarFilters.js | 94 +++++++++++++++++++++++++++++
 1 file changed, 94 insertions(+)
 create mode 100644 client/components/sidebar/sidebarFilters.js

(limited to 'client/components/sidebar/sidebarFilters.js')

diff --git a/client/components/sidebar/sidebarFilters.js b/client/components/sidebar/sidebarFilters.js
new file mode 100644
index 00000000..df0db529
--- /dev/null
+++ b/client/components/sidebar/sidebarFilters.js
@@ -0,0 +1,94 @@
+BlazeComponent.extendComponent({
+  template: function() {
+    return 'filterSidebar';
+  },
+
+  events: function() {
+    return [{
+      'click .js-toggle-label-filter': function(event) {
+        Filter.labelIds.toogle(this._id);
+        Filter.resetExceptions();
+        event.preventDefault();
+      },
+      'click .js-toogle-member-filter': function(event) {
+        Filter.members.toogle(this._id);
+        Filter.resetExceptions();
+        event.preventDefault();
+      },
+      'click .js-clear-all': function(event) {
+        Filter.reset();
+        event.preventDefault();
+      }
+    }];
+  }
+}).register('filterSidebar');
+
+var updateSelectedCards = function(query) {
+  Cards.find(MultiSelection.getMongoSelector()).forEach(function(card) {
+    Cards.update(card._id, query);
+  });
+};
+
+BlazeComponent.extendComponent({
+  template: function() {
+    return 'multiselectionSidebar';
+  },
+
+  mapSelection: function(kind, _id) {
+    return Cards.find(MultiSelection.getMongoSelector()).map(function(card) {
+      var methodName = kind === 'label' ? 'hasLabel' : 'isAssigned';
+      return card[methodName](_id);
+    });
+  },
+
+  allSelectedElementHave: function(kind, _id) {
+    if (MultiSelection.isEmpty())
+      return false;
+    else
+      return _.every(this.mapSelection(kind, _id));
+  },
+
+  someSelectedElementHave: function(kind, _id) {
+    if (MultiSelection.isEmpty())
+      return false;
+    else
+      return _.some(this.mapSelection(kind, _id));
+  },
+
+  events: function() {
+    return [{
+      'click .js-toggle-label-multiselection': function(evt, tpl) {
+        var labelId = this.currentData()._id;
+        var mappedSelection = this.mapSelection('label', labelId);
+        var operation;
+        if (_.every(mappedSelection))
+          operation = '$pull';
+        else if (_.every(mappedSelection, function(bool) { return ! bool; }))
+          operation = '$addToSet';
+        else {
+          var popup = Popup.open('disambiguateMultiLabel');
+          // XXX We need to have a better integration between the popup and the
+          // UI components systems.
+          return popup.call(this.currentData(), evt, tpl);
+        }
+
+        var query = {};
+        query[operation] = {
+          labelIds: labelId
+        };
+        updateSelectedCards(query);
+      }
+    }];
+  }
+}).register('multiselectionSidebar');
+
+Template.disambiguateMultiLabelPopup.events({
+  'click .js-remove-label': function() {
+    updateSelectedCards({$pull: {labelIds: this._id}});
+    Popup.close();
+  },
+  'click .js-add-label': function() {
+    updateSelectedCards({$addToSet: {labelIds: this._id}});
+    Popup.close();
+  }
+});
-- 
cgit v1.2.3-1-g7c22