ZVON > References > Zvon Example Repository
Example repository: index | categories | search

All > SVG > DOM > dom-eventListener-BE-04


File: dom-eventListener-BE-04
Author: Vincent Hardy
Origin: W3C SVG conformance suite

Rendered imageSVG source
ElementsAttributes
axlink:href |
descid |
gid | style |
pathd | style |
rectheight | id | style | width | x | y |
scripttype |
svgheight | id | onload | width |
textstyle | x | y |
titleid |

Source

<svg id="svg-root" width="450" height="450" onload="initTest(evt)" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" >
     <title id="test-title">dom-eventListener-BE-04</title>
     <desc id="test-desc">Checks if DOM/ECMA Script binding is supported. Checks that the DOM API supports event listener registration/unregistration.</desc>
     <g id="test-body-content">
          <script type="text/ecmascript">
		
    var svg_ns = "http://www.w3.org/2000/svg"
		var doc;
		var content;
		var startButton;
		var buttonRect;
    var yLocation = 100;
		//
		// onload handler for top level svg element. Sets a UI event listener for
		// the test start button.
		//
		function initTest(evt){
			// Get Document
    	var target = evt.target;
			doc = target.ownerDocument;
			content = doc.getElementById("test-body-content");

			// Get start rect and add a UI listener
			startButton = doc.getElementById("startButton");
			buttonRect = doc.getElementById("buttonRect");
			startButton.addEventListener("click", uiEventDetected, false);
		}

		//
		// click handler for 'startButton' rect element.
		//
    function uiEventDetected(evt) {
			//
			// Add an element to show that UI event was detected
			//
			var newText = doc.createElementNS(svg_ns, 'text');
			newText.setAttribute('x', '50');
			newText.setAttribute('y', yLocation);
			var message = "UI Event Listeners supported";
			var textContent = doc.createTextNode(message);
			newText.appendChild(textContent);
			content.appendChild(newText);

			startButton.removeEventListener("click", uiEventDetected, false);

			// Make start button pink
			buttonRect.setAttribute("style", "fill:#ff8888; stroke:black;");		

      // If test does not successfully remove the event listener, then
      // a second click will cause a subsequent text string to appear 50 units
      // below the first new text string.
      yLocation = yLocation + 50;	
    }

	
</script>
          <g id="startButton">
               <rect id="buttonRect" x="10" y="50" width="80" height="20" style="fill:#dddddd;stroke:black;"/>
               <text x="15" y="65">Start Test</text>
          </g>
     </g>
     <g id="test-legend" style="fill:black;font-family:Helvetica;font-size:10;">
          <rect x="10" y="390" width="275" height="50" style="fill:none;stroke:#000000;"/>
          <path style="fill:none;stroke:#000000;" d="M10 405 h275 M205 405 v35 M10 426 h195 M205 422 h80"/>
          <text x="25" y="401">Scalable Vector Graphics (SVG) Conformance Suite</text>
          <a xlink:href="copyright-documents-19990405.html">
               <text x="12" y="437" style="fill:blue;"> Copyright 2000 W3C. All Rights Reserved. </text>
          </a>
          <text style="font-size:12;" x="35" y="420">dom-eventListener-BE-04</text>
          <text style="font-size:10;" x="210" y="417">$Revision: 1.1 $</text>
          <text style="font-size:10;" x="210" y="435">Release 2.0</text>
          <rect id="test-frame" x="1" y="1" width="448" height="448" style="fill:none;stroke:#000000;"/>
     </g>
</svg>



Sponsored links: conference call service, VoIP Internettelefonie, DSL, SDSL, ADSL, answering service