Skip to content

Add Drag In and Drag Out events#2198

Open
roy-mdr wants to merge 8 commits intoSortableJS:masterfrom
roy-mdr:drag-in-out
Open

Add Drag In and Drag Out events#2198
roy-mdr wants to merge 8 commits intoSortableJS:masterfrom
roy-mdr:drag-in-out

Conversation

@roy-mdr
Copy link

@roy-mdr roy-mdr commented Sep 2, 2022

Leaved comments in this commit for code review before merge.

known isues:

  • DnD HTML5 API: If drag too fast to another browser UI element (ej. dev tools) the HTML5 DnD dragLeave event is not triggered (not an issue from this code) ... a workaround could be to force a fallback to get the element at pointer position when dragging back to the browser window.

This PR resolve #2075 #979 #460 #1468 #2159 #1269


Usage

Sortable.create(inboxEl, {
    group: 'inbox',

    onDragIn:  (e) => console.log("+++++ drag in Inbox"),
    onDragOut: (e) => console.log("----- drag out Inbox"),
    onDrop: (e) => console.log("Doped!") // Somewhere inside X,Y of this sortable. Even if no onEnd event.
});
Leaved comments in this commit for code review before merge.

known isues:
- DnD HTML5 API: If drag too fast to another browser UI element (ej. dev tools) the HTML5 DnD dragLeave event is not triggered (not an issue from this code) ... a workaround could be to force a fallback to get the element at pointer position when dragging back to the browser window.
Before: dragIn event was only triggered when it was a valid list to drop in. However if the list was nested in another Sortable the event didn't fire again because it was already marked as valid.
After: dragIn event is triggered even if is not a valid Sortable to drop in. Now is up to the Sortable component to handle and check if the list is allowed to drop in.
onDrop event is triggered when a sortable-dragging element is dropped inside the X and Y of the Sortable element, even if there was no onEnd event triggered
@lovelyelfpop
Copy link

Nice!

@SyedMSawaid
Copy link

@roy-mdr Is it going to merge in to the main library? How long do we have to wait for it?

@roy-mdr
Copy link
Author

roy-mdr commented Mar 28, 2023

@roy-mdr Is it going to merge in to the main library? How long do we have to wait for it?

Unfortunately its not my decision but the original developers :/ Hopefully soon!

@SyedMSawaid
Copy link

@owen-m1 Any idea on when it is going to merge?

P.S. If there are no core maintainers for this project right now, how about we recruit some? I would love to contribute to this library.

@owen-m1
Copy link
Member

owen-m1 commented Jul 2, 2023

@SyedMSawaid Yeah I'm happy to add you if you'd like to contribute, I don't have a lot of time anymore

@RowenTey
Copy link

Any updates on this PR?

@oemer-aran
Copy link

Is anything blocking this PR to be merged?

@bassemawhoob
Copy link

@owen-m1 Pushing for this PR to be merged :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

7 participants