diff options
| author | Louis <6653109+artonge@users.noreply.github.com> | 2023-01-05 21:35:09 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-01-05 21:35:09 +0100 |
| commit | c16f59379bee79dab9382c90e114c6b34dc07401 (patch) | |
| tree | 5568c6f82b822111eb762f7934ab437a71f96ce3 | |
| parent | a36848ce7f014fad8ce50930600e92655355a626 (diff) | |
| parent | 4236ee2485b771c01dc41dae3f09931a8c2ec4c3 (diff) | |
| download | nextcloud-server-c16f59379bee79dab9382c90e114c6b34dc07401.tar.gz nextcloud-server-c16f59379bee79dab9382c90e114c6b34dc07401.zip | |
Merge pull request #36024 from nextcloud/artonge/fix/file_list_scroll_while_dragging
Fix scrolling while dragging in file list view
| -rw-r--r-- | apps/files/js/files.js | 36 |
1 files changed, 19 insertions, 17 deletions
diff --git a/apps/files/js/files.js b/apps/files/js/files.js index a14afcd4fce..0ae049360b4 100644 --- a/apps/files/js/files.js +++ b/apps/files/js/files.js @@ -449,7 +449,6 @@ var dragOptions={ revert: 'invalid', revertDuration: 300, opacity: 0.7, - appendTo: 'body', cursorAt: { left: 24, top: 18 }, helper: createDragShadow, cursor: 'move', @@ -482,23 +481,26 @@ var dragOptions={ $('.crumbmenu').removeClass('canDropChildren'); }, drag: function(event, ui) { - var scrollingArea = FileList.$container; - var currentScrollTop = $(scrollingArea).scrollTop(); - var scrollArea = Math.min(Math.floor($(window).innerHeight() / 2), 100); - - var bottom = $(window).innerHeight() - scrollArea; - var top = $(window).scrollTop() + scrollArea; - if (event.pageY < top) { - $(scrollingArea).animate({ - scrollTop: currentScrollTop - 10 - }, 400); - - } else if (event.pageY > bottom) { - $(scrollingArea).animate({ - scrollTop: currentScrollTop + 10 - }, 400); - } + /** @type {JQuery<HTMLDivElement>} */ + const scrollingArea = FileList.$container; + + // Get the top and bottom scroll trigger y positions + const containerHeight = scrollingArea.innerHeight() ?? 0 + const scrollTriggerArea = Math.min(Math.floor(containerHeight / 2), 100); + const bottomTriggerY = containerHeight - scrollTriggerArea; + const topTriggerY = scrollTriggerArea; + + // Get the cursor position relative to the container + const containerOffset = scrollingArea.offset() ?? {left: 0, top: 0} + const cursorPositionY = event.pageY - containerOffset.top + const currentScrollTop = scrollingArea.scrollTop() ?? 0 + + if (cursorPositionY < topTriggerY) { + scrollingArea.scrollTop(currentScrollTop - 10) + } else if (cursorPositionY > bottomTriggerY) { + scrollingArea.scrollTop(currentScrollTop + 10) + } } }; // sane browsers support using the distance option |