[css-easing-2] Ohhh, *that's* what the before flag does. Literally unexplained anywhere.

Author: tabatkins

css-easing-2/Overview.bs

@@ -136,7 +136,7 @@ an [=input progress value=] and produces an [=output progress value=].
 An [=easing function=] must be a pure function meaning that for a given set of
 inputs, it always produces the same [=output progress value=].
 
-The <dfn>input progress value</dfn> is a real number in the range [-&infin;,
+The <dfn export for="easing function">input progress value</dfn> is a real number in the range [-&infin;,
 &infin;].
 Typically, the [=input progress value=] is in the range [0, 1] but this may
 not be the case when [=easing functions=] are chained together.
@@ -154,7 +154,7 @@ may be outside the range [0, 1].
 
 </div>
 
-The <dfn>output progress value</dfn> is a real number in the
+The <dfn export for="easing function">output progress value</dfn> is a real number in the
 range [-&infin;, &infin;].
 
 Note: While CSS numbers have a theoretically infinite range
@@ -164,18 +164,18 @@ If easing functions are used outside of the CSS context,
 care must be taken to either correctly handle potential infinities,
 or clamp the [=output progress value=].
 
-Some types of easing functions also take an additional boolean <dfn export for="easing function">before flag</dfn>,
-which is defined subsequently.
+Some types of easing functions
+also take an additional boolean <dfn export for="easing function">before flag</dfn>,
+which indicates the easing has not yet started,
+or is going in reverse and is past the finish.
 
-This specification defines four types of easing functions whose definitions
-follow.
+This specification defines several types of easing functions:
 
-The syntax for specifying an [=easing function=] is as follows:
-
-<div class="prod"><dfn type>&lt;easing-function&gt;</dfn> =
-  <<linear-easing-function>> |
-  <<cubic-bezier-easing-function>> |
-  <<step-easing-function>></div>
+<pre class="prod">
+  <dfn>&lt;easing-function&gt;</dfn> = <<linear-easing-function>>
+                    | <<cubic-bezier-easing-function>>
+                    | <<step-easing-function>>
+</pre>
 
 <wpt>
   timing-functions-syntax-computed.html
@@ -349,15 +349,16 @@ Output</h4>
     return the [=output progress value=]
     of that item.
 
-  3. If at least one of |points| has an [=input progress value=]
-    matching |inputProgress|:
+  3. If |inputProgress| matches the [=input progress value=]
+    of the first point in |points|,
+    and the [=before flag=] is true,
+    return the first point's [=output progress value=].
 
-    * If the [=before flag=] is true,
-      return the [=output progress value=] of the first such point.
-    * Otherwise,
-      return the [=output progress value=] of the last such point.
+  4. If |inputProgress| matches the [=input progress value=]
+    of at least one point in |points|,
+    return the [=output progress value=] of the last such point.
 
-  4. Otherwise, find two [=linear()/control points=],
+  5. Otherwise, find two [=linear()/control points=] in |points|,
     |A| and |B|,
     which will be used for interpolation:
 
@@ -378,7 +379,7 @@ Output</h4>
       and let |B| be the first [=linear()/control point=]
       whose [=input progress value=] is larger than |inputProgress|.
 
-  5. Linearly interpolate (or extrapolate) |inputProgress|
+  6. Linearly interpolate (or extrapolate) |inputProgress|
     along the line defined by |A| and |B|,
     and return the result.
 </div>
@@ -830,32 +831,28 @@ Output</h4>
   perform the following.
   It returns an [=output progress value=].
 
-  1. Let |steps| be |func|'s [=steps()/steps=],
+  1. If the [=before flag=] is true, return 0.
+
+  2. Let |steps| be |func|'s [=steps()/steps=],
     and |position| be |func|'s [=steps()/step position=].
 
-  2. Divide the interval [-&infin;, &infin;] into several segments,
+  3. Divide the interval [-&infin;, &infin;] into several segments,
     each with an associated value,
     as follows:
 
     1. [-&infin;, 0] has the value 0.
-    2. [1, &infin;] has the value 1.
+    2. (1, &infin;] has the value 1.
     3. [0, 1] is divided into |steps| intervals,
+      [0, ...) to [..., 1)
       with their values assigned as defined for the |position|
       (see <<step-position>>).
 
-    Note: All intervals are inclusive,
-    so some values are part of two intervals at once.
-
-  3. If |inputProgress| is in a single interval,
-    return the associated value for that interval.
-
-  4. Otherwise, |inputProgress| is in two intervals,
-    with two associated values
-    (which might be the same).
+    Note: In other words,
+    at the boundary between intervals,
+    the associated value is the higher value.
 
-    If the [=before flag=] is true,
-    return the smaller associated value;
-    otherwise, return the larger associated value.
+  4. Return the associated value
+    for the interval that |inputProgress| is in.
 </div>
 
 <div class=example>