summaryrefslogtreecommitdiffstats
path: root/client/components/swimlanes
diff options
context:
space:
mode:
authorAndrés Manelli <andresmanelli@gmail.com>2018-03-16 22:13:40 -0300
committerAndrés Manelli <andresmanelli@gmail.com>2018-03-16 22:13:40 -0300
commit5b0f7f8aef115b202aaff6bc25bb514426dc2009 (patch)
tree2155e587c6057d496c48d606d3ce50932826a110 /client/components/swimlanes
parent0495e61c288432662995a9a59c9c13ecb93639ea (diff)
downloadwekan-5b0f7f8aef115b202aaff6bc25bb514426dc2009.tar.gz
wekan-5b0f7f8aef115b202aaff6bc25bb514426dc2009.tar.bz2
wekan-5b0f7f8aef115b202aaff6bc25bb514426dc2009.zip
Fix drag and drop issues when re-enter board
Diffstat (limited to 'client/components/swimlanes')
-rw-r--r--client/components/swimlanes/swimlanes.js76
1 files changed, 49 insertions, 27 deletions
diff --git a/client/components/swimlanes/swimlanes.js b/client/components/swimlanes/swimlanes.js
index dacb487e..3dd7f208 100644
--- a/client/components/swimlanes/swimlanes.js
+++ b/client/components/swimlanes/swimlanes.js
@@ -3,15 +3,37 @@ const { calculateIndex } = Utils;
BlazeComponent.extendComponent({
onRendered() {
const boardComponent = this.parentComponent();
- const $swimlanesDom = boardComponent.$('.js-swimlanes');
+ const $listsDom = this.$('.js-lists');
+
+ if (!Session.get('currentCard')) {
+ boardComponent.scrollLeft();
+ }
+
+ // We want to animate the card details window closing. We rely on CSS
+ // transition for the actual animation.
+ $listsDom._uihooks = {
+ removeElement(node) {
+ const removeNode = _.once(() => {
+ node.parentNode.removeChild(node);
+ });
+ if ($(node).hasClass('js-card-details')) {
+ $(node).css({
+ flexBasis: 0,
+ padding: 0,
+ });
+ $listsDom.one(CSSEvents.transitionend, removeNode);
+ } else {
+ removeNode();
+ }
+ },
+ };
- $swimlanesDom.sortable({
+ $listsDom.sortable({
tolerance: 'pointer',
- appendTo: '.board-canvas',
helper: 'clone',
- handle: '.js-swimlane-header',
- items: '.js-swimlane:not(.placeholder)',
- placeholder: 'swimlane placeholder',
+ handle: '.js-list-header',
+ items: '.js-list:not(.js-list-composer)',
+ placeholder: 'list placeholder',
distance: 7,
start(evt, ui) {
ui.placeholder.height(ui.helper.height());
@@ -21,15 +43,15 @@ BlazeComponent.extendComponent({
stop(evt, ui) {
// To attribute the new index number, we need to get the DOM element
// of the previous and the following card -- if any.
- const prevSwimlaneDom = ui.item.prev('.js-swimlane').get(0);
- const nextSwimlaneDom = ui.item.next('.js-swimlane').get(0);
- const sortIndex = calculateIndex(prevSwimlaneDom, nextSwimlaneDom, 1);
+ const prevListDom = ui.item.prev('.js-list').get(0);
+ const nextListDom = ui.item.next('.js-list').get(0);
+ const sortIndex = calculateIndex(prevListDom, nextListDom, 1);
- $swimlanesDom.sortable('cancel');
- const swimlaneDomElement = ui.item.get(0);
- const swimlane = Blaze.getData(swimlaneDomElement);
+ $listsDom.sortable('cancel');
+ const listDomElement = ui.item.get(0);
+ const list = Blaze.getData(listDomElement);
- Swimlanes.update(swimlane._id, {
+ Lists.update(list._id, {
$set: {
sort: sortIndex.base,
},
@@ -38,6 +60,20 @@ BlazeComponent.extendComponent({
boardComponent.setIsDragging(false);
},
});
+
+ function userIsMember() {
+ return Meteor.user() && Meteor.user().isBoardMember() && !Meteor.user().isCommentOnly();
+ }
+
+ // Disable drag-dropping while in multi-selection mode, or if the current user
+ // is not a board member
+ boardComponent.autorun(() => {
+ const $listDom = $listsDom;
+ if ($listDom.data('sortable')) {
+ $listsDom.sortable('option', 'disabled',
+ MultiSelection.isActive() || !userIsMember());
+ }
+ });
},
onCreated() {
this.draggingActive = new ReactiveVar(false);
@@ -50,20 +86,6 @@ BlazeComponent.extendComponent({
return this._id;
},
- // XXX Flow components allow us to avoid creating these two setter methods by
- // exposing a public API to modify the component state. We need to investigate
- // best practices here.
- setIsDragging(bool) {
- this.draggingActive.set(bool);
- },
-
- scrollLeft(position = 0) {
- const lists = this.$('.js-lists');
- lists && lists.animate({
- scrollLeft: position,
- });
- },
-
currentCardIsInThisList(listId, swimlaneId) {
const currentCard = Cards.findOne(Session.get('currentCard'));
const currentBoardId = Session.get('currentBoard');