search

w3c / css-houdini-drafts

Mirror of https://hg.css-houdini.org/drafts
https://drafts.css-houdini.org/
Other
1.84k stars 140 forks source link

[css-animationworklet] proposal for sequence AnimationTimeline #949

Open laurentperez opened 4 years ago

laurentperez commented 4 years ago

Hi

Per spec https://www.w3.org/TR/css-animation-worklet-1/#workletanimation AnimationEffect can be a sequence, but AnimationTimeline cannot

Playing with runtime GroupEffect feature and having read the very interesting proposals of https://github.com/yi-gu/group_effect/blob/master/README.md I tried multiple timelines and indeed Canary threw a 'ScrollTimeline cannot be cloned' Exception

I had an usecase where I grouped the Effects (since a sequence is allowed), but I wanted them to be on distinct ScrollTimelines (to use different ranges and offsets)

@majido Twitter demo at view-source:https://majido.github.io/houdini-samples/animation-worklet/twitter-hidey-bar/ polyfilled the worklet to enable multiple timelines

I believe allowing a sequence of multiple timelines (a 1:1 relation to the sequenced Effects, fallback to default timeline if sequence length is unequal) could be a great benefit if natively supported. This would allow for a basic free Choregraphy support (think of the timelines as a Ballet where dancers have their own rythm), until Yi proposals ship for more concrete types.

Is it intended to be in a future part of the spec ?

ty

majido commented 4 years ago

I understand the power that having multiple timeline can provide. While did initially tried to allow multiple timelines (as you have noticed in our older demos) but it was considered too complex and not a good match for integration with web-animations. So it was dropped.

The particular usecase that we intended multiple timelines for was to mix "time-based" and "scroll-based" timelines.

I had an usecase where I grouped the Effects (since a sequence is allowed), but I wanted them to be on distinct ScrollTimelines (to use different ranges and offsets)

I wonder can you use a single ScrollTimeline with the largest range and manually calculate the current time of other timelines inside the your animate() function and use that for each sub-effect of the group effect.

I believe allowing a sequence of multiple timelines (a 1:1 relation to the sequenced Effects, fallback to default timeline if sequence length is unequal) could be a great benefit if natively supported. This would allow for a basic free Choregraphy support (think of the timelines as a Ballet where dancers have their own rythm), until Yi proposals ship for more concrete types.

If you need 1:1 relation between timeline and effects then I think that can be declared using multiple animations. No? It is the cases where you don't want 1:1 relationship that cannot be modeled with multiple animations (e.g., a single effect which is driven from two timelines)

Is it intended to be in a future part of the spec ? We are pursuing a different approach for handling the usecase where you want to mix input/scroll + time in Animation Worklet. It is documented here: https://discourse.wicg.io/t/proposal-exposing-input-events-to-worker-threads/3479

So at the moment we don't have any plans to work on multiple timelines.