Moveable: Weird snapping with rotated groupables

[adityakrshnn]

Hi,

There seems to be some weird extra snapping with rotated groupables. There are some new snapping when I rotate a groupable. Can you please look into it?

[daybrush]

@adityakrshnn

Thank you for reporting bug. I'll check it and release new version soon.

[daybrush]

@adityakrshnn

Can you show me the draggable and rotatable code?

[adityakrshnn]

Here you go!

elementDragStart = (moveable: any, frame: any, set: any) => {
    set(frame.translate);
  }

elementDrag = (frame: any, target: any, beforeDelta: any) => {
    frame.translate[0] += beforeDelta[0];
    frame.translate[1] += beforeDelta[1];
    this.setStyle(target, frame);
  }

elementRotateStart = (moveable: any, frame: any, set: any, clientX: any, clientY: any, inputEvent: any) => {
    set(frame.rotate);
    this.setLabel(clientX, clientY, frame.rotate);
  }

elementRotate = (frame: any, target: any, beforeRotate: any, clientX: any, clientY: any) => {
    let degrees = parseInt(beforeRotate, 10);

    // Get degrees to display between -179 to 180
    while (degrees <= -180) {
      degrees += 360;
    }
    while (degrees > 180) {
      degrees -= 360;
    }

    frame.rotate = degrees;
    this.setStyle(target, frame);
    this.setLabel(clientX, clientY, frame.rotate);
  }

setStyle(target, frame) {
    target.style.transform
      = `translate(${frame.translate[0]}px, ${frame.translate[1]}px) rotate(${frame.rotate}deg)`;
  }

[daybrush]

@adityakrshnn

Can you help me?

I made the demo below, but I can't reproduce it. Please let me know if there is anything other than what you made.

https://codesandbox.io/s/great-kowalevski-j9zjx

[adityakrshnn]

It happens with elementGuidelines.

[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