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

setting start and end clips #23

Open
girayk opened this issue Oct 20, 2024 · 10 comments
Open

setting start and end clips #23

girayk opened this issue Oct 20, 2024 · 10 comments

Comments

@girayk
Copy link

girayk commented Oct 20, 2024

Start and end method is really useful for tracking clips on the timeline etc,
but unfortunately start and end is not working on VideoClip, works with ImageClip and I didn't try with other clips yet,
Can we make work with all, after we set to start time also we can delay it with offset as well but following them with start end stop is more easy to track.
p.s. please dont hate me

@voladelta
Copy link

😅 stacking and offset rule are weird. i'm fighting with them now.

i'm building a really simple editor, which has 1 track for same type.
after moving/resize on timeline, using set({ start, stop }) doesnt help.

any tips would be helpful.

image image

@girayk
Copy link
Author

girayk commented Oct 20, 2024

Yeah at the moment its buggy, its works on imageClip, u can extend your text or video clip and copy paste from ImageClip, or u can use offset at the moment but i am pretty sure Konstantin will fix it very shortly 😂

@girayk
Copy link
Author

girayk commented Oct 20, 2024

I was reviewing code, ImageClip is extend of Clip and VideoClip is extend of MediaClip and MediaClip is extend of Clip, I am not sure but I think also image suppose to be part of MediaClip, because only biggest difference both of them is Video has a audio element and image is not, but if the image is animated gif, it will have frames, we will need offset values and why we are not able to put a Caption on Image?

@voladelta
Copy link

no worry, i might remove the use of track, or handling in the back for users to ensure ux

stack mode isn't right words for this, dictionary: a pile of things arranged one on top of another

from the guide
which ensures that each new clip added starts exactly where the previous clip ended (plus 1 millisecond)

// proper `stacked` strategy would be helpful
composition.createTrack('video', { stacked: Boolean });

@voladelta
Copy link

voladelta commented Oct 20, 2024

remove the use of track

you can't, the problem is layering 😅, you can't layer clip with (z)index

so to layer, we need to use track. there is @flatten-js/interval-tree btw

@girayk
Copy link
Author

girayk commented Oct 21, 2024

Why u need a z-index if 2 clips are in same tracks? zindex are for html elements but clips are on the canvas, if you wanna debug how the track and clips are on the canvas, u can use pixie devtool, https://pixijs.io/devtools/
for the each clip on same track, time must be not on the same ratio, other wise its suppose the be in other track.

@voladelta
Copy link

i'm newbie on this 😅, i just want to make really simple editor without the need to understand track for non technical like and newbie like me
so each track has different type but can contain multiple overlapped items.

i have it working btw
on ui, they appears on same track, in the back, it is managed by a manager with interval-tree

image image

@girayk
Copy link
Author

girayk commented Oct 21, 2024

If you make it work, its good. But in general u dont need 3rd party library, actually its simple.
Imagine each tracks has a zindex and first in first out, so if u wanna put text top of everything text track should render last. U can put orderid on db and u can add text track last on sortby orderid,
Also if you wanna change ordering onmounted there is shiftTrack method which is like chancing zindex.
composition.shiftTrack(track);

But do not forget there is happing in canvas, so actually there is no zindex.

@voladelta
Copy link

From the docs, but not actual the case @k9p5

If clips overlap, Diffusion Studio will automatically adjust the start/stop times or move the clip to a different track.
It would be great if this handle internally with a flag 😅. Anyway, i'll try to contribute back when i have more experience with the library.

@girayk
Copy link
Author

girayk commented Oct 21, 2024

And personal suggestion, as i understand u re using vue, if u re using vue devtool, make compotison as a shallowRef and from vue devtool u can understand, debug more easily.

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

2 participants