<!-- 
            Copyright: Copyright 1998-2005  W3C (MIT, ERCIM, Keio), All Rights Reserved.
See http://www.w3.org/Consortium/Legal/.
Author: Aaron Cohen (Intel)
           Version: February 7, 2001
            Module: Animation Module
           Feature: animation
         File Name: animation-add-BE-05.smil
  Media Components: none
 Expected Behavior: Nine red rectangles numbered 1 to 9 shrink to squares
                    over 2s as follows:
                    at 2s #1 shrinks.
                    at 5s #2 shrinks, 1s after #1 completes
                    #4 shrinks when it is clicked on.
                    #5 shrinks 1s after it is clicked on.
                    #6 shrinks 2s after it is clicked on.
                    #7 shrinks when the accesskey '1' is pressed.
                    #8 should be shrunk from 0s since it's wallclock time is in the past.
                    #9 will not shrink unless a DOM call causes it to begin.
-->
<smil xmlns="http://www.w3.org/2005/SMIL21/Language">
    <head>
        <layout>
            <root-layout width="640" height="480" backgroundColor="white"/>
            <region id="whole" width="640" height="480" z-index="0"/>
            <region id="rect1" top="50px" left="90px" height="50px" width="30px" backgroundColor="red" z-index="1"/>
            <region id="rect2" top="50px" left="234px" height="50px" width="30px" backgroundColor="red" z-index="1"/>
            <region id="rect3" top="50px" left="380px" height="50px" width="30px" backgroundColor="red" z-index="1"/>
            <region id="rect4" top="160px" left="90px" height="50px" width="30px" backgroundColor="transparent" z-index="1"/>
            <region id="rect5" top="160px" left="234px" height="50px" width="30px" backgroundColor="transparent" z-index="1"/>
            <region id="rect6" top="160px" left="380px" height="50px" width="30px" backgroundColor="transparent" z-index="1"/>
            <region id="rect7" top="270px" left="90px" height="50px" width="30px" backgroundColor="red" z-index="1"/>
            <region id="rect8" top="270px" left="234px" height="50px" width="30px" backgroundColor="red" z-index="1"/>
            <region id="rect9" top="270px" left="380px" height="50px" width="30px" backgroundColor="red" z-index="1"/>
        </layout>
    </head>
    <body>
        <par dur="indefinite">
            <img src="../images/animation-timing-BE-05.jpg" region="whole"/>
            <animate id="anim1" targetElement="rect1" attributeName="height" from="50" to="25" begin="2s" dur="2s" fill="freeze"/>
            <animate id="anim2" targetElement="rect2" attributeName="height" from="50" to="25" begin="anim1.end+1s" dur="2s" fill="freeze"/>
           
            <brush id="brush4" color="red" region="rect4" height="50px" width="30px"/>
            <animate id="anim4" targetElement="brush4" attributeName="height" from="50" to="25" begin="brush4.activateEvent" dur="2s" fill="freeze"/>
            <brush id="brush5" color="red" region="rect5" height="50px" width="30px"/>
            <animate id="anim5" targetElement="brush5" attributeName="height" from="50" to="25" begin="brush5.activateEvent+1s" dur="2s" fill="freeze"/>
            <brush id="brush6" color="red" region="rect6" height="50px" width="30px"/>
            <animate id="anim6a" targetElement="brush6" attributeName="width" repeatCount="3" from="30" to="30" begin="brush6.activateEvent" dur="1s" fill="freeze"/>
            <animate id="anim6b" targetElement="brush6" attributeName="height" from="50" to="25" begin="anim6a.repeat(2)" dur="2s" fill="freeze"/>
            <animate id="anim7" targetElement="rect7" attributeName="height" from="50" to="25" begin="accesskey(1)" dur="2s" fill="freeze"/>
            <animate id="anim8" targetElement="rect8" attributeName="height" from="50" to="25" begin="wallclock(2000-01-01T00:00:00Z)" dur="2s" fill="freeze"/>
            <animate id="anim9" targetElement="rect9" attributeName="width" from="30" to="30" begin="indefinite" dur="1s" fill="freeze"/>
        </par>
    </body>
</smil>