1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/svg/tests/example.xml Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,227 @@
1.4 +<?xml version="1.0"?>
1.5 +<?xml-stylesheet href="svg.css" type="text/css"?>
1.6 +<!DOCTYPE svg SYSTEM "SVG-20000202.dtd" >
1.7 +<!--<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 10 January 2000//EN" -->
1.8 +<!-- "http://www.w3.org/Graphics/SVG/SVG-19991203.dtd"> -->
1.9 +<svg xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.svg"
1.10 + xmlns:html="http://www.w3.org/1999/xhtml">
1.11 +
1.12 + <html:script>
1.13 +<![CDATA[
1.14 +
1.15 +var gIsInit = false;
1.16 +var barXPnts = new Array();
1.17 +var barYPnts = new Array();
1.18 +
1.19 +var nodes = new Array();
1.20 +var gBarMax = 200;
1.21 +var gHeight = 80;
1.22 +var gBarCount = 10;
1.23 +var gBarDir = 1;
1.24 +var gGo = true;
1.25 +
1.26 +function init()
1.27 +{
1.28 + dump("----------------\n");
1.29 + nodes[0] = findNode(document.documentElement, "bar21");
1.30 + nodes[1] = findNode(document.documentElement, "bar22");
1.31 + nodes[2] = findNode(document.documentElement, "bar23");
1.32 + nodes[3] = findNode(document.documentElement, "bargrid21");
1.33 + nodes[4] = findNode(document.documentElement, "bargrid22");
1.34 + nodes[5] = findNode(document.documentElement, "bargrid23");
1.35 + dump("----------------\n");
1.36 + gGo = true;
1.37 + setTimeout("moveit()", 100);
1.38 +}
1.39 +function stop()
1.40 +{
1.41 + gGo = false;
1.42 +}
1.43 +function ChangeBar(name, height)
1.44 +{
1.45 + today = new Date();
1.46 + stime = today.getMilliseconds();
1.47 + dump("----------------\n");
1.48 + str = name+"1";
1.49 + node = findNode(document.documentElement, str);
1.50 + //node = document.getElementById(str);
1.51 + today = new Date();
1.52 + etime = today.getMilliseconds();
1.53 + dump("1----------------"+(etime-stime)+"\n");
1.54 + attr = document.createAttribute("points");
1.55 + attr.value = "30 " + height + " 30 210 50 210 50 " + height;
1.56 + node.attributes.setNamedItem(attr);
1.57 + today = new Date();
1.58 + stime = today.getMilliseconds();
1.59 + dump("2----------------"+(stime-etime)+"\n");
1.60 +
1.61 + str = name+"2";
1.62 + node = findNode(document.documentElement, str);
1.63 + dump("3----------------\n");
1.64 + attr.value = "30 " + height + " 50 " + height + " 60 " + (height-10) + " 40 " + (height-10);
1.65 + node.attributes.setNamedItem(attr);
1.66 + dump("4----------------\n");
1.67 +
1.68 + str = name+"3";
1.69 + node = findNode(document.documentElement, str);
1.70 + dump("5----------------\n");
1.71 + attr.value = "50 " + height + " 60 " + (height-10) + " 60 200 50 210";
1.72 + node.attributes.setNamedItem(attr);
1.73 + dump("=================\n");
1.74 +}
1.75 +
1.76 +function ChangeBarWithNodes(node1, node2, node3, height)
1.77 +{
1.78 + attr = document.createAttribute("points");
1.79 + attr.value = "30 " + height + " 30 210 50 210 50 " + height;
1.80 + node1.attributes.setNamedItem(attr);
1.81 +
1.82 + attr.value = "30 " + height + " 50 " + height + " 60 " + (height-10) + " 40 " + (height-10);
1.83 + node2.attributes.setNamedItem(attr);
1.84 +
1.85 + attr.value = "50 " + height + " 60 " + (height-10) + " 60 200 50 210";
1.86 + node3.attributes.setNamedItem(attr);
1.87 +}
1.88 +
1.89 +function moveit()
1.90 +{
1.91 + //ChangeBar("bar2", 150);
1.92 + //ChangeBar("bargrid2", 150);
1.93 +
1.94 + ChangeBarWithNodes(nodes[0], nodes[1], nodes[2], gHeight);
1.95 + ChangeBarWithNodes(nodes[3], nodes[4], nodes[5], gHeight);
1.96 +
1.97 + gHeight += gBarDir;
1.98 + gBarCount--;
1.99 + //dump("gHeight: "+gHeight+" gBarCount: "+gBarCount+" gBarDir: "+gBarDir+"\n");
1.100 + if (gHeight > gBarMax || gHeight < 1) {
1.101 + gBarDir *= -1;
1.102 + gBarCount = (Math.random() * 15)+3;
1.103 + //dump("Changining directions: "+gBarDir+"\n");
1.104 + if (gHeight > gBarMax) {
1.105 + gHeight = gBarMax;
1.106 + } else {
1.107 + gHeight = 1;
1.108 + }
1.109 + } else {
1.110 + if (gBarCount < 1) {
1.111 + gBarDir *= -1;
1.112 + gBarCount = (Math.random() * 15)+3;
1.113 + //dump("----> "+gBarCount+"\n");
1.114 + }
1.115 + }
1.116 + if (gGo) {
1.117 + setTimeout("moveit()", 100);
1.118 + }
1.119 +
1.120 +}
1.121 +
1.122 +function findNode(node, nodename)
1.123 +{
1.124 + var type = node.nodeType;
1.125 + if (type == Node.ELEMENT_NODE) {
1.126 +
1.127 + // open tag
1.128 + //dump("\<" + node.tagName);
1.129 +
1.130 + // dump the attributes if any
1.131 + attributes = node.attributes;
1.132 + if (null != attributes) {
1.133 + var countAttrs = attributes.length;
1.134 + var index = 0;
1.135 + while(index < countAttrs) {
1.136 + att = attributes[index];
1.137 + if (null != att) {
1.138 + //dump(" " + att.name + "=" + att.value+" ["+nodename+"]\n");
1.139 + if (att.name == "id" && att.value == nodename) {
1.140 + //dump("Found it!\n");
1.141 + return node;
1.142 + }
1.143 + }
1.144 + index++;
1.145 + }
1.146 + }
1.147 +
1.148 + // recursively dump the children
1.149 + if (node.hasChildNodes()) {
1.150 + // close tag
1.151 + //dump(">");
1.152 +
1.153 + // get the children
1.154 + var children = node.childNodes;
1.155 + var length = children.length;
1.156 + var count = 0;
1.157 + while(count < length) {
1.158 + child = children[count];
1.159 + fndNode = findNode(child, nodename);
1.160 + if (fndNode != null) {
1.161 + return fndNode;
1.162 + }
1.163 + count++;
1.164 + }
1.165 + //dump("</" + node.tagName + ">");
1.166 + } else {
1.167 + // close tag
1.168 + //dump("/>");
1.169 + }
1.170 +
1.171 +
1.172 + }
1.173 + // if it's a piece of text just dump the text
1.174 + else if (type == Node.TEXT_NODE) {
1.175 + //dump(node.data);
1.176 + }
1.177 + return null;
1.178 +}
1.179 +
1.180 +]]>
1.181 + </html:script>
1.182 +
1.183 + <g>
1.184 + <polyline x="55" y="10" id="bg" points="20 0 220 0 220 200 20 200"/>
1.185 + <polyline x="55" y="10" id="bg" points="20 0 20 200 0 220 0 20 0 20 20 0"/>
1.186 + <polyline x="55" y="10" id="bg" points="20 200 220 200 200 220 0 220"/>
1.187 +
1.188 + <polyline x="55" y="10" id="grid" points="20 0 220 0 220 200 20 200"/>
1.189 + <polyline x="55" y="10" id="grid" points="20 0 20 200 0 220 0 20 0 20"/>
1.190 + <polyline x="55" y="10" id="grid" points="20 200 220 200 200 220 0 220"/>
1.191 +
1.192 + <polyline x="55" y="10" id="grid" points="20 220 40 200 40 0"/>
1.193 + <polyline x="55" y="10" id="grid" points="40 220 60 200 60 0"/>
1.194 + <polyline x="55" y="10" id="grid" points="60 220 80 200 80 0"/>
1.195 + <polyline x="55" y="10" id="grid" points="80 220 100 200 100 0"/>
1.196 + <polyline x="55" y="10" id="grid" points="100 220 120 200 120 0"/>
1.197 + <polyline x="55" y="10" id="grid" points="120 220 140 200 140 0"/>
1.198 + <polyline x="55" y="10" id="grid" points="140 220 160 200 160 0"/>
1.199 + <polyline x="55" y="10" id="grid" points="160 220 180 200 180 0"/>
1.200 + <polyline x="55" y="10" id="grid" points="180 220 200 200 200 0"/>
1.201 +
1.202 + <polygon x="55" y="10" id="bar1" points="30 60 30 210 50 210 50 60"/>
1.203 + <polygon x="55" y="10" id="bar1" points="30 60 50 60 60 50 40 50"/>
1.204 + <polygon x="55" y="10" id="bar1" points="50 60 60 50 60 200 50 210"/>
1.205 +
1.206 + <polyline x="55" y="10" id="grid" points="30 60 30 210 50 210 50 60"/>
1.207 + <polyline x="55" y="10" id="grid" points="30 60 50 60 60 50 40 50"/>
1.208 + <polyline x="55" y="10" id="grid" points="50 60 60 50 60 200 50 210"/>
1.209 +
1.210 +
1.211 + <polygon x="95" y="10" id="bar21" points="30 80 30 210 50 210 50 80"/>
1.212 + <polygon x="95" y="10" id="bar22" points="30 80 50 80 60 70 40 70"/>
1.213 + <polygon x="95" y="10" id="bar23" points="50 80 60 70 60 200 50 210"/>
1.214 +
1.215 + <polyline x="95" y="10" id="bargrid21" points="30 80 30 210 50 210 50 80"/>
1.216 + <polyline x="95" y="10" id="bargrid22" points="30 80 50 80 60 70 40 70"/>
1.217 + <polyline x="95" y="10" id="bargrid23" points="50 80 60 70 60 200 50 210"/>
1.218 +
1.219 + <polygon x="400" y="20" id="rect" points="10 10 50 10 50 50"/>
1.220 + <polygon x="400" y="75" id="poly" points="10 10 50 10 50 50 45 70 32 32 80 20"/>
1.221 + <polyline x="400" y="150" id="poly" points="10 10 50 10 50 50 45 70 32 32 80 20"/>
1.222 +
1.223 + </g>
1.224 + <foreignobject>
1.225 + <html:div style="position:absolute;top:5px;left:385px;">Simple Polygons</html:div>
1.226 + <html:div style="position:absolute;top:240px;left:115px;">A Simple Graph</html:div>
1.227 + <html:input type="button" style="position:absolute;top:260px;left:350px;" onclick="init();" value="Start"/>
1.228 + <html:input type="button" style="position:absolute;top:260px;left:390px;" onclick="stop();" value="Stop"/>
1.229 + </foreignobject>
1.230 +</svg>
