react-timeline-editor icon indicating copy to clipboard operation
react-timeline-editor copied to clipboard

Move rows as you are dragging an item

Open maustin75 opened this issue 1 year ago • 3 comments

This library is great.

The only thing missing for my use case is the ability to drag an item from one row to another. It would be nice to have an item move rows as you are dragging it and adjusting the droppable ability based on if the item fits and there is no overlap with another item.

First, is this possible currently? If not, has anyone implemented changes to allow this?

Thanks!

maustin75 avatar Nov 02 '24 23:11 maustin75

I'm working on that right now. Ill share my code if I do figure out a way

raccoonhands1 avatar Dec 01 '24 03:12 raccoonhands1

do you still need this?

I can help

kingsoftheweb avatar Mar 25 '25 16:03 kingsoftheweb

I ended up forking the repo, otherwise it would be too annoying hack it. I think I fixed it like this:

  1. use onActionMoving event to determine when the action is moving
  2. when its moving, get the bounding client rect, scroll amount, & mouse client.Y from the top of the timeline
  3. xzdarcy rows are indexed from 0, so you can just use some basic math to determine which row to move to

xzdarcy used some jank ahh libraries for handling motion. A better way is to just get client mouse position values

raccoonhands1 avatar Apr 01 '25 15:04 raccoonhands1