Closed emmernme closed 8 months ago
I solved this by setting the snap targets to functions, and referencing a dynamic array.
Draggable:
interact.modifiers.snap({
targets: [
() => { // Original position
if (this.snapTargets.length > 0) {
return this.snapTargets[0];
}
},
() => {
if (this.snapTargets.length == 2) {
return this.snapTargets[1];
}
}
],
endOnly: true,
range: Infinity,
relativePoints: [
{ x: 0.5, y: 0.5 }, // to the center
],
})
Dropzone:
ondragenter: (event) => {
if (hotspot_id == dropzone_id) {
this.snapTargets[1] = {
x: zone.getRect(e).left + zone.getRect(e).width / 2,
y: zone.getRect(e).top + zone.getRect(e).height / 2,
};
}
}
While dragging, attempting to change snap targets when entering a dropzone does not take effect until the next time the draggable is dragged.
Is there a way to change the snapping targets while a draggable is being dragged, and have it take effect immediately?