<!-- Created with Inkscape (http://www.inkscape.org/) --><svg xmlns:ns1="https://launchpad.net/jessyink" 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="1000" height="1000" viewBox="0 0 1000 1000" version="1.1" id="svg8" inkscape:version="0.92.4 5da689c313, 2019-01-14" sodipodi:docname="test.svg">
  <svg:script id="inkwebjs" type="text/javascript"><![CDATA[
/* inkweb.js - InkWebEffect:AutoUpdate */
/*
**  InkWeb - Inkscape's Javscript features for the open vector web
**
**  Copyright (C) 2009 Aurelio A. Heckert, aurium (a) gmail dot com
**
**  ********* Bugs and New Fetures *************************************
**   If you found any bug on this script or if you want to propose a
**   new feature, please report it in the inkscape bug tracker
**   https://inkscape.org/report .
**  ********************************************************************
**
**  This program is free software: you can redistribute it and/or modify
**  it under the terms of the GNU Lesser General Public License as published
**  by the Free Software Foundation, either version 3 of the License, or
**  (at your option) any later version.
**
**  This program is distributed in the hope that it will be useful,
**  but WITHOUT ANY WARRANTY; without even the implied warranty of
**  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
**  GNU Lesser General Public License for more details.
**
**  You should have received a copy of the GNU Lesser General Public License
**  along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/

var InkWeb = {

  version: 0.04,

  NS: {
    svg:      "http://www.w3.org/2000/svg",
    sodipodi: "http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd",
    inkscape: "http://www.inkscape.org/namespaces/inkscape",
    cc:       "http://creativecommons.org/ns#",
    dc:       "http://purl.org/dc/elements/1.1/",
    rdf:      "http://www.w3.org/1999/02/22-rdf-syntax-ns#",
    xlink:    "http://www.w3.org/1999/xlink",
    xml:      "http://www.w3.org/XML/1998/namespace"
  }

};

InkWeb.el = function (tag, attributes) {
  // A helper to create SVG elements
  var element = document.createElementNS( this.NS.svg, tag );
  for ( var att in attributes ) {
    switch ( att ) {
      case "parent":
        attributes.parent.appendChild( element );
        break;
      case "text":
        element.appendChild( document.createTextNode( attributes.text ) );
        break;
      default:
        element.setAttribute( att, attributes[att] );
    }
  }
  return element;
}

InkWeb.reGetStyleAttVal = function (att) {
  return new RegExp( "(^|.*;)[ ]*"+ att +":([^;]*)(;.*|$)" )
}

InkWeb.getStyle = function (el, att) {
  // This method is needed because el.style is only working
  // to HTML style in the Firefox 3.0
  if ( typeof(el) == "string" )
    el = document.getElementById(el);
  var style = el.getAttribute("style");
  var match = this.reGetStyleAttVal(att).exec(style);
  if ( match ) {
    return match[2];
  } else {
    return false;
  }
}

InkWeb.setStyle = function (el, att, val) {
  if ( typeof(el) == "string" )
    el = document.getElementById(el);
  var style = el.getAttribute("style");
  re = this.reGetStyleAttVal(att);
  if ( re.test(style) ) {
    style = style.replace( re, "$1"+ att +":"+ val +"$3" );
  } else {
    style += ";"+ att +":"+ val;
  }
  el.setAttribute( "style", style );
  return val
}

InkWeb.transmitAtt = function (conf) {
  conf.att = conf.att.split( /\s+/ );
  if ( typeof(conf.from) == "string" )
    conf.from = document.getElementById( conf.from );
  if ( ! conf.to.join )
    conf.to = [ conf.to ];
  for ( var toEl,elN=0; toEl=conf.to[elN]; elN++ ) {
    if ( typeof(toEl) == "string" )
      toEl = document.getElementById( toEl );
    for ( var i=0; i<conf.att.length; i++ ) {
      var val = this.getStyle( conf.from, conf.att[i] );
      if ( val ) {
        this.setStyle( toEl, conf.att[i], val );
      } else {
        val = conf.from.getAttribute(conf.att[i]);
        toEl.setAttribute( conf.att[i], val );
      }
    }
  }
}

InkWeb.goto = function (conf) {
  if ( typeof(conf.from) == "string" )
    conf.from = document.getElementById( conf.from );
  if ( ! conf.to )
    conf.to = conf.to ;
  if ( typeof(toEl) == "string" )
      toEl = document.getElementById( toEl );
  toEl = document.getElementById( conf.to );
  document.getElementsByTagName("svg")[0].viewBox.baseVal.x = toEl.getAttribute("x");
  document.getElementsByTagName("svg")[0].viewBox.baseVal.y = toEl.getAttribute("y");
}

InkWeb.setAtt = function (conf) {
  if ( ! conf.el.join )
    conf.to = [ conf.el ];
  conf.att = conf.att.split( /\s+/ );
  conf.val = conf.val.split( /\s+/ );
  for ( var el,elN=0; el=conf.el[elN]; elN++ ) {
    if ( typeof(el) == "string" )
      el = document.getElementById( el );
    for ( var att,i=0; att=conf.att[i]; i++ ) {
      if (
           att == "width"  ||
           att == "height" ||
           att == "x"  ||
           att == "y"  ||
           att == "cx" ||
           att == "cy" ||
           att == "r"  ||
           att == "rx" ||
           att == "ry" ||
           att == "transform"
         ) {
        el.setAttribute( att, conf.val[i] );
      } else {
        this.setStyle( el, att, conf.val[i] );
      }
    }
  }
}

InkWeb.moveElTo = function (startConf) {
  if ( typeof(startConf) == "string" ) {
    // startConf may be only a element Id, to timeout recursive calls.
    var el = document.getElementById( startConf );
  } else {
    if ( typeof(startConf.el) == "string" )
      startConf.el = document.getElementById( startConf.el );
    var el = startConf.el;
  }
  if ( ! el.inkWebMoving ) {
    el.inkWebMoving = {
      step: 0
    };
  }
  var conf = el.inkWebMoving;
  if ( conf.step == 0 ) {
    conf.x = startConf.x;
    conf.y = startConf.y;
    // dur : duration of the animation in seconds
    if ( startConf.dur ) { conf.dur = startConf.dur }
    else { conf.dur = 1 }
    // steps : animation steps in a second
    if ( startConf.stepsBySec ) { conf.stepsBySec = startConf.stepsBySec }
    else { conf.stepsBySec = 16 }
    conf.sleep = Math.round( 1000 / conf.stepsBySec );
    conf.steps = conf.dur * conf.stepsBySec;
    var startPos = el.getBBox();
    conf.xInc = ( conf.x - startPos.x ) / conf.steps;
    conf.yInc = ( conf.y - startPos.y ) / conf.steps;
    conf.transform = el.transform.baseVal.consolidate();
    if ( ! conf.transform ) {
      conf.transform = el.ownerSVGElement.createSVGTransform();
    }
    el.transform.baseVal.clear();
    el.transform.baseVal.appendItem(conf.transform);
  }
  if ( conf.step < conf.steps ) {
    conf.step++;
    conf.transform.matrix.e += conf.xInc;
    conf.transform.matrix.f += conf.yInc;
    try{ el.ownerSVGElement.forceRedraw() }
    catch(e){ this.log(e, "this "+el.ownerSVGElement+" has no forceRedraw().") }
    conf.timeout = setTimeout( 'InkWeb.moveElTo("'+el.id+'")', conf.sleep );
  } else {
    delete el.inkWebMoving;
  }
}

InkWeb.moveViewbox = function (conf) {
  if ( typeof(conf.from) == "string" )
    conf.from = document.getElementById( conf.from );
  if ( ! conf.to )
    conf.to = conf.from ;
  if ( typeof(conf.to) == "string" )
      conf.to = document.getElementById( conf.to );
  bbox = conf.to.getBBox();
  vbox = document.getElementsByTagName("svg")[0].viewBox;
  document.getElementsByTagName("svg")[0].viewBox.baseVal.x=bbox.x;
  document.getElementsByTagName("svg")[0].viewBox.baseVal.y=bbox.y;
  document.getElementsByTagName("svg")[0].viewBox.baseVal.width=bbox.width;
  document.getElementsByTagName("svg")[0].viewBox.baseVal.height=bbox.height;
  document.getElementsByTagName("svg")[0].viewBox.animVal.x=bbox.x;
  document.getElementsByTagName("svg")[0].viewBox.animVal.y=bbox.y;
  document.getElementsByTagName("svg")[0].viewBox.animVal.width=bbox.width;
  document.getElementsByTagName("svg")[0].viewBox.animVal.heigt=bbox.height;
  vbox = document.getElementsByTagName("svg")[0].viewBox;
}

InkWeb.log = function () { /* requires inkweb-debug.js, not included in Inkscape */ }
]]></svg:script><defs id="defs33">
    <marker inkscape:stockid="Arrow2Lstart" orient="auto" refY="0.0" refX="0.0" id="Arrow2Lstart" style="overflow:visible" inkscape:isstock="true">
      <path id="path859" style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round;stroke:#000000;stroke-opacity:1;fill:#000000;fill-opacity:1" 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(1.1) translate(1,0)"/>
    </marker>
  </defs>
  <sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10" gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-width="1920" inkscape:window-height="1017" id="base" showgrid="true" inkscape:snap-text-baseline="true" inkscape:zoom="0.6675088" inkscape:cx="202.7349" inkscape:cy="481.16986" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="webslicer-layer">
    <inkscape:grid type="xygrid" id="grid27" spacingx="10" spacingy="10" empspacing="10" color="#8080ff" opacity="0.25098039" empcolor="#0000ff" empopacity="0.25098039"/>
  </sodipodi:namedview>
  <g inkscape:groupmode="layer" id="webslicer-layer" inkscape:label="Slide3" style="display:inline">
    <rect height="201.49811" width="248.69112" y="353.92661" x="651.3089" id="slicerect1" style="opacity:0.5;fill:#ff0000;stroke-width:1.11927199">
      <desc id="desc51">format: png
