Previous

Scripting

jstest.svg - Result


copyright_js.xml

<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="copyright.xsl"?>

<module>
<copyright>
	<copyrightline>Copyright 2000 by</copyrightline>
	<address><np>Manor Academy</np>
	<np>Sometown Street</np>
	<np>SOMEWHERE</np></address>
	<email id="emailad">admin@manor-academy.co.uk</email>
	<website id="webad">http://www.manor-academy.co.uk</website>
</copyright>
</module>


jstest.xsl - Extract


<xsl:template match="module">
  ...     
  function DoOnMouseOver( evt )
  {
    var el = getSVGDocument(evt.getTarget()).getElementById("<xsl:value-of select="copyright/email/@id"/>");
    var elw = getSVGDocument(evt.getTarget()).getElementById("<xsl:value-of select="copyright/website/@id"/>");
  
  ...
  }

  function DoOnMouseOut( evt )
  {
  ...
  }   
 
  ...
  <xsl:apply-templates />
  </svg>
</xsl:template>

...

<xsl:template match="address">
 <xsl:for-each select="np">
   <xsl:variable name="pos2" select="(position()*20)+30"/>
   <text x="20" y="{$pos2+20}" class="smallheading">
     <xsl:value-of select="."/>
   </text>
 </xsl:for-each>
</xsl:template>

<xsl:template match="email">
 <g onmouseover="DoOnMouseOver( evt )" onmouseout="DoOnMouseOut( evt )">
  <text x="10" y="140" class="normaltext" >
   <xsl:attribute name="id"><xsl:value-of select="@id"/></xsl:attribute>
   email: <a class="glossary" xmlns:xlink="http://www.w3.org/2000/xlink/namespace/">
   <xsl:attribute name="xlink:href">mailto:<xsl:value-of select="."/></xsl:attribute>
   <xsl:value-of select="."/></a>
  </text>
 </g>
</xsl:template>

<xsl:template match="website">
...
</xsl:template>

</xsl:stylesheet>


jstest.svg - Extract


function DoOnMouseOver( evt )
{
  var el = getSVGDocument(evt.getTarget()).getElementById("emailad");
  var elw = getSVGDocument(evt.getTarget()).getElementById("webad");
  
  if (evt.getTarget().getAttribute("id") == "emailad" )
     el.getStyle().setProperty("fill", "red");
  if (evt.getTarget().getAttribute("id") == "webad" )
     elw.getStyle().setProperty("fill", "red");
}

...

<g onmouseover="DoOnMouseOver( evt )" onmouseout="DoOnMouseOut( evt )">
  <text x="10" y="140" class="normaltext" id="emailad">
    email: <a class="glossary" xlink:href="mailto:admin@manor-academy.co.uk" xmlns:xlink="http://www.w3.org/2000/xlink/namespace/">admin@manor-academy.co.uk</a>
  </text>
</g>

...


</svg>

jstest.svg - Result


Previous