changeset 1010:45290696a438

add new html mockups Ignore-this: 6f4c1701a5a9f378217d513ee88368a0
author drewp@bigasterisk.com
date Sat, 26 Apr 2014 17:48:21 +0000
parents ba47676dde49
children 78690efc866c
files www/mockup/curveedit.html www/mockup/effectmockup.svg www/mockup/effectpreview.html www/mockup/inputmapping.html
diffstat 4 files changed, 813 insertions(+), 0 deletions(-) [+]
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/www/mockup/curveedit.html	Sat Apr 26 17:48:21 2014 +0000
@@ -0,0 +1,96 @@
+<!doctype html>
+<html>
+  <head>
+    <title></title>
+    <meta charset="utf-8" />
+    <style>
+    body {
+ font-family: sans;
+        font-size: 8px;
+        }
+a {
+    color: #aff;
+    }
+      canvas {
+       
+     }
+.curveRow {
+border-top: 1px solid rgb(185, 185, 185);
+background: rgb(75, 75, 75);
+    }
+    </style>
+  </head>
+  <body>
+
+    <div>
+    Editing song: [song1] unlink Player is on song [song2] [x] follow player
+    </div>
+
+    <div>
+    timeline
+      <div>
+  0 10 20 30 40 50 60 70 80 90 100 110 120
+      </div>
+
+      <div id="sampleCurveRow">
+        <div class="curveRow"> <a href="#">curve1</a> <canvas></canvas> </div>
+      </div>
+      <script src="/lib/jquery-2.0.3.min.js"></script>
+      <script type="text/javascript">
+    window.onload = function () {
+        var row = $("#sampleCurveRow");
+        for (var i=0; i<50; i++) {
+            row.parent().append(row.clone());
+        }
+        var expandNear = 0;
+        var animating = false;
+        function redrawAll() {
+            $("canvas").each(function (i, canvas) {
+                canvas.width = 900;
+                var near = Math.abs(Math.round(expandNear / 20) - i);
+                canvas.height = Math.max(10, Math.min(150, 30 / near ));
+                
+                var ctx = canvas.getContext('2d');
+                ctx.strokeStyle = 'white';
+                ctx.strokeWidth = 3;
+                var _rand = i * 13763;
+                var rand = function() {
+                    _rand = (_rand * 64874) % 7646;
+                    return (_rand % 1000) / 1000;
+                };
+                var ww = Math.pow(rand(), 3) * 900;
+                var t = (+new Date() / 1000);
+                var pts = [];
+                var zoom = animating ? (.6 + 4 * (Math.sin(t) + 1)) : 1;
+                for (var x = 0; x < 900; x += Math.max(1, ww * Math.pow(rand(), 2))) {
+                    var x2 = x * zoom;
+
+                    var y = rand();
+                    if (rand() > .8) {
+                        y = 0;
+                    }
+                    pts.push([x2, canvas.height * (1 - y)]);
+                }
+                ctx.beginPath();
+                ctx.moveTo(0, canvas.height);
+                pts.forEach(function (pt) {
+                    ctx.lineTo(pt[0], pt[1]);
+                });
+                ctx.lineTo(canvas.width, canvas.height);
+                ctx.fill();
+            });
+        }
+        var loop = function () {
+            redrawAll();
+            setTimeout(loop, 50);
+        };
+        redrawAll();
+        $('body').click(function() { animating = true; loop(); });
+        $('body').mousemove(function (ev) {
+            expandNear = ev.pageY;
+            redrawAll();
+        });
+    };
+    </script>
+  </body>
+</html>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/www/mockup/effectmockup.svg	Sat Apr 26 17:48:21 2014 +0000
@@ -0,0 +1,313 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="744.09448819"
+   height="1052.3622047"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.48.4 r9939"
+   sodipodi:docname="effectmockup.svg">
+  <defs
+     id="defs4">
+    <marker
+       inkscape:stockid="Arrow2Mend"
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="Arrow2Mend"
+       style="overflow:visible;">
+      <path
+         id="path3881"
+         style="fill-rule:evenodd;stroke-width:0.62500000;stroke-linejoin:round;"
+         d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z "
+         transform="scale(0.6) rotate(180) translate(0,0)" />
+    </marker>
+    <marker
+       inkscape:stockid="Arrow1Mend"
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="Arrow1Mend"
+       style="overflow:visible;">
+      <path
+         id="path3863"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1.0pt;"
+         transform="scale(0.4) rotate(180) translate(10,0)" />
+    </marker>
+    <marker
+       inkscape:stockid="Arrow1Lend"
+       orient="auto"
+       refY="0.0"
+       refX="0.0"
+       id="Arrow1Lend"
+       style="overflow:visible;">
+      <path
+         id="path3857"
+         d="M 0.0,0.0 L 5.0,-5.0 L -12.5,0.0 L 5.0,5.0 L 0.0,0.0 z "
+         style="fill-rule:evenodd;stroke:#000000;stroke-width:1.0pt;"
+         transform="scale(0.8) rotate(180) translate(12.5,0)" />
+    </marker>
+    <linearGradient
+       id="linearGradient3816">
+      <stop
+         style="stop-color:#000000;stop-opacity:1;"
+         offset="0"
+         id="stop3818" />
+      <stop
+         id="stop3824"
+         offset="0.5"
+         style="stop-color:#da6bd5;stop-opacity:1;" />
+      <stop
+         style="stop-color:#4abdc7;stop-opacity:0.875;"
+         offset="0.75"
+         id="stop3826" />
+      <stop
+         id="stop3828"
+         offset="0.875"
+         style="stop-color:#8ddb3f;stop-opacity:0.83620691;" />
+      <stop
+         style="stop-color:#000000;stop-opacity:0;"
+         offset="1"
+         id="stop3820" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient3816"
+       id="linearGradient3822"
+       x1="157.0838"
+       y1="608.90521"
+       x2="479.31232"
+       y2="608.90521"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="translate(114.28571,172.85714)" />
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.77245895"
+     inkscape:cx="400.81482"
+     inkscape:cy="309.02614"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     inkscape:window-width="1160"
+     inkscape:window-height="971"
+     inkscape:window-x="1"
+     inkscape:window-y="52"
+     inkscape:window-maximized="0" />
+  <metadata
+     id="metadata7">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <text
+       xml:space="preserve"
+       style="font-size:96.21405029px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;opacity:0.26254829;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Sans"
+       x="1460.2559"
+       y="147.97874"
+       id="text2997"
+       sodipodi:linespacing="125%"
+       transform="scale(0.20786986,4.8107023)"><tspan
+         sodipodi:role="line"
+         id="tspan2999"
+         x="1460.2559"
+         y="147.97874">|  |  |  |  |  |  |  |  |  |  |  |  </tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:29.29896545px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Sans"
+       x="116.62979"
+       y="293.71292"
+       id="text2985"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan2987"
+         x="116.62979"
+         y="293.71292">effect chase1</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:20px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Sans"
+       x="304.28571"
+       y="339.50504"
+       id="text2989"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan2991"
+         x="304.28571"
+         y="339.50504">0  10  20  30  40  50</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:20px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Sans;opacity:0.68725869"
+       x="242.6721"
+       y="371.69269"
+       id="text2993"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan2995"
+         x="242.6721"
+         y="371.69269">beat</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:20px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Sans"
+       x="124.10067"
+       y="444.66876"
+       id="text3001"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan3003"
+         x="124.10067"
+         y="444.66876">hue = nsin(t * .5)</tspan></text>
+    <path
+       style="fill:#000000;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;color:#000000;fill-opacity:1;fill-rule:nonzero;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
+       d="m 303.63794,484.95062 c -10.15825,-18.53903 28.18258,-32.21348 21.92744,-8.95423 9.81138,15.38603 19.51486,-22.69463 25.12928,0.84982 9.4897,22.23503 12.22318,-22.24126 27.30901,-6.91374 3.0461,7.09265 3.22174,24.42971 15.07276,12.40672 3.42402,-8.16123 3.81986,-28.84715 16.19008,-15.71016 -1.06924,16.00399 16.0183,29.16704 22.02438,8.59332 4.59999,-13.3056 14.29956,-6.97185 13.78929,4.0917 17.22871,21.9799 16.74817,-32.87409 31.91744,-8.52412 -2.06569,23.39567 32.27633,20.80448 32.03859,-0.37583 20.38958,-16.71462 9.12184,13.47994 16.74058,20.34532 z"
+       id="path3005"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccccccccccc" />
+    <text
+       xml:space="preserve"
+       style="font-size:20px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Sans"
+       x="120.52785"
+       y="751.17059"
+       id="text3042"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan3044"
+         x="120.52785"
+         y="751.17059">color = fromhsv(hue, 1 , val)</tspan></text>
+    <rect
+       style="opacity:0.66409266;color:#000000;fill:url(#linearGradient3822);fill-opacity:1;stroke:#7f7f7f;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
+       id="rect3046"
+       width="321.22852"
+       height="30.304577"
+       x="271.86951"
+       y="766.61005" />
+    <path
+       style="fill:#000000;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;fill-opacity:1"
+       d="m 288.56422,695.09229 c 27.62079,-0.18655 70.8815,1.07516 73.74113,-3.03046 0.33672,0 0.70899,-0.15059 1.01015,0 0.42592,0.21296 0.58424,0.79719 1.01016,1.01015 0.40051,0.20026 2.82394,-0.20651 3.03045,0 0.2381,0.2381 -0.33671,1.01015 0,1.01015 0.4762,0 0.67344,-1.34687 1.01016,-1.01015 0.33671,0.33672 -1.34687,1.34687 -1.01016,1.01015 1.01016,-1.01015 2.29547,-1.80546 3.03046,-3.03045 0.34648,-0.57747 -0.21296,-1.38143 0,-2.02031 0.15059,-0.45175 0.7972,-0.58423 1.01016,-1.01015 0.15058,-0.30117 -0.0817,-0.68349 0,-1.01015 0.25825,-1.03301 0.80132,-1.98634 1.01015,-3.03046 0.13207,-0.66036 -0.21296,-1.38143 0,-2.02031 0.15058,-0.45175 0.79719,-0.58423 1.01015,-1.01015 0.32057,-0.64114 -0.32749,-4.72327 0,-5.05076 0.2381,-0.2381 0.77206,0.23809 1.01015,0 0.2381,-0.2381 0.33672,-1.01015 0,-1.01015 -0.47619,0 -1.48634,1.01015 -1.01015,1.01015 0.75292,0 1.26738,-1.01015 2.02031,-1.01015 0.33671,0 -0.33672,1.01015 0,1.01015 1.06479,0 1.99745,-0.7519 3.03045,-1.01015 1.18908,-0.29727 1.19246,0.1823 2.02031,1.01015 0.33672,0.33672 0.74601,0.61394 1.01015,1.01015 1.31132,1.96698 1.01015,1.85382 1.01015,4.04061 0,0.33672 -0.33671,-1.01015 0,-1.01015 0.33672,0 -0.15058,1.31132 0,1.01015 3.05054,-6.10108 -0.14561,-0.42769 1.01016,-5.05076 0.18261,-0.73044 0.82754,-1.28986 1.01015,-2.02031 0.16333,-0.65332 -0.30117,-1.41796 0,-2.0203 0.15058,-0.30117 0.67343,0 1.01015,0 0.24499,0 2.99797,-0.0325 3.03046,0 1.23035,1.23035 0.47318,2.25689 2.0203,3.03046 0.30117,0.15058 0.67344,0 1.01016,0 2.61758,0 -0.36274,-0.64742 2.0203,-3.03046 0.2381,-0.2381 0.67344,0 1.01015,0 0.33672,0 1.01016,-0.33672 1.01016,0 0,0.33672 -1.34687,0 -1.01016,0 0.67344,0 1.54412,-0.47619 2.02031,0 0.47619,0.47619 -0.30117,1.41797 0,2.0203 0.15058,0.30117 0.82337,-0.28016 1.01015,0 0.64855,0.97282 1.7958,6.39755 2.02031,7.07107 0.23809,0.71429 0.73052,1.32123 1.01015,2.02031 0.33672,1.01015 0.67343,2.0203 1.01015,3.03045 0.33672,0.33672 0.7972,0.58424 1.01015,1.01016 0.15059,0.30117 -0.18677,1.29032 0,1.01015 0.8353,-1.25294 1.24556,-2.74936 2.02031,-4.04061 0.245,-0.40833 0.79719,-0.58424 1.01015,-1.01015 0.15059,-0.30117 -0.23809,-0.77206 0,-1.01016 0.2381,-0.23809 0.8851,0.31264 1.01015,0 0.63766,-1.59412 0.53848,-3.39989 1.01016,-5.05076 0.20684,-0.72395 0.77205,-1.30602 1.01015,-2.0203 0.10648,-0.31944 -0.33672,-1.01016 0,-1.01016 0.33672,0 -0.15059,0.70899 0,1.01016 2.39386,4.78772 2.0203,1.15246 2.0203,5.05076 0,0.67343 0.67344,2.0203 0,2.0203 -0.67343,0 0,-1.34687 0,-2.0203 0,-0.33672 -0.23809,-0.77206 0,-1.01015 0.2381,-0.2381 0.85957,0.30117 1.01016,0 0,-5.7242 -0.67344,-0.33672 1.01015,-2.02031 0.47619,-0.47619 -0.67344,-2.0203 0,-2.0203 0.47619,0 0.67343,0.67343 1.01015,1.01015 0.67344,0.67343 1.49202,1.22788 2.02031,2.0203 0.18677,0.28017 -0.18678,0.72999 0,1.01016 0.52828,0.79243 1.53031,1.20364 2.0203,2.0203 0.54783,0.91306 0.41951,2.1445 1.01015,3.03046 0.79243,1.18864 2.02031,2.0203 3.03046,3.03046 1.01015,1.01015 2.23803,1.84181 3.03046,3.03045 0.18678,0.28017 -0.066,1.34034 0,1.01016 0.40168,-2.0084 0.7205,-4.03333 1.01015,-6.06092 0.0476,-0.33333 -0.15058,-0.70898 0,-1.01015 0.21296,-0.42592 0.85957,-0.5584 1.01016,-1.01015 0.42591,-1.27776 -0.60234,-2.83594 0,-4.04061 0.15058,-0.30117 0.70898,0.15058 1.01015,0 0.42592,-0.21296 0.79719,-0.58424 1.01015,-1.01016 0.15058,-0.30117 0,-0.67343 0,-1.01015 0,-1.01015 -0.31944,-2.07214 0,-3.03046 0.10648,-0.31943 0.67344,0 1.01015,0 0.33672,0 0.70899,-0.15058 1.01016,0 0.73018,0.3651 1.33496,2.03816 2.0203,1.01016 0.59064,-0.88597 0.41951,-2.1445 1.01015,-3.03046 0.18678,-0.28017 0.67344,0 1.01016,0 0,-0.33672 -0.15059,-0.70898 0,-1.01015 0.21295,-0.42592 0.79719,-1.43607 1.01015,-1.01016 5.65248,11.30498 -1.6046,0.23696 1.01015,8.08122 0.10648,0.31944 0.77206,-0.23809 1.01015,0 0.003,0.003 -0.005,2.99595 0,3.03046 0.24281,1.69967 0.53848,3.3999 1.01016,5.05076 0.20684,0.72396 0.86249,1.28201 1.01015,2.02031 0.19811,0.99054 -0.31944,2.07214 0,3.03046 0.10648,0.31944 0.77206,-0.2381 1.01015,0 0.2381,0.23809 0,1.34687 0,1.01015 0,-1.68359 -0.23809,-3.3841 0,-5.05076 0.10648,-0.74536 0.74578,-1.31532 1.01015,-2.02031 0.74775,-1.99399 1.27256,-4.06692 2.02031,-6.06091 -0.35741,-1.72417 1.47736,-1.94458 2.0203,-3.03046 0.25946,-0.51891 -0.15337,-4.89739 0,-5.05076 0.2381,-0.2381 0.77206,0.23809 1.01016,0 0.23809,-0.2381 -0.2381,-0.77206 0,-1.01016 0.23809,-0.23809 0.77205,-0.23809 1.01015,0 0.47619,0.47619 -0.21296,1.38143 0,2.02031 0.23809,0.71428 0.47775,1.48791 1.01015,2.0203 0.47619,0.47619 2.02031,-0.67343 2.02031,0 0,0.33672 -1.16074,0.30117 -1.01016,0 0.75293,-1.50584 2.16426,-2.59694 3.03046,-4.04061 0,-2.69374 -0.33672,0.33672 1.01015,-1.01015 0.2381,-0.23809 -0.33671,-1.01015 0,-1.01015 0.0948,0 -0.10967,5.51256 0,6.06091 0.41765,2.08824 1.67021,3.96031 2.02031,6.06092 0.31774,1.90645 -0.38167,4.15256 0,6.06091 0.20882,1.04412 0.80133,1.98635 1.01015,3.03046 0.13207,0.66036 -0.30117,1.41797 0,2.02031 0.15059,0.30117 0.67344,0 1.01015,0 0.33672,0 0.85957,0.30117 1.01016,0 0.95238,-1.90476 1.06792,-4.15616 2.0203,-6.06092 0.42592,-0.85183 1.59439,-1.16847 2.02031,-2.0203 0.30117,-0.60234 -0.30117,-1.41797 0,-2.02031 0.15058,-0.30117 0.85956,0.30117 1.01015,0 0.30117,-0.60234 -0.30117,-1.41796 0,-2.0203 4.5985,-4.59851 0.53396,0.41842 2.0203,-4.04061 0.41842,-2.26541 2.31618,-3.91806 3.03046,-6.06092 0.10648,-0.31944 0,-1.34687 0,-1.01015 0,5.11899 -0.30117,-1.20468 1.01015,4.04061 0.008,0.0338 -0.005,3.02509 0,3.03046 0.2381,0.23809 0.92849,-0.32667 1.01016,0 0.32666,1.30665 -0.32667,2.73395 0,4.04061 0.0817,0.32666 0.77205,0.23809 1.01015,0 0.47619,-0.47619 -0.37355,-1.45998 0,-2.02031 0.52829,-0.79243 1.34687,-1.34687 2.0203,-2.0203 0.0471,-0.0471 1.38331,-1.8595 2.02031,-1.01016 0.90351,1.20468 1.46105,2.64247 2.0203,4.04061 0.25011,0.62527 -0.47619,1.54412 0,2.02031 0.2381,0.23809 0.90368,-0.31944 1.01016,0 0.31944,0.95831 -0.19811,2.03992 0,3.03046 0.14766,0.7383 0.77205,1.30602 1.01015,2.0203 0.30305,0.90914 -0.30305,2.12132 0,3.03046 0.15058,0.45175 0.67343,0.67343 1.01015,1.01015 0.33672,0.67344 0.77206,1.30602 1.01016,2.02031 0.10647,0.31944 0,0.67343 0,1.01015 0.33671,0.33672 0.79719,0.58423 1.01015,1.01015 0.15058,0.30117 -0.2381,0.77206 0,1.01015 0.23809,0.2381 1.01015,-0.33671 1.01015,0 0,0.33672 -1.3394,0.0706 -1.01015,0 33.47997,0.15361 84.20859,2.02031 125.25891,2.02031 z"
+       id="path3830"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccsssccscccsssssssssssssscsscsccsssssscccccccssccssscsssscssscssssscccccccssscssccsssccsscssscsscscssscccssssscscssccccssccsccsssscsssscccccsccc" />
+    <path
+       style="fill:#000000;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;color:#000000;fill-opacity:1;fill-rule:nonzero;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
+       d="m 275.81818,583.11846 c 3.24948,-0.63421 -0.43501,-12.38728 -0.28442,-11.93552 0.30304,0.90914 -0.30305,2.12132 0,3.03046 0.23809,0.71428 0.77206,1.30602 1.01015,2.0203 0.14396,0.43188 -0.33455,4.02763 0,2.02031 0.39143,-2.34856 0.43269,-4.76121 1.01015,-7.07107 0.1155,-0.46197 0.7972,-0.58424 1.01016,-1.01015 0.47619,-0.95239 0.61469,-2.04183 1.01015,-3.03046 1.83105,-4.57762 0.0933,-0.1399 2.0203,-3.03046 0.41765,-0.62647 0.77206,-1.30602 1.01016,-2.0203 0.21296,-0.63888 -0.47619,-1.54412 0,-2.02031 0.23809,-0.23809 0.77205,-0.23809 1.01015,0 0.5324,0.5324 0.67343,1.34687 1.01015,2.02031 0.33672,0.67343 0.77206,1.30601 1.01015,2.0203 0.10648,0.31944 0,0.67344 0,1.01015 0,1.01016 -0.56033,2.18996 0,3.03046 0.37356,0.56033 1.41797,-0.30117 2.02031,0 0.39966,0.19983 -0.50247,2.02552 0,3.03046 0.15058,0.30117 0.85957,0.30117 1.01015,0 1.47824,-2.95648 2.36752,-9.75432 4.04061,-8.08122 0.2381,0.23809 -0.0925,0.68639 0,1.01015 0.58505,2.04765 1.34687,4.04061 2.02031,6.06092 0.33671,1.01015 0.5777,4.00347 1.01015,3.03045 1.69155,-3.80599 2.09393,-8.06352 3.03046,-12.12183 0.21646,-0.938 -0.43293,-2.16461 0,-3.03045 0.15058,-0.30117 0.67343,0 1.01015,0 0.33672,0 0.85957,-0.30117 1.01015,0 0.30117,0.60233 -0.13207,1.35994 0,2.0203 0.20883,1.04412 0.7519,1.99746 1.01016,3.03046 0.0817,0.32666 0,0.67343 0,1.01015 0,1 0,4.05076 0,5.05076 0,1.01016 0,2.02031 0,3.03046 0,0.33672 -0.066,1.34033 0,1.01015 0.40167,-2.0084 0.51339,-4.07389 1.01015,-6.06091 -2.10819,-4.34178 1.71913,-1.1168 2.0203,-2.02031 0.31944,-0.95831 -0.245,-2.05046 0,-3.03045 0.1155,-0.46198 0.85957,-1.46191 1.01016,-1.01016 0.12114,0.36343 0,5.83738 0,7.07107 0,0.33672 -0.10648,0.69071 0,1.01015 0.23809,0.71429 0.73052,1.32124 1.01015,2.02031 0.39545,0.98863 0.6147,2.04182 1.01015,3.03046 0.27963,0.69907 0.77206,1.30602 1.01015,2.0203 0.10648,0.31944 -0.23809,0.77206 0,1.01015 0.2381,0.2381 0.8851,0.31264 1.01016,0 0.63765,-1.59413 0.79719,-3.34709 1.01015,-5.05076 0.12529,-1.00235 -0.19811,-2.03992 0,-3.03046 0.44456,-2.22283 1.73192,-2.30922 3.03046,-4.04061 0.45175,-0.60234 0.5925,-1.39383 1.01015,-2.0203 0.26414,-0.39622 0.74601,-0.61394 1.01015,-1.01015 0.41765,-0.62647 0.33672,-2.35703 1.01015,-2.02031 0.95238,0.47619 0.67344,2.02031 1.01016,3.03046 0.33671,1.01015 0.80133,1.98634 1.01015,3.03046 0.26414,1.32071 -0.42592,2.76285 0,4.04061 0.15058,0.45175 0.74601,0.61393 1.01015,1.01015 0.41765,0.62647 0.47776,1.48791 1.01015,2.0203 0.2381,0.2381 0.8734,0.3077 1.01016,0 1.29736,-2.91906 2.0203,-6.06091 3.03045,-9.09137 0.33672,-1.01015 0.41951,-2.14449 1.01016,-3.03046 0.18677,-0.28016 0.95479,-0.33213 1.01015,0 0.33213,1.99282 0,4.04061 0,6.06092 0,2.0203 0,4.04061 0,6.06091 0,1.01016 -0.45176,2.12695 0,3.03046 0.21296,0.42592 0.7053,-0.64433 1.01015,-1.01015 1.38027,-1.65632 2.84465,-3.25683 4.04061,-5.05076 0.18678,-0.28017 0,-0.67344 0,-1.01016 0.67344,-0.33671 1.48791,-0.47775 2.02031,-1.01015 0.23809,-0.23809 -0.10648,-0.69071 0,-1.01015 0.23809,-0.71429 0.47775,-1.48791 1.01015,-2.02031 0.47619,-0.47619 1.41797,0.30117 2.0203,0 0.42592,-0.21296 0.58424,-0.79719 1.01016,-1.01015 0.30117,-0.15058 0.67343,0 1.01015,0 2.72682,0 -0.0285,0.95323 1.01015,3.03046 0.15059,0.30117 0.77206,-0.2381 1.01015,0 0.2381,0.23809 -0.23809,0.77206 0,1.01015 0.50508,0.50508 2.52539,-0.50508 3.03046,0 2.34485,4.68969 -0.66718,0.17149 3.03046,2.02031 0.60234,0.30117 -0.30117,1.41796 0,2.0203 0.21296,0.42592 0.89466,0.54818 1.01015,1.01015 0.49,1.95999 -0.63887,4.14429 0,6.06092 0.10648,0.31944 0.67344,0 1.01015,0 0.33672,0 0.82338,0.28016 1.01016,0 2.47485,-7.42457 -0.33047,-0.51446 2.0203,-4.04061 1.54765,-2.32148 0.0842,-2.02031 2.02031,-2.02031 0.67343,0 1.41796,-0.30117 2.0203,0 0.0713,0.0357 -0.53647,5.08845 2.02031,2.02031 1.44603,-1.73524 2.23735,-3.94596 3.03046,-6.06092 0.14793,-0.39449 -0.5808,-3.03045 1.01015,-3.03045 0.33672,0 0,0.67343 0,1.01015 0,0.67343 0,1.34687 0,2.0203 0,2.69374 0,5.38748 0,8.08122 0,1.01016 0,2.02031 0,3.03046 0,0.33672 0,1.34687 0,1.01015 0,-2.69374 0,-5.38748 0,-8.08122 0,-0.67343 -0.16333,-1.36697 0,-2.0203 0.11251,-0.45003 1.18016,-2.75041 2.0203,-3.03046 4.78019,-1.59339 1.75574,5.70015 2.02031,8.08122 0.0526,0.47328 0.79719,1.43607 1.01015,1.01015 0.45175,-0.9035 -0.245,-2.05046 0,-3.03045 0.18674,-0.74697 2.62092,-2.21138 3.03046,-3.03046 0.15058,-0.30117 -0.18678,-0.72999 0,-1.01015 0.52828,-0.79243 1.49202,-1.22788 2.0203,-2.02031 0.18678,-0.28017 -0.23809,-0.77206 0,-1.01015 0.2381,-0.2381 0.82338,-0.28017 1.01016,0 1.32959,1.99438 1.01015,3.8577 1.01015,6.06091 0,0.33672 0,0.67344 0,1.01016 0,0.33671 -0.33672,1.01015 0,1.01015 0.47619,0 0.84742,-0.56263 1.01015,-1.01015 1.20138,-3.30379 2.06469,-6.72136 3.03046,-10.10153 0.3814,-1.3349 0.78191,-2.67118 1.01015,-4.04061 0.11071,-0.66427 -0.30117,-1.41797 0,-2.0203 0.15059,-0.30117 0.9548,-0.33214 1.01015,0 0.33214,1.99281 0,4.04061 0,6.06091 0,3.03046 0,6.06092 0,9.09137 0,1.01016 0,4.04061 0,3.03046 0,-2.35702 -0.26029,-4.72846 0,-7.07107 0.0831,-0.74831 0.67344,-1.34687 1.01016,-2.0203 0.33671,-0.67344 0.67343,-1.34687 1.01015,-2.02031 0.33672,-0.67343 0.5925,-1.39383 1.01015,-2.0203 0.26414,-0.39622 0.76516,-1.41848 1.01015,-1.01015 1.09567,1.8261 1.50381,3.99491 2.02031,6.06091 0.14061,0.56243 -0.1744,4.87637 0,5.05076 0.23809,0.2381 0.67343,0 1.01015,0 1.01015,0 2.02031,0 3.03046,0 0.33672,0 0.85957,-0.30117 1.01015,0 0.62088,1.24176 0.78192,2.67118 1.01015,4.04061 0.11072,0.66428 -0.30117,1.41797 0,2.02031 0.33672,0.67343 1.75003,-0.30742 2.02031,-1.01015 1.52895,-3.97529 2.45879,-8.16729 4.04061,-12.12183 0.45089,-1.12722 1.29187,-2.05922 2.0203,-3.03046 0.28572,-0.38095 0.5584,-0.85957 1.01016,-1.01015 0.84922,-0.28308 2.70891,-0.27603 3.03045,1.01015 0.32667,1.30665 0,2.69374 0,4.04061 0,0.33672 -0.23809,0.77206 0,1.01015 0.2381,0.2381 0.74078,0.20203 1.01016,0 7.7658,-5.82435 -0.38962,-0.15395 4.04061,-6.06091 0.45175,-0.60234 1.48791,-0.47776 2.0203,-1.01016 0.2381,-0.23809 -0.33671,-1.01015 0,-1.01015 0.47619,0 0.89466,0.54818 1.01016,1.01015 0.24499,0.97999 0,2.02031 0,3.03046 0,1.01015 0,2.02031 0,3.03046 0,5.579 0.40833,4.12668 -1.01016,9.09137 -0.29252,1.02383 -0.41951,2.1445 -1.01015,3.03046 -0.18678,0.28016 -1.07619,0.33018 -1.01015,0 0.68943,-3.44717 1.82908,-6.79774 3.03046,-10.10153 0.16273,-0.44752 0.67343,-0.67343 1.01015,-1.01015 0.67343,-0.67343 1.49202,-1.22788 2.0203,-2.0203 0.18678,-0.28017 -0.23809,-0.77206 0,-1.01016 0.48257,-0.48257 2.59963,-1.44098 3.03046,-1.01015 0.005,0.005 -0.008,2.99157 0,3.03046 0.20882,1.04411 0.67344,2.0203 1.01015,3.03046 0.33672,1.01015 0.41951,2.14449 1.01016,3.03045 0.18677,0.28017 0.675,0.0324 1.01015,0 35.81552,-3.46601 19.6545,-3.03045 43.43656,-3.03045 3.70389,0 7.41599,-0.24638 11.11168,0 1.38524,0.0924 3.05891,0.0285 4.04061,1.01015 0.71428,0.71428 0,2.0203 0,3.03046 0,0.33671 0.23809,-0.77206 0,-1.01016 -0.2381,-0.23809 -0.67344,0 -1.01016,0 -1.68358,0 -3.36717,0 -5.05076,0 -4.13908,0 -8.47238,0.41267 -12.12183,-2.0203 -1.70405,-1.13603 -1.59738,-2.41965 -4.04061,-3.03046 -0.40674,-0.10168 -5.88317,-0.0889 -6.06092,0 -0.42591,0.21296 -0.55839,0.85957 -1.01015,1.01015 -0.63887,0.21296 -1.38143,-0.21296 -2.0203,0 -0.45176,0.15059 -0.55229,0.87934 -1.01016,1.01016 -3.62108,1.03459 -5.93228,0.44076 -9.09137,2.0203 -1.08588,0.54294 -1.86312,1.68678 -3.03046,2.02031 -1.29504,0.37001 -2.69374,0 -4.04061,0 -1.01015,0 -2.0203,0 -3.03045,0 -0.67344,0 -1.64675,0.56033 -2.02031,0 -0.56033,-0.8405 0,-2.02031 0,-3.03046 0,-0.33672 -0.15058,-1.31132 0,-1.01015 0.81092,1.62184 1.20938,3.42891 2.02031,5.05076 0.54294,1.08588 1.52723,1.92104 2.0203,3.03046 0.86491,1.94604 1.06793,4.15615 2.02031,6.06091 0.42591,0.85184 1.6666,1.13604 2.0203,2.02031 0.37516,0.9379 -0.71428,2.31617 0,3.03045 0.5324,0.5324 0.88637,-1.27762 1.01015,-2.0203 0.55632,-3.33793 0.76906,-6.72616 1.01016,-10.10153 0.096,-1.34344 -0.32667,-2.73395 0,-4.04061 0.16333,-0.65332 1.71913,0.60234 2.0203,0 0.30117,-0.60234 -0.30117,-1.41796 0,-2.0203 0.15059,-0.30117 0.77206,-0.2381 1.01015,0 0.0325,0.0325 0,2.78547 0,3.03046 0,1.8256 -0.22676,5.48374 0,7.07106 0.19634,1.37437 0.38928,2.79886 1.01016,4.04061 0.15058,0.30117 0.87751,0.3095 1.01015,0 7.08548,-4.88423 3.56924,-12.9637 6.06091,-19.19289 0.12506,-0.31264 0.96839,-0.33412 1.01016,0 0.39509,3.16073 0,8.41408 0,12.12183 0,1.01015 0,4.04061 0,3.03045 0,-1.68358 -0.46252,-3.43195 0,-5.05076 0.9681,-3.38837 2.14866,-1.38965 4.04061,-2.0203 0.45175,-0.15059 0.58423,-0.7972 1.01015,-1.01016 0.30117,-0.15058 0.77206,0.2381 1.01015,0 3.10057,-3.10056 -0.59019,-0.83991 1.01015,-4.04061 0.15059,-0.30117 0.85957,-0.30117 1.01016,0 1.01015,2.02031 -0.50508,1.51523 0,3.03046 0.23809,0.71429 0.82754,1.28986 1.01015,2.02031 0.16333,0.65332 0,1.34687 0,2.0203 0,2.02031 -0.22311,4.05297 0,6.06092 0.11759,1.05828 0.67343,2.0203 1.01015,3.03045 0.33672,1.01016 0.41951,2.1445 1.01015,3.03046 0.18678,0.28017 0.88065,0.31082 1.01016,0 1.34687,-4.04061 2.69374,-8.08122 4.04061,-12.12183 0,-1.34687 -0.32667,-2.73395 0,-4.04061 0.0817,-0.32666 0.90367,-0.31944 1.01015,0 1.41226,4.23677 1.01015,8.76545 1.01015,13.13198 0,0.33672 -0.0886,-0.6853 0,-1.01015 0.92497,-3.39156 1.91878,-6.76649 3.03046,-10.10152 0.2381,-0.71429 0.47776,-1.48791 1.01015,-2.02031 0.5324,-0.5324 1.48791,-0.47775 2.02031,-1.01015 0.23809,-0.2381 -0.2381,-0.77206 0,-1.01015 0.23809,-0.2381 0.91765,-0.32377 1.01015,0 0.6541,2.28934 0.54321,4.73635 1.01015,7.07106 0.20883,1.04412 0.85957,1.97637 1.01016,3.03046 0.19047,1.33333 -0.47292,5.30173 0,4.04061 1.46241,-3.89978 2.09392,-8.06352 3.03045,-12.12183 0.0757,-0.32809 -0.23809,-0.77206 0,-1.01015 0.2381,-0.2381 0.70899,0.15058 1.01016,0 0.26299,-0.1315 1.23064,-1.79982 2.0203,-1.01015 0.2381,0.23809 -0.15058,1.31132 0,1.01015 0.81092,-1.62185 1.08738,-3.49589 2.02031,-5.05076 0.17324,-0.28874 0.70898,0.15058 1.01015,0 0.42592,-0.21296 0.58423,-0.7972 1.01015,-1.01016 0.30117,-0.15058 0.67344,0 1.01015,0 0.91999,0 2.65888,-0.47619 3.03046,1.01016 0.32667,1.30665 0,2.69374 0,4.04061 0,0.67343 0,1.34687 0,2.0203 0,0.33672 -0.18678,1.29032 0,1.01015 1.16457,-1.74685 2.05325,-5.66928 3.03046,-4.04061 0.93292,1.55488 0.2317,5.34887 2.0203,5.05077 2.39507,-0.39918 2.48618,-4.1956 4.04061,-6.06092 0.21557,-0.25867 0.77206,0.2381 1.01016,0 0.23809,-0.23809 -0.33672,-1.01015 0,-1.01015 2.92381,0 2.0203,2.21858 2.0203,4.04061 0,1.68359 0,3.36717 0,5.05076 0,0.33672 -0.23809,0.77206 0,1.01015 0.2381,0.2381 0.79981,0.26294 1.01015,0 1.22652,-1.53314 1.94137,-3.41713 3.03046,-5.05076 0.26414,-0.39621 0.58424,-0.79719 1.01015,-1.01015 0.30117,-0.15059 0.67344,0 1.01016,0 0.33671,0 0.90367,-0.31944 1.01015,0 0.31944,0.95831 -0.64668,3.80648 0,3.03046 2.21934,-2.66321 3.26715,-6.11869 5.05076,-9.09138 0.245,-0.40833 0.58424,-0.79719 1.01015,-1.01015 0.16163,-0.0808 2.99006,-0.0808 3.03046,0 0.30117,0.60234 0,1.34687 0,2.02031 0,2.69374 0,5.38748 0,8.08122 0,1.01015 0,2.0203 0,3.03045 0,0.33672 -0.17324,1.29889 0,1.01016 1.01015,-2.02031 2.02031,-4.04061 3.03046,-6.06092 0.33672,0 0.77206,0.2381 1.01015,0 0.5324,-0.5324 0.47776,-1.48791 1.01016,-2.0203 0.23809,-0.2381 0.67343,0 1.01015,0 0.33672,0 0.94411,-0.33018 1.01015,0 0.33018,1.65089 -0.33018,3.39987 0,5.05076 0.066,0.33018 0.83691,0.28873 1.01015,0 1.93688,-3.22813 3.36718,-6.73435 5.05077,-10.10153 0.10858,-0.21716 1.86439,-4.66207 3.03045,-5.05076 0.63888,-0.21296 1.54412,-0.47619 2.02031,0 0.0891,0.0891 -0.0718,8.08122 0,8.08122 5.84675,0 3.90114,-0.94042 8.08122,-3.03046 0.30117,-0.15058 0.70898,0.15059 1.01015,0 0.42592,-0.21296 0.79719,-0.58423 1.01015,-1.01015 0.15059,-0.30117 0,-1.34687 0,-1.01015 0,2.0203 0,4.04061 0,6.06091 0,1.01016 0,2.02031 0,3.03046 0,0.33672 -0.33671,1.01015 0,1.01015 1.43607,0 3.30441,-2.29425 4.04061,-3.03045 0.33672,-0.33672 0.58424,-0.7972 1.01016,-1.01016 0.30117,-0.15058 0.67343,0 1.01015,0 1.59004,0 1.24648,-0.30117 2.0203,2.02031 0.10648,0.31944 -0.23809,0.77206 0,1.01015 0.2381,0.2381 0.67344,0 1.01016,0 0.67343,0 1.34707,0.0164 2.0203,0 13.1324,-0.3203 26.29987,0.017 39.39595,-1.01015 4.15221,-0.32567 8.00783,-2.38088 12.12183,-3.03046 2.32818,-0.36761 5.4044,-1.66667 7.07107,0 0.0825,0.0825 -6.31335,4.74768 -7.07107,5.05076 -0.62527,0.25011 -1.38143,-0.21296 -2.0203,0 -0.45176,0.15059 -0.54818,0.89466 -1.01016,1.01016 -5.44273,1.36068 -0.92721,-0.96869 -5.05076,-3.03046 -0.60234,-0.30117 -1.34687,0 -2.0203,0 -1.68359,0 -3.36718,0 -5.05077,0 -1.01015,0 -2.0203,0 -3.03045,0 -0.33672,0 -0.70899,0.15058 -1.01016,0 -0.42591,-0.21296 -0.53396,-1.01015 -1.01015,-1.01015 -0.82137,0 -4.14521,1.4166 -5.05076,2.0203 -0.39622,0.26414 -0.58424,0.79719 -1.01015,1.01015 -0.30117,0.15059 -0.67344,0 -1.01016,0 -0.67343,0 -1.34687,0 -2.0203,0 -2.02031,0 -4.0681,-0.33213 -6.06092,0 -0.74268,0.12378 -1.30602,0.77206 -2.0203,1.01016 -0.31944,0.10648 -0.70899,-0.15059 -1.01016,0 -0.4918,0.2459 -3.78433,3.83559 -4.04061,4.04061 -0.94801,0.75841 -2.08244,1.26189 -3.03045,2.0203 -2.34922,1.87937 -1.32934,2.1267 -4.04061,3.03046 -0.58516,0.19505 -3.16523,0 -4.04061,0 -0.33672,0 -0.96839,0.33412 -1.01016,0 0,-15.9248 0.65333,-2.14095 -1.01015,-12.12183 -0.11071,-0.66427 0,-1.34687 0,-2.02031 0,-0.33671 0,-1.34687 0,-1.01015 0,4.04061 0,8.08122 0,12.12183 0,0.33672 -0.274,1.20587 0,1.01015 13.82616,-9.87583 2.77662,-1.63954 9.09137,-11.11167 0.0627,-2.84433 2.27754,-0.25723 3.03046,-1.01016 0.2381,-0.23809 -0.15058,-1.31132 0,-1.01015 1.11663,2.23326 1.01015,2.31877 1.01015,4.04061 0,0.33672 -0.30116,1.16074 0,1.01015 3.44888,-1.72443 2.02031,-6.63077 2.02031,4.04061 0,1.34687 0,2.69374 0,4.04061 0,0.67344 -0.34648,2.59777 0,2.02031 2.32425,-3.87376 3.91915,-8.14427 6.06091,-12.12183 0.22577,-0.41927 0.58424,-0.7972 1.01016,-1.01015 0.30117,-0.15059 0.77205,0.23809 1.01015,0 0.2381,-0.2381 -0.2381,-0.77206 0,-1.01016 0.2381,-0.23809 0.8851,-0.31263 1.01015,0 0.63765,1.59413 0.46721,3.42194 1.01016,5.05077 1.24824,3.74474 1.01015,-1.23133 1.01015,2.0203 0,0.33672 0.33672,1.01015 0,1.01015 -0.33672,0 -0.12506,-0.69751 0,-1.01015 4.39741,-10.99353 0.27115,-0.9118 3.03046,-5.05076 0.41764,-0.62647 0.5925,-1.39384 1.01015,-2.02031 0.26414,-0.39621 0.95756,-1.48343 1.01015,-1.01015 0.37184,3.34658 0,6.73435 0,10.10153 0,1.01015 0,2.0203 0,3.03045 0,0.67344 -0.21296,2.65919 0,2.02031 0.87805,-2.63416 1.47576,-5.3585 2.02031,-8.08122 0.13207,-0.66036 -0.4207,-1.49444 0,-2.02031 1.05172,-1.31466 2.85013,-1.83998 4.04061,-3.03045 0.53239,-0.5324 0.38368,-1.60266 1.01015,-2.02031 0.56033,-0.37355 1.54411,0.47619 2.0203,0 0.47619,-0.47619 -0.67343,-2.0203 0,-2.0203 0.67344,0 0,1.34687 0,2.0203 0,0.33672 0,0.67344 0,1.01015 0,2.02031 7.12012,4.68789 7.12012,6.7082 0,1.01015 -1.61401,5.95585 -7.12012,2.38318 -0.28246,-0.18328 0.77206,0.23809 1.01016,0 0.23809,-0.2381 3.93676,14.21221 8.45732,11.8284 -149.5224,-1.85781 -202.50083,-1.95458 -328.39126,-6.96395 z"
+       id="path3832"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="ccsssccscsscsssssccccssscscscsssccsscsssssscssscssssscscsscssssscsssscsscscssssscsscssssssssssscssccsssssssssscsssccsccscssccsssccssssscscsssccssscsccccsccscssscccsssssssscsssssscssccssccccssscccccsssssscccsscsscccssscsccscccssssssscssssscsssssscssssccccsccssssscccssssscsssscssscscsssscssssssscsssscssssccccscsssccccsssscssssssssssssssssccc" />
+    <path
+       style="fill:none;stroke:#000000;stroke-width:2.10000000000000009;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;marker-end:url(#Arrow2Mend);opacity:0.31660232"
+       d="m 141.42857,455.21933 0,20 147.14286,0"
+       id="path3834"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:#000000;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;color:#000000;fill-opacity:1;fill-rule:nonzero;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
+       d="m 298.8627,539.46346 c 21.86648,-2.28684 55.80474,8.99265 62.74605,-19.45095 16.4407,-25.76333 56.7345,-7.60521 83.12298,-10.68066 20.79129,-8.77214 36.69572,4.05284 37.99517,25.62782 48.88594,0.28825 83.20353,1.59033 130.13024,1.68823 z"
+       id="path3836"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccccc" />
+    <path
+       style="fill:none;stroke:#000000;stroke-width:2.10000000000000009;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;marker-end:url(#Arrow2Mend);opacity:0.31660232"
+       d="m 287.14286,516.6479 -68.57143,0 0,100"
+       id="path3842"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:none;stroke:#000000;stroke-width:2.10000000000000009;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;marker-end:url(#Arrow2Mend);opacity:0.31660232"
+       d="m 270,570.93361 -14.28571,0 0,28.57143 85.71428,0 0,18.57143"
+       id="path3844"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:none;stroke:#000000;stroke-width:2.10000000000000009;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;marker-end:url(#Arrow2Mend);opacity:0.31660232"
+       d="m 135.71429,649.50504 0,35.71429 144.28571,0"
+       id="path3846"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:none;stroke:#000000;stroke-width:2.10000000000000009;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;marker-end:url(#Arrow2Mend);opacity:0.31660232"
+       d="m 144.28571,756.6479 0,24.28571 110,0"
+       id="path3848"
+       inkscape:connector-curvature="0" />
+    <path
+       style="fill:none;stroke:#fe0c0c;stroke-width:1.6;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none"
+       d="m 431.42857,350.93361 0,487.14286"
+       id="path4670"
+       inkscape:connector-curvature="0" />
+    <rect
+       style="opacity:0.65637066;color:#000000;fill:#ffffff;stroke:none;stroke-width:2.09999989999999981;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate;fill-opacity:1"
+       id="rect4668"
+       width="344.28571"
+       height="34.285713"
+       x="105.71429"
+       y="620.93359" />
+    <text
+       xml:space="preserve"
+       style="font-size:20px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Sans"
+       x="119.60709"
+       y="642.13361"
+       id="text3038"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan3040"
+         x="119.60709"
+         y="642.13361">val = backchase * (music &gt;  .3 )</tspan></text>
+    <text
+       xml:space="preserve"
+       style="font-size:20px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans;-inkscape-font-specification:Sans"
+       x="122.85714"
+       y="845.21936"
+       id="text4699"
+       sodipodi:linespacing="125%"><tspan
+         sodipodi:role="line"
+         id="tspan4701"
+         x="122.85714"
+         y="845.21936">out = color</tspan></text>
+    <path
+       inkscape:connector-curvature="0"
+       id="path4703"
+       d="m 138.57143,852.36218 c 0.37491,51.70389 1.39124,62.85715 1.42857,102.85715"
+       style="opacity:0.31660234;fill:none;stroke:#000000;stroke-width:2.0999999;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;marker-end:url(#Arrow2Mend)"
+       sodipodi:nodetypes="cc" />
+    <rect
+       style="opacity:0.68725866999999996;color:#000000;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:2.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:2.2,4.4;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
+       id="rect4734"
+       width="37.531288"
+       height="29.292711"
+       x="399.11319"
+       y="621.21008" />
+    <rect
+       y="727.75854"
+       x="334.77875"
+       height="29.79941"
+       width="21.855896"
+       id="rect4736"
+       style="opacity:0.68725867;color:#000000;fill:none;stroke:#000000;stroke-width:1.69330156;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:1.69330156, 3.38660311;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate" />
+    <rect
+       style="opacity:0.68725867;color:#000000;fill:none;stroke:#000000;stroke-width:1.71662986;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:1.71662985, 3.43325968;stroke-dashoffset:0;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate"
+       id="rect4738"
+       width="22.479851"
+       height="29.776081"
+       x="267.4729"
+       y="422.89963" />
+  </g>
+</svg>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/www/mockup/effectpreview.html	Sat Apr 26 17:48:21 2014 +0000
@@ -0,0 +1,382 @@
+<!doctype html>
+<html>
+  <head>
+    <title></title>
+    <meta charset="utf-8" />
+    <style>
+     body {
+       font-family: sans;
+       font-size: 8px;
+         background: black;
+         color: gray;
+     }
+     a {
+       color: #aff;
+     }
+     canvas {
+       outline: 1px solid gray;
+     }
+     svg {
+pointer-events: none;
+     }
+.markers text {
+ fill: white;
+    }
+.timelineArea {
+    display: inline-block;
+    }
+     .codeLine {
+       margin-bottom: 3em;
+       position: relative;
+       border: 1px solid #dfdfdf;
+         padding: 5px;
+     }
+     .codeLine canvas {
+       display: block;
+     }
+     code {
+       display: block;
+       font-size: 14px;
+       margin: 20px 0;
+       padding: 5px;
+         color: white;
+       background: rgba(34, 34 34, 0.52);
+     }
+     .alignStartTime {
+       margin-left: 150px;
+     }
+     .codeLine .inputs, .codeLine .output {
+     }
+     .codeLine .inputs {
+     }
+     .codeLine .output {
+     }
+     .codeLine svg.arrows {
+       position: absolute;
+     }
+     .timelineArea {
+       position: relative;
+     }
+     svg.markers {
+       position: absolute;
+       top: 0;
+       left: 150px;
+       right: 0;
+       bottom: 0;
+     }
+.adjustable {
+    border: 2px dashed rgb(72, 72, 252);
+padding: 0 4px;
+    background: rgba(109, 109, 253, 0.38);
+    }
+.markers path {
+stroke:#ffffff;
+       stroke-width:1;
+       opacity:0.31660232
+    }
+    </style>
+  </head>
+  <body>
+    <h1>
+      Effect chase1
+    </h1>
+    <div>
+      (&lt;--&gt; timeline adjusters)
+    </div>
+    <div class="timelineArea">
+      <!-- times + beats + now, extends under the rest -->
+      <svg class="markers">
+        <text x="0" y="10"> 0sec </text><path d="m0,20 0,2000"></path>
+        <text x="80" y="10"> 10 </text><path d="m30,20 0,2000"></path>
+        <text x="160" y="10"> 20 </text><path d="m60,20 0,2000"></path>
+        <text x="240" y="10"> 30 </text><path d="m90,20 0,2000"></path>
+        <text x="320" y="10"> 40 </text><path d="m120,20 0,2000"></path>
+      </svg>
+
+      <div class="codeLine">
+        <style>
+          .arrows path {
+fill:none;stroke:#ffffff;stroke-width:2.10000000000000009;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none;marker-end:url(#Arrow2Mend);opacity:0.31660232
+           }
+        </style>
+        <svg class="arrows">
+          <defs id="defs4">
+            <marker orient="auto" refY="0.0" refX="0.0" id="Arrow2Mend" style="overflow:visible;">
+              <path style="fill-rule:evenodd;stroke-width:0.62500000;stroke-linejoin:round;"
+                    d="M 8.7185878,4.0337352 L -2.2072895,0.016013256 L 8.7185884,-4.0017078 C 6.9730900,-1.6296469 6.9831476,1.6157441 8.7185878,4.0337352 z "
+                    transform="scale(0.6) rotate(180) translate(0,0)" />
+            </marker>
+          </defs>
+          <path class="arrow" d="m0,0"></path>
+        </svg>
+        <div class="inputs">
+        </div>
+        <code><span class="out" id="out1var">hue</span> = nsin(t * <span class="adjustable" data-param="sinTimeCoeff">.5</span> + 2pi * <span class="adjustable" data-param="sinTimeOffset">0</span>)</code>
+        <div class="alignStartTime">
+          <canvas class="output" id="out1"></canvas>
+        </div>
+      </div>
+
+      <div class="codeLine">
+        <svg class="arrows"> <defs></defs>
+          <path class="arrow" d="m0,0"></path>
+          <path class="arrow" d="m0,0"></path>
+          <path class="arrow" d="m0,0"></path>
+        </svg>
+        <div class="inputs">
+          <div class="alignStartTime">
+            <canvas class="input" id="in1"></canvas>
+          </div>
+          <div class="alignStartTime">
+            <canvas class="input" id="in2"></canvas>
+          </div>
+        </div>
+        <code><span id="out2var">val</span> = <span id="in21var">backchase</span> * (<span id="in22var">music</span> &gt; <span class="adjustable" data-param="valThresh">.3</span>)</code>
+        <div class="alignStartTime">
+          <canvas class="output" id="out2"></canvas>
+        </div>
+      </div>
+
+      <div class="codeLine">
+        <svg class="arrows"> <defs></defs><path class="arrow" d="m0,0"></path> </svg>
+        <div class="inputs">
+        </div>
+        <code><span id="out3var">out</span> = hsv2rgb(hue, <span class="adjustable" data-param="sat">1.0</span>, val)</code>
+        <div class="alignStartTime">
+          <canvas class="output" id="out3"></canvas>
+        </div>
+      </div>
+</div>
+    <style>
+     .dragValue {
+       position: absolute;
+       left: 98px;
+       top: 168px;
+       width: 300px;
+       background: rgba(80,80,80,0.64);
+       color: white;
+       border: 1px solid black;
+       box-shadow: 5px 5px 73px black;
+       font-size: 26px;
+         -webkit-user-select: none;
+
+     }
+     .dragValue table {
+       width: 100%;
+       border-collapse: collapse;
+       }
+     .dragValue table tr.current td {
+         background: rgba(128, 128, 128, 0.71);
+       }
+     .dragValue table td {
+         border-left: 1px solid black;
+       height: 80px;
+       }
+     .dragValue table .low { }
+     .dragValue table .high { text-align: right; }
+
+     div.newValue {
+       position: absolute;
+display: inline-block;
+border: 1px solid black;
+border-radius: 50%;
+padding: 3px;
+         font-size: 20px;
+         color: black;
+background: rgb(241, 241, 144);
+box-shadow: 3px 4px 12px rgba(0, 0, 0, 0.23);
+                }
+    </style>
+    <div class="dragValue">
+      Editing .5 to <span class="newValue">.5</span>
+      <table>
+        <tr data-bounds="0 1"><td class="low">0 ||||||||||</td><td class="high">|||||||||| 1</td></tr>
+        <tr data-bounds=".4 .6"><td class="low">.4 | | | | |</td><td class="high">| | | | | .6</td></tr>
+        <tr data-bounds=".49 .51"><td class="low">.49</td><td class="high">.51</td></tr>
+      </table>
+      <div class="newValue">.5</div>
+    </div>
+
+    <script src="/lib/jquery-2.0.3.min.js"></script>
+    <script src="/lib/rickshaw/71877d994a/vendor/d3.min.js"></script>
+    <script type="text/javascript">
+    window.onload = function () {
+        
+        var _music = [];
+        for (var x=0; x<1000; x++) {
+            _music.push(Math.random());
+        }
+        function musicCurve(x) {
+            return _music[Math.round(x)];
+        }
+        var params = {
+            sinTimeCoeff: .1,
+            sinTimeOffset: 0,
+            valThresh: .5,
+            sat: 1
+        };
+        
+        function hue(x) { return Math.sin(x * params.sinTimeCoeff + 6.28 * params.sinTimeOffset) * .5 + .5; }
+        function valFunc(x) { return (x > 100 && x < 300) * (musicCurve(x) > params.valThresh); }
+        
+        function drawCurve(canvas, func) {
+            var ctx = canvas.getContext('2d');
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            
+            ctx.strokeStyle = '#ffffff';
+            ctx.fillStyle = '#666';
+            ctx.strokeWidth = 3;
+            ctx.beginPath();
+            ctx.moveTo(0, canvas.height);
+            for (var x = 0; x < canvas.width; x += 2) {
+                var y = func(x);
+                ctx.lineTo(x, canvas.height * (1 - y));
+            }
+            ctx.lineTo(canvas.width, canvas.height);
+            ctx.fill();
+            ctx.stroke();
+        }
+        function drawRgb(canvas) {
+            var ctx = canvas.getContext('2d');
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            var step = 1;
+            for (var x = 0; x < canvas.width; x+= step) {
+                var vv = (valFunc(x) * .5 * 100);
+                ctx.fillStyle = ('hsl('+
+                                 (360 * hue(x))+','+
+                                 (params.sat * 100)+'%,'+
+                                 vv+'%'+
+                                 ')');
+                if (vv > 0) {
+                    ctx.fillRect(x, 0, step, canvas.height);
+                } // else leave it transparent
+            }
+        }
+
+        function drawTimeCoords(svg) {
+            // use KO on svg templates
+        }
+        function routePath(svg, src, dest) {
+            var parent = $(svg).position();
+            var srcPos = src.position();           
+            var destPos = dest.position();
+            var startDown = srcPos.left < 150;
+            if (startDown) { 
+                srcPos.left += src.width() / 2;
+                srcPos.top += src.height();
+                destPos.top += dest.height() / 2;
+            } else {
+                srcPos.top += src.height() / 2;
+                destPos.left += dest.width() / 2;
+            }
+            
+            var d = "";
+            var px = parent.left, py = parent.top;
+            d += "m" + (srcPos.left - px) + "," + (srcPos.top - py);
+            if (startDown) {
+                d += "L" + (srcPos.left - px) + "," + (destPos.top - py);
+            } else {
+                if (destPos.left < srcPos.left) {
+                    d += "L" + (destPos.left - px) + "," + (srcPos.top - py);
+                } else {
+                    d += "L" + (srcPos.left - px - 10) + "," + (srcPos.top - py);
+                    var ymid = srcPos.top + src.height() / 2 + 5;
+                    d += "L" + (srcPos.left - px - 10) + "," + (ymid - py);
+                    d += "L" + (destPos.left - px) + "," + (ymid - py);
+                }
+            }
+            d += "L" + (destPos.left - px) + "," + (destPos.top - py);
+            return d;
+        }
+        function connectElems(svg, src, dest) {
+            // this is wrong; it's not a proper path object
+            var path = document.createElementNS('svg', 'path');
+            svg.appendChild(path);
+
+            // workaround- use spare path nodes
+            for (var i = 1; i < svg.children.length; i++) {
+                path = svg.children[i];
+                if (path.getAttribute('d') == 'm0,0') {
+                    break;
+                }
+            }
+            
+            path.classList.add('arrow');
+            path.setAttribute('d', routePath(svg, src, dest));
+        }
+        
+        function connectVars() {
+            connectElems($("#out1").closest(".codeLine").find(".arrows")[0], $("#out1var"), $("#out1"));
+            connectElems($("#out2").closest(".codeLine").find(".arrows")[0], $("#out2var"), $("#out2"));
+            connectElems($("#out3").closest(".codeLine").find(".arrows")[0], $("#out3var"), $("#out3"));
+
+            connectElems($("#out2").closest(".codeLine").find(".arrows")[0], $("#in1"), $("#in21var"));
+            connectElems($("#out2").closest(".codeLine").find(".arrows")[0], $("#in2"), $("#in22var"));
+        }
+        function redrawAll() {
+            $("canvas").each(function (i, canvas) {
+                canvas.width = 500;
+                canvas.height = 30;
+            });
+            drawCurve($("#out1")[0], hue)
+            drawCurve($("#in1")[0], function (x) { return x > 100 && x < 300; })
+            drawCurve($("#in2")[0], function (x) { return musicCurve(x); })
+            drawCurve($("#out2")[0], valFunc);
+            drawRgb($("#out3")[0]);
+
+            $("svg.arrows").each(function (i, svg) {
+
+            });
+            drawTimeCoords($(".markers"));
+            connectVars();
+        }
+        redrawAll();
+        
+
+        var adjusting = null;
+        var adjustParam = "";
+        $(".dragValue").hide();
+        $(".adjustable").mousedown(function (ev) {
+            $(".dragValue").show();
+            adjusting = $(ev.target);
+            adjustParam = adjusting.attr('data-param');
+            $(".dragValue").css({left: adjusting.offset().left - 150,
+                                 top: adjusting.offset().top - 120});
+        });
+        $("body, .dragValue").mouseup(function (ev) {
+            $(".dragValue").hide();
+        });
+        $(".dragValue").mousemove(function (ev) {
+            var dv = $(".dragValue").position();
+            $(".dragValue div.newValue").css({left: ev.pageX - dv.left - 15, top: ev.pageY - dv.top - 35});
+            var row = $(ev.target).closest('tr');
+            $(".dragValue tr").removeClass('current');
+            if (!row.length) {
+                // revert
+                return;
+            } 
+            row.addClass('current');
+
+            var rx = row.offset().left;
+            var frac = (ev.pageX - rx) / row.width();
+
+            var bounds = row.attr('data-bounds').split(" ");
+            var newValue = parseFloat(bounds[0]) * (1 - frac) + parseFloat(bounds[1]) * frac;
+            newValue = Math.round(newValue * 1000) / 1000;
+            valueChanged(newValue);
+            });
+        function valueChanged(newValue) {
+            if (adjusting) {
+                adjusting.text(newValue);
+            }
+            $(".dragValue .newValue").text(newValue);
+            params[adjustParam] = newValue;
+            drawCurve($("#out1")[0], hue)
+            drawCurve($("#out2")[0], valFunc);
+            drawRgb($("#out3")[0]);
+        };
+
+    };
+    </script>
+  </body>
+</html>
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/www/mockup/inputmapping.html	Sat Apr 26 17:48:21 2014 +0000
@@ -0,0 +1,22 @@
+<!doctype html>
+<html>
+  <head>
+    <title></title>
+    <meta charset="utf-8" />
+  </head>
+  <body>
+
+
+    <div class="button">chase back</div>
+    <div class="button">chase overhead</div>
+    chase colors
+    stack front
+    single color strobe
+    rainbows
+    blacklight
+    music cyc
+    music front
+    
+    
+  </body>
+</html>