From 8e267afd3569a56c7dde813d278c55b021b8431f Mon Sep 17 00:00:00 2001 From: Nathaniel Sabanski Date: Tue, 20 Dec 2022 20:56:58 -0800 Subject: [PATCH] Mobile fix for Project view: Add delay to Sortable.js on mobile, to ensure scrolling is possible. (#22152) Mobile / touch devices currently get "hung up" on the sortable action, preventing any ability to visually scroll through the Project board to see issues. Solution: Sortable.js has a built-in fix using `delayOnTouchOnly` BEFORE https://user-images.githubusercontent.com/24665/208266817-6f2968b7-4788-4656-a941-f85b25fc59d5.mp4 AFTER https://user-images.githubusercontent.com/24665/208266822-3d327002-7a9d-41cf-9890-6d6b8dcb17be.mp4 Co-authored-by: Lunny Xiao Co-authored-by: techknowlogick --- web_src/js/features/repo-projects.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/web_src/js/features/repo-projects.js b/web_src/js/features/repo-projects.js index 9777e6c8ecc..78a9b14ad0d 100644 --- a/web_src/js/features/repo-projects.js +++ b/web_src/js/features/repo-projects.js @@ -49,6 +49,8 @@ async function initRepoProjectSortable() { filter: '[data-id="0"]', animation: 150, ghostClass: 'card-ghost', + delayOnTouchOnly: true, + delay: 500, onSort: () => { boardColumns = mainBoard.getElementsByClassName('board-column'); for (let i = 0; i < boardColumns.length; i++) { @@ -76,6 +78,8 @@ async function initRepoProjectSortable() { ghostClass: 'card-ghost', onAdd: moveIssue, onUpdate: moveIssue, + delayOnTouchOnly: true, + delay: 500, }); } }