+ An [=animation effect=] is + associated with an animation + when the effect is that animation’s [=associated effect=]. At a given moment, - an [=animation effect=] can be [=associated with an animation|associated=] + an [=animation effect=] can be [=associated animation|associated=] with at most one [=animation=]. An [=animation effect=], |effect|, @@ -4248,11 +4247,6 @@ Combining effects {#combining-effects} of any two [=keyframe effects=] |A| and |B| within an [=effect stack=] is established by comparing their properties as follows: - 1. Let the associated animation of an animation effect - be the [=animation=] [=associated with an animation|associated=] - with the [=animation effect=]. - 1. Sort |A| and |B| by applying the following conditions in turn until the order is resolved, From 058c4b83bd2420bd845dde15bb6ed24954548934 Mon Sep 17 00:00:00 2001 From: fantasai Date: Thu, 15 Jun 2023 18:44:42 -0400 Subject: [PATCH 2/9] [web-animations-1] Describe the high-level model up front This makes it easier to understand what this object is and to contextualize all the definitions that follow. --- web-animations-1/Overview.bs | 23 +++++++++++++++++------ 1 file changed, 17 insertions(+), 6 deletions(-) diff --git a/web-animations-1/Overview.bs b/web-animations-1/Overview.bs index 5ce4c13e884..fa4350e219a 100644 --- a/web-animations-1/Overview.bs +++ b/web-animations-1/Overview.bs @@ -2465,8 +2465,23 @@ Animation effects {#animation-effects} An animation effect is a [=timing node=] that provides a static description of some timed behavior. -### Relationship between animation effects and animations ### {#animation-effects-and-animations} -

+ All [=animation effects=] have the following properties: + * an [=active interval=], + determined by its [=start delay=] and [=active duration=], + defining the time interval during which its behavior takes effect + * an [=iteration duration=], [=iteration count=], and [=iteration start=] + defining how its behavior repeats within that interval + * a [=playback direction=] applying to each iteration, + to allow reversing the timing of effects within an iteration + * a [=fill mode=] defining the application of effects + [=before phase|before=]/[=after phase|after=] its [=active interval=] + * optionally, an [=animation effect/associated animation=] + and through it, optionally, an [=associated with a timeline|associated timeline=], + which cause the [=animation effect=] to apply its behavior + by driving its [=local time|local time value=] + +### Associated animation and timeline ### {#animation-effects-and-animations} + An [=animation effect=] is associated with an animation @@ -2487,10 +2502,6 @@ Animation effects {#animation-effects} Subsequent levels of this specification will define further types of [=animation effects=]. - All types of [=animation effects=] - define a number of common properties - which are described in the following sections. - ### The active interval ### {#the-active-interval}

From 850479b658096722ae0cdbe7a14fb47bb164c020 Mon Sep 17 00:00:00 2001 From: fantasai Date: Fri, 16 Jun 2023 16:16:53 -0400 Subject: [PATCH 3/9] [web-animations-1] De-dup and integrate Active Interval section --- web-animations-1/Overview.bs | 106 ++++++++++++++++------------------- 1 file changed, 47 insertions(+), 59 deletions(-) diff --git a/web-animations-1/Overview.bs b/web-animations-1/Overview.bs index fa4350e219a..39788cc0ec1 100644 --- a/web-animations-1/Overview.bs +++ b/web-animations-1/Overview.bs @@ -2502,79 +2502,67 @@ Animation effects {#animation-effects} Subsequent levels of this specification will define further types of [=animation effects=]. -### The active interval ### {#the-active-interval} +### The active interval, duration, and delays ### {#the-active-interval} -

- - The period that an [=animation effect=] is scheduled to run - is called its [=active interval=]. - Each [=animation effect=] has only one such interval. - - The lower bound of the [=active interval=] typically corresponds - to the [=start time=] of - the [=animation=] associated with this [=animation effect=], - but can be shifted by a [=start delay=] on the [=animation effect=]. - - The upper bound of the interval is determined - by the [=active duration=]. - - The relationship between - the [=start time=], [=start delay=], and [=active duration=] - is illustrated below. - -

- - -

- - An [=end delay=] can also be specified - but is primarily only of use when sequencing animations. - -

- - [=Animation effects=] define an active interval + [=Animation effects=] define an active interval, which is the period of time during which the effect - is scheduled to produce its effect-- - with the exception of [=fill modes=], - which apply outside the [=active interval=]. + is scheduled to produce its effect + (excepting [=fill modes=], + which apply outside the [=active interval=]). + Each [=animation effect=] has only one such interval. The lower bound of the [=active interval=] - is defined by the [=start delay=]. - - The start delay of an [=animation effect=] - is a signed offset from the [=start time=] of the [=animation=] - with which the animation effect is associated. + by default corresponds to the [=start time=] of the [=associated animation=], + but can be shifted by the start delay, + which is a signed offset from the [=start time=] of the [=animation=]. - The length of the [=active interval=] is called the [=active duration=], + The length of the [=active interval=] is called the active duration, the calculation of which is defined in [[#calculating-the-active-duration]]. + Its length determines the upper bound of the [=active interval=]. + +

+ + The relationship between + the [=start time=], [=start delay=], and [=active duration=] + is illustrated below. + +

+ + +

+

Similar to the [=start delay=], an [=animation effect=] also has an end delay, - which is primarily of use when sequencing animations + which is primarily of use when sequencing one [=animation effect=] based on the [=end time=] of another [=animation effect=]. - Although this is typically only useful in combination with sequence effects + + The end time, + of an [=animation effect=] + is the result of evaluating + max(start delay + active duration + end delay, 0). + + Note: Although the [=end delay=] is typically only useful + in combination with sequence effects which are introduced in a subsequent level of this specification, it is included here for the purpose of representing the min attribute in SVG ([[SVG11]], Chapter 19). - The end time of an [=animation effect=] - is the result of evaluating - max(start delay + active duration + end delay, 0). ### Local time ### {#local-time-section} @@ -3236,7 +3224,7 @@ Core animation effect calculations {#core-animation-effect-calculations} The [=active duration=] is calculated as follows:

- active duration = + [=active duration=] = iteration duration × iteration count

From cbdae49d9260aeb3100acba9d6894a3c64aa5ede Mon Sep 17 00:00:00 2001 From: fantasai Date: Sat, 17 Jun 2023 14:07:45 -0400 Subject: [PATCH 4/9] [web-animations-1] DFN the fill modes --- web-animations-1/Overview.bs | 148 ++++++++++++++++------------------- 1 file changed, 68 insertions(+), 80 deletions(-) diff --git a/web-animations-1/Overview.bs b/web-animations-1/Overview.bs index 39788cc0ec1..ac0035a3f4f 100644 --- a/web-animations-1/Overview.bs +++ b/web-animations-1/Overview.bs @@ -2786,23 +2786,71 @@ Animation effects {#animation-effects}

+ : none + :: + The animation effect has no effect when it is not [=in play=]. + + : forwards + :: + When the animation effect is in the [=animation effect/after phase=], + the animation effect will produce the same [=iteration progress=] value + as the last moment it is scheduled to be [=in play=]. + + For all other times that the animation effect is not [=in play=], + it will have no effect. - The possible [=fill modes=] are: + : backwards + :: + When the animation effect is in the [=animation effect/before phase=], + the animation effect will produce the same [=iteration progress=] value + as the earliest moment that it is scheduled to be [=in play=]. - * none, - * forwards, - * backwards, and - * both. + For all other times that the animation effect is not [=in play=], + it will have no effect. - The normative definition of these modes + : both + :: + When the animation effect is in its [=animation effect/before phase=], + [=fill mode/backwards=] fill behavior is used. + + When the animation effect is in its [=animation effect/after phase=], + [=fill mode/forwards=] fill behavior is used. + +

+ + +

-This section is non-normative - - The effect of each [=fill mode=] is as follows: - - : none - :: - The animation effect has no effect when it is not [=in play=]. - - : forwards - :: - When the animation effect is in the [=animation effect/after phase=], - the animation effect will produce the same [=iteration progress=] value - as the last moment it is scheduled to be [=in play=]. - - For all other times that the animation effect is not [=in play=], - it will have no effect. - - : backwards - :: - When the animation effect is in the [=animation effect/before phase=], - the animation effect will produce the same [=iteration progress=] value - as the earliest moment that it is scheduled to be [=in play=]. - - For all other times that the animation effect is not [=in play=], - it will have no effect. - - : both - :: - When the animation effect is in its [=animation effect/before phase=], - backwards fill behavior is used. - - When the animation effect is in its [=animation effect/after phase=], - forwards fill behavior is used. - - Some examples of the these fill modes are illustrated below. - -

- - -

- - Note: Setting a fill mode has no bearing on + Note: Setting a [=fill mode=] has no bearing on the endpoints of the [=active interval=] or the boundaries between [[#animation-effect-phases-and-states|phases]] However, the fill mode does have an effect @@ -2938,8 +2928,6 @@ Fill behavior {#fill-behavior} inside the [=animation effect/active phase=] or when a fill is applied. -

: If the [=fill mode=] is - backwards or - both, + [=fill mode/backwards=] or [=fill mode/both=], :: Return the result of evaluating max(local time − start delay, 0). @@ -3275,8 +3262,7 @@ Core animation effect calculations {#core-animation-effect-calculations}

: If the [=fill mode=] is - forwards or - both, + [=fill mode/forwards=] or [=fill mode/backwards=], :: Return the result of evaluating max(min(local time − start delay, @@ -4500,7 +4486,7 @@ Side effects of animation {#side-effects-section} a [=stacking context=] will be created for the [=effect target=] so long as the [=animation=] is in the [=animation effect/before phase=], the [=animation effect/active phase=] or, - if it has a [=fill mode=] of "forwards" or "both", + if it has a [=fill mode=] of [=fill mode/forwards=] or [=fill mode/both=], the [=animation effect/after phase=]. @@ -5184,10 +5170,10 @@ The {{AnimationEffect}} interface {#the-animationeffect-interface} : If the [=animation effect=] to which the fill mode is being applied is a [=keyframe effect=], :: - Use {{FillMode/none}} as the [=fill mode=]. + Use [=fill mode/none=] as the [=fill mode=]. : Otherwise, - :: Use {{FillMode/both}} as the [=fill mode=]. + :: Use [=fill mode/both=] as the [=fill mode=].