From 981ed546f1cae45ad8b92b393ee29c1a26277f32 Mon Sep 17 00:00:00 2001 From: Marc Hartmayer Date: Thu, 23 Apr 2020 00:54:39 +0200 Subject: Newer versions of jQuery sortable use `uiSortable` key Newer versions of jQuery sortable use `uiSortable` as key to store the data. Let's adapt the code. While at it, refactor the code. --- client/components/swimlanes/swimlanes.js | 26 ++------------------------ 1 file changed, 2 insertions(+), 24 deletions(-) (limited to 'client/components/swimlanes/swimlanes.js') diff --git a/client/components/swimlanes/swimlanes.js b/client/components/swimlanes/swimlanes.js index b7a55ce6..577bf6d2 100644 --- a/client/components/swimlanes/swimlanes.js +++ b/client/components/swimlanes/swimlanes.js @@ -122,34 +122,12 @@ function initSortable(boardComponent, $listsDom) { } const $listDom = $listsDom; - if ($listDom.data('sortable')) { + if ($listDom.data('uiSortable')) { $listsDom.sortable( 'option', 'disabled', // Disable drag-dropping when user is not member/is worker/is miniscreen - !userIsMember(), - // Not disable drag-dropping while in multi-selection mode - // MultiSelection.isActive() || !userIsMember(), - ); - } - - if ($listDom.data('sortable')) { - $listsDom.sortable( - 'option', - 'disabled', - // Disable drag-dropping when user is not member/is worker/is miniscreen - Meteor.user().isWorker(), - // Not disable drag-dropping while in multi-selection mode - // MultiSelection.isActive() || !userIsMember(), - ); - } - - if ($listDom.data('sortable')) { - $listsDom.sortable( - 'option', - 'disabled', - // Disable drag-dropping when user is not member/is worker/is miniscreen - Utils.isMiniScreen(), + !userIsMember() || Meteor.user().isWorker() || Utils.isMiniScreen(), // Not disable drag-dropping while in multi-selection mode // MultiSelection.isActive() || !userIsMember(), ); -- cgit v1.2.3-1-g7c22 From 6476503137fc41cf52e913aa33aed6bb1abaac6a Mon Sep 17 00:00:00 2001 From: Marc Hartmayer Date: Thu, 23 Apr 2020 02:09:01 +0200 Subject: Fix drag-and-drop and scrolling on mobile devices Use drag handles on "miniscreens" whenever useful, this is especially useful on mobile device. This should hopefully fix https://github.com/wekan/wekan/issues/2947. While at it, simplify the condition Utils.isMiniScreen() || (!Utils.isMiniScreen() && showDesktopDragHandles) to Utils.isMiniScreen() || showDesktopDragHandle --- client/components/swimlanes/swimlanes.js | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) (limited to 'client/components/swimlanes/swimlanes.js') diff --git a/client/components/swimlanes/swimlanes.js b/client/components/swimlanes/swimlanes.js index 577bf6d2..2d299ddc 100644 --- a/client/components/swimlanes/swimlanes.js +++ b/client/components/swimlanes/swimlanes.js @@ -111,7 +111,7 @@ function initSortable(boardComponent, $listsDom) { showDesktopDragHandles = false; } - if (!Utils.isMiniScreen() && showDesktopDragHandles) { + if (Utils.isMiniScreen() || showDesktopDragHandles) { $listsDom.sortable({ handle: '.js-list-handle', }); @@ -126,8 +126,8 @@ function initSortable(boardComponent, $listsDom) { $listsDom.sortable( 'option', 'disabled', - // Disable drag-dropping when user is not member/is worker/is miniscreen - !userIsMember() || Meteor.user().isWorker() || Utils.isMiniScreen(), + // Disable drag-dropping when user is not member/is worker + !userIsMember() || Meteor.user().isWorker(), // Not disable drag-dropping while in multi-selection mode // MultiSelection.isActive() || !userIsMember(), ); @@ -188,8 +188,7 @@ BlazeComponent.extendComponent({ } const noDragInside = ['a', 'input', 'textarea', 'p'].concat( - Utils.isMiniScreen() || - (!Utils.isMiniScreen() && showDesktopDragHandles) + Utils.isMiniScreen() || showDesktopDragHandles ? ['.js-list-handle', '.js-swimlane-header-handle'] : ['.js-list-header'], ); -- cgit v1.2.3-1-g7c22 From 6d1cdebfe214c7f67f8cc396cf880d1b5a18f013 Mon Sep 17 00:00:00 2001 From: Marc Hartmayer Date: Sat, 25 Apr 2020 09:48:56 +0200 Subject: Make it compatible with newer and older versions of jQuery sortable While at it, fix comments and prettify it. --- client/components/swimlanes/swimlanes.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'client/components/swimlanes/swimlanes.js') diff --git a/client/components/swimlanes/swimlanes.js b/client/components/swimlanes/swimlanes.js index 2d299ddc..ea8aaf1d 100644 --- a/client/components/swimlanes/swimlanes.js +++ b/client/components/swimlanes/swimlanes.js @@ -122,7 +122,7 @@ function initSortable(boardComponent, $listsDom) { } const $listDom = $listsDom; - if ($listDom.data('uiSortable')) { + if ($listDom.data('uiSortable') || $listDom.data('sortable')) { $listsDom.sortable( 'option', 'disabled', -- cgit v1.2.3-1-g7c22 From f1b18d79cdbfd9c9edecf4f93a89e88ee1c6faea Mon Sep 17 00:00:00 2001 From: Marc Hartmayer Date: Fri, 24 Apr 2020 22:41:24 +0200 Subject: Don't interpret dragging an element as a click Remove `enableClickOnTouch` as this behavior is not intuitive. --- client/components/swimlanes/swimlanes.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) (limited to 'client/components/swimlanes/swimlanes.js') diff --git a/client/components/swimlanes/swimlanes.js b/client/components/swimlanes/swimlanes.js index ea8aaf1d..753fa88b 100644 --- a/client/components/swimlanes/swimlanes.js +++ b/client/components/swimlanes/swimlanes.js @@ -1,6 +1,6 @@ import { Cookies } from 'meteor/ostrio:cookies'; const cookies = new Cookies(); -const { calculateIndex, enableClickOnTouch } = Utils; +const { calculateIndex } = Utils; function currentListIsInThisSwimlane(swimlaneId) { const currentList = Lists.findOne(Session.get('currentList')); @@ -87,9 +87,6 @@ function initSortable(boardComponent, $listsDom) { }, }); - // ugly touch event hotfix - enableClickOnTouch('.js-list:not(.js-list-composer)'); - function userIsMember() { return ( Meteor.user() && -- cgit v1.2.3-1-g7c22