summaryrefslogtreecommitdiffstats
path: root/layout/svg/tests
diff options
context:
space:
mode:
Diffstat (limited to 'layout/svg/tests')
-rw-r--r--layout/svg/tests/example.xml227
-rw-r--r--layout/svg/tests/svg.css33
2 files changed, 260 insertions, 0 deletions
diff --git a/layout/svg/tests/example.xml b/layout/svg/tests/example.xml
new file mode 100644
index 000000000..fb82a7bec
--- /dev/null
+++ b/layout/svg/tests/example.xml
@@ -0,0 +1,227 @@
+<?xml version="1.0"?>
+<?xml-stylesheet href="svg.css" type="text/css"?>
+<!DOCTYPE svg SYSTEM "SVG-20000202.dtd" >
+<!--<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 10 January 2000//EN" -->
+<!-- "http://www.w3.org/Graphics/SVG/SVG-19991203.dtd"> -->
+<svg xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.svg"
+ xmlns:html="http://www.w3.org/1999/xhtml">
+
+ <html:script>
+<![CDATA[
+
+var gIsInit = false;
+var barXPnts = new Array();
+var barYPnts = new Array();
+
+var nodes = new Array();
+var gBarMax = 200;
+var gHeight = 80;
+var gBarCount = 10;
+var gBarDir = 1;
+var gGo = true;
+
+function init()
+{
+ dump("----------------\n");
+ nodes[0] = findNode(document.documentElement, "bar21");
+ nodes[1] = findNode(document.documentElement, "bar22");
+ nodes[2] = findNode(document.documentElement, "bar23");
+ nodes[3] = findNode(document.documentElement, "bargrid21");
+ nodes[4] = findNode(document.documentElement, "bargrid22");
+ nodes[5] = findNode(document.documentElement, "bargrid23");
+ dump("----------------\n");
+ gGo = true;
+ setTimeout("moveit()", 100);
+}
+function stop()
+{
+ gGo = false;
+}
+function ChangeBar(name, height)
+{
+ today = new Date();
+ stime = today.getMilliseconds();
+ dump("----------------\n");
+ str = name+"1";
+ node = findNode(document.documentElement, str);
+ //node = document.getElementById(str);
+ today = new Date();
+ etime = today.getMilliseconds();
+ dump("1----------------"+(etime-stime)+"\n");
+ attr = document.createAttribute("points");
+ attr.value = "30 " + height + " 30 210 50 210 50 " + height;
+ node.attributes.setNamedItem(attr);
+ today = new Date();
+ stime = today.getMilliseconds();
+ dump("2----------------"+(stime-etime)+"\n");
+
+ str = name+"2";
+ node = findNode(document.documentElement, str);
+ dump("3----------------\n");
+ attr.value = "30 " + height + " 50 " + height + " 60 " + (height-10) + " 40 " + (height-10);
+ node.attributes.setNamedItem(attr);
+ dump("4----------------\n");
+
+ str = name+"3";
+ node = findNode(document.documentElement, str);
+ dump("5----------------\n");
+ attr.value = "50 " + height + " 60 " + (height-10) + " 60 200 50 210";
+ node.attributes.setNamedItem(attr);
+ dump("=================\n");
+}
+
+function ChangeBarWithNodes(node1, node2, node3, height)
+{
+ attr = document.createAttribute("points");
+ attr.value = "30 " + height + " 30 210 50 210 50 " + height;
+ node1.attributes.setNamedItem(attr);
+
+ attr.value = "30 " + height + " 50 " + height + " 60 " + (height-10) + " 40 " + (height-10);
+ node2.attributes.setNamedItem(attr);
+
+ attr.value = "50 " + height + " 60 " + (height-10) + " 60 200 50 210";
+ node3.attributes.setNamedItem(attr);
+}
+
+function moveit()
+{
+ //ChangeBar("bar2", 150);
+ //ChangeBar("bargrid2", 150);
+
+ ChangeBarWithNodes(nodes[0], nodes[1], nodes[2], gHeight);
+ ChangeBarWithNodes(nodes[3], nodes[4], nodes[5], gHeight);
+
+ gHeight += gBarDir;
+ gBarCount--;
+ //dump("gHeight: "+gHeight+" gBarCount: "+gBarCount+" gBarDir: "+gBarDir+"\n");
+ if (gHeight > gBarMax || gHeight < 1) {
+ gBarDir *= -1;
+ gBarCount = (Math.random() * 15)+3;
+ //dump("Changining directions: "+gBarDir+"\n");
+ if (gHeight > gBarMax) {
+ gHeight = gBarMax;
+ } else {
+ gHeight = 1;
+ }
+ } else {
+ if (gBarCount < 1) {
+ gBarDir *= -1;
+ gBarCount = (Math.random() * 15)+3;
+ //dump("----> "+gBarCount+"\n");
+ }
+ }
+ if (gGo) {
+ setTimeout("moveit()", 100);
+ }
+
+}
+
+function findNode(node, nodename)
+{
+ var type = node.nodeType;
+ if (type == Node.ELEMENT_NODE) {
+
+ // open tag
+ //dump("\<" + node.tagName);
+
+ // dump the attributes if any
+ attributes = node.attributes;
+ if (null != attributes) {
+ var countAttrs = attributes.length;
+ var index = 0;
+ while(index < countAttrs) {
+ att = attributes[index];
+ if (null != att) {
+ //dump(" " + att.name + "=" + att.value+" ["+nodename+"]\n");
+ if (att.name == "id" && att.value == nodename) {
+ //dump("Found it!\n");
+ return node;
+ }
+ }
+ index++;
+ }
+ }
+
+ // recursively dump the children
+ if (node.hasChildNodes()) {
+ // close tag
+ //dump(">");
+
+ // get the children
+ var children = node.childNodes;
+ var length = children.length;
+ var count = 0;
+ while(count < length) {
+ child = children[count];
+ fndNode = findNode(child, nodename);
+ if (fndNode != null) {
+ return fndNode;
+ }
+ count++;
+ }
+ //dump("</" + node.tagName + ">");
+ } else {
+ // close tag
+ //dump("/>");
+ }
+
+
+ }
+ // if it's a piece of text just dump the text
+ else if (type == Node.TEXT_NODE) {
+ //dump(node.data);
+ }
+ return null;
+}
+
+]]>
+ </html:script>
+
+ <g>
+ <polyline x="55" y="10" id="bg" points="20 0 220 0 220 200 20 200"/>
+ <polyline x="55" y="10" id="bg" points="20 0 20 200 0 220 0 20 0 20 20 0"/>
+ <polyline x="55" y="10" id="bg" points="20 200 220 200 200 220 0 220"/>
+
+ <polyline x="55" y="10" id="grid" points="20 0 220 0 220 200 20 200"/>
+ <polyline x="55" y="10" id="grid" points="20 0 20 200 0 220 0 20 0 20"/>
+ <polyline x="55" y="10" id="grid" points="20 200 220 200 200 220 0 220"/>
+
+ <polyline x="55" y="10" id="grid" points="20 220 40 200 40 0"/>
+ <polyline x="55" y="10" id="grid" points="40 220 60 200 60 0"/>
+ <polyline x="55" y="10" id="grid" points="60 220 80 200 80 0"/>
+ <polyline x="55" y="10" id="grid" points="80 220 100 200 100 0"/>
+ <polyline x="55" y="10" id="grid" points="100 220 120 200 120 0"/>
+ <polyline x="55" y="10" id="grid" points="120 220 140 200 140 0"/>
+ <polyline x="55" y="10" id="grid" points="140 220 160 200 160 0"/>
+ <polyline x="55" y="10" id="grid" points="160 220 180 200 180 0"/>
+ <polyline x="55" y="10" id="grid" points="180 220 200 200 200 0"/>
+
+ <polygon x="55" y="10" id="bar1" points="30 60 30 210 50 210 50 60"/>
+ <polygon x="55" y="10" id="bar1" points="30 60 50 60 60 50 40 50"/>
+ <polygon x="55" y="10" id="bar1" points="50 60 60 50 60 200 50 210"/>
+
+ <polyline x="55" y="10" id="grid" points="30 60 30 210 50 210 50 60"/>
+ <polyline x="55" y="10" id="grid" points="30 60 50 60 60 50 40 50"/>
+ <polyline x="55" y="10" id="grid" points="50 60 60 50 60 200 50 210"/>
+
+
+ <polygon x="95" y="10" id="bar21" points="30 80 30 210 50 210 50 80"/>
+ <polygon x="95" y="10" id="bar22" points="30 80 50 80 60 70 40 70"/>
+ <polygon x="95" y="10" id="bar23" points="50 80 60 70 60 200 50 210"/>
+
+ <polyline x="95" y="10" id="bargrid21" points="30 80 30 210 50 210 50 80"/>
+ <polyline x="95" y="10" id="bargrid22" points="30 80 50 80 60 70 40 70"/>
+ <polyline x="95" y="10" id="bargrid23" points="50 80 60 70 60 200 50 210"/>
+
+ <polygon x="400" y="20" id="rect" points="10 10 50 10 50 50"/>
+ <polygon x="400" y="75" id="poly" points="10 10 50 10 50 50 45 70 32 32 80 20"/>
+ <polyline x="400" y="150" id="poly" points="10 10 50 10 50 50 45 70 32 32 80 20"/>
+
+ </g>
+ <foreignobject>
+ <html:div style="position:absolute;top:5px;left:385px;">Simple Polygons</html:div>
+ <html:div style="position:absolute;top:240px;left:115px;">A Simple Graph</html:div>
+ <html:input type="button" style="position:absolute;top:260px;left:350px;" onclick="init();" value="Start"/>
+ <html:input type="button" style="position:absolute;top:260px;left:390px;" onclick="stop();" value="Stop"/>
+ </foreignobject>
+</svg>
diff --git a/layout/svg/tests/svg.css b/layout/svg/tests/svg.css
new file mode 100644
index 000000000..358811af7
--- /dev/null
+++ b/layout/svg/tests/svg.css
@@ -0,0 +1,33 @@
+
+polygon {
+ color: black;
+}
+
+polygon[id="grid"] {
+ color: black;
+}
+
+polygon[id="bar1"] {
+ color: green;
+}
+
+polygon[id="rect"] {
+ color: blue;
+}
+
+polygon[id="bg"] {
+ color: #DDDDDD;
+}
+
+polygon[id="bar21"], polygon[id="bar22"], polygon[id="bar23"] {
+ color: #6F00DD;
+}
+
+polygon[id="bargrid21"], polygon[id="bargrid22"], polygon[id="bargrid23"] {
+ color: black;
+}
+
+polygon[id="poly"] {
+ color: #c0d0f0;
+}
+