mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-29 21:25:35 +00:00
106 lines
3.3 KiB
HTML
106 lines
3.3 KiB
HTML
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
|
<head>
|
||
|
<title>Test for SMIL Restart Behavior </title>
|
||
|
<script type="text/javascript" src="/MochiKit/packed.js"></script>
|
||
|
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
||
|
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
|
||
|
</head>
|
||
|
<body>
|
||
|
<p id="display"></p>
|
||
|
<div id="content" style="display: none">
|
||
|
<svg id="svg" xmlns="http://www.w3.org/2000/svg" width="120px" height="120px">
|
||
|
<!-- These 3 circles only differ in their animation's "restart" value -->
|
||
|
<circle cx="20" cy="20" r="15" fill="blue">
|
||
|
<animate attributeName="cx" from="20" to="100" begin="0s" dur="4s"
|
||
|
restart="always" id="always" attributeType="XML"/>
|
||
|
</circle>
|
||
|
<circle cx="20" cy="60" r="15" fill="blue">
|
||
|
<animate attributeName="cx" from="20" to="100" begin="0s" dur="4s"
|
||
|
restart="whenNotActive" id="whenNotActive" attributeType="XML"/>
|
||
|
</circle>
|
||
|
<circle cx="20" cy="100" r="15" fill="blue">
|
||
|
<animate attributeName="cx" from="20" to="100" begin="0s" dur="4s"
|
||
|
restart="never" id="never" attributeType="XML"/>
|
||
|
</circle>
|
||
|
</svg>
|
||
|
</div>
|
||
|
<pre id="test">
|
||
|
<script class="testbody" type="text/javascript">
|
||
|
<![CDATA[
|
||
|
/** Test for SMIL Restart Behavior **/
|
||
|
|
||
|
/* Global Variables */
|
||
|
var dur = 4.0; // this must match the "dur" attribute on animations above.
|
||
|
var svg = document.getElementById("svg");
|
||
|
|
||
|
SimpleTest.waitForExplicitFinish();
|
||
|
|
||
|
// main: just triggers the first link in the chain of function-calls
|
||
|
function main() {
|
||
|
checkInitialState();
|
||
|
}
|
||
|
|
||
|
// Attempt a "beginElement" call on the given element, and
|
||
|
// complain if we don't get the expected return value.
|
||
|
// 'time' is only provided for better diagnostic output.
|
||
|
function tryRestartElem(id, time, expectedRetVal) {
|
||
|
var elem = document.getElementById(id);
|
||
|
var retVal = elem.beginElement();
|
||
|
is(retVal, expectedRetVal,
|
||
|
"Error restarting animation '" + id +
|
||
|
"' at time = " + time + ": " +
|
||
|
"expected return value of " + expectedRetVal +
|
||
|
", but got " + retVal + ".");
|
||
|
}
|
||
|
|
||
|
function checkInitialState() {
|
||
|
svg.setCurrentTime(0.0);
|
||
|
setTimeout('doCheckInitialState(0.0)', 0);
|
||
|
}
|
||
|
function doCheckInitialState(time) {
|
||
|
tryRestartElem('always', time, true);
|
||
|
tryRestartElem('whenNotActive', time, false);
|
||
|
tryRestartElem('never', time, false);
|
||
|
checkHalfwayState();
|
||
|
}
|
||
|
|
||
|
function checkHalfwayState() {
|
||
|
svg.setCurrentTime(0.5 * dur);
|
||
|
setTimeout('doCheckHalfwayState(0.5 * dur)', 0);
|
||
|
}
|
||
|
function doCheckHalfwayState(time) {
|
||
|
tryRestartElem('always', time, true);
|
||
|
tryRestartElem('whenNotActive', time, false);
|
||
|
tryRestartElem('never', time, false);
|
||
|
checkEndingState();
|
||
|
}
|
||
|
|
||
|
function checkEndingState() {
|
||
|
svg.setCurrentTime(dur);
|
||
|
setTimeout('doCheckEndingState(dur)', 0);
|
||
|
}
|
||
|
function doCheckEndingState(time) {
|
||
|
tryRestartElem('always', time, true);
|
||
|
tryRestartElem('whenNotActive', time, true);
|
||
|
tryRestartElem('never', time, false);
|
||
|
checkAfterEndingState();
|
||
|
}
|
||
|
|
||
|
function checkAfterEndingState() {
|
||
|
svg.setCurrentTime(dur * 3);
|
||
|
setTimeout('doCheckAfterEndingState(dur * 3)', 0);
|
||
|
}
|
||
|
function doCheckAfterEndingState(time) {
|
||
|
tryRestartElem('always', time, true);
|
||
|
tryRestartElem('whenNotActive', time, true);
|
||
|
tryRestartElem('never', time, false);
|
||
|
SimpleTest.finish();
|
||
|
}
|
||
|
|
||
|
window.addEventListener("load", main, false);
|
||
|
]]>
|
||
|
</script>
|
||
|
</pre>
|
||
|
</body>
|
||
|
</html>
|