Hold specific key to turn off snappable?

[adityakrshnn]

Hi, Can we hold a specific key(like Ctrl) to prevent the moveable to snap with horizontal / vertical / element guidelines?

[daybrush]

@adityakrshnn

Moveable is updated. Check it again.

• moveable 0.13.0
• react-moveable 0.16.1
• preact-moveable 0.15.0
• ngx-moveable 0.9.0
• svelte-movable 0.4.0

Add snapHorizontal, snapVertical, snapHorizontal props. (default: true).

you can toggle that props.

moveable.snapVertical = true; // false

[adityakrshnn]

Great additions to turn off individual props. But I kind of needed the ability to turn off snapping completely on holding a keyboard button (like Ctrl or Cmd). The reason being, I am finding it difficult to get the current moveable that is being dragged or resized through keyboard events. Can you suggest any way to detect current moveable ?

[daybrush]

@adityakrshnn

Turning off and turning on everything is as follows:

moveable.snappable= true / false

I will add the isSnap parameter to events later.

[adityakrshnn]

Yes I know. I wanted to know if there could be an inbuilt way to turn it on/off with a keypress. For example, while I am dragging a moveable, if I press the Command key, snapping will turn off for that moveable automatically.

[daybrush]

@adityakrshnn

moveable 0.13.1 is released. You can set guidelines dynamically in events (except for elements).

moveable.verticalGuidelines = [100, 200, 300]; moveable.horizontalGuidelines = [100, 200, 300];

[adityakrshnn]

Great job on the quick release. Although, I still feel we are on different pages.

You can check out this reference to understand what I am trying to convey: https://github.com/lf2com/magnet.js/blob/master/README.md#allowctrlkeyenabled

I am here if you have any queries. :)

[daybrush]

@adityakrshnn

I made a demo like this:

https://codesandbox.io/s/objective-violet-o0pmw

It's similar, but when you toggle control, it seems to reposition itself by firing one more drag event.

However, you must drag directly from the Moveable to reposition it.

Perhaps this problem requires adding a method.

[adityakrshnn]

Yes, this demo represents what I have in mind. If there was a way to incorporate this into moveable, it would be great.

[adityakrshnn]

@daybrush Any updates on this?

[daybrush]

@adityakrshnn The last update of this feature is 0.13.1. Maybe I'm not going to handle key events in moveable.

[adityakrshnn]

Ok. I'll try implementing it myself. Thank you for the effort.