dpi: 96
layout-disposition: bg-el-norepeat
layout-position-anchor: tl</desc>
    </rect>
  </g>
  <g inkscape:groupmode="layer" id="layer2" inkscape:label="Slide2" style="display:inline">
    <circle style="display:inline;fill:#000080;stroke:none" id="c1" cx="150" cy="450" r="50" inkscape:label="#path3736"/>
    <ellipse style="display:inline;fill:none;stroke:#ff0000;stroke-width:16" id="c2" cx="400" cy="450" rx="100" ry="50" inkscape:label="#path3738"/>
    <path style="display:inline;fill:#ffff00;stroke:#008000;stroke-width:16" id="c3" sodipodi:type="arc" sodipodi:cx="700" sodipodi:cy="450" sodipodi:rx="100" sodipodi:ry="50" sodipodi:start="0.59013865" sodipodi:end="5.6484511" d="m 783.08635,477.82381 a 100,50 0 0 1 -111.09848,20.17442 100,50 0 0 1 -71.96301,-46.88343 100,50 0 0 1 67.71127,-48.44091 100,50 0 0 1 112.7868,17.67793 L 700,450 Z" inkscape:label="#path3740"/>
    <path style="display:inline;fill:none;stroke:#000000;stroke-width:10;marker-start:url(#Arrow2Lstart)" d="M 100,600 200,700 300,600 400,700" id="p1" inkscape:connector-curvature="0" inkscape:label="#path3746" onclick="InkWeb.moveViewbox({from:this, to:'r3'});"/>
    <path style="display:inline;fill:none;stroke:#000000;stroke-width:10" d="m 500,600 c 0,0 0,100 100,100 100,0 0,-100 100,-100 100,0 100,100 100,100" id="p2" inkscape:connector-curvature="0" inkscape:label="#path3748"/>
    <path sodipodi:type="star" style="display:inline;fill:#ffff00;stroke:#008000;stroke-width:10" id="s1" sodipodi:sides="5" sodipodi:cx="189.03001" sodipodi:cy="847.93945" sodipodi:r1="69.364868" sodipodi:r2="34.682434" sodipodi:arg1="0.63598373" sodipodi:arg2="1.2643023" inkscape:flatsided="false" inkscape:rounded="0" inkscape:randomized="0" d="m 244.8332,889.14005 -45.33887,-8.13446 -32.40428,32.73753 -6.27415,-45.63352 -41.14872,-20.70184 41.46124,-20.06861 6.97297,-45.53197 31.89861,33.23044 45.45824,-7.43847 -21.74681,40.60615 z" inkscape:transform-center-x="6.4673011" inkscape:transform-center-y="-0.16430137"/>
    <use style="display:inline" x="0" y="0" xlink:href="#s1" inkscape:transform-center-x="6.4673011" inkscape:transform-center-y="-0.16430137" id="u1" transform="translate(200,2.9962152)" width="100%" height="100%" inkscape:label="#use3808"/>
  </g>
  <g inkscape:label="Slide1" inkscape:groupmode="layer" id="layer1" style="display:inline">
    <text xml:space="preserve" style="font-size:14.66666698px;line-height:1.25;font-family:sans-serif;fill:#000000;stroke:none" x="100" y="100" id="t1" inkscape:label="#text12"><tspan sodipodi:role="line" id="tspan10" x="100" y="100">Hello World</tspan></text>
    <flowRoot xml:space="preserve" id="t4" style="font-size:40px;line-height:1.25;font-family:sans-serif;fill:#000000;stroke:none" transform="matrix(0.26458333,0,0,0.26458333,372.02961,28.904505)" inkscape:label="#flowRoot14"><flowRegion id="flowRegion16"><rect id="rect18" width="264.5675" height="262.16187" x="105.71429" y="219.66254"/></flowRegion><flowPara id="flowPara20" style="font-size:55.43307114px">flow text which wraps</flowPara></flowRoot>    <text xml:space="preserve" style="font-size:14.66666698px;line-height:1.25;font-family:sans-serif;fill:#000000;stroke:none" x="200" y="100" id="t2" inkscape:label="#text3727"><tspan sodipodi:role="line" id="tspan3725" x="200" y="100" style="font-size:14.66666698px">UPPER</tspan></text>
    <text xml:space="preserve" style="font-size:10.58333302px;line-height:1.25;font-family:sans-serif;fill:#000000;stroke:none" x="300" y="100" id="t3" inkscape:label="#text3735"><tspan sodipodi:role="line" id="tspan3733" x="300" y="100" style="font-size:14.66666698px">Multi line</tspan><tspan sodipodi:role="line" x="300" y="118.33334" id="tspan3737" style="font-size:14.66666698px">text</tspan><tspan sodipodi:role="line" x="300" y="136.66667" id="tspan3739" style="font-size:14.66666698px">FOO</tspan></text>
    <g id="t5" transform="translate(445.71038,-129.64807)" inkscape:label="#g3772">
      <text id="text3762" y="229.64807" x="54.289616" style="font-size:10.58333302px;line-height:1.25;font-family:sans-serif;fill:#000000;stroke:none" xml:space="preserve"><tspan y="229.64807" x="54.289616" id="tspan3760" sodipodi:role="line" style="font-size:14.66666698px">Grouped</tspan></text>
      <text id="text3766" y="259.64807" x="54.289619" style="font-size:14.66666698px;line-height:1.25;font-family:sans-serif;fill:#000000;stroke:none" xml:space="preserve"><tspan y="259.64807" x="54.289619" id="tspan3764" sodipodi:role="line" style="font-size:14.66666698px">text</tspan></text>
    </g>
    <rect style="fill:#000080;stroke:none" id="r1" width="100" height="100" x="100" y="200" inkscape:label="#rect3732"/>
    <rect style="fill:none;stroke:#ff0000;stroke-width:16" id="r2" width="200" height="100" x="300" y="200" inkscape:label="#rect3734"/>
    <rect style="fill:#ffff00;stroke:#008000;stroke-width:16" id="r3" width="200" height="100" x="600" y="200" ry="38.950798" rx="44.943226" inkscape:label="#rect3744"/>
  </g>
  <script ns1:version="1.5.5" id="JessyInk">// dummy
</script>
</svg>