Mercurial > drafts / changeset

     1.1 --- a/css-transitions/Overview.bs	Tue Jan 27 11:25:36 2015 -0800
     1.2 +++ b/css-transitions/Overview.bs	Tue Jan 27 12:48:02 2015 -0800
     1.3 @@ -502,7 +502,8 @@
     1.4        </h2>
     1.5  
     1.6        <p>
     1.7 -        Implementations must maintain a set of running transitions,
     1.8 +        Implementations must maintain a set of
     1.9 +        <dfn title="running transition">running transitions</dfn>,
    1.10          each of which applies to a specific element and non-shorthand
    1.11          property.  Each of these transitions also has a
    1.12          <dfn>start time</dfn>, <dfn>end time</dfn>, <dfn>start value</dfn>,
    1.13 @@ -512,6 +513,46 @@
    1.14          and are removed from this set
    1.15          when they <a>complete</a>
    1.16          or when implementations are required to <dfn>cancel</dfn> them.
    1.17 +        <span class="note">
    1.18 +          For the rationale behind the <a>reversing-adjusted start value</a>
    1.19 +          and <a>reversing shortening factor</a>, see [[#reversing]].
    1.20 +        </span>
    1.21 +      </p>
    1.22 +
    1.23 +      <p>
    1.24 +        Implementations must also maintain a set of
    1.25 +        <dfn title="completed transition">completed transitions</dfn>,
    1.26 +        each of which
    1.27 +        (like <a title="running transition">running transitions</a>)
    1.28 +        applies to a specific element and non-shorthand property.
    1.29 +        <span class="note">
    1.30 +          This specification maintains the invariant that
    1.31 +          there is never both a <a>running transition</a> and
    1.32 +          a <a>completed transition</a> for the same property and element.
    1.33 +        </span>
    1.34 +        <span class="note">
    1.35 +          This set of completed transitions
    1.36 +          needs to be maintained
    1.37 +          in order to prevent
    1.38 +          transitions from repeating themselves in certain cases,
    1.39 +          i.e., to maintain the invariant
    1.40 +          that this specification tries to maintain
    1.41 +          that unrelated style changes do not trigger transitions.
    1.42 +        </span>
    1.43 +      </p>
    1.44 +
    1.45 +      <p class="example">
    1.46 +        An example where maintaining the set of completed transitions
    1.47 +        is necessary would be a transition on
    1.48 +        an inherited property,
    1.49 +        where the parent specifies a transition of that property for
    1.50 +        a longer duration (say, ''transition: 4s text-indent'')
    1.51 +        and a child element that inherits the parent's value specifies
    1.52 +        a transition of the same property for a shorter duration
    1.53 +        (say, ''transition: 1s text-indent'').
    1.54 +        Without the maintenance of this set of completed transitions,
    1.55 +        implementations could start additional transitions on the child
    1.56 +        after the initial 1 second transition on the child completes.
    1.57        </p>
    1.58  
    1.59        <p>
    1.60 @@ -637,13 +678,33 @@
    1.61  
    1.62        <ol>
    1.63        <li>
    1.64 -        If the element does not have a running transition for the property,
    1.65 -        the <a>before-change style</a> is different from
    1.66 -        and can be interpolated with
    1.67 -        the <a>after-change style</a> for that property,
    1.68 -        there is a <a>matching transition-property value</a>,
    1.69 -        and the <a>combined duration</a> is greater than ''0s'',
    1.70 -        implementations must
    1.71 +        If all of the following are true:
    1.72 +        <ul>
    1.73 +          <li>
    1.74 +            the element does not have
    1.75 +            a <a>running transition</a> for the property,
    1.76 +          </li>
    1.77 +          <li>
    1.78 +            the <a>before-change style</a> is different from
    1.79 +            and can be interpolated with
    1.80 +            the <a>after-change style</a> for that property,
    1.81 +          </li>
    1.82 +          <li>
    1.83 +            the element does not have a <a>completed transition</a>
    1.84 +            for the property
    1.85 +            or the <a>end value</a> of the <a>completed transition</a>
    1.86 +            is different from the <a>after-change style</a> for the property,
    1.87 +          </li>
    1.88 +          <li>
    1.89 +            there is a <a>matching transition-property value</a>, and
    1.90 +          </li>
    1.91 +          <li>
    1.92 +            the <a>combined duration</a> is greater than ''0s'',
    1.93 +          </li>
    1.94 +        </ul>
    1.95 +        then implementations must
    1.96 +        remove the <a>completed transition</a> (if present) from the set
    1.97 +        of completed transitions and
    1.98          start a transition whose:
    1.99          <ul>
   1.100            <li>
   1.101 @@ -675,49 +736,52 @@
   1.102          </ul>
   1.103        </li>
   1.104        <li>
   1.105 -        If the element has a running transition for the property,
   1.106 +        If the element has a <a>running transition</a> or
   1.107 +        <a>completed transition</a> for the property,
   1.108          and there is <strong>not</strong>
   1.109          a <a>matching transition-property value</a>,
   1.110          then implementations must
   1.111 -        <a>cancel</a> the running transition.
   1.112 +        <a>cancel</a> the <a>running transition</a>
   1.113 +        or remove the <a>completed transition</a> from the set of
   1.114 +        <a title="completed transition">completed transitions</a>.
   1.115        </li>
   1.116        <li>
   1.117 -        If the element has a running transition for the property,
   1.118 +        If the element has a <a>running transition</a> for the property,
   1.119          there is a <a>matching transition-property value</a>,
   1.120 -        and the <a>end value</a> of the running transition is
   1.121 +        and the <a>end value</a> of the <a>running transition</a> is
   1.122          <strong>not</strong> equal to the value of the property in the
   1.123          <a>after-change style</a>, then:
   1.124          <ol>
   1.125            <li>
   1.126              If the <a>current value</a> of the property
   1.127 -            in the running transition
   1.128 +            in the <a>running transition</a>
   1.129              is equal to
   1.130              the value of the property in the <a>after-change style</a>,
   1.131              or if these two values cannot be interpolated,
   1.132              then implementations must
   1.133 -            <a>cancel</a> the running transition.
   1.134 +            <a>cancel</a> the <a>running transition</a>.
   1.135            </li>
   1.136            <li>
   1.137              Otherwise, if the <a>combined duration</a> is
   1.138              less than or equal to ''0s'',
   1.139              then implementations must
   1.140 -            <a>cancel</a> the running transition.
   1.141 +            <a>cancel</a> the <a>running transition</a>.
   1.142            </li>
   1.143            <li>
   1.144              Otherwise, if the <a>reversing-adjusted start value</a>
   1.145 -            of the running transition is the same as the value of
   1.146 +            of the <a>running transition</a> is the same as the value of
   1.147              the property in the <a>after-change style</a>
   1.148              <span class="note">(see the
   1.149              <a href="#reversing">section on reversing of
   1.150              transitions</a> for why these case exists)</span>,
   1.151              implementations must
   1.152 -            <a>cancel</a> the running transition and
   1.153 +            <a>cancel</a> the <a>running transition</a> and
   1.154              start a new transition whose:
   1.155              <ul>
   1.156                <li>
   1.157                  <a>reversing-adjusted start value</a> is
   1.158                  the <a>end value</a> of the
   1.159 -                running transition
   1.160 +                <a>running transition</a>
   1.161                  <span class="note">(Note: This represents the logical start state of
   1.162                  the transition, and allows some calculations to ignore that
   1.163                  the transition started before that state was reached, which
   1.164 @@ -766,7 +830,7 @@
   1.165                <li>
   1.166                  <a>start value</a> is
   1.167                  the <a>current value</a> of the property
   1.168 -                in the running transition,
   1.169 +                in the <a>running transition</a>,
   1.170                </li>
   1.171                <li>
   1.172                  <a>end value</a> is
   1.173 @@ -777,7 +841,7 @@
   1.174            </li>
   1.175            <li>
   1.176              Otherwise, implementations must
   1.177 -            <a>cancel</a> the running transition
   1.178 +            <a>cancel</a> the <a>running transition</a>
   1.179              and start a new transition whose:
   1.180              <ul>
   1.181                <li>
   1.182 @@ -793,7 +857,7 @@
   1.183                <li>
   1.184                  <a>start value</a> is
   1.185                  the <a>current value</a> of the property
   1.186 -                in the running transition,
   1.187 +                in the <a>running transition</a>,
   1.188                </li>
   1.189                <li>
   1.190                  <a>end value</a> is
   1.191 @@ -1003,14 +1067,16 @@
   1.192        <h2 id="complete">Completion of transitions</h2>
   1.193  
   1.194        <p>
   1.195 -        Running transitions <dfn id="dfn-complete">complete</dfn>
   1.196 +        <a title="running transition">Running transitions</a>
   1.197 +        <dfn id="dfn-complete">complete</dfn>
   1.198          at a time that equal to or after their end time,
   1.199          but prior to to the first <a>style change event</a>
   1.200          whose time is equal to or after their <a>end time</a>.
   1.201          When a transition completes,
   1.202 -        implementations must remove
   1.203 +        implementations must move
   1.204          all transitions that complete at that time
   1.205 -        from the set of running transitions
   1.206 +        from the set of <a>running transitions</a>
   1.207 +        to the set of <a>completed transitions</a>
   1.208          and then fire the <a href="#transition-events">events</a>
   1.209          for those completions.
   1.210          <span class="note">(Note that doing otherwise could allow

     2.1 --- a/css-transitions/Overview.html	Tue Jan 27 11:25:36 2015 -0800
     2.2 +++ b/css-transitions/Overview.html	Tue Jan 27 12:48:02 2015 -0800
     2.3 @@ -941,7 +941,8 @@
     2.4  
     2.5        
     2.6        <p>
     2.7 -        Implementations must maintain a set of running transitions,
     2.8 +        Implementations must maintain a set of
     2.9 +        <dfn data-dfn-type="dfn" data-noexport="" id="running-transition" title="running transition">running transitions<a class="self-link" href="#running-transition"></a></dfn>,
    2.10          each of which applies to a specific element and non-shorthand
    2.11          property.  Each of these transitions also has a
    2.12          <dfn data-dfn-type="dfn" data-noexport="" id="start-time">start time<a class="self-link" href="#start-time"></a></dfn>, <dfn data-dfn-type="dfn" data-noexport="" id="end-time">end time<a class="self-link" href="#end-time"></a></dfn>, <dfn data-dfn-type="dfn" data-noexport="" id="start-value">start value<a class="self-link" href="#start-value"></a></dfn>,
    2.13 @@ -951,6 +952,50 @@
    2.14          and are removed from this set
    2.15          when they <a data-link-type="dfn" href="#dfn-complete">complete</a>
    2.16          or when implementations are required to <dfn data-dfn-type="dfn" data-noexport="" id="cancel">cancel<a class="self-link" href="#cancel"></a></dfn> them.
    2.17 +        <span class="note" role="note">
    2.18 +          For the rationale behind the <a data-link-type="dfn" href="#reversing_adjusted-start-value">reversing-adjusted start value</a>
    2.19 +          and <a data-link-type="dfn" href="#reversing-shortening-factor">reversing shortening factor</a>, see <a data-section="" href="#reversing">§3.1 
    2.20 +        Faster reversing of interrupted transitions
    2.21 +      </a>.
    2.22 +        </span>
    2.23 +      </p>
    2.24 +
    2.25 +      
    2.26 +      <p>
    2.27 +        Implementations must also maintain a set of
    2.28 +        <dfn data-dfn-type="dfn" data-noexport="" id="completed-transition" title="completed transition">completed transitions<a class="self-link" href="#completed-transition"></a></dfn>,
    2.29 +        each of which
    2.30 +        (like <a data-link-type="dfn" href="#running-transition" title="running transition">running transitions</a>)
    2.31 +        applies to a specific element and non-shorthand property.
    2.32 +        <span class="note" role="note">
    2.33 +          This specification maintains the invariant that
    2.34 +          there is never both a <a data-link-type="dfn" href="#running-transition">running transition</a> and
    2.35 +          a <a data-link-type="dfn" href="#completed-transition">completed transition</a> for the same property and element.
    2.36 +        </span>
    2.37 +        <span class="note" role="note">
    2.38 +          This set of completed transitions
    2.39 +          needs to be maintained
    2.40 +          in order to prevent
    2.41 +          transitions from repeating themselves in certain cases,
    2.42 +          i.e., to maintain the invariant
    2.43 +          that this specification tries to maintain
    2.44 +          that unrelated style changes do not trigger transitions.
    2.45 +        </span>
    2.46 +      </p>
    2.47 +
    2.48 +      
    2.49 +      <p class="example">
    2.50 +        An example where maintaining the set of completed transitions
    2.51 +        is necessary would be a transition on
    2.52 +        an inherited property,
    2.53 +        where the parent specifies a transition of that property for
    2.54 +        a longer duration (say, <a class="css" data-link-type="propdesc" href="#propdef-transition" title="transition">transition: 4s text-indent</a>)
    2.55 +        and a child element that inherits the parent’s value specifies
    2.56 +        a transition of the same property for a shorter duration
    2.57 +        (say, <a class="css" data-link-type="propdesc" href="#propdef-transition" title="transition">transition: 1s text-indent</a>).
    2.58 +        Without the maintenance of this set of completed transitions,
    2.59 +        implementations could start additional transitions on the child
    2.60 +        after the initial 1 second transition on the child completes.
    2.61        </p>
    2.62  
    2.63        
    2.64 @@ -1092,13 +1137,46 @@
    2.65        <ol>
    2.66        
    2.67          <li>
    2.68 -        If the element does not have a running transition for the property,
    2.69 -        the <a data-link-type="dfn" href="#before_change-style">before-change style</a> is different from
    2.70 -        and can be interpolated with
    2.71 -        the <a data-link-type="dfn" href="#after_change-style">after-change style</a> for that property,
    2.72 -        there is a <a data-link-type="dfn" href="#matching-transition_property-value">matching transition-property value</a>,
    2.73 -        and the <a data-link-type="dfn" href="#combined-duration">combined duration</a> is greater than <span class="css">0s</span>,
    2.74 -        implementations must
    2.75 +        If all of the following are true:
    2.76 +        
    2.77 +          <ul>
    2.78 +          
    2.79 +            <li>
    2.80 +            the element does not have
    2.81 +            a <a data-link-type="dfn" href="#running-transition">running transition</a> for the property,
    2.82 +          </li>
    2.83 +            
    2.84 +          
    2.85 +            <li>
    2.86 +            the <a data-link-type="dfn" href="#before_change-style">before-change style</a> is different from
    2.87 +            and can be interpolated with
    2.88 +            the <a data-link-type="dfn" href="#after_change-style">after-change style</a> for that property,
    2.89 +          </li>
    2.90 +            
    2.91 +          
    2.92 +            <li>
    2.93 +            the element does not have a <a data-link-type="dfn" href="#completed-transition">completed transition</a>
    2.94 +            for the property
    2.95 +            or the <a data-link-type="dfn" href="#end-value">end value</a> of the <a data-link-type="dfn" href="#completed-transition">completed transition</a>
    2.96 +            is different from the <a data-link-type="dfn" href="#after_change-style">after-change style</a> for the property,
    2.97 +          </li>
    2.98 +            
    2.99 +          
   2.100 +            <li>
   2.101 +            there is a <a data-link-type="dfn" href="#matching-transition_property-value">matching transition-property value</a>, and
   2.102 +          </li>
   2.103 +            
   2.104 +          
   2.105 +            <li>
   2.106 +            the <a data-link-type="dfn" href="#combined-duration">combined duration</a> is greater than <span class="css">0s</span>,
   2.107 +          </li>
   2.108 +            
   2.109 +        
   2.110 +          </ul>
   2.111 +          
   2.112 +        then implementations must
   2.113 +        remove the <a data-link-type="dfn" href="#completed-transition">completed transition</a> (if present) from the set
   2.114 +        of completed transitions and
   2.115          start a transition whose:
   2.116          
   2.117            <ul>
   2.118 @@ -1147,18 +1225,21 @@
   2.119          
   2.120        
   2.121          <li>
   2.122 -        If the element has a running transition for the property,
   2.123 +        If the element has a <a data-link-type="dfn" href="#running-transition">running transition</a> or
   2.124 +        <a data-link-type="dfn" href="#completed-transition">completed transition</a> for the property,
   2.125          and there is <strong>not</strong>
   2.126          a <a data-link-type="dfn" href="#matching-transition_property-value">matching transition-property value</a>,
   2.127          then implementations must
   2.128 -        <a data-link-type="dfn" href="#cancel">cancel</a> the running transition.
   2.129 +        <a data-link-type="dfn" href="#cancel">cancel</a> the <a data-link-type="dfn" href="#running-transition">running transition</a>
   2.130 +        or remove the <a data-link-type="dfn" href="#completed-transition">completed transition</a> from the set of
   2.131 +        <a data-link-type="dfn" href="#completed-transition" title="completed transition">completed transitions</a>.
   2.132        </li>
   2.133          
   2.134        
   2.135          <li>
   2.136 -        If the element has a running transition for the property,
   2.137 +        If the element has a <a data-link-type="dfn" href="#running-transition">running transition</a> for the property,
   2.138          there is a <a data-link-type="dfn" href="#matching-transition_property-value">matching transition-property value</a>,
   2.139 -        and the <a data-link-type="dfn" href="#end-value">end value</a> of the running transition is
   2.140 +        and the <a data-link-type="dfn" href="#end-value">end value</a> of the <a data-link-type="dfn" href="#running-transition">running transition</a> is
   2.141          <strong>not</strong> equal to the value of the property in the
   2.142          <a data-link-type="dfn" href="#after_change-style">after-change style</a>, then:
   2.143          
   2.144 @@ -1166,12 +1247,12 @@
   2.145            
   2.146              <li>
   2.147              If the <a data-link-type="dfn" href="#current-value">current value</a> of the property
   2.148 -            in the running transition
   2.149 +            in the <a data-link-type="dfn" href="#running-transition">running transition</a>
   2.150              is equal to
   2.151              the value of the property in the <a data-link-type="dfn" href="#after_change-style">after-change style</a>,
   2.152              or if these two values cannot be interpolated,
   2.153              then implementations must
   2.154 -            <a data-link-type="dfn" href="#cancel">cancel</a> the running transition.
   2.155 +            <a data-link-type="dfn" href="#cancel">cancel</a> the <a data-link-type="dfn" href="#running-transition">running transition</a>.
   2.156            </li>
   2.157              
   2.158            
   2.159 @@ -1179,19 +1260,19 @@
   2.160              Otherwise, if the <a data-link-type="dfn" href="#combined-duration">combined duration</a> is
   2.161              less than or equal to <span class="css">0s</span>,
   2.162              then implementations must
   2.163 -            <a data-link-type="dfn" href="#cancel">cancel</a> the running transition.
   2.164 +            <a data-link-type="dfn" href="#cancel">cancel</a> the <a data-link-type="dfn" href="#running-transition">running transition</a>.
   2.165            </li>
   2.166              
   2.167            
   2.168              <li>
   2.169              Otherwise, if the <a data-link-type="dfn" href="#reversing_adjusted-start-value">reversing-adjusted start value</a>
   2.170 -            of the running transition is the same as the value of
   2.171 +            of the <a data-link-type="dfn" href="#running-transition">running transition</a> is the same as the value of
   2.172              the property in the <a data-link-type="dfn" href="#after_change-style">after-change style</a>
   2.173              <span class="note" role="note">(see the
   2.174              <a href="#reversing">section on reversing of
   2.175              transitions</a> for why these case exists)</span>,
   2.176              implementations must
   2.177 -            <a data-link-type="dfn" href="#cancel">cancel</a> the running transition and
   2.178 +            <a data-link-type="dfn" href="#cancel">cancel</a> the <a data-link-type="dfn" href="#running-transition">running transition</a> and
   2.179              start a new transition whose:
   2.180              
   2.181                <ul>
   2.182 @@ -1199,7 +1280,7 @@
   2.183                  <li>
   2.184                  <a data-link-type="dfn" href="#reversing_adjusted-start-value">reversing-adjusted start value</a> is
   2.185                  the <a data-link-type="dfn" href="#end-value">end value</a> of the
   2.186 -                running transition
   2.187 +                <a data-link-type="dfn" href="#running-transition">running transition</a>
   2.188                  <span class="note" role="note">(Note: This represents the logical start state of
   2.189                  the transition, and allows some calculations to ignore that
   2.190                  the transition started before that state was reached, which
   2.191 @@ -1269,7 +1350,7 @@
   2.192                  <li>
   2.193                  <a data-link-type="dfn" href="#start-value">start value</a> is
   2.194                  the <a data-link-type="dfn" href="#current-value">current value</a> of the property
   2.195 -                in the running transition,
   2.196 +                in the <a data-link-type="dfn" href="#running-transition">running transition</a>,
   2.197                </li>
   2.198                  
   2.199                
   2.200 @@ -1288,7 +1369,7 @@
   2.201            
   2.202              <li>
   2.203              Otherwise, implementations must
   2.204 -            <a data-link-type="dfn" href="#cancel">cancel</a> the running transition
   2.205 +            <a data-link-type="dfn" href="#cancel">cancel</a> the <a data-link-type="dfn" href="#running-transition">running transition</a>
   2.206              and start a new transition whose:
   2.207              
   2.208                <ul>
   2.209 @@ -1310,7 +1391,7 @@
   2.210                  <li>
   2.211                  <a data-link-type="dfn" href="#start-value">start value</a> is
   2.212                  the <a data-link-type="dfn" href="#current-value">current value</a> of the property
   2.213 -                in the running transition,
   2.214 +                in the <a data-link-type="dfn" href="#running-transition">running transition</a>,
   2.215                </li>
   2.216                  
   2.217                
   2.218 @@ -1572,14 +1653,16 @@
   2.219  
   2.220        
   2.221        <p>
   2.222 -        Running transitions <dfn data-dfn-type="dfn" data-noexport="" id="dfn-complete">complete<a class="self-link" href="#dfn-complete"></a></dfn>
   2.223 +        <a data-link-type="dfn" href="#running-transition" title="running transition">Running transitions</a>
   2.224 +        <dfn data-dfn-type="dfn" data-noexport="" id="dfn-complete">complete<a class="self-link" href="#dfn-complete"></a></dfn>
   2.225          at a time that equal to or after their end time,
   2.226          but prior to to the first <a data-link-type="dfn" href="#style-change-event">style change event</a>
   2.227          whose time is equal to or after their <a data-link-type="dfn" href="#end-time">end time</a>.
   2.228          When a transition completes,
   2.229 -        implementations must remove
   2.230 +        implementations must move
   2.231          all transitions that complete at that time
   2.232 -        from the set of running transitions
   2.233 +        from the set of <a data-link-type="dfn" href="#running-transition">running transitions</a>
   2.234 +        to the set of <a data-link-type="dfn" href="#completed-transition">completed transitions</a>
   2.235          and then fire the <a href="#transition-events">events</a>
   2.236          for those completions.
   2.237          <span class="note" role="note">(Note that doing otherwise could allow
   2.238 @@ -2679,6 +2762,7 @@
   2.239        <li>cancel, <a href="#cancel" title="section 3">3</a></li>
   2.240        <li>combined duration, <a href="#combined-duration" title="section 3">3</a></li>
   2.241        <li>complete, <a href="#dfn-complete" title="section 5">5</a></li>
   2.242 +      <li>completed transition, <a href="#completed-transition" title="section 3">3</a></li>
   2.243        <li>cubic-bezier(), <a href="#funcdef-cubic-bezier" title="section 2.3">2.3</a></li>
   2.244        <li>current value, <a href="#current-value" title="section 4">4</a></li>
   2.245        <li>ease, <a href="#valdef-transition-timing-function-ease" title="section 2.3">2.3</a></li>
   2.246 @@ -2714,6 +2798,7 @@
   2.247        </li>
   2.248        <li>reversing-adjusted start value, <a href="#reversing_adjusted-start-value" title="section 3">3</a></li>
   2.249        <li>reversing shortening factor, <a href="#reversing-shortening-factor" title="section 3">3</a></li>
   2.250 +      <li>running transition, <a href="#running-transition" title="section 3">3</a></li>
   2.251        <li>&lt;single-transition>, <a href="#single-transition" title="section 2.5">2.5</a></li>
   2.252        <li>&lt;single-transition-property>, <a href="#single-transition-property" title="section 2.1">2.1</a></li>
   2.253        <li>&lt;single-transition-timing-function>, <a href="#single-transition-timing-function" title="section 2.3">2.3</a></li>