summaryrefslogtreecommitdiffstats
path: root/share/extensions/tests/data/svg/inkwebjs-move.svg
diff options
context:
space:
mode:
Diffstat (limited to 'share/extensions/tests/data/svg/inkwebjs-move.svg')
-rw-r--r--share/extensions/tests/data/svg/inkwebjs-move.svg128
1 files changed, 128 insertions, 0 deletions
diff --git a/share/extensions/tests/data/svg/inkwebjs-move.svg b/share/extensions/tests/data/svg/inkwebjs-move.svg
new file mode 100644
index 0000000..b4aa50f
--- /dev/null
+++ b/share/extensions/tests/data/svg/inkwebjs-move.svg
@@ -0,0 +1,128 @@
+<svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ width="800" height="450">
+ <style type="text/css">
+ text { font-family:sans-serif; font-size:11px; text-anchor:middle; text-align:center }
+ .title tspan { font-weight: bold }
+ .pos { opacity: 0.3 }
+ .started { fill:#C80 }
+ </style>
+ <script type="text/javascript" xlink:href="../inkweb.js" />
+ <script type="text/javascript" xlink:href="inkweb-debug.js" />
+ <rect x="0%" y="0%" width="100%" height="100%" style="fill:#EEE; stroke:#999; stroke-width:4px" />
+
+ <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
+
+ <text id="test-1" x="125" y="26" class="title">
+ <tspan>Test 1</tspan> - from left to right </text>
+ <text class="pos" x="80" y="80"> Start </text>
+ <circle id="t1-start" cx="80" cy="50" r="20" fill="#C00" opacity="0.2" />
+ <text class="pos" x="170" y="80"> End </text>
+ <circle id="t1-end" cx="170" cy="50" r="20" fill="#C00" opacity="0.2" />
+ <!-- The element to move -->
+ <circle id="t1-elem" cx="80" cy="50" r="20" fill="#C00" />
+
+ <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
+
+ <text id="test-2" x="325" y="26" class="title">
+ <tspan>Test 2</tspan> - from right to left</text>
+ <text class="pos" x="370" y="80"> Start </text>
+ <circle id="t2-start" cx="370" cy="50" r="20" fill="#0A0" opacity="0.2" />
+ <text class="pos" x="280" y="80"> End </text>
+ <circle id="t2-end" cx="280" cy="50" r="20" fill="#0A0" opacity="0.2" />
+ <!-- The element to move -->
+ <circle id="t2-elem" cx="370" cy="50" r="20" fill="#0A0" />
+
+ <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
+
+ <text id="test-3" x="125" y="120" class="title">
+ <tspan>Test 3</tspan> - pre-translated </text>
+ <text class="pos" x="80" y="190"> Start </text>
+ <path id="t3-start" fill="#C00" opacity="0.2" transform="translate(30,10)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+ <text class="pos" x="170" y="190"> End </text>
+ <path id="t3-end" fill="#C00" opacity="0.2" transform="translate(120,10)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+ <!-- The element to move -->
+ <path id="t3-elem" fill="#C00" transform="translate(30,10)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+
+ <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
+
+ <text id="test-4" x="350" y="120" class="title">
+ <tspan>Test 4</tspan> - pre-translated and scaled </text>
+ <text class="pos" x="300" y="190"> Start </text>
+ <path id="t4-start" fill="#C00" opacity="0.2"
+ transform="translate(235,-45) scale(1.4)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+ <text class="pos" x="400" y="190"> End </text>
+ <path id="t4-end" fill="#C00" opacity="0.2"
+ transform="translate(335,-45) scale(1.4)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+ <!-- The element to move -->
+ <path id="t4-elem" fill="#C00"
+ transform="translate(235,-45) scale(1.4)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+
+ <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
+
+ <text id="test-5" x="600" y="120" class="title">
+ <tspan>Test 5</tspan> - pre-translated and rotated </text>
+ <text class="pos" x="550" y="190"> Start </text>
+ <path id="t5-start" fill="#C00" opacity="0.2"
+ transform="translate(500,0) rotate(-15 90 140)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+ <text class="pos" x="650" y="190"> End </text>
+ <path id="t5-end" fill="#C00" opacity="0.2"
+ transform="translate(600,0) rotate(-15 90 140)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+ <!-- The element to move -->
+ <path id="t5-elem" fill="#C00"
+ transform="translate(500,0) rotate(-15 90 140)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+
+ <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
+
+ <text id="test-6" x="125" y="220" class="title">
+ <tspan>Test 6</tspan> - with a transformation matrix </text>
+ <text class="pos" x="80" y="290"> Start </text>
+ <path id="t6-start" fill="#C00" opacity="0.2"
+ transform="matrix(1.2 0 -0.5 1.2 95 80)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+ <text class="pos" x="170" y="290"> End </text>
+ <path id="t6-end" fill="#C00" opacity="0.2"
+ transform="matrix(1.2 0 -0.5 1.2 185 80)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+ <!-- The element to move -->
+ <path id="t6-elem" fill="#C00"
+ transform="matrix(1.2 0 -0.5 1.2 95 80)"
+ d="M30,130 L60,130 L60,120 L70,140 L60,160 L60,150 L30,150" />
+
+ <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
+
+ <script type="text/javascript">
+
+ var titles = document.getElementsByClassName("title")
+ for ( var title,i=0; title=titles[i]; i++ ) {
+ title.className.baseVal += " started";
+ testeNum = title.id.replace( /^.*-/, "" );
+ var el = document.getElementById( "t"+testeNum+"-elem" );
+ var start = document.getElementById( "t"+testeNum+"-start" ).getBBox();
+ var end = document.getElementById( "t"+testeNum+"-end" ).getBBox();
+ InkWeb.moveElTo( { el:el, x:end.x, y:end.y } );
+ }
+
+ function testLog() {
+ try{ foo.lalala() }
+ catch(e){ InkWeb.log(e, "foo.lalala() is wrong?") }
+
+ InkWeb.log("This is a sequence log.");
+
+ InkWeb.log("warn", "Warning! Warning!!!");
+ }
+ setTimeout("testLog()", 2000);
+
+ </script>
+
+</svg>