<?xml version="1.0" encoding="UTF-8"?>
<!--======================================================================-->
<!--= Copyright 2004 World Wide Web Consortium, (Massachusetts =-->
<!--= Institute of Technology, Institut National de Recherche en =-->
<!--= Informatique et en Automatique, Keio University). All Rights =-->
<!--= Reserved. See http://www.w3.org/Consortium/Legal/. =-->
<!--======================================================================--><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Tiny//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-tiny.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="tiny" id="svg-root" width="100%" height="100%" viewBox="0 0 480 360">
<SVGTestCase xmlns:testcase="http://www.w3.org/2000/02/svg/testsuite/description/" xmlns="http://www.w3.org/2000/02/svg/testsuite/description/" reviewer="CN" owner="VH" desc="Basic test on the animation's fill attribute" status="accepted" version="$Revision: 1.7 $" testname="$RCSfile: animate-elem-70-t.svg,v $">
<OperatorScript>
<Paragraph>
This tests performs basic tests on the animation's SMIL fill attribute.
</Paragraph>
<Paragraph>
On the first row, the <set> animation has its dur
attribute set to '1s' and its begin attribute set to '0s;
firstSet.end + 1s'. The fill attribute is unspecified, so the
the effect is as if it was set to 'remove', because 'remove' is
the default value for fill.
Consequently, the first interval is (0s <= t < 1s), the second is
(2s <= t < 3s), the third, (4s <= t < 5s) etc.. The red rectangle starts on the
right position, moves to the left position for one second, moves
to the right for 1 second, and so on.
</Paragraph>
<Paragraph>
On the second row, the <set> animation has its dur attribute set to
1s and its begin attribute set to '0s; firstSet.end'. The fill attribute
is set to 'remove'. The behavior should be exactly the same as for the previous
row, and the rectangle moves from the right position to the left position
every second.
</Paragraph>
<Paragraph>
On the third row, the <set> animation has its dur attribute set to
1s and its begin attribute set to '0s; firstSet.end'. The fill attribute
is set to 'freeze'. The first interval should be (0s <= t < 1s), the second (2s <= t < 3s),
the third (4s <= t < 5s), etc. Between interval, the fill behavior should be applied,
so the red rectangle should stay on the right position and never go to the
left position.
</Paragraph>
<Paragraph>
On the fourth row, the <set> animation has its dur attribute set to
1s and its begin attribute set to '0s'. The fill attribute
is set to 'freeze'. The first interval should be (0s <= t < 1s) and there is no
following interval. Because of the fill behavior, the <set> should
apply the last (and only) animation value after 1s. Consequently, the
red rectangle should stay on the right position and never go to the
left position.
</Paragraph>
</OperatorScript>
</SVGTestCase>
<title id="test-title">$RCSfile: animate-elem-70-t.svg,v $</title>
<!--======================================================================-->
<!--Content of Test Case follows... =====================-->
<!--======================================================================-->
<text id="revision" x="10" y="340" font-size="40" stroke="none" fill="black">$Revision: 1.7 $</text>
<rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/>
<text text-anchor="middle" x="240" y="30" font-size="20">fill</text>
<g transform="translate(130, 60)">
<g transform="translate(120,45)" text-anchor="end" font-size="14">
<text>fill unspecified (remove)</text>
<text y="25">fill=remove</text>
<text y="100">fill=freeze (with restart)</text>
<text y="125">fill=freeze (no restart)</text>
</g>
<g id="timeMarkersText" transform="translate(180, 125)" text-anchor="middle" font-size="14">
<text y="-15">never</text>
<text>here</text>
<text y="-15" x="80">always</text>
<text x="80">here</text>
</g>
<g transform="translate(180,40)" stroke="black">
<defs>
<rect id="shadow" x="-6" y="-6" width="12" height="12" fill="#ccc" stroke="black" stroke-width="1"/>
</defs>
<g id="setOne">
<use xlink:href="#shadow" x="0"/>
<use xlink:href="#shadow" x="80"/>
<rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)">
<set id="firstSet" attributeName="x" to="74" begin="0s; firstSet.end + 1s" dur="1s"/>
</rect>
</g>
<g id="setTwo" transform="translate(0, 25)">
<use xlink:href="#shadow" x="0"/>
<use xlink:href="#shadow" x="80"/>
<rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)">
<set id="secondSet" attributeName="x" to="74" begin="0s; secondSet.end + 1s" dur="1s" fill="remove"/>
</rect>
</g>
<g id="setThree" transform="translate(0, 100)">
<use xlink:href="#shadow" x="0"/>
<use xlink:href="#shadow" x="80"/>
<rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)">
<set id="thirdSet" attributeName="x" to="74" begin="0s; thirdSet.end + 1s" dur="1s" fill="freeze"/>
</rect>
</g>
<g id="setFour" transform="translate(0, 125)">
<use xlink:href="#shadow" x="0"/>
<use xlink:href="#shadow" x="80"/>
<rect x="-6" y="-6" width="12" height="12" fill="rgb(204,0,102)">
<set id="fourthSet" attributeName="x" to="74" begin="0s" dur="1s" fill="freeze"/>
</rect>
</g>
</g>
</g>
<script>
// Pause the animation at t=0.
document.documentElement.pauseAnimations();
</script>
</svg>
Codebase Browser
chromium