Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How do I do the right side padding? #26

Open
ShahriarDhruvo opened this issue Feb 20, 2023 · 1 comment
Open

How do I do the right side padding? #26

ShahriarDhruvo opened this issue Feb 20, 2023 · 1 comment

Comments

@ShahriarDhruvo
Copy link

ShahriarDhruvo commented Feb 20, 2023

How do I do the right side padding? For left side you take something like
<Timeline .... startLeft={40} />
As you can see for custom scale the right side of the scale can also get chopped :(

I realised that you can do this:
<Timeline ... getScaleRender={(scale) => <span style={{'color': '#ffaa11', 'margin-right': '30px';}}>{scale}</span>} />
But it's not correct as it'll also shift the entire scale!
image

image

@ShahriarDhruvo ShahriarDhruvo changed the title The minScaleCount & maxScaleCount do the job like a charm, thanks. How do I do the right side padding? Feb 20, 2023
@ShahriarDhruvo
Copy link
Author

As a work around for 4.458s video I did Math.ceil() to it to make it 5. And right now it looks like this
image
It looks broken but do my job. I also realized you cannot set a partial scale i.e if you want a scale of 4.5 you can't do that you either have to set a scale of 4 and ignore that 0.5 or set a scale of 5 and allow user to drag the actions beyond the maximum limit, which is not right :( And also without the right padding option this will always look broken.

Oh yeah after the maximum cursor limit on v0.1.9 you can drag the cursor beyond the video duration limit and as my actions maximumEnd is set to video duration you can't drag those action beyond that. So maybe you can take a prop which will set the cursor limit by the user? That can solve this issue somewhat. But I think a proper implementation is to allow partial scaling to 0.01 accuracy (so that I can set a scale of 4.458) and have a right side padding to avoid that artifact.

Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant