SVGViewTests/w3c/1.2T/svg/script-handle-05-t.svg

<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.2" baseProfile="tiny" xml:id="svg-root" width="100%" height="100%"
  viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg"
  xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xe="http://www.w3.org/2001/xml-events">
  <!--======================================================================-->
  <!--=  Copyright 2008 World Wide Web Consortium, (Massachusetts          =-->
  <!--=  Institute of Technology, European Research Consortium for         =-->
  <!--=  Informatics and Mathematics (ERCIM), Keio University).            =-->
  <!--=  All Rights Reserved.                                              =-->
  <!--=  See http://www.w3.org/Consortium/Legal/.                          =-->
  <!--======================================================================-->
  <SVGTestCase xmlns="http://www.w3.org/2000/02/svg/testsuite/description/"
    reviewer="AE" owner="ED, VH" desc="This test validates scripting support by using a simple mouse event handler and manipulating the DOM with the ECMA binding DOM API." status="accepted"
    approved="yes"
    version="$Revision: 1.10 $" testname="$RCSfile: script-handle-05-t.svg,v $">
    <d:OperatorScript xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/" xmlns="http://www.w3.org/1999/xhtml">
      <p>Tests basic mouse event handler and DOM manipulation through ECMA script binding.</p>
      <p>The test uses ECMA Script and initially displays a target with a message asking the user to click on the target. Once the user has done so, and if both event handling and DOM manipulation are supported, then the target and initial text are hidden and a text message indicating that the test was successful is displayed.</p>
    </d:OperatorScript>
  </SVGTestCase>
  <title xml:id="test-title">$RCSfile: script-handle-05-t.svg,v $</title>
  <defs>
    <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F">
      <font-face-src>
        <font-face-uri xlink:href="../images/SVGFreeSans.svg#ascii" />
      </font-face-src>
    </font-face>
  </defs>
  <g xml:id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18">
    <!-- Displayed Title -->
    <text x="140" y="20" fill="black"> Event and DOM Access Test </text>
    <!-- When the user clicks on the "target" group, the onMouseClick should -->
    <!-- be invoked. That handler will hide the target and show a message -->
    <!-- indicating that the test passed. -->
    <g xml:id="targetGroup">
      <g xml:id="target">
        <handler xe:event="click">
          onMouseClick(evt);
        </handler>
        <text x="70" y="150">Click on target</text>
        <rect x="60" y="160" width="20" height="20" fill="white" stroke="none" />
        <line x1="60" y1="170" x2="80" y2="170" stroke-width=".5" stroke="black" />
        <line x1="70" y1="160" x2="70" y2="180" stroke-width=".5" stroke="black" />
      </g>
      <g xml:id="testPassed" visibility="hidden">
        <text x="70" y="170" fill="green" font-size="30" font-weight="bold">Scripting Test Passed!</text>
      </g>
    </g>
    <script type="text/ecmascript">
      <![CDATA[
      function onMouseClick(evt) {
        // Get Document
        var target = evt.target;
        var doc = target.ownerDocument;
        // Make test result visible
        var testPassed = doc.getElementById('testPassed');
        testPassed.setTrait('visibility', 'visible'); 
        // Make target invisible
        var target = doc.getElementById('target');
        target.setTrait('visibility', 'hidden');
      }
    ]]>
    </script>
  </g>
  <g font-family="SVGFreeSansASCII,sans-serif" font-size="32">
    <text xml:id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.10 $</text>
  </g>
  <rect xml:id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000" />
  <!-- comment out this watermark once the test is approved -->
  <!--<g xml:id="draft-watermark"> 
    <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1" /> 
    <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> 
  </g>-->
</svg>