[web-animations-1] Initialize start time of scroll animations to zero (w3c#2075) (w3c#4842)

Initialize start time of scroll animations to zero.

Author: ogerchikov

web-animations-1/Overview.bs

@@ -828,31 +828,6 @@ follows:
     <var>animation</var> with the <var>did seek</var> flag set to false, and
     the <var>synchronously notify</var> flag set to false.
 
-<h4 id="responding-to-a-newly-inactive-timeline">Responding to a newly inactive
-  timeline</h4>
-
-Issue(2080): With the set of timelines defined in this level of this
-             specification, this situation is not expected to occur. As
-             a result, this section will likely be moved to a subsequent level
-             of this specification.
-
-When the <a>timeline</a> associated with an <a>animation</a>,
-<var>animation</var>, becomes newly <a lt="inactive timeline">inactive</a>,
-if <var>animation</var>'s <a>previous current time</a> is <a
-lt="unresolved">resolved</a>, the procedure to <a>silently set the current
-time</a> of <var>animation</var> to <a>previous current time</a> is run.
-
-<div class="note">
-
-This step makes the behavior when an <a>animation</a>'s <a>timeline</a> becomes
-<a lt="inactive timeline">inactive</a> consistent with when it is
-disassociated with a <a>timeline</a>.
-Furthermore, it ensures that the only occasion on which an <a>animation</a>
-becomes <a lt="idle play state">idle</a>, is when the procedure to
-<a>cancel an animation</a> is performed.
-
-</div>
-
 <h4 id="setting-the-associated-effect" oldids="setting-the-target-effect">Setting the associated effect of an animation</h4>
 
 The procedure to <dfn>set the associated effect of an animation</dfn>,
@@ -1148,6 +1123,9 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
     <var>animation</var> has a <a>pending pause task</a>, and false otherwise.
 1.  Let <var>has pending ready promise</var> be a boolean flag that is
     initially false.
+1.  Let <var>performed seek</var> be a boolean flag that is initially false.
+1.  Let <var>has finite timeline</var> be true if |animation| has an associated
+    <a>timeline</a> that is not [=monotonically increasing=].
 1.  Perform the steps corresponding to the <em>first</em> matching
     condition from the following, if any:
 
@@ -1161,23 +1139,65 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
         *   <a>current time</a> &lt; zero, or
         *   <a>current time</a> &ge; <a>associated effect end</a>,
 
-    ::  Set <var>animation</var>'s <a>hold time</a> to zero.
+    ::  1.  Set <var>performed seek</var> to true.
+        1.  Update either <var>animation</var>’s <a>start time</a> or
+            <a>hold time</a> as follows:
+
+            <div class="switch">
+
+            :   If |has finite timeline| is true,
+            ::  Set <var>animation</var>'s <a>start time</a> to zero.
+            :   Otherwise,
+            ::  Set <var>animation</var>'s <a>hold time</a> to zero.
+
+            </div>
+
     :   If |animation|'s [=effective playback rate=] &lt; 0,
         the <var>auto-rewind</var> flag is true and <em>either</em>
         <var>animation</var>'s:
 
         *   <a>current time</a> is <a>unresolved</a>, or
         *   <a>current time</a> &le; zero, or
         *   <a>current time</a> &gt; <a>associated effect end</a>,
+    ::
+        <div class="switch">
+
+        :   If <a>associated effect end</a> is positive infinity,
+        ::  <a>throw</a> an "{{InvalidStateError}}" {{DOMException}} and
+            abort these steps.
+        :   Otherwise,
+        ::  1.  Set <var>performed seek</var> to true.
+            1.  Update either <var>animation</var>’s <a>start time</a> or
+                <a>hold time</a> as follows:
+
+                <div class="switch">
+
+                :   If |has finite timeline| is true,
+                ::  Set <var>animation</var>'s <a>start time</a> to <a>associated
+                    effect end</a>.
+                :   Otherwise,
+                ::  Set <var>animation</var>'s <a>hold time</a> to <a>associated
+                    effect end</a>.
+
+                </div>
+
+        </div>
 
-    ::  If <a>associated effect end</a> is positive infinity,
-        <a>throw</a> an "{{InvalidStateError}}" {{DOMException}} and
-        abort these steps.
-        Otherwise, set <var>animation</var>'s <a>hold time</a> to <a>associated
-        effect end</a>.
     :   If |animation|'s [=effective playback rate=] = 0 and |animation|'s
         [=current time=] is [=unresolved=],
-    ::  Set <var>animation</var>'s <a>hold time</a> to zero.
+
+        ::  1.  Set <var>performed seek</var> to true.
+            1.  Update either <var>animation</var>’s <a>start time</a> or
+                <a>hold time</a> as follows:
+
+                <div class="switch">
+
+                :   If |has finite timeline| is true,
+                ::  Set <var>animation</var>'s <a>start time</a> to zero.
+                :   Otherwise,
+                ::  Set <var>animation</var>'s <a>hold time</a> to zero.
+
+                </div>
 
     </div>
 
@@ -1187,9 +1207,10 @@ as CSS Animations [[CSS-ANIMATIONS-1]].
     1.  Cancel that task.
     1.  Set <var>has pending ready promise</var> to true.
 
-1.  If the following three conditions are <em>all</em> satisfied:
+1.  If the following four conditions are <em>all</em> satisfied:
 
     * |animation|'s [=hold time=] is [=unresolved=], and
+    * |performed seek| is false, and
     * |aborted pause| is false, and
     * |animation| does <em>not</em> have a [=pending playback rate=],
 
@@ -1322,21 +1343,50 @@ follows:
 1.  If <var>animation</var> has a <a>pending pause task</a>, abort these steps.
 1.  If the <a>play state</a> of <var>animation</var> is <a
     lt="paused play state">paused</a>, abort these steps.
+1.  Let <var>has finite timeline</var> be true if |animation| has an associated
+    <a>timeline</a> that is not [=monotonically increasing=].
 1.  If the <var>animation</var>'s <a>current time</a> is <a>unresolved</a>,
     perform the steps according to the first matching condition from below:
 
     <div class="switch">
 
-    :    If <var>animation</var>'s [=playback rate=] is &ge; 0,
-    ::   Let <var>animation</var>'s <a>hold time</a> be zero.
+    :   If <var>animation</var>'s [=playback rate=] is &ge; 0,
+    ::  Update either <var>animation</var>’s <a>start time</a> or
+        <a>hold time</a> as follows:
+
+        <div class="switch">
+
+        :   If |has finite timeline| is true,
+        ::  Set <var>animation</var>'s <a>start time</a> to zero.
+        :   Otherwise,
+        ::  Set <var>animation</var>'s <a>hold time</a> to zero.
+
+        </div>
+
+    :   Otherwise,
+    ::
+        <div class="switch">
+
+        :   If <a>associated effect end</a> for <var>animation</var> is positive
+            infinity,
+        ::  <a>throw</a> an "{{InvalidStateError}}" {{DOMException}}
+            and abort these steps.
+        :   Otherwise,
+        ::  Update either <var>animation</var>’s <a>start time</a> or
+            <a>hold time</a> as follows:
+
+            <div class="switch">
+
+            :   If |has finite timeline| is true,
+            ::  let <var>animation</var>'s <a>start time</a> be
+                <a>associated effect end</a>.
+            :   Otherwise,
+            ::  let <var>animation</var>'s <a>hold time</a> be
+                <a>associated effect end</a>.
 
-    :    Otherwise,
-    ::   If <a>associated effect end</a> for <var>animation</var> is positive
-         infinity,
-         <a>throw</a> an "{{InvalidStateError}}" {{DOMException}}
-         and abort these steps.
-         Otherwise, let <var>animation</var>'s <a>hold time</a> be
-         <a>associated effect end</a>.
+            </div>
+
+        </div>
 
     </div>
 
@@ -1347,10 +1397,14 @@ follows:
 1.  If <var>has pending ready promise</var> is false,
     set <var>animation</var>'s <a>current ready promise</a> to
     <a>a new promise</a> in the <a>relevant Realm</a> of <var>animation</var>.
-1.  Schedule a task to be executed at the first possible moment after
-    the user agent has performed any processing necessary to suspend
-    the playback of
-    <var>animation</var>'s <a>associated effect</a>, if any.
+1.  Schedule a task to be executed at the first possible moment where
+    <em>both</em> of the following conditions are true:
+    *   the user agent has performed any processing necessary to suspend
+        the playback of <var>animation</var>'s <a>associated effect</a>, if any.
+
+    *   the animation is associated with a <a>timeline</a> that is not
+        <a lt="inactive timeline">inactive</a>.
+
     The task shall perform the following steps:
 
     1.  Let <var>ready time</var> be the time value of the timeline associated
@@ -1934,11 +1988,14 @@ non-normative description is also provided:
 
 :   <a lt="idle play state">idle</a>
 ::  The <a>current time</a> of the animation is <a>unresolved</a> and
+    the <a>start time</a> of the animation is <a>unresolved</a> and
     there are no pending tasks.
     In this state the animation has no effect.
 :   <a lt="running play state">running</a>
 ::  The animation has a resolved <a>current time</a> that changes on each
-    <a>animation frame</a> (provided the [=playback rate=] is not zero).
+    <a>animation frame</a> (provided the [=playback rate=] is not zero
+    and the <a>timeline</a> is [=inactive timeline|active=] and
+    [=monotonically increasing=]).
 :   <a lt="paused play state">paused</a>
 ::  The animation has been suspended and the <a>current time</a>
     is no longer changing.
@@ -1957,6 +2014,8 @@ condition from the following:
 :   <em>All</em> of the following conditions are true:
     *   The <a>current time</a> of <var>animation</var> is <a>unresolved</a>,
         <em>and</em>
+    *   the <a>start time</a> of <var>animation</var> is <a>unresolved</a>,
+        <em>and</em>
     *   <var>animation</var> does <em>not</em> have <em>either</em>
         a <a>pending play task</a> <em>or</em> a <a>pending pause task</a>,
 ::  &rarr; <dfn lt="idle play state">idle</dfn>