summaryrefslogtreecommitdiffstats
path: root/layout/reftests/svg/smil/transform/skew-1.svg
diff options
context:
space:
mode:
Diffstat (limited to 'layout/reftests/svg/smil/transform/skew-1.svg')
-rw-r--r--layout/reftests/svg/smil/transform/skew-1.svg86
1 files changed, 86 insertions, 0 deletions
diff --git a/layout/reftests/svg/smil/transform/skew-1.svg b/layout/reftests/svg/smil/transform/skew-1.svg
new file mode 100644
index 0000000000..603c7f4025
--- /dev/null
+++ b/layout/reftests/svg/smil/transform/skew-1.svg
@@ -0,0 +1,86 @@
+<svg xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ class="reftest-wait"
+ onload="setTimeAndSnapshot(101, true)">
+ <script xlink:href="../smil-util.js" type="text/javascript"/>
+ <defs>
+ <g id="smiley">
+ <circle fill="yellow" stroke="black" stroke-width="2" cx="0" cy="0"
+ r="40"/>
+ <circle fill="white" stroke="black" stroke-width="1" cx="-14" cy="-14"
+ r="14"/>
+ <circle fill="white" stroke="black" stroke-width="1" cx="14" cy="-14"
+ r="14"/>
+ <circle cx="-10" cy="-14" r="4"/>
+ <circle cx="10" cy="-14" r="4"/>
+ <path d="m-11 14a13,13 0 0,0 22,0" fill="none" stroke="black"/>
+ </g>
+ </defs>
+ <!-- from-to animation -->
+ <g transform="translate(50 50)">
+ <use xlink:href="#smiley">
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewX" fill="freeze" from="-30" to="90" begin="100s" dur="2s"/>
+ </use>
+ </g>
+ <!-- from-by animation -->
+ <g transform="translate(150 50)">
+ <use xlink:href="#smiley">
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewX" fill="freeze" from="60" by="-60" begin="100s" dur="2s"/>
+ </use>
+ </g>
+ <!-- by animation -->
+ <g transform="translate(250 50) skewX(-15)">
+ <use xlink:href="#smiley" transform="skewX(15)">
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewX" fill="freeze" by="60" begin="100s" dur="2s"/>
+ </use>
+ </g>
+ <!-- to animation -->
+ <g transform="translate(50 150)">
+ <use xlink:href="#smiley" transform="skewX(15)">
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewX" fill="freeze" to="45" begin="100s" dur="2s"/>
+ </use>
+ </g>
+ <!-- values animation -->
+ <g transform="translate(150 150)">
+ <use xlink:href="#smiley">
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewX" fill="freeze" values="10; 40; 20; 60" begin="100s" dur="2s"/>
+ </use>
+ </g>
+ <!-- additive -->
+ <g transform="translate(250 150)">
+ <use xlink:href="#smiley" transform="skewY(-30)">
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewY" fill="freeze" to="30" begin="100s" dur="2s"/>
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewX" fill="freeze" from="-30" to="90" begin="100s" dur="2s" additive="sum"/>
+ </use>
+ </g>
+ <!-- accumulate: none -->
+ <g transform="translate(50 250)">
+ <use xlink:href="#smiley">
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewX" fill="freeze" from="20" to="50" begin="100s" dur="0.75s"
+ repeatCount="3"/>
+ </use>
+ </g>
+ <!-- accumulate: sum -->
+ <g transform="translate(150 250)">
+ <use xlink:href="#smiley">
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewX" fill="freeze" from="0" to="22.5" begin="100s" dur="0.75"
+ accumulate="sum" repeatCount="3"/>
+ </use>
+ </g>
+ <!-- angles > 360 -->
+ <g transform="translate(250 250)">
+ <use xlink:href="#smiley">
+ <animateTransform attributeName="transform" attributeType="XML"
+ type="skewX" fill="freeze" from="-690" to="750" begin="100s" dur="2s"/>
+ </use>
+ </g>
+</svg>