Fix card, list and swimlane move.

Allow moving cards in multiselect mode.

Closes #2771,
closes #2743,
closes #2704,
related #2081

4 files changed, 54 insertions, 30 deletions

diff --git a/client/components/boards/boardBody.js b/client/components/boards/boardBody.js
index 47042ae7..82f12c40 100644
--- a/client/components/boards/boardBody.js
+++ b/client/components/boards/boardBody.js
@@ -89,7 +89,6 @@ BlazeComponent.extendComponent({
         helper.append(list.clone());
         return helper;
       },
-      handle: '.js-swimlane-header-handle',
       items: '.swimlane:not(.placeholder)',
       placeholder: 'swimlane placeholder',
       distance: 7,
@@ -193,6 +192,24 @@ BlazeComponent.extendComponent({
     // ugly touch event hotfix
     enableClickOnTouch('.js-swimlane:not(.placeholder)');
 
+    this.autorun(() => {
+      if (
+        Utils.isMiniScreen() ||
+        (!Utils.isMiniScreen() && Meteor.user().hasShowDesktopDragHandles())
+      ) {
+        $swimlanesDom.sortable({
+          handle: '.js-swimlane-header-handle',
+        });
+      } else {
+        $swimlanesDom.sortable({
+          handle: '.swimlane-header',
+        });
+      }
+
+      // Disable drag-dropping if the current user is not a board member or is comment only
+      $swimlanesDom.sortable('option', 'disabled', !userIsMember());
+    });
+
     function userIsMember() {
       return (
         Meteor.user() &&
diff --git a/client/components/lists/list.js b/client/components/lists/list.js
index b7b8b2e0..6bd8eefe 100644
--- a/client/components/lists/list.js
+++ b/client/components/lists/list.js
@@ -31,18 +31,6 @@ BlazeComponent.extendComponent({
     const itemsSelector = '.js-minicard:not(.placeholder, .js-card-composer)';
     const $cards = this.$('.js-minicards');
 
-    if (Utils.isMiniScreen) {
-      $('.js-minicards').sortable({
-        handle: '.handle',
-      });
-    }
-
-    if (!Utils.isMiniScreen && showDesktopDragHandles) {
-      $('.js-minicards').sortable({
-        handle: '.handle',
-      });
-    }
-
     $cards.sortable({
       connectWith: '.js-minicards:not(.js-list-full)',
       tolerance: 'pointer',
@@ -128,8 +116,21 @@ BlazeComponent.extendComponent({
     // ugly touch event hotfix
     enableClickOnTouch(itemsSelector);
 
-    // Disable drag-dropping if the current user is not a board member or is comment only
     this.autorun(() => {
+      if (
+        Utils.isMiniScreen() ||
+        (!Utils.isMiniScreen() && Meteor.user().hasShowDesktopDragHandles())
+      ) {
+        $cards.sortable({
+          handle: '.handle',
+        });
+      } else {
+        $cards.sortable({
+          handle: '.minicard',
+        });
+      }
+
+      // Disable drag-dropping if the current user is not a board member or is comment only
       $cards.sortable('option', 'disabled', !userIsMember());
     });
 
diff --git a/client/components/swimlanes/swimlaneHeader.jade b/client/components/swimlanes/swimlaneHeader.jade
index 72a7f054..4b48b0cc 100644
--- a/client/components/swimlanes/swimlaneHeader.jade
+++ b/client/components/swimlanes/swimlaneHeader.jade
@@ -17,6 +17,8 @@ template(name="swimlaneFixedHeader")
       a.fa.fa-plus.js-open-add-swimlane-menu.swimlane-header-plus-icon
       a.fa.fa-navicon.js-open-swimlane-menu
       unless isMiniScreen
+        unless showDesktopDragHandles
+          a.swimlane-header.handle.fa.fa-arrows.js-swimlane-header-handle
         if showDesktopDragHandles
           a.swimlane-header-handle.handle.fa.fa-arrows.js-swimlane-header-handle
       if isMiniScreen
diff --git a/client/components/swimlanes/swimlanes.js b/client/components/swimlanes/swimlanes.js
index 8faad870..f2fa882f 100644
--- a/client/components/swimlanes/swimlanes.js
+++ b/client/components/swimlanes/swimlanes.js
@@ -53,18 +53,6 @@ function initSortable(boardComponent, $listsDom) {
     },
   };
 
-  if (Utils.isMiniScreen) {
-    $listsDom.sortable({
-      handle: '.js-list-handle',
-    });
-  }
-
-  if (!Utils.isMiniScreen && showDesktopDragHandles) {
-    $listsDom.sortable({
-      handle: '.js-list-header',
-    });
-  }
-
   $listsDom.sortable({
     tolerance: 'pointer',
     helper: 'clone',
@@ -108,15 +96,29 @@ function initSortable(boardComponent, $listsDom) {
     );
   }
 
-  // Disable drag-dropping while in multi-selection mode, or if the current user
-  // is not a board member
   boardComponent.autorun(() => {
+    if (
+      Utils.isMiniScreen() ||
+      (!Utils.isMiniScreen() && Meteor.user().hasShowDesktopDragHandles())
+    ) {
+      $listsDom.sortable({
+        handle: '.js-list-handle',
+      });
+    } else {
+      $listsDom.sortable({
+        handle: '.js-list-header',
+      });
+    }
+
     const $listDom = $listsDom;
     if ($listDom.data('sortable')) {
       $listsDom.sortable(
         'option',
         'disabled',
-        MultiSelection.isActive() || !userIsMember(),
+        // Disable drag-dropping when user is not member
+        !userIsMember(),
+        // Not disable drag-dropping while in multi-selection mode
+        // MultiSelection.isActive() || !userIsMember(),
       );
     }
   });
@@ -164,7 +166,9 @@ BlazeComponent.extendComponent({
           // his mouse.
 
           const noDragInside = ['a', 'input', 'textarea', 'p'].concat(
-            Util.isMiniScreen || (!Util.isMiniScreen && showDesktopDragHandles)
+            Utils.isMiniScreen() ||
+              (!Utils.isMiniScreen() &&
+                Meteor.user().hasShowDesktopDragHandles())
               ? ['.js-list-handle', '.js-swimlane-header-handle']
               : ['.js-list-header'],
           );