Resetting positions if drop was not in a designated drop zone

[jaks19]

Hello, great work. I have a Q related to snapping back dragged items.

I want to be able to drag selected icons from their original positions (before click) to their final positions (click released).

If the final position is not a designated drop zone, I want to snap all icons to their original positions, not any intermediate position.

Is this possible?
Thanks!

[jaks19]

If anyone is interested, here is a sketch of what I did:

• record positions of html elements when drag starts
• when drag stops, if in drop zone, process elements
• when drag stops, if elsewhere, reset element positions to cached original positions

var ds;
var draggedItems;
var droppedItems;

ds = new DragSelect({
        selectables: document.querySelectorAll('.item'),
        dropZones: [{
            id: 'trash',
            element: document.querySelector('#trash-zone')
        }],
            useTransform: false
    });
  
ds.subscribe('dragmove', ({ items, event, isDragging, isDraggingKeyboard }) => {
    draggedItems = items;
});
  
ds.subscribe('callback', ({ dropTarget, isDragging, scroll_directions, items }) => {

    const init_pos = ds.getInitialCursorPosition();
    const curr_pos = ds.getCurrentCursorPosition();
    
    droppedItems = items; 
    
    // was moved
    if ((init_pos['x'] != curr_pos['x']) || (init_pos['y'] != curr_pos['y'])) {
        if(dropTarget === undefined) {
            console.log("dropped items in emptiness")
            
            droppedItems.map( (itm, i) => {
              console.assert(droppedItems[i].id == draggedItems[i].id)
              console.assert(droppedItems[i].className == draggedItems[i].className)
              droppedItems[i].style = draggedItems[i].style;
            });
             
        }
    }
}