FIX: #454 #455
FIX: #454 #455
Conversation
Component change the Y / X position when Drag stops even though dragging is restricted to X/Y axis
|
@chathuraa Thanks for your great work :) Looks good. I'd like to ask you one more favor, could you please add reproduced case to storybook. |
|
Sure thing, I'll give it a go, this will be my 1st story book. :).
…On Thu, 4 Oct. 2018, 9:54 am bokuweb, ***@***.***> wrote:
@chathuraa <https://github.com/chathuraa> Thanks for your great work :)
Looks good. I'd like to ask you one more favor, could you please add
reproduced case to storybook.
https://codesandbox.io/s/j1vj3j90ov
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
<#455 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/ACTfwd6xhn2mJzDjFtnyR-VMKK2VxYltks5uhU5GgaJpZM4XF0gA>
.
|
| @@ -497,10 +497,32 @@ export class Rnd extends React.Component<Props, State> { | |||
| const { left, top } = this.getOffsetFromParent(); | |||
| let draggablePosition; | |||
| if (position) { | |||
There was a problem hiding this comment.
@chathuraa Sorry, could you please separate these block to another function or method like createNewPosition 🙏
There was a problem hiding this comment.
Hey @bokuweb ,
I had to update some tests, I couldnt figure out the reason for '8px' discrepancy. I managed to get pretty much everything working. apart from the uncontrolled bounds.
Thanks,
Chat.
There was a problem hiding this comment.
Ahhh..Is it due to default margin? If you set html, body { padding: 0, margin: 0 }; to ./fixture.url, will the results be as you expected?
There was a problem hiding this comment.
Hey @bokuweb,
oh okay, that makes sense. I've updated the getOffsetFromParent and the tests so the padding and margins become irrelevant.
The update on the getOffsetFromParent, seems to cause an issue with uncontrolled bounds. I cant seems to find where the issue is. Any suggestions?
Thanks,
Chat.
There was a problem hiding this comment.
I do not understand what is issue. Why not try applying changes with you only when using position props ?
There was a problem hiding this comment.
I tried that. however the issue was there on almost every where the getOffsetFromParent been used.
ie:
componentDidMount,
dragStart,
onDrag,
onDragStop,
etc
So decided to update the function to return left/top based on axis restrictions, rather than setting the logic on each function.
Re: the bounds, it only affecting the uncontrolled bounds. all the other scenarios including controlled bounds are working.
There was a problem hiding this comment.
Hmmmm, I'll try to fix it 🙏 So, this issue is complex....
|
Yep will do.
…On Thu, 4 Oct. 2018, 3:43 pm bokuweb, ***@***.***> wrote:
***@***.**** requested changes on this pull request.
------------------------------
In src/index.tsx
<#455 (comment)>:
> @@ -497,10 +497,32 @@ export class Rnd extends React.Component<Props, State> {
const { left, top } = this.getOffsetFromParent();
let draggablePosition;
if (position) {
@chathuraa <https://github.com/chathuraa> Sorry, could you please
separate these block to another function or method like createNewPosition
🙏
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
<#455 (review)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/ACTfwSK9NAHsBlHFRs_roGAcB9K0Cd84ks5uhZ_5gaJpZM4XF0gA>
.
|
Added a story for axis restriction
| @@ -1,5 +1,5 @@ | |||
| import React from "react"; | |||
| import Rnd from "../../src"; | |||
| import { Rnd } from "../../src"; | |||
| @@ -0,0 +1,102 @@ | |||
| import React from "react"; | |||
|
It seems to be. Cause of the issue is adding/subtracting left and top. And
getoffset.... is dependency for most of the other methods.
Adding and subtracting should be based on each scenario, I can't figure out
the relationship between the uncontrolled bounds and getoffset....
Thanks
…On Mon, 8 Oct. 2018, 11:09 am bokuweb, ***@***.***> wrote:
***@***.**** commented on this pull request.
------------------------------
In src/index.tsx
<#455 (comment)>:
> @@ -497,10 +497,32 @@ export class Rnd extends React.Component<Props, State> {
const { left, top } = this.getOffsetFromParent();
let draggablePosition;
if (position) {
Hmmmm, I'll try to fix it 🙏 So, this issue is complex....
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
<#455 (comment)>, or mute
the thread
<https://github.com/notifications/unsubscribe-auth/ACTfwbUufhjvx6YVne2CRuVvEkF_Tzmcks5uipedgaJpZM4XF0gA>
.
|
|
Any chance to get this PR mergered? |
|
For enyone facing same issue, there is workaround. note: when I did set grid vertical value to 0 while using controlled state. Drag start behave really wierdly. |
|
Hello? |
Component change the Y position when Drag stops even though dragging is restricted to X axis