<PUBLIC:COMPONENT tagName="svg" >
<PUBLIC:DEFAULTS viewLinkContent />
<PUBLIC:PROPERTY name="width" />
<PUBLIC:PROPERTY name="height" />
<ATTACH event="oncontentready" onevent="init()" />
</PUBLIC:COMPONENT>

<SCRIPT LANGUAGE="JavaScript">

function updatePeerElement()
{
	var newElement = this.svgPeer;
	var name = this.svgPeer.getNodeName();
	var p = this;
	var attrNames = attrList[name];
	if( attrNames != null )
	{
		var i;
		for( i = 0 ; i < attrNames.length ; i++ )
		{
			var n = attrNames[i];
			var v = p[n];
			if( n == "style" )
				v = v.cssText;
			if( v != null )
				newElement.setAttribute( n, v );
		}
	}
}

var nameTranslator = new Object();

var attrList = {
		g:["style","transform"],
		path:["d","style","transform"],
		rect:["style","x","y","width","height","rx","ry","transform"],
		ellipse:["style","cx","cy","rx","ry","transform"],
		text:["style","x","y","transform",""],
		filter:["id","x","y","width","height","filterUnits"],
		feTurbulence:["baseFrequency","numOctaves","result"],
		feMerge:["result"],
		feMergeNode:["in"],
		feGaussianBlur:["in","stdDeviation","result"],
		feDisplacementMap:["in","in2","scale","xChannelSelector","yChannelSelector","result"],
		feOffset:["in","dx","dy","result"],
		feMorphology:["in","radius","operator","result"],
		feComponentTransfer:["in","result"],
		feFuncA:["type","slope","intercept","tableValues","amplitude","exponent","offset"],
		feFuncR:["type","slope","intercept","tableValues","amplitude","exponent","offset"],
		feFuncG:["type","slope","intercept","tableValues","amplitude","exponent","offset"],
		feFuncB:["type","slope","intercept","tableValues","amplitude","exponent","offset"],
		feComposite:["in","in2","operator","k1","k2","k3","k4","result"],
		feDiffuseLighting:["in","style","resultScale","surfaceScale","diffuseConstant","lightColor","result"],
		feDistantLight:["azimuth","elevation"],
		fePointLight:["x","y","z"],
		feSpotLight:["x","y","z","pointsAtX","pointsAtY","pointsAtZ","specularExponent"],
		feSpecularLighting:["in","style","specularConstant","specularExponent","surfaceScale","lightColor","result"],
		feFlood:["style","result"],
		linearGradient:["id","x1","y1","x2","y2","gradientUnits"],
		radialGradient:["id","cx","cy","r","gradientUnits"],
		stop:["offset","style"]
};

var q;
for( q in attrList )
{
	nameTranslator[q.toUpperCase()] = q;
}

function copyXMLTree( fromElement, toElement, doc )
{
	var p;
	for( p = fromElement.firstChild ; p != null ; p = p.nextSibling )
	{
		switch( p.nodeType )
		{
		case 1 : // element
			{
				var name = p.nodeName;
				var ci = name.lastIndexOf( ":" );
				if( ci >= 0 )
					name = name.substring(ci+1);
				var t = nameTranslator[name];
				if( t != null )
					name = t;
				var newElement = doc.createElement( name );
				copyXMLTree( p, newElement, doc );
				toElement.appendChild( newElement );
				p.svgPeer = newElement;
				p.svgStyle = newElement.style;
				p.onpropertychange = updatePeerElement;
			}
			break;
		case 3 : // text
			{
				var newNode = doc.createTextNode( p.data );
				toElement.appendChild( newNode  );
			}
			break;
		}
	}
}

function init()
{
	if(element.width)
		svgEmbed.width = element.width;
	if(element.height)
		svgEmbed.height = element.height;
	var doc = svgEmbed.getSVGDocument();
	var svg = doc.getFirstChild();
	svg.style.setProperty( "display", "none" );
	copyXMLTree( element, svg, doc );
	svg.style.setProperty( "display", "inline" );
}

</SCRIPT>

<BODY style="width:100%; height:100%">
<EMBED id="svgEmbed" WIDTH="300" HEIGHT="300" SRC="dummy.svg">
</EMBED>

</BODY>


