Repository navigation
Drag ghost does not follow the cursor when the view is scrolled mid-drag #74
Description
Description
When an event is dragged in the dynamic view and the view is scrolled while
the mouse button is held down (mouse wheel / trackpad), the drag ghost stops
following the cursor: it stays at the coordinates computed before the scroll.
Dropping then applies the event to the wrong slot/day.
Why it happens
onDrag() handles this correctly for resizing — it compares the current
scrollTop with the previous one and offsets the computation:
// Resizing the event.
scrollTop = $('kronolithView' + this.view.capitalize()).down('.kronolithViewBody').scrollTop,
...
// Check if view has scrolled since last call.
if (scrollTop != this.scrollLast) {
offset = scrollTop - this.scrollLast;
this.scrollLast = scrollTop;
}but the moving branch of the same function has no equivalent:
} else if (elt.classList.contains('kronolithEditable')) {
// Moving the event.
...
this.calculateEventDates(event, storage, step, drag.ghost.offsetTop, drag.divHeight);dragdrop2 positions the ghost from offsets captured on mousedown
(_position() → ob.xy_top / ob.y_top), which are never adjusted when the
container scrolls underneath.
Steps to reproduce
- Open the dynamic calendar view with enough events for the view to scroll.
- Press and hold the mouse button on an event to start dragging it.
- While still holding, scroll the view with the mouse wheel.
- The ghost drifts away from the cursor by exactly the scrolled distance;
dropping lands on the wrong day/slot.
Notes
Most visible in the month view when the grid is taller than the viewport.
The stock theme keeps the whole month within the viewport, so the month grid
does not scroll there and the case is less likely to show up — but the same
missing compensation applies to any scrollable dynamic view while moving
(as opposed to resizing) an event.
Environment
- Kronolith
FRAMEWORK_6_0 - Dynamic view, month (also applies to other scrollable views)
Activity
ralflang commentedon Jul 22, 2026
I'm torn if I should fix dragdrop2 or reimplement in native browser Pointer Events API with a bit of own code.
What I would NOT want is import a large library such as interact.js which is a great tool but probably not what we need.
pierrefardel commentedon Jul 22, 2026
Pointer Events sounds like the right call to me. Beyond fixing this particular bug, it would give pointer capture (
setPointerCapture), which removes a whole class of "the drag lost the cursor" issues, plus touch and pen support for free — that's hard to retrofit onto Scriptaculous, which predates all of it. And agreed on not pulling in interact.js: what Kronolith does here is a fairly narrow use case, a library that size would mostly be dead weight.Happy to test whatever you come up with. My theme makes the month grid scrollable (
overflow-y: auto), so this reproduces reliably on my side, whereas the stock theme keeps the month within the viewport and mostly hides it.ralflang commentedon Jul 23, 2026
horde/Core#211 and #76 together seem to fix #74 for me, can you test this?
@pierrefardel
pierrefardel commentedon Jul 23, 2026
Tested the fix (horde/Core#211 + #76) on
FRAMEWORK_6_0: the ghost now follows the cursor when the view is scrolled mid-drag, and the drop lands on the correct day. Resize and the spurious event-create modal on release are fixed too. Works for me in month and day/week views — thanks!