2009-11-17 dino@apple.com

- added rules for reversibility of transforms (improved)

Author: grorg

css3-transitions/Overview.html

@@ -29,15 +29,15 @@
 
    <h1>CSS Transitions Module Level 3</h1>
 
-   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 17 November
+   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 18 November
     2009</h2>
 
    <dl>
     <dt>This version:
 
-    <dd> <a href="http://www.w3.org/TR/2009/ED-css3-transitions-20091117">
+    <dd> <a href="http://www.w3.org/TR/2009/ED-css3-transitions-20091118">
      http://dev.w3.org/csswg/css3-transitions/</a>
-     <!--http://www.w3.org/TR/2009/WD-css3-transitions-20091117-->
+     <!--http://www.w3.org/TR/2009/WD-css3-transitions-20091118-->
 
     <dt>Latest version:
 
@@ -710,25 +710,42 @@ <h2 id=reversing><span class=secno>3 </span> Automatically reversing
    the expected behavior is that the new transition should be the reverse of
    what has already executed.
 
-  <p> If a currently executing transition is interrupted and the
-   transitioning property value is set to the original starting value for the
-   interrupted transition, and no other transition-related properties have
-   changed, then the new transition should be the reverse of the interrupted
-   transition. The new transition will execute with a duration that is the
-   elapsed time of the interrupted transition at the moment it was
-   interrupted. The timing function for the new transition will be the
-   portion of the curve traversed up to the point of reversal, followed in
-   the opposite direction to the starting point. The new transition will not
-   begin with a delay, even if one was specified. If the existing transition
-   was interrupted during its delay period, the new transition will execute
-   instantly.
+  <p> If a running transition with duration T, executing so far for duration
+   TE, from state A, to state B, is interrupted by a property change that
+   would start a new transition back to state A, and all the transition
+   attributes are the same (duration, delay and timing function), then the
+   new transition must reverse the effect. The new transition must:
+
+  <ol>
+   <li> Use the B and A states as its "from" and "to" states respectively. It
+    does not use the current value as its from state, due to the rules below.
+    
+
+   <li> Execute with the same duration T, but starting as if the transition
+    had already begun, without any transition delay, at the moment which
+    would cause the new transition to finish in TE from the moment of
+    interruption. In other words, the new transition will execute as if it
+    started T-TE in the past.
+
+   <li> Use a timing function that is the portion of the curve traversed up
+    to the moment of interruption, followed in the opposite direction
+    (towards the starting point). This will make the transition appear as if
+    it is playing backwards.
+
+   <li> Ignore any transition delay.
+  </ol>
 
   <p> For example, suppose there is a transition with a duration of two
    seconds. If this transition is interrupted after 0.5 seconds and the
    property value assigned to the original value, then the new transition
    effect will be the reverse of the original, as if it had begun 1.5 seconds
    in the past.
 
+  <p> Note that by using the defined from and to states for the reversing
+   transition, it is also possible that it may reverse again, if interrupted;
+   for example, if the transition reversing to state A was again interrupted
+   by a property change to state B.
+
   <h2 id=transition-events-><span class=secno>4 </span> Transition Events</h2>
 
   <p> The completion of a CSS Transition generates a corresponding <a

css3-transitions/Overview.src.html

@@ -657,20 +657,37 @@ <h2 id="reversing">
         asymmetric. Instead, the expected behavior is that the new transition
         should be the reverse of what has already executed.
       </p>
+      
       <p>
-        If a currently executing transition is interrupted and the
-        transitioning property value is set to the original starting value for
-        the interrupted transition, and no other transition-related properties
-        have changed, then the new transition should be the reverse of the
-        interrupted transition. The new transition will execute with a
-        duration that is the elapsed time of the interrupted transition at the
-        moment it was interrupted. The timing function for the new transition
-        will be the portion of the curve traversed up to the point of
-        reversal, followed in the opposite direction to the starting point.
-        The new transition will not begin with a delay, even if one was
-        specified. If the existing transition was interrupted during its delay
-        period, the new transition will execute instantly.
+        If a running transition with duration T, executing so far for duration TE, 
+        from state A, to state B, is interrupted by
+        a property change that would start a new transition back to state A, and
+        all the transition attributes are the same (duration, delay and timing function),
+        then the new transition must reverse the effect. The new transition must:
       </p>
+      
+      <ol>
+        <li>
+          Use the B and A states as its "from" and "to" states respectively. It
+          does not use the current value as its from state, due to the rules below.
+        </li>
+        <li>
+          Execute with the same duration T, but starting as if the transition had
+          already begun, without any transition delay, at the moment which would
+          cause the new transition to finish in TE from the moment of interruption. In other
+          words, the new transition will execute as if it started T-TE in the past.
+        </li>
+        <li>
+          Use a timing function that is the portion of the curve traversed up
+          to the moment of interruption, followed in the opposite direction (towards
+          the starting point). This will make the transition appear as if it 
+          is playing backwards.
+        </li>
+        <li>
+          Ignore any transition delay.
+        </li>
+      </ol>
+
       <p>
         For example, suppose there is a transition with a duration of two
         seconds. If this transition is interrupted after 0.5 seconds and the
@@ -679,6 +696,13 @@ <h2 id="reversing">
         1.5 seconds in the past.
       </p>
 
+      <p>
+        Note that by using the defined from and to states for the reversing
+        transition, it is also possible that it may reverse again, if
+        interrupted; for example, if the transition reversing to state A was
+        again interrupted by a property change to state B.
+      </p>
+
       <h2>
         Transition Events
       </h2>