More Events

[xcrap]

It would be good to have an even only on dragend or something, this way the requests to update the image order to my database would be much smoother instead of every single element switch :)

[TahaSh]

@xcrap Adding more events is on my list for the upcoming releases.

[TahaSh]

@xcrap I've added two new events in v0.3.0: onSwapEnd and onSwapStart.

Example:

swapy.onSwapStart(() => {
  console.log('Start')
})

swapy.onSwapEnd((event) => {
  console.log('end')
})

[xcrap]

@xcrap I've added two new events in v0.3.0: onSwapEnd and onSwapStart.

Example:

swapy.onSwapStart(() => {
  console.log('Start')
})

swapy.onSwapEnd((event) => {
  console.log('end')
})

The problem is, if i Drag more than one element he still fires multiple times, so If I start dragging and move 3 elements and i finish dragging the onSwapEnd will fire 3 times. It was supposed to fire only once because it was still the same drag? So the onSwapEnd is having the same effect of onSwap

[TahaSh]

@xcrap in your case, you need to use swapMode: 'drop':

createSwapy(container, {
  swapMode: 'drop'
})

[TahaSh]

@xcrap sorry, I misread your comment. It's strange that it fires three times. It should fire once per dragging session. Does it happen if you try a simple setup? I couldn't reproduce it here.

[xcrap]

document.addEventListener('DOMContentLoaded', () => {
    const container = document.querySelector('.blog-sortable-container');

    if (container) {

        const swapy = createSwapy(container, {
            animation: 'dynamic',
            // swapMode: 'drop'
        });

        swapy.onSwapEnd((event) => {
            console.log('Swap ended', event);

            updateOrder(event.data.map);
            console.log('Boink');
        });
}
});

This is so confusing to me, it should be happening once but it's always making two requests, even i drag to the side or multiple items it's actually making always two requests independent on the number of moves. So it's not making in every single move that's already an update but I have no idea why it's happening twice.

If I go back to onSwap it's only a request per move that's the expected behavior, but something's happening here :\

[xcrap]

Also the onSwapStart fires once as expected.

[TahaSh]

@xcrap I found the bug. I'll push the fix soon and let you know!

[TahaSh]

@xcrap It should be fixed now in v0.3.1!

[xcrap]

Yes I confirm everything working as expected, thanks a lot :)

[TahaSh]

Great, thanks!

[xcrap]

I've noticed another issue with this, if you click in a link inside a slot, just clicking the dragging end is also triggered, so there's an issue with that, clicking should not be considered dragging. Also if you drag but make no order change there should be something that warns about it. The clicking I think it's a bug, the drag but no change it's a suggestion :)

[TahaSh]

@xcrap I've just released v0.4.0, which includes:

• Prevents triggering swapEnd on click without dragging.
• The swapEnd event now includes a parameter to indicate whether any items were swapped during the drag session. Here's an example:

swapy.onSwapEnd(({ data, hasChanged }) => {
  console.log(hasChanged);
  console.log('end', data);
})

Thanks for the suggestion :)

[xcrap]

That's really cool, already updated the the click but not dragging is working great, however about the hasChanged I don't think it's making what's supposed to be, because if I drag a item to another position and drag it back to the same and then release the mouse he will return true which should actually be false because they're in the same positions :)

Thanks for the updates, really great lib!

[xcrap]

Still in the back issue, I mean "indicate whether any items were swapped", they are swapped, but I think it would be more useful if you they are actually changed/updated :)

[TahaSh]

@xcrap good catch! It should be fixed now in v0.4.1. Thanks!

[xcrap]

Oh yeah it's working like a charm and it's very useful while dealing with database updates is nothing happens, great add on thanks a lot for your work, this update and the onSwapEnd has saved me dozens of requests! Life saving :)

[TahaSh]

Thank you so much for your kind words :)