search

annaghi / dnd-list

Drag and Drop for sortable lists in Elm web apps with mouse support
https://annaghi.github.io/dnd-list/
BSD 3-Clause "New" or "Revised" License
103 stars 15 forks source link

add function to expose position of a drag #65

Closed rubysolo closed 4 years ago

rubysolo commented 4 years ago

First, thank you for building this library, it's excellent!

I ran into a situation in which the built in ghost styles rendered my dragging element offset to the right and down from where it should have been. As the position data is completely opaque, I was unable to correct the offset without vendoring the package and adding a means to get the positions.

annaghi commented 4 years ago

Hey @rubysolo thank you for the PR. Before merging it can you please check one thing?

I have a partial solution: we need to change the position from absolute to fixed in the ghostStyles function in the DnDList.elm module, here: https://github.com/annaghi/dnd-list/blob/master/src/DnDList.elm#L702-L752

Can you try this first? (Be careful the position is set in three places - yeah, this was my first Elm package :)

The solution is partial because it will fix the ghost element's position if it has ascendant with position: relative. However it will not fix its position if it has a scrollable ascendant.

rubysolo commented 4 years ago

Okay, I gave this a shot. In my vendored copy of DnDList, I reverted my changes and then changed position to fixed for all three instances in the ghostStyles function. It was better, but not not fully solved. My implementation is a vertical sorted list, and position: fixed moved the drag element to almost the right x coordinate -- it was shifted a few pixels to the right, but it was close enough to be acceptable. However, the vertical position was still off by about an element height.

annaghi commented 4 years ago

Thank you very much for checking the position: fixed, unfortunate it is not working.

Anyways, your PR has been merged, and the example is very useful too!