Documentation typo fixes.
authorDmitry Baranovskiy <Dmitry@Baranovskiy.com>
Mon, 21 Mar 2011 11:36:31 +0000 (22:36 +1100)
committerDmitry Baranovskiy <Dmitry@Baranovskiy.com>
Mon, 21 Mar 2011 11:36:31 +0000 (22:36 +1100)
dr.css
raphael-src.html
raphael.js
reference.html

diff --git a/dr.css b/dr.css
index c189499..a4adc4c 100644 (file)
--- a/dr.css
+++ b/dr.css
@@ -18,16 +18,16 @@ html, body {
     background: #eee;
     border-right: solid #eee 3px;
     float: right;
-    font: 300 100.01%/1.4 "Myriad Pro", "Helvetica Neue", Helvetica, "Arial Unicode MS", Arial, sans-serif;
+    font: 300 16px/1.4 "Myriad Pro", "Helvetica Neue", Helvetica, "Arial Unicode MS", Arial, sans-serif;
     height: 100%;
     margin: 0;
     overflow: auto;
-    padding: 0 2em;
-    width: 60em;
+    padding: 0 30px;
+    width: 800px;
 }
 .dr-toc {
     margin: 0;
-    padding: 0 1em;
+    padding: 0 16px;
     background: #ddd;
     list-style: none;
     font-family: Menlo, Consolas, Monaco, "Lucida Console", monospace;
@@ -35,11 +35,11 @@ html, body {
     border-right: solid #ddd 3px;
     height: 100%;
     float: right;
-    width: 15em;
+    width: 240px;
 }
 #dr {
     margin: 0 auto;
-    width: 82em;
+    width: 1152px;
     height: 100%;
 }
 ::-moz-selection {
@@ -63,8 +63,8 @@ pre.code {
     background: #333;
     color: #fff;
     overflow-x: auto;
-    padding: 1em 2.5em;
-    margin: 0 -2.5em;
+    padding: 16px 30px;
+    margin: 0 -30px;
 }
 code b {
     color: #e9df8f;
@@ -92,21 +92,21 @@ em.amp {
     font-style: italic;
 }
 dl.dr-parameters {
-    margin: .5em 0;
+    margin: 8px 0;
 }
 dt.dr-param {
     color: #666;
     font-weight: 400;
     float: left;
-    margin-right: 1em;
-    min-width: 10em;
+    margin-right: 16px;
+    min-width: 160px;
 }
 dd.dr-type {
     margin: 0;
 }
 dd.dr-description {
     display: table;
-    min-height: 1.5em;
+    min-height: 24px;
     border: solid 1px #eee;
 }
 .dr-type {
@@ -115,46 +115,57 @@ dd.dr-description {
 .dr-type em,
 .dr-returns em,
 .dr-property em {
-    -moz-border-radius: .3em;
-    -webkit-border-radius: .3em;
+    -moz-border-radius: 5px;
+    -webkit-border-radius: 5px;
     background: #ccc;
-    border-radius: .3em;
-    display: block;
+    border-radius: 5px;
     float: left;
     font-size: .75em;
     font-style: normal;
     font-weight: 700;
-    margin: .2em .5em .2em 0;
-    min-width: 5em;
-    padding: .1em .5em;
+    margin: 0 8px 0 0;
+    min-width: 80px;
+    padding: 2px 5px;
     text-align: center;
 }
+.dr-type em.amp,
+.dr-returns em.amp,
+.dr-property em.amp {
+    float: none;
+    background: none;
+    font-size: 1em;
+    font-weight: 400;
+    font-style: italic;
+    margin: 0;
+    padding: 0;
+    min-width: 0;
+}
 .dr-property em.dr-type {
-    margin: .23em 1em 0 0;
+    margin: 4px 16px 0 0;
 }
 em.dr-type-string {
-    background: #e5ff7f;
-    color: #667f00;
+    background: #e1edb1;
+    color: #3d4c00;
 }
 em.dr-type-object {
-    background: #ff7f7f;
-    color: #7f0000;
+    background: #edb1b1;
+    color: #4c0000;
 }
 em.dr-type-function {
-    background: #bf7fff;
-    color: #3f007f;
+    background: #cfb1ed;
+    color: #26004c;
 }
 em.dr-type-number {
-    background: #7fb2ff;
-    color: #00327f;
+    background: #b1c9ed;
+    color: #001e4c;
 }
 em.dr-type-boolean {
-    background: #7fffb2;
-    color: #007f32;
+    background: #b1edc9;
+    color: #004c1e;
 }
 em.dr-type-array {
-    background: #ffcc7f;
-    color: #7f4c00;
+    background: #edd5b1;
+    color: #4c2d00;
 }
 dd.dr-optional {
     display: none;
@@ -162,20 +173,20 @@ dd.dr-optional {
 ol.dr-json {
     background: #ddd;
     list-style: none;
-    margin: 0 -2em;
-    padding: 1em 2em;
+    margin: 0 -30px;
+    padding: 16px 30px;
 }
 ol.dr-json .dr-json-key {
     float: left;
-    min-width: 3em;
-    margin-right: 1em;
+    min-width: 50px;
+    margin-right: 16px;
 }
 ol.dr-json .dr-json-description {
     display: table;
 }
 ol.dr-json ol.dr-json  {
     margin: 0;
-    padding: 0 0 0 3em;
+    padding: 0 0 0 50px;
 }
 h1 {
     font-weight: 400;
@@ -183,22 +194,22 @@ h1 {
     margin: 0;
 }
 h2, h3, h4, h5 {
-    margin: 1em 0;
-    padding: .4em 0 0;
-    font-weight: 100;
+    margin: 1em 0 .5em 0;
+    padding: 6px 0 0;
+    font-weight: 600;
     position: relative;
 }
 h5 {
-    font-size: 1.1em;
+    font-size: 18px;
 }
 h4 {
-    font-size: 1.2em;
+    font-size: 20px;
 }
 h3 {
-    font-size: 1.8em;
+    font-size: 28px;
 }
 h2 {
-    font-size: 2.4em;
+    font-size: 38px;
 }
 h2.dr-method,
 h3.dr-method,
@@ -212,23 +223,35 @@ h4.dr-property,
 h5.dr-property {
     color: #009;
 }
+i.dr-trixie {
+    border: solid 10px #eee;
+    border-left-color: #999;
+    height: 0;
+    margin-left: -30px;
+    margin-top: -10px;
+    overflow: hidden;
+    position: absolute;
+    top: 50%;
+    width: 0;
+}
 p.header {
-    font-size: 1.2em;
-    font-weight: 200;
+    font-size: 19px;
+    font-weight: 600;
+    margin: 1em 0 .3em;
 }
 .dr-returns {
-    margin-top: 1em;
+    margin-top: 16px;
 }
 .dr-returns .dr-title {
     float: left;
-    margin-right: 1em;
-    width: 10em;
+    margin-right: 16px;
+    width: 160px;
 }
 .dr-toc a {
     display: block;
     text-decoration: none;
     color: #333;
-    padding-top: .5em;
+    padding-top: 8px;
     position: relative;
     z-index: 1000;
 }
@@ -331,7 +354,6 @@ p {
     background: #333;
 }
 #src-dr-js code:hover .ln {
-/*    background: #666;*/
     color: #fff;
 }
 #src-dr-js code .ln {
index 8a100f1..a54e890 100644 (file)
@@ -17,7 +17,7 @@
 </span></code><code id="L15"><span class="ln">15</span><span class="c">    <span class="s"> * </span>from <b>this</b> instance will be bound to <b>this</b> canvas.
 </span></code><code id="L16"><span class="ln">16</span><span class="c">     > Parameters
 </span></code><code id="L17"><span class="ln">17</span><span class="c">     **
-</span></code><code id="L18"><span class="ln">18</span><span class="c">    <span class="s"> - </span>container (HTMLElement|string) DOM element or it’s id which is going to be a parent <b>for</b> drawing surface
+</span></code><code id="L18"><span class="ln">18</span><span class="c">    <span class="s"> - </span>container (HTMLElement|string) DOM element or its ID which is going to be a parent <b>for</b> drawing surface
 </span></code><code id="L19"><span class="ln">19</span><span class="c">    <span class="s"> - </span>width (number)
 </span></code><code id="L20"><span class="ln">20</span><span class="c">    <span class="s"> - </span>height (number)
 </span></code><code id="L21"><span class="ln">21</span><span class="c">    <span class="s"> * </span>or
 </span></code><code id="L29"><span class="ln">29</span><span class="c">    <span class="s"> - </span>onReadyCallback (<b>function</b>) <b>function</b> that is going to be called on DOM ready event. You can also subscribe to <b>this</b> event via Eve’s “DOMLoad” event. In <b>this</b> <b>case</b> method returns `<b>undefined</b>`.
 </span></code><code id="L30"><span class="ln">30</span><span class="c">    <span class="s"> = </span>(object) @Paper
 </span></code><code id="L31"><span class="ln">31</span><span class="c">     > Usage
-</span></code><code id="L32"><span class="ln">32</span><span class="c">    <span class="s"> | </span><span class="c">// Each of the following examples create a canvas that is 320px wide by 200px high</span>
-</span></code><code id="L33"><span class="ln">33</span><span class="c">    <span class="s"> | </span><span class="c">// Canvas is created at the viewport’s <span class="d">10</span>,<span class="d">50</span> coordinate</span>
-</span></code><code id="L34"><span class="ln">34</span><span class="c">    <span class="s"> | </span><b>var</b> paper<span class="s"> = </span>Raphael(<span class="d">10</span>, <span class="d">50</span>, <span class="d">320</span>, <span class="d">200</span>);
-</span></code><code id="L35"><span class="ln">35</span><span class="c">    <span class="s"> | </span><span class="c">// Canvas is created at the top left corner of the #notepad element</span>
-</span></code><code id="L36"><span class="ln">36</span><span class="c">    <span class="s"> | </span><span class="c">// (or its top right corner <b>in</b> dir=<i>"rtl"</i> elements)</span>
-</span></code><code id="L37"><span class="ln">37</span><span class="c">    <span class="s"> | </span><b>var</b> paper<span class="s"> = </span>Raphael(document.getElementById(<i>"notepad"</i>), <span class="d">320</span>, <span class="d">200</span>);
-</span></code><code id="L38"><span class="ln">38</span><span class="c">    <span class="s"> | </span><span class="c">// Same as above</span>
-</span></code><code id="L39"><span class="ln">39</span><span class="c">    <span class="s"> | </span><b>var</b> paper<span class="s"> = </span>Raphael(<i>"notepad"</i>, <span class="d">320</span>, <span class="d">200</span>);
-</span></code><code id="L40"><span class="ln">40</span><span class="c">    <span class="s"> | </span><span class="c">// Image dump</span>
-</span></code><code id="L41"><span class="ln">41</span><span class="c">    <span class="s"> | </span><b>var</b> set<span class="s"> = </span>Raphael([<i>"notepad"</i>, <span class="d">320</span>, <span class="d">200</span>, {
-</span></code><code id="L42"><span class="ln">42</span><span class="c">    <span class="s"> | </span>    type: <i>"rect"</i>,
-</span></code><code id="L43"><span class="ln">43</span><span class="c">    <span class="s"> | </span>    x: <span class="d">10</span>,
-</span></code><code id="L44"><span class="ln">44</span><span class="c">    <span class="s"> | </span>    y: <span class="d">10</span>,
-</span></code><code id="L45"><span class="ln">45</span><span class="c">    <span class="s"> | </span>    width: <span class="d">25</span>,
-</span></code><code id="L46"><span class="ln">46</span><span class="c">    <span class="s"> | </span>    height: <span class="d">25</span>,
-</span></code><code id="L47"><span class="ln">47</span><span class="c">    <span class="s"> | </span>    stroke: <i>"#f00"</i>
-</span></code><code id="L48"><span class="ln">48</span><span class="c">    <span class="s"> | </span>}, {
-</span></code><code id="L49"><span class="ln">49</span><span class="c">    <span class="s"> | </span>    type: <i>"text"</i>,
-</span></code><code id="L50"><span class="ln">50</span><span class="c">    <span class="s"> | </span>    x: <span class="d">30</span>,
-</span></code><code id="L51"><span class="ln">51</span><span class="c">    <span class="s"> | </span>    y: <span class="d">40</span>,
-</span></code><code id="L52"><span class="ln">52</span><span class="c">    <span class="s"> | </span>    text: <i>"Dump"</i>
-</span></code><code id="L53"><span class="ln">53</span><span class="c">    <span class="s"> | </span>}]);
-</span></code><code id="L54"><span class="ln">54</span><span class="c">    \*/</span>
-</code><code id="L55"><span class="ln">55</span>    <b>function</b> R(first) {
-</code><code id="L56"><span class="ln">56</span>        <b>if</b> (R.is(first, <i>"<b>function</b>"</i>)) {
-</code><code id="L57"><span class="ln">57</span>            <b>return</b> eve.on(<i>"DOMload"</i>, first);
-</code><code id="L58"><span class="ln">58</span>        } <b>else</b> <b>if</b> (R.is(first, array)) {
-</code><code id="L59"><span class="ln">59</span>            <b>var</b> a<span class="s"> = </span>first,
-</code><code id="L60"><span class="ln">60</span>                cnv<span class="s"> = </span>create[apply](R, a.splice(<span class="d">0</span>, <span class="d">3</span><span class="s"> + </span>R.is(a[<span class="d">0</span>], nu))),
-</code><code id="L61"><span class="ln">61</span>                res<span class="s"> = </span>cnv.set(),
-</code><code id="L62"><span class="ln">62</span>                i<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L63"><span class="ln">63</span>                ii<span class="s"> = </span>a.length,
-</code><code id="L64"><span class="ln">64</span>                j;
-</code><code id="L65"><span class="ln">65</span>            <b>for</b> (; i &lt; ii; i++) {
-</code><code id="L66"><span class="ln">66</span>                j<span class="s"> = </span>a[i]<span class="s"> || </span>{};
-</code><code id="L67"><span class="ln">67</span>                elements[has](j.type)<span class="s"> &amp;&amp; </span>res.push(cnv[j.type]().attr(j));
-</code><code id="L68"><span class="ln">68</span>            }
-</code><code id="L69"><span class="ln">69</span>            <b>return</b> res;
-</code><code id="L70"><span class="ln">70</span>        }
-</code><code id="L71"><span class="ln">71</span>        <b>return</b> create[apply](R, arguments);
-</code><code id="L72"><span class="ln">72</span>    }
-</code><code id="L73"><span class="ln">73</span>    R.version<span class="s"> = </span><i>"<span class="d">2.0</span><span class="d">.0</span>"</i>;
-</code><code id="L74"><span class="ln">74</span>    <b>var</b> separator<span class="s"> = </span>/[, ]+/,
-</code><code id="L75"><span class="ln">75</span>        elements<span class="s"> = </span>{circle: <span class="d">1</span>, rect: <span class="d">1</span>, path: <span class="d">1</span>, ellipse: <span class="d">1</span>, text: <span class="d">1</span>, image: <span class="d">1</span>},
-</code><code id="L76"><span class="ln">76</span>        formatrg<span class="s"> = </span>/\{(\d+)\}/g,
-</code><code id="L77"><span class="ln">77</span>        proto<span class="s"> = </span><i>"prototype"</i>,
-</code><code id="L78"><span class="ln">78</span>        has<span class="s"> = </span><i>"hasOwnProperty"</i>,
-</code><code id="L79"><span class="ln">79</span>        g<span class="s"> = </span>{
-</code><code id="L80"><span class="ln">80</span>            doc: document,
-</code><code id="L81"><span class="ln">81</span>            win: window
-</code><code id="L82"><span class="ln">82</span>        },
-</code><code id="L83"><span class="ln">83</span>        oldRaphael<span class="s"> = </span>{
-</code><code id="L84"><span class="ln">84</span>            was: Object.prototype[has].call(g.win, <i>"Raphael"</i>),
-</code><code id="L85"><span class="ln">85</span>            is: g.win.Raphael
-</code><code id="L86"><span class="ln">86</span>        },
-</code><code id="L87"><span class="ln">87</span>        Paper<span class="s"> = </span><b>function</b> () {},
-</code><code id="L88"><span class="ln">88</span>        paperproto,
-</code><code id="L89"><span class="ln">89</span>        appendChild<span class="s"> = </span><i>"appendChild"</i>,
-</code><code id="L90"><span class="ln">90</span>        apply<span class="s"> = </span><i>"apply"</i>,
-</code><code id="L91"><span class="ln">91</span>        concat<span class="s"> = </span><i>"concat"</i>,
-</code><code id="L92"><span class="ln">92</span>        supportsTouch<span class="s"> = </span><i>"createTouch"</i> <b>in</b> g.doc,
-</code><code id="L93"><span class="ln">93</span>        E<span class="s"> = </span><i>""</i>,
-</code><code id="L94"><span class="ln">94</span>        S<span class="s"> = </span><i>" "</i>,
-</code><code id="L95"><span class="ln">95</span>        Str<span class="s"> = </span>String,
-</code><code id="L96"><span class="ln">96</span>        split<span class="s"> = </span><i>"split"</i>,
-</code><code id="L97"><span class="ln">97</span>        events<span class="s"> = </span><i>"click dblclick mousedown mousemove mouseout mouseover mouseup touchstart touchmove touchend orientationchange touchcancel gesturestart gesturechange gestureend"</i>.split(S),
-</code><code id="L98"><span class="ln">98</span>        touchMap<span class="s"> = </span>{
-</code><code id="L99"><span class="ln">99</span>            mousedown: <i>"touchstart"</i>,
-</code><code id="L100"><span class="ln">100</span>            mousemove: <i>"touchmove"</i>,
-</code><code id="L101"><span class="ln">101</span>            mouseup: <i>"touchend"</i>
-</code><code id="L102"><span class="ln">102</span>        },
-</code><code id="L103"><span class="ln">103</span>        lowerCase<span class="s"> = </span>Str.prototype.toLowerCase,
-</code><code id="L104"><span class="ln">104</span>        math<span class="s"> = </span>Math,
-</code><code id="L105"><span class="ln">105</span>        mmax<span class="s"> = </span>math.max,
-</code><code id="L106"><span class="ln">106</span>        mmin<span class="s"> = </span>math.min,
-</code><code id="L107"><span class="ln">107</span>        abs<span class="s"> = </span>math.abs,
-</code><code id="L108"><span class="ln">108</span>        pow<span class="s"> = </span>math.pow,
-</code><code id="L109"><span class="ln">109</span>        PI<span class="s"> = </span>math.PI,
-</code><code id="L110"><span class="ln">110</span>        nu<span class="s"> = </span><i>"number"</i>,
-</code><code id="L111"><span class="ln">111</span>        string<span class="s"> = </span><i>"string"</i>,
-</code><code id="L112"><span class="ln">112</span>        array<span class="s"> = </span><i>"array"</i>,
-</code><code id="L113"><span class="ln">113</span>        toString<span class="s"> = </span><i>"toString"</i>,
-</code><code id="L114"><span class="ln">114</span>        fillString<span class="s"> = </span><i>"fill"</i>,
-</code><code id="L115"><span class="ln">115</span>        objectToString<span class="s"> = </span>Object.prototype.toString,
-</code><code id="L116"><span class="ln">116</span>        paper<span class="s"> = </span>{},
-</code><code id="L117"><span class="ln">117</span>        push<span class="s"> = </span><i>"push"</i>,
-</code><code id="L118"><span class="ln">118</span>        ISURL<span class="s"> = </span>/^url\([<i>'"]?([^\)]+?)['</i>"]?\)$/i,
-</code><code id="L119"><span class="ln">119</span>        colourRegExp<span class="s"> = </span>/^\s*((#[a-f\d]{<span class="d">6</span>})|(#[a-f\d]{<span class="d">3</span>})|rgba?\(\s*([\d\.]+%?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\)|hsba?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\)|hsla?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\))\s*$/i,
-</code><code id="L120"><span class="ln">120</span>        isnan<span class="s"> = </span>{<i>"NaN"</i>: <span class="d">1</span>, <i>"Infinity"</i>: <span class="d">1</span>, <i>"-Infinity"</i>: <span class="d">1</span>},
-</code><code id="L121"><span class="ln">121</span>        bezierrg<span class="s"> = </span>/^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/,
-</code><code id="L122"><span class="ln">122</span>        round<span class="s"> = </span>math.round,
-</code><code id="L123"><span class="ln">123</span>        setAttribute<span class="s"> = </span><i>"setAttribute"</i>,
-</code><code id="L124"><span class="ln">124</span>        toFloat<span class="s"> = </span>parseFloat,
-</code><code id="L125"><span class="ln">125</span>        toInt<span class="s"> = </span>parseInt,
-</code><code id="L126"><span class="ln">126</span>        ms<span class="s"> = </span><i>" progid:DXImageTransform.Microsoft"</i>,
-</code><code id="L127"><span class="ln">127</span>        upperCase<span class="s"> = </span>Str.prototype.toUpperCase,
-</code><code id="L128"><span class="ln">128</span>        availableAttrs<span class="s"> = </span>{<i>"arrow-end"</i>: <i>"none"</i>, <i>"arrow-start"</i>: <i>"none"</i>, blur: <span class="d">0</span>, <i>"clip-rect"</i>: <i>"<span class="d">0</span> <span class="d">0</span> <span class="d">1e9</span> <span class="d">1e9</span>"</i>, cursor: <i>"<b>default</b>"</i>, cx: <span class="d">0</span>, cy: <span class="d">0</span>, fill: <i>"#fff"</i>, <i>"fill-opacity"</i>: <span class="d">1</span>, font: <i>'10px "Arial"'</i>, <i>"font-family"</i>: <i>'"Arial"'</i>, <i>"font-size"</i>: <i>"<span class="d">10</span>"</i>, <i>"font-style"</i>: <i>"normal"</i>, <i>"font-weight"</i>: <span class="d">400</span>, gradient: <span class="d">0</span>, height: <span class="d">0</span>, href: <i>"http:<span class="c">//raphaeljs.com/"</i>, opacity: <span class="d">1</span>, path: <i>"M0,<span class="d">0</span>"</i>, r: <span class="d">0</span>, rx: <span class="d">0</span>, ry: <span class="d">0</span>, src: <i>""</i>, stroke: <i>"#<span class="d">000</span>"</i>, <i>"stroke-dasharray"</i>: <i>""</i>, <i>"stroke-linecap"</i>: <i>"butt"</i>, <i>"stroke-linejoin"</i>: <i>"butt"</i>, <i>"stroke-miterlimit"</i>: <span class="d">0</span>, <i>"stroke-opacity"</i>: <span class="d">1</span>, <i>"stroke-width"</i>: <span class="d">1</span>, target: <i>"_blank"</i>, <i>"text-anchor"</i>: <i>"middle"</i>, title: <i>"Raphael"</i>, transform: <i>""</i>, width: <span class="d">0</span>, x: <span class="d">0</span>, y: <span class="d">0</span>},</span>
-</code><code id="L129"><span class="ln">129</span>        availableAnimAttrs<span class="s"> = </span>{blur: nu, <i>"clip-rect"</i>: <i>"csv"</i>, cx: nu, cy: nu, fill: <i>"colour"</i>, <i>"fill-opacity"</i>: nu, <i>"font-size"</i>: nu, height: nu, opacity: nu, path: <i>"path"</i>, r: nu, rx: nu, ry: nu, stroke: <i>"colour"</i>, <i>"stroke-opacity"</i>: nu, <i>"stroke-width"</i>: nu, transform: <i>"transform"</i>, width: nu, x: nu, y: nu},
-</code><code id="L130"><span class="ln">130</span>        commaSpaces<span class="s"> = </span>/\s*,\s*/,
-</code><code id="L131"><span class="ln">131</span>        hsrg<span class="s"> = </span>{hs: <span class="d">1</span>, rg: <span class="d">1</span>},
-</code><code id="L132"><span class="ln">132</span>        p2s<span class="s"> = </span>/,?([achlmqrstvxz]),?/gi,
-</code><code id="L133"><span class="ln">133</span>        pathCommand<span class="s"> = </span>/([achlmqstvz])[\s,]*((-?\d*\.?\d*(?:e[-+]?\d+)?\s*,?\s*)+)/ig,
-</code><code id="L134"><span class="ln">134</span>        tCommand<span class="s"> = </span>/([rstm])[\s,]*((-?\d*\.?\d*(?:e[-+]?\d+)?\s*,?\s*)+)/ig,
-</code><code id="L135"><span class="ln">135</span>        pathValues<span class="s"> = </span>/(-?\d*\.?\d*(?:e[-+]?\d+)?)\s*,?\s*/ig,
-</code><code id="L136"><span class="ln">136</span>        radial_gradient<span class="s"> = </span>/^r(?:\(([^,]+?)\s*,\s*([^\)]+?)\))?/,
-</code><code id="L137"><span class="ln">137</span>        sortByKey<span class="s"> = </span><b>function</b> (a, b) {
-</code><code id="L138"><span class="ln">138</span>            <b>return</b> a.key<span class="s"> - </span>b.key;
-</code><code id="L139"><span class="ln">139</span>        },
-</code><code id="L140"><span class="ln">140</span>        sortByNumber<span class="s"> = </span><b>function</b> (a, b) {
-</code><code id="L141"><span class="ln">141</span>            <b>return</b> a<span class="s"> - </span>b;
-</code><code id="L142"><span class="ln">142</span>        },
-</code><code id="L143"><span class="ln">143</span>        fun<span class="s"> = </span><b>function</b> () {},
-</code><code id="L144"><span class="ln">144</span>        pipe<span class="s"> = </span><b>function</b> (x) {
-</code><code id="L145"><span class="ln">145</span>            <b>return</b> x;
-</code><code id="L146"><span class="ln">146</span>        },
-</code><code id="L147"><span class="ln">147</span>        rectPath<span class="s"> = </span><b>function</b> (x, y, w, h, r) {
-</code><code id="L148"><span class="ln">148</span>            <b>if</b> (r) {
-</code><code id="L149"><span class="ln">149</span>                <b>return</b> [[<i>"M"</i>, x<span class="s"> + </span>r, y], [<i>"l"</i>, w<span class="s"> - </span>r<span class="s"> * </span><span class="d">2</span>, <span class="d">0</span>], [<i>"a"</i>, r, r, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, r, r], [<i>"l"</i>, <span class="d">0</span>, h<span class="s"> - </span>r<span class="s"> * </span><span class="d">2</span>], [<i>"a"</i>, r, r, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, -r, r], [<i>"l"</i>, r<span class="s"> * </span><span class="d">2</span><span class="s"> - </span>w, <span class="d">0</span>], [<i>"a"</i>, r, r, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, -r, -r], [<i>"l"</i>, <span class="d">0</span>, r<span class="s"> * </span><span class="d">2</span><span class="s"> - </span>h], [<i>"a"</i>, r, r, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, r, -r], [<i>"z"</i>]];
-</code><code id="L150"><span class="ln">150</span>            }
-</code><code id="L151"><span class="ln">151</span>            <b>return</b> [[<i>"M"</i>, x, y], [<i>"l"</i>, w, <span class="d">0</span>], [<i>"l"</i>, <span class="d">0</span>, h], [<i>"l"</i>, -w, <span class="d">0</span>], [<i>"z"</i>]];
-</code><code id="L152"><span class="ln">152</span>        },
-</code><code id="L153"><span class="ln">153</span>        ellipsePath<span class="s"> = </span><b>function</b> (x, y, rx, ry) {
-</code><code id="L154"><span class="ln">154</span>            <b>if</b> (ry<span class="s"> == </span><b>null</b>) {
-</code><code id="L155"><span class="ln">155</span>                ry<span class="s"> = </span>rx;
-</code><code id="L156"><span class="ln">156</span>            }
-</code><code id="L157"><span class="ln">157</span>            <b>return</b> [[<i>"M"</i>, x, y], [<i>"m"</i>, <span class="d">0</span>, -ry], [<i>"a"</i>, rx, ry, <span class="d">0</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">0</span>, <span class="d">2</span><span class="s"> * </span>ry], [<i>"a"</i>, rx, ry, <span class="d">0</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">0</span>, -<span class="d">2</span><span class="s"> * </span>ry], [<i>"z"</i>]];
-</code><code id="L158"><span class="ln">158</span>        },
-</code><code id="L159"><span class="ln">159</span>        getPath<span class="s"> = </span>{
-</code><code id="L160"><span class="ln">160</span>            path: <b>function</b> (el) {
-</code><code id="L161"><span class="ln">161</span>                <b>return</b> el.attr(<i>"path"</i>);
-</code><code id="L162"><span class="ln">162</span>            },
-</code><code id="L163"><span class="ln">163</span>            circle: <b>function</b> (el) {
-</code><code id="L164"><span class="ln">164</span>                <b>var</b> a<span class="s"> = </span>el.attrs;
-</code><code id="L165"><span class="ln">165</span>                <b>return</b> ellipsePath(a.cx, a.cy, a.r);
-</code><code id="L166"><span class="ln">166</span>            },
-</code><code id="L167"><span class="ln">167</span>            ellipse: <b>function</b> (el) {
-</code><code id="L168"><span class="ln">168</span>                <b>var</b> a<span class="s"> = </span>el.attrs;
-</code><code id="L169"><span class="ln">169</span>                <b>return</b> ellipsePath(a.cx, a.cy, a.rx, a.ry);
-</code><code id="L170"><span class="ln">170</span>            },
-</code><code id="L171"><span class="ln">171</span>            rect: <b>function</b> (el) {
-</code><code id="L172"><span class="ln">172</span>                <b>var</b> a<span class="s"> = </span>el.attrs;
-</code><code id="L173"><span class="ln">173</span>                <b>return</b> rectPath(a.x, a.y, a.width, a.height, a.r);
-</code><code id="L174"><span class="ln">174</span>            },
-</code><code id="L175"><span class="ln">175</span>            image: <b>function</b> (el) {
-</code><code id="L176"><span class="ln">176</span>                <b>var</b> a<span class="s"> = </span>el.attrs;
-</code><code id="L177"><span class="ln">177</span>                <b>return</b> rectPath(a.x, a.y, a.width, a.height);
-</code><code id="L178"><span class="ln">178</span>            },
-</code><code id="L179"><span class="ln">179</span>            text: <b>function</b> (el) {
-</code><code id="L180"><span class="ln">180</span>                <b>var</b> bbox<span class="s"> = </span>el._getBBox();
-</code><code id="L181"><span class="ln">181</span>                <b>return</b> rectPath(bbox.x, bbox.y, bbox.width, bbox.height);
-</code><code id="L182"><span class="ln">182</span>            }
-</code><code id="L183"><span class="ln">183</span>        },
-</code><code id="L184"><span class="ln">184</span>        mapPath<span class="s"> = </span><b>function</b> (path, matrix) {
-</code><code id="L185"><span class="ln">185</span>            <b>if</b> (!matrix) {
-</code><code id="L186"><span class="ln">186</span>                <b>return</b> path;
-</code><code id="L187"><span class="ln">187</span>            }
-</code><code id="L188"><span class="ln">188</span>            <b>var</b> x, y, i, j, pathi;
-</code><code id="L189"><span class="ln">189</span>            path<span class="s"> = </span>path2curve(path);
-</code><code id="L190"><span class="ln">190</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>path.length; i &lt; ii; i++) {
-</code><code id="L191"><span class="ln">191</span>                pathi<span class="s"> = </span>path[i];
-</code><code id="L192"><span class="ln">192</span>                <b>for</b> (j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>pathi.length; j &lt; jj; j += <span class="d">2</span>) {
-</code><code id="L193"><span class="ln">193</span>                    x<span class="s"> = </span>matrix.x(pathi[j], pathi[j<span class="s"> + </span><span class="d">1</span>]);
-</code><code id="L194"><span class="ln">194</span>                    y<span class="s"> = </span>matrix.y(pathi[j], pathi[j<span class="s"> + </span><span class="d">1</span>]);
-</code><code id="L195"><span class="ln">195</span>                    pathi[j]<span class="s"> = </span>x;
-</code><code id="L196"><span class="ln">196</span>                    pathi[j<span class="s"> + </span><span class="d">1</span>]<span class="s"> = </span>y;
-</code><code id="L197"><span class="ln">197</span>                }
-</code><code id="L198"><span class="ln">198</span>            }
-</code><code id="L199"><span class="ln">199</span>            <b>return</b> path;
-</code><code id="L200"><span class="ln">200</span>        };
-</code><code id="L201"><span class="ln">201</span>
-</code><code id="L202"><span class="ln">202</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L203"><span class="ln">203</span><span class="c">    <span class="s"> * </span>Raphael.type
-</span></code><code id="L204"><span class="ln">204</span><span class="c">     [ property (string) ]
-</span></code><code id="L205"><span class="ln">205</span><span class="c">     **
-</span></code><code id="L206"><span class="ln">206</span><span class="c">    <span class="s"> * </span>Can be “SVG”, “VML” or empty, depending on browser support.
-</span></code><code id="L207"><span class="ln">207</span><span class="c">    \*/</span>
-</code><code id="L208"><span class="ln">208</span>    R.type<span class="s"> = </span>(g.win.SVGAngle<span class="s"> || </span>g.doc.implementation.hasFeature(<i>"http:<span class="c">//www.w3.org/TR/SVG11/feature#BasicStructure"</i>, <i>"<span class="d">1.1</span>"</i>) ? <i>"SVG"</i> : <i>"VML"</i>);</span>
-</code><code id="L209"><span class="ln">209</span>    <b>if</b> (R.type<span class="s"> == </span><i>"VML"</i>) {
-</code><code id="L210"><span class="ln">210</span>        <b>var</b> d<span class="s"> = </span>g.doc.createElement(<i>"div"</i>),
-</code><code id="L211"><span class="ln">211</span>            b;
-</code><code id="L212"><span class="ln">212</span>        d.innerHTML<span class="s"> = </span><i>'&lt;v:shape adj="<span class="d">1</span>"/>'</i>;
-</code><code id="L213"><span class="ln">213</span>        b<span class="s"> = </span>d.firstChild;
-</code><code id="L214"><span class="ln">214</span>        b.style.behavior<span class="s"> = </span><i>"url(#<b>default</b>#VML)"</i>;
-</code><code id="L215"><span class="ln">215</span>        <b>if</b> (!(b<span class="s"> &amp;&amp; </span><b>typeof</b> b.adj<span class="s"> == </span><i>"object"</i>)) {
-</code><code id="L216"><span class="ln">216</span>            <b>return</b> R.type<span class="s"> = </span>E;
-</code><code id="L217"><span class="ln">217</span>        }
-</code><code id="L218"><span class="ln">218</span>        d<span class="s"> = </span><b>null</b>;
-</code><code id="L219"><span class="ln">219</span>    }
-</code><code id="L220"><span class="ln">220</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L221"><span class="ln">221</span><span class="c">    <span class="s"> * </span>Raphael.svg
-</span></code><code id="L222"><span class="ln">222</span><span class="c">     [ property (<b>boolean</b>) ]
-</span></code><code id="L223"><span class="ln">223</span><span class="c">     **
-</span></code><code id="L224"><span class="ln">224</span><span class="c">    <span class="s"> * </span>`<b>true</b>` <b>if</b> browser supports SVG.
-</span></code><code id="L225"><span class="ln">225</span><span class="c">    \*/</span>
-</code><code id="L226"><span class="ln">226</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L227"><span class="ln">227</span><span class="c">    <span class="s"> * </span>Raphael.vml
-</span></code><code id="L228"><span class="ln">228</span><span class="c">     [ property (<b>boolean</b>) ]
-</span></code><code id="L229"><span class="ln">229</span><span class="c">     **
-</span></code><code id="L230"><span class="ln">230</span><span class="c">    <span class="s"> * </span>`<b>true</b>` <b>if</b> browser supports VML.
-</span></code><code id="L231"><span class="ln">231</span><span class="c">    \*/</span>
-</code><code id="L232"><span class="ln">232</span>    R.svg<span class="s"> = </span>!(R.vml<span class="s"> = </span>R.type<span class="s"> == </span><i>"VML"</i>);
-</code><code id="L233"><span class="ln">233</span>    paperproto<span class="s"> = </span>Paper.prototype<span class="s"> = </span>R.prototype;
-</code><code id="L234"><span class="ln">234</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L235"><span class="ln">235</span><span class="c">    <span class="s"> * </span>Paper.customAttributes
-</span></code><code id="L236"><span class="ln">236</span><span class="c">     [ property (object) ]
-</span></code><code id="L237"><span class="ln">237</span><span class="c">     **
-</span></code><code id="L238"><span class="ln">238</span><span class="c">    <span class="s"> * </span>If you have a set of attributes that you would like to represent
-</span></code><code id="L239"><span class="ln">239</span><span class="c">    <span class="s"> * </span>as a <b>function</b> of some number you can <b>do</b> it easily <b>with</b> custom attributes:
-</span></code><code id="L240"><span class="ln">240</span><span class="c">     > Usage
-</span></code><code id="L241"><span class="ln">241</span><span class="c">    <span class="s"> | </span>paper.customAttributes.hue<span class="s"> = </span><b>function</b> (num) {
-</span></code><code id="L242"><span class="ln">242</span><span class="c">    <span class="s"> | </span>    num<span class="s"> = </span>num<span class="s"> % </span><span class="d">1</span>;
-</span></code><code id="L243"><span class="ln">243</span><span class="c">    <span class="s"> | </span>    <b>return</b> {fill: <i>"hsb("</i><span class="s"> + </span>num<span class="s"> + </span><i>", <span class="d">.75</span>, <span class="d">1</span>)"</i>};
-</span></code><code id="L244"><span class="ln">244</span><span class="c">    <span class="s"> | </span>};
-</span></code><code id="L245"><span class="ln">245</span><span class="c">    <span class="s"> | </span><span class="c">// Custom attribute “hue” will change fill</span>
-</span></code><code id="L246"><span class="ln">246</span><span class="c">    <span class="s"> | </span><span class="c">// to be given hue <b>with</b> fixed saturation and brightness.</span>
-</span></code><code id="L247"><span class="ln">247</span><span class="c">    <span class="s"> | </span><span class="c">// Now you can use it like <b>this</b>:</span>
-</span></code><code id="L248"><span class="ln">248</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.circle(<span class="d">10</span>, <span class="d">10</span>, <span class="d">10</span>).attr({hue: <span class="d">.45</span>});
-</span></code><code id="L249"><span class="ln">249</span><span class="c">    <span class="s"> | </span><span class="c">// or even like <b>this</b>:</span>
-</span></code><code id="L250"><span class="ln">250</span><span class="c">    <span class="s"> | </span>c.animate({hue: <span class="d">1</span>}, <span class="d">1e3</span>);
-</span></code><code id="L251"><span class="ln">251</span><span class="c">    <span class="s"> | </span>
-</span></code><code id="L252"><span class="ln">252</span><span class="c">    <span class="s"> | </span><span class="c">// You could also create custom attribute</span>
-</span></code><code id="L253"><span class="ln">253</span><span class="c">    <span class="s"> | </span><span class="c">// <b>with</b> multiple parameters:</span>
-</span></code><code id="L254"><span class="ln">254</span><span class="c">    <span class="s"> | </span>paper.customAttributes.hsb<span class="s"> = </span><b>function</b> (h, s, b) {
-</span></code><code id="L255"><span class="ln">255</span><span class="c">    <span class="s"> | </span>    <b>return</b> {fill: <i>"hsb("</i><span class="s"> + </span>[h, s, b].join(<i>","</i>)<span class="s"> + </span><i>")"</i>};
-</span></code><code id="L256"><span class="ln">256</span><span class="c">    <span class="s"> | </span>};
-</span></code><code id="L257"><span class="ln">257</span><span class="c">    <span class="s"> | </span>c.attr({hsb: <i>"<span class="d">.5</span> <span class="d">.8</span> <span class="d">1</span>"</i>});
-</span></code><code id="L258"><span class="ln">258</span><span class="c">    <span class="s"> | </span>c.animate({hsb: <i>"<span class="d">1</span> <span class="d">0</span> <span class="d">.5</span>"</i>}, <span class="d">1e3</span>);
-</span></code><code id="L259"><span class="ln">259</span><span class="c">    \*/</span>
-</code><code id="L260"><span class="ln">260</span>    paperproto.customAttributes<span class="s"> = </span>{};
-</code><code id="L261"><span class="ln">261</span>    R._id<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L262"><span class="ln">262</span>    R._oid<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L263"><span class="ln">263</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L264"><span class="ln">264</span><span class="c">    <span class="s"> * </span>Raphael.fn
-</span></code><code id="L265"><span class="ln">265</span><span class="c">     [ property (object) ]
-</span></code><code id="L266"><span class="ln">266</span><span class="c">     **
-</span></code><code id="L267"><span class="ln">267</span><span class="c">    <span class="s"> * </span>You can add your own method to the canvas. For example <b>if</b> you want to draw pie chart,
-</span></code><code id="L268"><span class="ln">268</span><span class="c">    <span class="s"> * </span>you can create your own pie chart <b>function</b> and ship it as a Raphaël plugin. To <b>do</b> <b>this</b>
-</span></code><code id="L269"><span class="ln">269</span><span class="c">    <span class="s"> * </span>you need to extend `Raphael.fn` object. Please note that you can create your own namespaces
-</span></code><code id="L270"><span class="ln">270</span><span class="c">    <span class="s"> * </span>inside `fn` object. Methods will be run <b>in</b> context of canvas anyway. You should alter `fn`
-</span></code><code id="L271"><span class="ln">271</span><span class="c">    <span class="s"> * </span>object before Raphaël instance was created, otherwise it will take no effect.
-</span></code><code id="L272"><span class="ln">272</span><span class="c">     > Usage
-</span></code><code id="L273"><span class="ln">273</span><span class="c">    <span class="s"> | </span>Raphael.fn.arrow<span class="s"> = </span><b>function</b> (x1, y1, x2, y2, size) {
-</span></code><code id="L274"><span class="ln">274</span><span class="c">    <span class="s"> | </span>    <b>return</b> <b>this</b>.path( ... );
-</span></code><code id="L275"><span class="ln">275</span><span class="c">    <span class="s"> | </span>};
-</span></code><code id="L276"><span class="ln">276</span><span class="c">    <span class="s"> | </span><span class="c">// or create namespace</span>
-</span></code><code id="L277"><span class="ln">277</span><span class="c">    <span class="s"> | </span>Raphael.fn.mystuff<span class="s"> = </span>{
-</span></code><code id="L278"><span class="ln">278</span><span class="c">    <span class="s"> | </span>    arrow: <b>function</b> () {…},
-</span></code><code id="L279"><span class="ln">279</span><span class="c">    <span class="s"> | </span>    star: <b>function</b> () {…},
-</span></code><code id="L280"><span class="ln">280</span><span class="c">    <span class="s"> | </span>    <span class="c">// etc…</span>
-</span></code><code id="L281"><span class="ln">281</span><span class="c">    <span class="s"> | </span>};
-</span></code><code id="L282"><span class="ln">282</span><span class="c">    <span class="s"> | </span><b>var</b> paper<span class="s"> = </span>Raphael(<span class="d">10</span>, <span class="d">10</span>, <span class="d">630</span>, <span class="d">480</span>);
-</span></code><code id="L283"><span class="ln">283</span><span class="c">    <span class="s"> | </span><span class="c">// then use it</span>
-</span></code><code id="L284"><span class="ln">284</span><span class="c">    <span class="s"> | </span>paper.arrow(<span class="d">10</span>, <span class="d">10</span>, <span class="d">30</span>, <span class="d">30</span>, <span class="d">5</span>).attr({fill: <i>"#f00"</i>});
-</span></code><code id="L285"><span class="ln">285</span><span class="c">    <span class="s"> | </span>paper.mystuff.arrow();
-</span></code><code id="L286"><span class="ln">286</span><span class="c">    <span class="s"> | </span>paper.mystuff.star();
-</span></code><code id="L287"><span class="ln">287</span><span class="c">    \*/</span>
-</code><code id="L288"><span class="ln">288</span>    R.fn<span class="s"> = </span>{};
-</code><code id="L289"><span class="ln">289</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L290"><span class="ln">290</span><span class="c">    <span class="s"> * </span>Raphael.is
-</span></code><code id="L291"><span class="ln">291</span><span class="c">     [ method ]
-</span></code><code id="L292"><span class="ln">292</span><span class="c">     **
-</span></code><code id="L293"><span class="ln">293</span><span class="c">    <span class="s"> * </span>Handfull replacement <b>for</b> `<b>typeof</b>` operator.
-</span></code><code id="L294"><span class="ln">294</span><span class="c">     > Parameters
-</span></code><code id="L295"><span class="ln">295</span><span class="c">    <span class="s"> - </span>o (…) any object or primitive
-</span></code><code id="L296"><span class="ln">296</span><span class="c">    <span class="s"> - </span>type (string) name of the type, i.e. “string”, “<b>function</b>”, “number”, etc.
-</span></code><code id="L297"><span class="ln">297</span><span class="c">    <span class="s"> = </span>(<b>boolean</b>) is given value is of given type
-</span></code><code id="L298"><span class="ln">298</span><span class="c">    \*/</span>
-</code><code id="L299"><span class="ln">299</span>    R.is<span class="s"> = </span><b>function</b> (o, type) {
-</code><code id="L300"><span class="ln">300</span>        type<span class="s"> = </span>lowerCase.call(type);
-</code><code id="L301"><span class="ln">301</span>        <b>if</b> (type<span class="s"> == </span><i>"finite"</i>) {
-</code><code id="L302"><span class="ln">302</span>            <b>return</b> !isnan[has](+o);
-</code><code id="L303"><span class="ln">303</span>        }
-</code><code id="L304"><span class="ln">304</span>        <b>return</b>  (type<span class="s"> == </span><i>"<b>null</b>"</i><span class="s"> &amp;&amp; </span>o<span class="s"> === </span><b>null</b>) ||
-</code><code id="L305"><span class="ln">305</span>                (type<span class="s"> == </span><b>typeof</b> o) ||
-</code><code id="L306"><span class="ln">306</span>                (type<span class="s"> == </span><i>"object"</i><span class="s"> &amp;&amp; </span>o<span class="s"> === </span>Object(o)) ||
-</code><code id="L307"><span class="ln">307</span>                (type<span class="s"> == </span><i>"array"</i><span class="s"> &amp;&amp; </span>Array.isArray<span class="s"> &amp;&amp; </span>Array.isArray(o)) ||
-</code><code id="L308"><span class="ln">308</span>                objectToString.call(o).slice(<span class="d">8</span>, -<span class="d">1</span>).toLowerCase()<span class="s"> == </span>type;
-</code><code id="L309"><span class="ln">309</span>    };
-</code><code id="L310"><span class="ln">310</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L311"><span class="ln">311</span><span class="c">    <span class="s"> * </span>Raphael.angle
-</span></code><code id="L312"><span class="ln">312</span><span class="c">     [ method ]
-</span></code><code id="L313"><span class="ln">313</span><span class="c">     **
-</span></code><code id="L314"><span class="ln">314</span><span class="c">    <span class="s"> * </span>Returns angle between two or three points
-</span></code><code id="L315"><span class="ln">315</span><span class="c">     > Parameters
-</span></code><code id="L316"><span class="ln">316</span><span class="c">    <span class="s"> - </span>x1 (number) x coord of first point
-</span></code><code id="L317"><span class="ln">317</span><span class="c">    <span class="s"> - </span>y1 (number) y coord of first point
-</span></code><code id="L318"><span class="ln">318</span><span class="c">    <span class="s"> - </span>x2 (number) x coord of second point
-</span></code><code id="L319"><span class="ln">319</span><span class="c">    <span class="s"> - </span>y2 (number) y coord of second point
-</span></code><code id="L320"><span class="ln">320</span><span class="c">    <span class="s"> - </span>x3 (number) #optional x coord of third point
-</span></code><code id="L321"><span class="ln">321</span><span class="c">    <span class="s"> - </span>y3 (number) #optional y coord of third point
-</span></code><code id="L322"><span class="ln">322</span><span class="c">    <span class="s"> = </span>(number) angle <b>in</b> degrees.
-</span></code><code id="L323"><span class="ln">323</span><span class="c">    \*/</span>
-</code><code id="L324"><span class="ln">324</span>    R.angle<span class="s"> = </span><b>function</b> (x1, y1, x2, y2, x3, y3) {
-</code><code id="L325"><span class="ln">325</span>        <b>if</b> (x3<span class="s"> == </span><b>null</b>) {
-</code><code id="L326"><span class="ln">326</span>            <b>var</b> x<span class="s"> = </span>x1<span class="s"> - </span>x2,
-</code><code id="L327"><span class="ln">327</span>                y<span class="s"> = </span>y1<span class="s"> - </span>y2;
-</code><code id="L328"><span class="ln">328</span>            <b>if</b> (!x<span class="s"> &amp;&amp; </span>!y) {
-</code><code id="L329"><span class="ln">329</span>                <b>return</b> <span class="d">0</span>;
-</code><code id="L330"><span class="ln">330</span>            }
-</code><code id="L331"><span class="ln">331</span>            <b>return</b> (<span class="d">180</span><span class="s"> + </span>math.atan2(-y, -x)<span class="s"> * </span><span class="d">180</span><span class="s"> / </span>PI<span class="s"> + </span><span class="d">360</span>)<span class="s"> % </span><span class="d">360</span>;
-</code><code id="L332"><span class="ln">332</span>        } <b>else</b> {
-</code><code id="L333"><span class="ln">333</span>            <b>return</b> R.angle(x1, y1, x3, y3)<span class="s"> - </span>R.angle(x2, y2, x3, y3);
-</code><code id="L334"><span class="ln">334</span>        }
-</code><code id="L335"><span class="ln">335</span>    };
-</code><code id="L336"><span class="ln">336</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L337"><span class="ln">337</span><span class="c">    <span class="s"> * </span>Raphael.rad
-</span></code><code id="L338"><span class="ln">338</span><span class="c">     [ method ]
-</span></code><code id="L339"><span class="ln">339</span><span class="c">     **
-</span></code><code id="L340"><span class="ln">340</span><span class="c">    <span class="s"> * </span>Transform angle to radians
-</span></code><code id="L341"><span class="ln">341</span><span class="c">     > Parameters
-</span></code><code id="L342"><span class="ln">342</span><span class="c">    <span class="s"> - </span>deg (number) angle <b>in</b> degrees
-</span></code><code id="L343"><span class="ln">343</span><span class="c">    <span class="s"> = </span>(number) angle <b>in</b> radians.
-</span></code><code id="L344"><span class="ln">344</span><span class="c">    \*/</span>
-</code><code id="L345"><span class="ln">345</span>    R.rad<span class="s"> = </span><b>function</b> (deg) {
-</code><code id="L346"><span class="ln">346</span>        <b>return</b> deg<span class="s"> % </span><span class="d">360</span><span class="s"> * </span>PI<span class="s"> / </span><span class="d">180</span>;
-</code><code id="L347"><span class="ln">347</span>    };
-</code><code id="L348"><span class="ln">348</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L349"><span class="ln">349</span><span class="c">    <span class="s"> * </span>Raphael.deg
-</span></code><code id="L350"><span class="ln">350</span><span class="c">     [ method ]
-</span></code><code id="L351"><span class="ln">351</span><span class="c">     **
-</span></code><code id="L352"><span class="ln">352</span><span class="c">    <span class="s"> * </span>Transform angle to degrees
-</span></code><code id="L353"><span class="ln">353</span><span class="c">     > Parameters
-</span></code><code id="L354"><span class="ln">354</span><span class="c">    <span class="s"> - </span>deg (number) angle <b>in</b> radians
-</span></code><code id="L355"><span class="ln">355</span><span class="c">    <span class="s"> = </span>(number) angle <b>in</b> degrees.
-</span></code><code id="L356"><span class="ln">356</span><span class="c">    \*/</span>
-</code><code id="L357"><span class="ln">357</span>    R.deg<span class="s"> = </span><b>function</b> (rad) {
-</code><code id="L358"><span class="ln">358</span>        <b>return</b> rad<span class="s"> * </span><span class="d">180</span><span class="s"> / </span>PI<span class="s"> % </span><span class="d">360</span>;
-</code><code id="L359"><span class="ln">359</span>    };
-</code><code id="L360"><span class="ln">360</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L361"><span class="ln">361</span><span class="c">    <span class="s"> * </span>Raphael.snapTo
-</span></code><code id="L362"><span class="ln">362</span><span class="c">     [ method ]
-</span></code><code id="L363"><span class="ln">363</span><span class="c">     **
-</span></code><code id="L364"><span class="ln">364</span><span class="c">    <span class="s"> * </span>Snaps given value to given grid.
-</span></code><code id="L365"><span class="ln">365</span><span class="c">     > Parameters
-</span></code><code id="L366"><span class="ln">366</span><span class="c">    <span class="s"> - </span>values (array|number) given array of values or step of the grid
-</span></code><code id="L367"><span class="ln">367</span><span class="c">    <span class="s"> - </span>value (number) value to adjust
-</span></code><code id="L368"><span class="ln">368</span><span class="c">    <span class="s"> - </span>tolerance (number) #optional tolerance <b>for</b> snapping. Default is `<span class="d">10</span>`.
-</span></code><code id="L369"><span class="ln">369</span><span class="c">    <span class="s"> = </span>(number) adjusted value.
-</span></code><code id="L370"><span class="ln">370</span><span class="c">    \*/</span>
-</code><code id="L371"><span class="ln">371</span>    R.snapTo<span class="s"> = </span><b>function</b> (values, value, tolerance) {
-</code><code id="L372"><span class="ln">372</span>        tolerance<span class="s"> = </span>R.is(tolerance, <i>"finite"</i>) ? tolerance : <span class="d">10</span>;
-</code><code id="L373"><span class="ln">373</span>        <b>if</b> (R.is(values, array)) {
-</code><code id="L374"><span class="ln">374</span>            <b>var</b> i<span class="s"> = </span>values.length;
-</code><code id="L375"><span class="ln">375</span>            <b>while</b> (i--) <b>if</b> (abs(values[i]<span class="s"> - </span>value) &lt;= tolerance) {
-</code><code id="L376"><span class="ln">376</span>                <b>return</b> values[i];
-</code><code id="L377"><span class="ln">377</span>            }
-</code><code id="L378"><span class="ln">378</span>        } <b>else</b> {
-</code><code id="L379"><span class="ln">379</span>            values<span class="s"> = </span>+values;
-</code><code id="L380"><span class="ln">380</span>            <b>var</b> rem<span class="s"> = </span>value<span class="s"> % </span>values;
-</code><code id="L381"><span class="ln">381</span>            <b>if</b> (rem &lt; tolerance) {
-</code><code id="L382"><span class="ln">382</span>                <b>return</b> value<span class="s"> - </span>rem;
-</code><code id="L383"><span class="ln">383</span>            }
-</code><code id="L384"><span class="ln">384</span>            <b>if</b> (rem > values<span class="s"> - </span>tolerance) {
-</code><code id="L385"><span class="ln">385</span>                <b>return</b> value<span class="s"> - </span>rem<span class="s"> + </span>values;
-</code><code id="L386"><span class="ln">386</span>            }
-</code><code id="L387"><span class="ln">387</span>        }
-</code><code id="L388"><span class="ln">388</span>        <b>return</b> value;
-</code><code id="L389"><span class="ln">389</span>    };
-</code><code id="L390"><span class="ln">390</span>    
-</code><code id="L391"><span class="ln">391</span>    <b>var</b> createUUID<span class="s"> = </span>(<b>function</b> (uuidRegEx, uuidReplacer) {
-</code><code id="L392"><span class="ln">392</span>        <b>return</b> <b>function</b> () {
-</code><code id="L393"><span class="ln">393</span>            <b>return</b> <i>"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx"</i>.replace(uuidRegEx, uuidReplacer).toUpperCase();
-</code><code id="L394"><span class="ln">394</span>        };
-</code><code id="L395"><span class="ln">395</span>    })(/[xy]/g, <b>function</b> (c) {
-</code><code id="L396"><span class="ln">396</span>        <b>var</b> r<span class="s"> = </span>math.random()<span class="s"> * </span><span class="d">16</span><span class="s"> | </span><span class="d">0</span>,
-</code><code id="L397"><span class="ln">397</span>            v<span class="s"> = </span>c<span class="s"> == </span><i>"x"</i> ? r : (r<span class="s"> &amp; </span><span class="d">3</span><span class="s"> | </span><span class="d">8</span>);
-</code><code id="L398"><span class="ln">398</span>        <b>return</b> v.toString(<span class="d">16</span>);
-</code><code id="L399"><span class="ln">399</span>    });
-</code><code id="L400"><span class="ln">400</span>
-</code><code id="L401"><span class="ln">401</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L402"><span class="ln">402</span><span class="c">    <span class="s"> * </span>Raphael.setWindow
-</span></code><code id="L403"><span class="ln">403</span><span class="c">     [ method ]
-</span></code><code id="L404"><span class="ln">404</span><span class="c">     **
-</span></code><code id="L405"><span class="ln">405</span><span class="c">    <span class="s"> * </span>Used when you need to draw <b>in</b> `&lt;iframe>`. Switched window to the iframe one.
-</span></code><code id="L406"><span class="ln">406</span><span class="c">     > Parameters
-</span></code><code id="L407"><span class="ln">407</span><span class="c">    <span class="s"> - </span>newwin (window) <b>new</b> window object
-</span></code><code id="L408"><span class="ln">408</span><span class="c">    \*/</span>
-</code><code id="L409"><span class="ln">409</span>    R.setWindow<span class="s"> = </span><b>function</b> (newwin) {
-</code><code id="L410"><span class="ln">410</span>        eve(<i>"setWindow"</i>, R, g.win, newwin);
-</code><code id="L411"><span class="ln">411</span>        g.win<span class="s"> = </span>newwin;
-</code><code id="L412"><span class="ln">412</span>        g.doc<span class="s"> = </span>g.win.document;
-</code><code id="L413"><span class="ln">413</span>        <b>if</b> (initWin) {
-</code><code id="L414"><span class="ln">414</span>            initWin(g.win);
-</code><code id="L415"><span class="ln">415</span>        }
-</code><code id="L416"><span class="ln">416</span>    };
-</code><code id="L417"><span class="ln">417</span>    <span class="c">// colour utilities</span>
-</code><code id="L418"><span class="ln">418</span>    <b>var</b> toHex<span class="s"> = </span><b>function</b> (color) {
-</code><code id="L419"><span class="ln">419</span>        <b>if</b> (R.vml) {
-</code><code id="L420"><span class="ln">420</span>            <span class="c">// http://dean.edwards.name/weblog/<span class="d">2009</span>/<span class="d">10</span>/convert-any-colour-value-to-hex-<b>in</b>-msie/</span>
-</code><code id="L421"><span class="ln">421</span>            <b>var</b> trim<span class="s"> = </span>/^\s+|\s+$/g;
-</code><code id="L422"><span class="ln">422</span>            <b>var</b> bod;
-</code><code id="L423"><span class="ln">423</span>            <b>try</b> {
-</code><code id="L424"><span class="ln">424</span>                <b>var</b> docum<span class="s"> = </span><b>new</b> ActiveXObject(<i>"htmlfile"</i>);
-</code><code id="L425"><span class="ln">425</span>                docum.write(<i>"&lt;body>"</i>);
-</code><code id="L426"><span class="ln">426</span>                docum.close();
-</code><code id="L427"><span class="ln">427</span>                bod<span class="s"> = </span>docum.body;
-</code><code id="L428"><span class="ln">428</span>            } <b>catch</b>(e) {
-</code><code id="L429"><span class="ln">429</span>                bod<span class="s"> = </span>createPopup().document.body;
-</code><code id="L430"><span class="ln">430</span>            }
-</code><code id="L431"><span class="ln">431</span>            <b>var</b> range<span class="s"> = </span>bod.createTextRange();
-</code><code id="L432"><span class="ln">432</span>            toHex<span class="s"> = </span>cacher(<b>function</b> (color) {
-</code><code id="L433"><span class="ln">433</span>                <b>try</b> {
-</code><code id="L434"><span class="ln">434</span>                    bod.style.color<span class="s"> = </span>Str(color).replace(trim, E);
-</code><code id="L435"><span class="ln">435</span>                    <b>var</b> value<span class="s"> = </span>range.queryCommandValue(<i>"ForeColor"</i>);
-</code><code id="L436"><span class="ln">436</span>                    value<span class="s"> = </span>((value<span class="s"> &amp; </span><span class="d">255</span>) &lt;&lt; <span class="d">16</span>)<span class="s"> | </span>(value<span class="s"> &amp; </span><span class="d">65280</span>)<span class="s"> | </span>((value<span class="s"> &amp; </span><span class="d">16711680</span>) >>> <span class="d">16</span>);
-</code><code id="L437"><span class="ln">437</span>                    <b>return</b> <i>"#"</i><span class="s"> + </span>(<i>"<span class="d">000000</span>"</i><span class="s"> + </span>value.toString(<span class="d">16</span>)).slice(-<span class="d">6</span>);
-</code><code id="L438"><span class="ln">438</span>                } <b>catch</b>(e) {
-</code><code id="L439"><span class="ln">439</span>                    <b>return</b> <i>"none"</i>;
-</code><code id="L440"><span class="ln">440</span>                }
-</code><code id="L441"><span class="ln">441</span>            });
-</code><code id="L442"><span class="ln">442</span>        } <b>else</b> {
-</code><code id="L443"><span class="ln">443</span>            <b>var</b> i<span class="s"> = </span>g.doc.createElement(<i>"i"</i>);
-</code><code id="L444"><span class="ln">444</span>            i.title<span class="s"> = </span><i>"Rapha\xebl Colour Picker"</i>;
-</code><code id="L445"><span class="ln">445</span>            i.style.display<span class="s"> = </span><i>"none"</i>;
-</code><code id="L446"><span class="ln">446</span>            g.doc.body.appendChild(i);
-</code><code id="L447"><span class="ln">447</span>            toHex<span class="s"> = </span>cacher(<b>function</b> (color) {
-</code><code id="L448"><span class="ln">448</span>                i.style.color<span class="s"> = </span>color;
-</code><code id="L449"><span class="ln">449</span>                <b>return</b> g.doc.defaultView.getComputedStyle(i, E).getPropertyValue(<i>"color"</i>);
-</code><code id="L450"><span class="ln">450</span>            });
-</code><code id="L451"><span class="ln">451</span>        }
-</code><code id="L452"><span class="ln">452</span>        <b>return</b> toHex(color);
-</code><code id="L453"><span class="ln">453</span>    },
-</code><code id="L454"><span class="ln">454</span>    hsbtoString<span class="s"> = </span><b>function</b> () {
-</code><code id="L455"><span class="ln">455</span>        <b>return</b> <i>"hsb("</i><span class="s"> + </span>[<b>this</b>.h, <b>this</b>.s, <b>this</b>.b]<span class="s"> + </span><i>")"</i>;
-</code><code id="L456"><span class="ln">456</span>    },
-</code><code id="L457"><span class="ln">457</span>    hsltoString<span class="s"> = </span><b>function</b> () {
-</code><code id="L458"><span class="ln">458</span>        <b>return</b> <i>"hsl("</i><span class="s"> + </span>[<b>this</b>.h, <b>this</b>.s, <b>this</b>.l]<span class="s"> + </span><i>")"</i>;
-</code><code id="L459"><span class="ln">459</span>    },
-</code><code id="L460"><span class="ln">460</span>    rgbtoString<span class="s"> = </span><b>function</b> () {
-</code><code id="L461"><span class="ln">461</span>        <b>return</b> <b>this</b>.hex;
-</code><code id="L462"><span class="ln">462</span>    },
-</code><code id="L463"><span class="ln">463</span>    prepareRGB<span class="s"> = </span><b>function</b> (r, g, b) {
-</code><code id="L464"><span class="ln">464</span>        <b>if</b> (g<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(r, <i>"object"</i>)<span class="s"> &amp;&amp; </span><i>"r"</i> <b>in</b> r<span class="s"> &amp;&amp; </span><i>"g"</i> <b>in</b> r<span class="s"> &amp;&amp; </span><i>"b"</i> <b>in</b> r) {
-</code><code id="L465"><span class="ln">465</span>            b<span class="s"> = </span>r.b;
-</code><code id="L466"><span class="ln">466</span>            g<span class="s"> = </span>r.g;
-</code><code id="L467"><span class="ln">467</span>            r<span class="s"> = </span>r.r;
-</code><code id="L468"><span class="ln">468</span>        }
-</code><code id="L469"><span class="ln">469</span>        <b>if</b> (g<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(r, string)) {
-</code><code id="L470"><span class="ln">470</span>            <b>var</b> clr<span class="s"> = </span>R.getRGB(r);
-</code><code id="L471"><span class="ln">471</span>            r<span class="s"> = </span>clr.r;
-</code><code id="L472"><span class="ln">472</span>            g<span class="s"> = </span>clr.g;
-</code><code id="L473"><span class="ln">473</span>            b<span class="s"> = </span>clr.b;
-</code><code id="L474"><span class="ln">474</span>        }
-</code><code id="L475"><span class="ln">475</span>        <b>if</b> (r > <span class="d">1</span><span class="s"> || </span>g > <span class="d">1</span><span class="s"> || </span>b > <span class="d">1</span>) {
-</code><code id="L476"><span class="ln">476</span>            r /= <span class="d">255</span>;
-</code><code id="L477"><span class="ln">477</span>            g /= <span class="d">255</span>;
-</code><code id="L478"><span class="ln">478</span>            b /= <span class="d">255</span>;
-</code><code id="L479"><span class="ln">479</span>        }
-</code><code id="L480"><span class="ln">480</span>        
-</code><code id="L481"><span class="ln">481</span>        <b>return</b> [r, g, b];
-</code><code id="L482"><span class="ln">482</span>    },
-</code><code id="L483"><span class="ln">483</span>    packageRGB<span class="s"> = </span><b>function</b> (r, g, b, o) {
-</code><code id="L484"><span class="ln">484</span>        r *= <span class="d">255</span>;
-</code><code id="L485"><span class="ln">485</span>        g *= <span class="d">255</span>;
-</code><code id="L486"><span class="ln">486</span>        b *= <span class="d">255</span>;
-</code><code id="L487"><span class="ln">487</span>        <b>var</b> rgb<span class="s"> = </span>{
-</code><code id="L488"><span class="ln">488</span>            r: r,
-</code><code id="L489"><span class="ln">489</span>            g: g,
-</code><code id="L490"><span class="ln">490</span>            b: b,
-</code><code id="L491"><span class="ln">491</span>            hex: R.rgb(r, g, b),
-</code><code id="L492"><span class="ln">492</span>            toString: rgbtoString
-</code><code id="L493"><span class="ln">493</span>        };
-</code><code id="L494"><span class="ln">494</span>        R.is(o, <i>"finite"</i>)<span class="s"> &amp;&amp; </span>(rgb.opacity<span class="s"> = </span>o);
-</code><code id="L495"><span class="ln">495</span>        <b>return</b> rgb;
-</code><code id="L496"><span class="ln">496</span>    };
-</code><code id="L497"><span class="ln">497</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L498"><span class="ln">498</span><span class="c">    <span class="s"> * </span>Raphael.hsb2rgb
-</span></code><code id="L499"><span class="ln">499</span><span class="c">     [ method ]
-</span></code><code id="L500"><span class="ln">500</span><span class="c">     **
-</span></code><code id="L501"><span class="ln">501</span><span class="c">    <span class="s"> * </span>Converts HSB values to RGB object.
-</span></code><code id="L502"><span class="ln">502</span><span class="c">     > Parameters
-</span></code><code id="L503"><span class="ln">503</span><span class="c">    <span class="s"> - </span>h (number) hue
-</span></code><code id="L504"><span class="ln">504</span><span class="c">    <span class="s"> - </span>s (number) saturation
-</span></code><code id="L505"><span class="ln">505</span><span class="c">    <span class="s"> - </span>v (number) value or brightness
-</span></code><code id="L506"><span class="ln">506</span><span class="c">    <span class="s"> = </span>(object) RGB object <b>in</b> format:
-</span></code><code id="L507"><span class="ln">507</span><span class="c">     o {
-</span></code><code id="L508"><span class="ln">508</span><span class="c">     o     r (number) red,
-</span></code><code id="L509"><span class="ln">509</span><span class="c">     o     g (number) green,
-</span></code><code id="L510"><span class="ln">510</span><span class="c">     o     b (number) blue,
-</span></code><code id="L511"><span class="ln">511</span><span class="c">     o     hex (string) color <b>in</b> HTML/CSS format: #••••••
-</span></code><code id="L512"><span class="ln">512</span><span class="c">     o }
-</span></code><code id="L513"><span class="ln">513</span><span class="c">    \*/</span>
-</code><code id="L514"><span class="ln">514</span>    R.hsb2rgb<span class="s"> = </span><b>function</b> (h, s, v, o) {
-</code><code id="L515"><span class="ln">515</span>        <b>if</b> (<b>this</b>.is(h, <i>"object"</i>)<span class="s"> &amp;&amp; </span><i>"h"</i> <b>in</b> h<span class="s"> &amp;&amp; </span><i>"s"</i> <b>in</b> h<span class="s"> &amp;&amp; </span><i>"b"</i> <b>in</b> h) {
-</code><code id="L516"><span class="ln">516</span>            v<span class="s"> = </span>h.b;
-</code><code id="L517"><span class="ln">517</span>            s<span class="s"> = </span>h.s;
-</code><code id="L518"><span class="ln">518</span>            h<span class="s"> = </span>h.h;
-</code><code id="L519"><span class="ln">519</span>            o<span class="s"> = </span>h.o;
-</code><code id="L520"><span class="ln">520</span>        }
-</code><code id="L521"><span class="ln">521</span>        h *= <span class="d">360</span>;
-</code><code id="L522"><span class="ln">522</span>        <b>var</b> R, G, B, X, C;
-</code><code id="L523"><span class="ln">523</span>        h<span class="s"> = </span>(h<span class="s"> % </span><span class="d">360</span>)<span class="s"> / </span><span class="d">60</span>;
-</code><code id="L524"><span class="ln">524</span>        C<span class="s"> = </span>v<span class="s"> * </span>s;
-</code><code id="L525"><span class="ln">525</span>        X<span class="s"> = </span>C<span class="s"> * </span>(<span class="d">1</span><span class="s"> - </span>abs(h<span class="s"> % </span><span class="d">2</span><span class="s"> - </span><span class="d">1</span>));
-</code><code id="L526"><span class="ln">526</span>        R<span class="s"> = </span>G<span class="s"> = </span>B<span class="s"> = </span>v<span class="s"> - </span>C;
-</code><code id="L527"><span class="ln">527</span>
-</code><code id="L528"><span class="ln">528</span>        h<span class="s"> = </span>~~h;
-</code><code id="L529"><span class="ln">529</span>        R += [C, X, <span class="d">0</span>, <span class="d">0</span>, X, C][h];
-</code><code id="L530"><span class="ln">530</span>        G += [X, C, C, X, <span class="d">0</span>, <span class="d">0</span>][h];
-</code><code id="L531"><span class="ln">531</span>        B += [<span class="d">0</span>, <span class="d">0</span>, X, C, C, X][h];
-</code><code id="L532"><span class="ln">532</span>        <b>return</b> packageRGB(R, G, B, o);
-</code><code id="L533"><span class="ln">533</span>    };
-</code><code id="L534"><span class="ln">534</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L535"><span class="ln">535</span><span class="c">    <span class="s"> * </span>Raphael.hsl2rgb
-</span></code><code id="L536"><span class="ln">536</span><span class="c">     [ method ]
-</span></code><code id="L537"><span class="ln">537</span><span class="c">     **
-</span></code><code id="L538"><span class="ln">538</span><span class="c">    <span class="s"> * </span>Converts HSL values to RGB object.
-</span></code><code id="L539"><span class="ln">539</span><span class="c">     > Parameters
-</span></code><code id="L540"><span class="ln">540</span><span class="c">    <span class="s"> - </span>h (number) hue
-</span></code><code id="L541"><span class="ln">541</span><span class="c">    <span class="s"> - </span>s (number) saturation
-</span></code><code id="L542"><span class="ln">542</span><span class="c">    <span class="s"> - </span>l (number) luminosity
-</span></code><code id="L543"><span class="ln">543</span><span class="c">    <span class="s"> = </span>(object) RGB object <b>in</b> format:
-</span></code><code id="L544"><span class="ln">544</span><span class="c">     o {
-</span></code><code id="L545"><span class="ln">545</span><span class="c">     o     r (number) red,
-</span></code><code id="L546"><span class="ln">546</span><span class="c">     o     g (number) green,
-</span></code><code id="L547"><span class="ln">547</span><span class="c">     o     b (number) blue,
-</span></code><code id="L548"><span class="ln">548</span><span class="c">     o     hex (string) color <b>in</b> HTML/CSS format: #••••••
-</span></code><code id="L549"><span class="ln">549</span><span class="c">     o }
-</span></code><code id="L550"><span class="ln">550</span><span class="c">    \*/</span>
-</code><code id="L551"><span class="ln">551</span>    R.hsl2rgb<span class="s"> = </span><b>function</b> (h, s, l, o) {
-</code><code id="L552"><span class="ln">552</span>        <b>if</b> (<b>this</b>.is(h, <i>"object"</i>)<span class="s"> &amp;&amp; </span><i>"h"</i> <b>in</b> h<span class="s"> &amp;&amp; </span><i>"s"</i> <b>in</b> h<span class="s"> &amp;&amp; </span><i>"l"</i> <b>in</b> h) {
-</code><code id="L553"><span class="ln">553</span>            l<span class="s"> = </span>h.l;
-</code><code id="L554"><span class="ln">554</span>            s<span class="s"> = </span>h.s;
-</code><code id="L555"><span class="ln">555</span>            h<span class="s"> = </span>h.h;
-</code><code id="L556"><span class="ln">556</span>        }
-</code><code id="L557"><span class="ln">557</span>        <b>if</b> (h > <span class="d">1</span><span class="s"> || </span>s > <span class="d">1</span><span class="s"> || </span>l > <span class="d">1</span>) {
-</code><code id="L558"><span class="ln">558</span>            h /= <span class="d">360</span>;
-</code><code id="L559"><span class="ln">559</span>            s /= <span class="d">100</span>;
-</code><code id="L560"><span class="ln">560</span>            l /= <span class="d">100</span>;
-</code><code id="L561"><span class="ln">561</span>        }
-</code><code id="L562"><span class="ln">562</span>        h *= <span class="d">360</span>;
-</code><code id="L563"><span class="ln">563</span>        <b>var</b> R, G, B, X, C;
-</code><code id="L564"><span class="ln">564</span>        h<span class="s"> = </span>(h<span class="s"> % </span><span class="d">360</span>)<span class="s"> / </span><span class="d">60</span>;
-</code><code id="L565"><span class="ln">565</span>        C<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>s<span class="s"> * </span>(l &lt; <span class="d">.5</span> ? l : <span class="d">1</span><span class="s"> - </span>l);
-</code><code id="L566"><span class="ln">566</span>        X<span class="s"> = </span>C<span class="s"> * </span>(<span class="d">1</span><span class="s"> - </span>abs(h<span class="s"> % </span><span class="d">2</span><span class="s"> - </span><span class="d">1</span>));
-</code><code id="L567"><span class="ln">567</span>        R<span class="s"> = </span>G<span class="s"> = </span>B<span class="s"> = </span>l<span class="s"> - </span>C<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L568"><span class="ln">568</span>
-</code><code id="L569"><span class="ln">569</span>        h<span class="s"> = </span>~~h;
-</code><code id="L570"><span class="ln">570</span>        R += [C, X, <span class="d">0</span>, <span class="d">0</span>, X, C][h];
-</code><code id="L571"><span class="ln">571</span>        G += [X, C, C, X, <span class="d">0</span>, <span class="d">0</span>][h];
-</code><code id="L572"><span class="ln">572</span>        B += [<span class="d">0</span>, <span class="d">0</span>, X, C, C, X][h];
-</code><code id="L573"><span class="ln">573</span>        <b>return</b> packageRGB(R, G, B, o);
-</code><code id="L574"><span class="ln">574</span>    };
-</code><code id="L575"><span class="ln">575</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L576"><span class="ln">576</span><span class="c">    <span class="s"> * </span>Raphael.rgb2hsb
-</span></code><code id="L577"><span class="ln">577</span><span class="c">     [ method ]
-</span></code><code id="L578"><span class="ln">578</span><span class="c">     **
-</span></code><code id="L579"><span class="ln">579</span><span class="c">    <span class="s"> * </span>Converts RGB values to HSB object.
-</span></code><code id="L580"><span class="ln">580</span><span class="c">     > Parameters
-</span></code><code id="L581"><span class="ln">581</span><span class="c">    <span class="s"> - </span>r (number) red
-</span></code><code id="L582"><span class="ln">582</span><span class="c">    <span class="s"> - </span>g (number) green
-</span></code><code id="L583"><span class="ln">583</span><span class="c">    <span class="s"> - </span>b (number) blue
-</span></code><code id="L584"><span class="ln">584</span><span class="c">    <span class="s"> = </span>(object) HSB object <b>in</b> format:
-</span></code><code id="L585"><span class="ln">585</span><span class="c">     o {
-</span></code><code id="L586"><span class="ln">586</span><span class="c">     o     h (number) hue
-</span></code><code id="L587"><span class="ln">587</span><span class="c">     o     s (number) saturation
-</span></code><code id="L588"><span class="ln">588</span><span class="c">     o     b (number) brightness
-</span></code><code id="L589"><span class="ln">589</span><span class="c">     o }
-</span></code><code id="L590"><span class="ln">590</span><span class="c">    \*/</span>
-</code><code id="L591"><span class="ln">591</span>    R.rgb2hsb<span class="s"> = </span><b>function</b> (r, g, b) {
-</code><code id="L592"><span class="ln">592</span>        b<span class="s"> = </span>prepareRGB(r, g, b);
-</code><code id="L593"><span class="ln">593</span>        r<span class="s"> = </span>b[<span class="d">0</span>];
-</code><code id="L594"><span class="ln">594</span>        g<span class="s"> = </span>b[<span class="d">1</span>];
-</code><code id="L595"><span class="ln">595</span>        b<span class="s"> = </span>b[<span class="d">2</span>];
-</code><code id="L596"><span class="ln">596</span>
-</code><code id="L597"><span class="ln">597</span>        <b>var</b> H, S, V, C;
-</code><code id="L598"><span class="ln">598</span>        V<span class="s"> = </span>mmax(r, g, b);
-</code><code id="L599"><span class="ln">599</span>        C<span class="s"> = </span>V<span class="s"> - </span>mmin(r, g, b);
-</code><code id="L600"><span class="ln">600</span>        H<span class="s"> = </span>(C<span class="s"> == </span><span class="d">0</span> ? <b>null</b> :
-</code><code id="L601"><span class="ln">601</span>             V<span class="s"> == </span>r ? (g<span class="s"> - </span>b)<span class="s"> / </span>C :
-</code><code id="L602"><span class="ln">602</span>             V<span class="s"> == </span>g ? (b<span class="s"> - </span>r)<span class="s"> / </span>C<span class="s"> + </span><span class="d">2</span> :
-</code><code id="L603"><span class="ln">603</span>                      (r<span class="s"> - </span>g)<span class="s"> / </span>C<span class="s"> + </span><span class="d">4</span>);
-</code><code id="L604"><span class="ln">604</span>        H<span class="s"> = </span>(H<span class="s"> % </span><span class="d">6</span>)<span class="s"> * </span><span class="d">60</span>;
-</code><code id="L605"><span class="ln">605</span>        S<span class="s"> = </span>C<span class="s"> == </span><span class="d">0</span> ? <span class="d">0</span> : C<span class="s"> / </span>V;
-</code><code id="L606"><span class="ln">606</span>        <b>return</b> {h: H, s: S, b: V, toString: hsbtoString};
-</code><code id="L607"><span class="ln">607</span>    };
-</code><code id="L608"><span class="ln">608</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L609"><span class="ln">609</span><span class="c">    <span class="s"> * </span>Raphael.rgb2hsl
-</span></code><code id="L610"><span class="ln">610</span><span class="c">     [ method ]
-</span></code><code id="L611"><span class="ln">611</span><span class="c">     **
-</span></code><code id="L612"><span class="ln">612</span><span class="c">    <span class="s"> * </span>Converts RGB values to HSL object.
-</span></code><code id="L613"><span class="ln">613</span><span class="c">     > Parameters
-</span></code><code id="L614"><span class="ln">614</span><span class="c">    <span class="s"> - </span>r (number) red
-</span></code><code id="L615"><span class="ln">615</span><span class="c">    <span class="s"> - </span>g (number) green
-</span></code><code id="L616"><span class="ln">616</span><span class="c">    <span class="s"> - </span>b (number) blue
-</span></code><code id="L617"><span class="ln">617</span><span class="c">    <span class="s"> = </span>(object) HSL object <b>in</b> format:
-</span></code><code id="L618"><span class="ln">618</span><span class="c">     o {
-</span></code><code id="L619"><span class="ln">619</span><span class="c">     o     h (number) hue
-</span></code><code id="L620"><span class="ln">620</span><span class="c">     o     s (number) saturation
-</span></code><code id="L621"><span class="ln">621</span><span class="c">     o     l (number) luminosity
-</span></code><code id="L622"><span class="ln">622</span><span class="c">     o }
-</span></code><code id="L623"><span class="ln">623</span><span class="c">    \*/</span>
-</code><code id="L624"><span class="ln">624</span>    R.rgb2hsl<span class="s"> = </span><b>function</b> (r, g, b) {
-</code><code id="L625"><span class="ln">625</span>        b<span class="s"> = </span>prepareRGB(r, g, b);
-</code><code id="L626"><span class="ln">626</span>        r<span class="s"> = </span>b[<span class="d">0</span>];
-</code><code id="L627"><span class="ln">627</span>        g<span class="s"> = </span>b[<span class="d">1</span>];
-</code><code id="L628"><span class="ln">628</span>        b<span class="s"> = </span>b[<span class="d">2</span>];
-</code><code id="L629"><span class="ln">629</span>
-</code><code id="L630"><span class="ln">630</span>        <b>var</b> H, S, L, M, m, C;
-</code><code id="L631"><span class="ln">631</span>        M<span class="s"> = </span>mmax(r, g, b);
-</code><code id="L632"><span class="ln">632</span>        m<span class="s"> = </span>mmin(r, g, b);
-</code><code id="L633"><span class="ln">633</span>        C<span class="s"> = </span>M<span class="s"> - </span>m;
-</code><code id="L634"><span class="ln">634</span>        H<span class="s"> = </span>(C<span class="s"> == </span><span class="d">0</span> ? <b>null</b> :
-</code><code id="L635"><span class="ln">635</span>             M<span class="s"> == </span>r ? (g<span class="s"> - </span>b)<span class="s"> / </span>C :
-</code><code id="L636"><span class="ln">636</span>             M<span class="s"> == </span>g ? (b<span class="s"> - </span>r)<span class="s"> / </span>C<span class="s"> + </span><span class="d">2</span> :
-</code><code id="L637"><span class="ln">637</span>                      (r<span class="s"> - </span>g)<span class="s"> / </span>C<span class="s"> + </span><span class="d">4</span>);
-</code><code id="L638"><span class="ln">638</span>        H<span class="s"> = </span>(H<span class="s"> % </span><span class="d">6</span>)<span class="s"> * </span><span class="d">60</span>;
-</code><code id="L639"><span class="ln">639</span>        L<span class="s"> = </span>(M<span class="s"> + </span>m)<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L640"><span class="ln">640</span>        S<span class="s"> = </span>(C<span class="s"> == </span><span class="d">0</span> ? <span class="d">0</span> :
-</code><code id="L641"><span class="ln">641</span>             L &lt; <span class="d">.5</span> ? C<span class="s"> / </span>(<span class="d">2</span><span class="s"> * </span>L) :
-</code><code id="L642"><span class="ln">642</span>                      C<span class="s"> / </span>(<span class="d">2</span><span class="s"> - </span><span class="d">2</span><span class="s"> * </span>L));
-</code><code id="L643"><span class="ln">643</span>        <b>return</b> {h: H, s: S, l: L, toString: hsltoString};
-</code><code id="L644"><span class="ln">644</span>    };
-</code><code id="L645"><span class="ln">645</span>    R._path2string<span class="s"> = </span><b>function</b> () {
-</code><code id="L646"><span class="ln">646</span>        <b>return</b> <b>this</b>.join(<i>","</i>).replace(p2s, <i>"$<span class="d">1</span>"</i>);
-</code><code id="L647"><span class="ln">647</span>    };
-</code><code id="L648"><span class="ln">648</span>    <b>function</b> cacher(f, scope, postprocessor) {
-</code><code id="L649"><span class="ln">649</span>        <b>function</b> newf() {
-</code><code id="L650"><span class="ln">650</span>            <b>var</b> arg<span class="s"> = </span>Array.prototype.slice.call(arguments, <span class="d">0</span>),
-</code><code id="L651"><span class="ln">651</span>                args<span class="s"> = </span>arg.join(<i>"\u2400"</i>),
-</code><code id="L652"><span class="ln">652</span>                cache<span class="s"> = </span>newf.cache<span class="s"> = </span>newf.cache<span class="s"> || </span>{},
-</code><code id="L653"><span class="ln">653</span>                count<span class="s"> = </span>newf.count<span class="s"> = </span>newf.count<span class="s"> || </span>[];
-</code><code id="L654"><span class="ln">654</span>            <b>if</b> (cache[has](args)) {
-</code><code id="L655"><span class="ln">655</span>                <b>return</b> postprocessor ? postprocessor(cache[args]) : cache[args];
-</code><code id="L656"><span class="ln">656</span>            }
-</code><code id="L657"><span class="ln">657</span>            count.length >= <span class="d">1e3</span><span class="s"> &amp;&amp; </span><b>delete</b> cache[count.shift()];
-</code><code id="L658"><span class="ln">658</span>            count.push(args);
-</code><code id="L659"><span class="ln">659</span>            cache[args]<span class="s"> = </span>f[apply](scope, arg);
-</code><code id="L660"><span class="ln">660</span>            <b>return</b> postprocessor ? postprocessor(cache[args]) : cache[args];
-</code><code id="L661"><span class="ln">661</span>        }
-</code><code id="L662"><span class="ln">662</span>        <b>return</b> newf;
-</code><code id="L663"><span class="ln">663</span>    }
-</code><code id="L664"><span class="ln">664</span>
-</code><code id="L665"><span class="ln">665</span>    <b>function</b> preload(src, f) {
-</code><code id="L666"><span class="ln">666</span>        <b>var</b> img<span class="s"> = </span>g.doc.createElement(<i>"img"</i>);
-</code><code id="L667"><span class="ln">667</span>        img.style.cssText<span class="s"> = </span><i>"position:absolute;left:-9999em;top-9999em"</i>;
-</code><code id="L668"><span class="ln">668</span>        img.onload<span class="s"> = </span><b>function</b> () {
-</code><code id="L669"><span class="ln">669</span>            f.call(<b>this</b>);
-</code><code id="L670"><span class="ln">670</span>            <b>this</b>.onload<span class="s"> = </span><b>null</b>;
-</code><code id="L671"><span class="ln">671</span>            g.doc.body.removeChild(<b>this</b>);
-</code><code id="L672"><span class="ln">672</span>        };
-</code><code id="L673"><span class="ln">673</span>        img.onerror<span class="s"> = </span><b>function</b> () {
-</code><code id="L674"><span class="ln">674</span>            g.doc.body.removeChild(<b>this</b>);
-</code><code id="L675"><span class="ln">675</span>        };
-</code><code id="L676"><span class="ln">676</span>        g.doc.body.appendChild(img);
-</code><code id="L677"><span class="ln">677</span>        img.src<span class="s"> = </span>src;
-</code><code id="L678"><span class="ln">678</span>    }
-</code><code id="L679"><span class="ln">679</span>
-</code><code id="L680"><span class="ln">680</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L681"><span class="ln">681</span><span class="c">    <span class="s"> * </span>Raphael.getRGB
-</span></code><code id="L682"><span class="ln">682</span><span class="c">     [ method ]
-</span></code><code id="L683"><span class="ln">683</span><span class="c">     **
-</span></code><code id="L684"><span class="ln">684</span><span class="c">    <span class="s"> * </span>Parses colour string as RGB object
-</span></code><code id="L685"><span class="ln">685</span><span class="c">     > Parameters
-</span></code><code id="L686"><span class="ln">686</span><span class="c">    <span class="s"> - </span>colour (string) colour string <b>in</b> one of formats:
-</span></code><code id="L687"><span class="ln">687</span><span class="c">     &lt;ul>
-</span></code><code id="L688"><span class="ln">688</span><span class="c">         &lt;li>Colour name (“&lt;samp>red&lt;/samp>”, “&lt;samp>green&lt;/samp>”, “&lt;samp>cornflowerblue&lt;/samp>”, etc)&lt;/li>
-</span></code><code id="L689"><span class="ln">689</span><span class="c">         &lt;li>#••• — shortened HTML colour: (“&lt;samp>#<span class="d">000</span>&lt;/samp>”, “&lt;samp>#fc0&lt;/samp>”, etc)&lt;/li>
-</span></code><code id="L690"><span class="ln">690</span><span class="c">         &lt;li>#•••••• — full length HTML colour: (“&lt;samp>#<span class="d">000000</span>&lt;/samp>”, “&lt;samp>#bd2300&lt;/samp>”)&lt;/li>
-</span></code><code id="L691"><span class="ln">691</span><span class="c">         &lt;li>rgb(•••, •••, •••) — red, green and blue channels’ values: (“&lt;samp>rgb(<span class="d">200</span>,&nbsp;<span class="d">100</span>,&nbsp;<span class="d">0</span>)&lt;/samp>”)&lt;/li>
-</span></code><code id="L692"><span class="ln">692</span><span class="c">         &lt;li>rgb(•••%, •••%, •••%) — same as above, but <b>in</b> %: (“&lt;samp>rgb(<span class="d">100</span>%,&nbsp;<span class="d">175</span>%,&nbsp;<span class="d">0</span>%)&lt;/samp>”)&lt;/li>
-</span></code><code id="L693"><span class="ln">693</span><span class="c">         &lt;li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“&lt;samp>hsb(<span class="d">0.5</span>,&nbsp;<span class="d">0.25</span>,&nbsp;<span class="d">1</span>)&lt;/samp>”)&lt;/li>
-</span></code><code id="L694"><span class="ln">694</span><span class="c">         &lt;li>hsb(•••%, •••%, •••%) — same as above, but <b>in</b> %&lt;/li>
-</span></code><code id="L695"><span class="ln">695</span><span class="c">         &lt;li>hsl(•••, •••, •••) — same as hsb&lt;/li>
-</span></code><code id="L696"><span class="ln">696</span><span class="c">         &lt;li>hsl(•••%, •••%, •••%) — same as hsb&lt;/li>
-</span></code><code id="L697"><span class="ln">697</span><span class="c">     &lt;/ul>
-</span></code><code id="L698"><span class="ln">698</span><span class="c">    <span class="s"> = </span>(object) RGB object <b>in</b> format:
-</span></code><code id="L699"><span class="ln">699</span><span class="c">     o {
-</span></code><code id="L700"><span class="ln">700</span><span class="c">     o     r (number) red,
-</span></code><code id="L701"><span class="ln">701</span><span class="c">     o     g (number) green,
-</span></code><code id="L702"><span class="ln">702</span><span class="c">     o     b (number) blue
-</span></code><code id="L703"><span class="ln">703</span><span class="c">     o     hex (string) color <b>in</b> HTML/CSS format: #••••••,
-</span></code><code id="L704"><span class="ln">704</span><span class="c">     o     error (<b>boolean</b>) <b>true</b> <b>if</b> string can’t be parsed
-</span></code><code id="L705"><span class="ln">705</span><span class="c">     o }
-</span></code><code id="L706"><span class="ln">706</span><span class="c">    \*/</span>
-</code><code id="L707"><span class="ln">707</span>    R.getRGB<span class="s"> = </span>cacher(<b>function</b> (colour) {
-</code><code id="L708"><span class="ln">708</span>        <b>if</b> (!colour<span class="s"> || </span>!!((colour<span class="s"> = </span>Str(colour)).indexOf(<i>"-"</i>)<span class="s"> + </span><span class="d">1</span>)) {
-</code><code id="L709"><span class="ln">709</span>            <b>return</b> {r: -<span class="d">1</span>, g: -<span class="d">1</span>, b: -<span class="d">1</span>, hex: <i>"none"</i>, error: <span class="d">1</span>};
-</code><code id="L710"><span class="ln">710</span>        }
-</code><code id="L711"><span class="ln">711</span>        <b>if</b> (colour<span class="s"> == </span><i>"none"</i>) {
-</code><code id="L712"><span class="ln">712</span>            <b>return</b> {r: -<span class="d">1</span>, g: -<span class="d">1</span>, b: -<span class="d">1</span>, hex: <i>"none"</i>};
-</code><code id="L713"><span class="ln">713</span>        }
-</code><code id="L714"><span class="ln">714</span>        !(hsrg[has](colour.toLowerCase().substring(<span class="d">0</span>, <span class="d">2</span>))<span class="s"> || </span>colour.charAt()<span class="s"> == </span><i>"#"</i>)<span class="s"> &amp;&amp; </span>(colour<span class="s"> = </span>toHex(colour));
-</code><code id="L715"><span class="ln">715</span>        <b>var</b> res,
-</code><code id="L716"><span class="ln">716</span>            red,
-</code><code id="L717"><span class="ln">717</span>            green,
-</code><code id="L718"><span class="ln">718</span>            blue,
-</code><code id="L719"><span class="ln">719</span>            opacity,
-</code><code id="L720"><span class="ln">720</span>            t,
-</code><code id="L721"><span class="ln">721</span>            values,
-</code><code id="L722"><span class="ln">722</span>            rgb<span class="s"> = </span>colour.match(colourRegExp);
-</code><code id="L723"><span class="ln">723</span>        <b>if</b> (rgb) {
-</code><code id="L724"><span class="ln">724</span>            <b>if</b> (rgb[<span class="d">2</span>]) {
-</code><code id="L725"><span class="ln">725</span>                blue<span class="s"> = </span>toInt(rgb[<span class="d">2</span>].substring(<span class="d">5</span>), <span class="d">16</span>);
-</code><code id="L726"><span class="ln">726</span>                green<span class="s"> = </span>toInt(rgb[<span class="d">2</span>].substring(<span class="d">3</span>, <span class="d">5</span>), <span class="d">16</span>);
-</code><code id="L727"><span class="ln">727</span>                red<span class="s"> = </span>toInt(rgb[<span class="d">2</span>].substring(<span class="d">1</span>, <span class="d">3</span>), <span class="d">16</span>);
-</code><code id="L728"><span class="ln">728</span>            }
-</code><code id="L729"><span class="ln">729</span>            <b>if</b> (rgb[<span class="d">3</span>]) {
-</code><code id="L730"><span class="ln">730</span>                blue<span class="s"> = </span>toInt((t<span class="s"> = </span>rgb[<span class="d">3</span>].charAt(<span class="d">3</span>))<span class="s"> + </span>t, <span class="d">16</span>);
-</code><code id="L731"><span class="ln">731</span>                green<span class="s"> = </span>toInt((t<span class="s"> = </span>rgb[<span class="d">3</span>].charAt(<span class="d">2</span>))<span class="s"> + </span>t, <span class="d">16</span>);
-</code><code id="L732"><span class="ln">732</span>                red<span class="s"> = </span>toInt((t<span class="s"> = </span>rgb[<span class="d">3</span>].charAt(<span class="d">1</span>))<span class="s"> + </span>t, <span class="d">16</span>);
-</code><code id="L733"><span class="ln">733</span>            }
-</code><code id="L734"><span class="ln">734</span>            <b>if</b> (rgb[<span class="d">4</span>]) {
-</code><code id="L735"><span class="ln">735</span>                values<span class="s"> = </span>rgb[<span class="d">4</span>].split(commaSpaces);
-</code><code id="L736"><span class="ln">736</span>                red<span class="s"> = </span>toFloat(values[<span class="d">0</span>]);
-</code><code id="L737"><span class="ln">737</span>                values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(red *= <span class="d">2.55</span>);
-</code><code id="L738"><span class="ln">738</span>                green<span class="s"> = </span>toFloat(values[<span class="d">1</span>]);
-</code><code id="L739"><span class="ln">739</span>                values[<span class="d">1</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(green *= <span class="d">2.55</span>);
-</code><code id="L740"><span class="ln">740</span>                blue<span class="s"> = </span>toFloat(values[<span class="d">2</span>]);
-</code><code id="L741"><span class="ln">741</span>                values[<span class="d">2</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(blue *= <span class="d">2.55</span>);
-</code><code id="L742"><span class="ln">742</span>                rgb[<span class="d">1</span>].toLowerCase().slice(<span class="d">0</span>, <span class="d">4</span>)<span class="s"> == </span><i>"rgba"</i><span class="s"> &amp;&amp; </span>(opacity<span class="s"> = </span>toFloat(values[<span class="d">3</span>]));
-</code><code id="L743"><span class="ln">743</span>                values[<span class="d">3</span>]<span class="s"> &amp;&amp; </span>values[<span class="d">3</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(opacity /= <span class="d">100</span>);
-</code><code id="L744"><span class="ln">744</span>            }
-</code><code id="L745"><span class="ln">745</span>            <b>if</b> (rgb[<span class="d">5</span>]) {
-</code><code id="L746"><span class="ln">746</span>                values<span class="s"> = </span>rgb[<span class="d">5</span>].split(commaSpaces);
-</code><code id="L747"><span class="ln">747</span>                red<span class="s"> = </span>toFloat(values[<span class="d">0</span>]);
-</code><code id="L748"><span class="ln">748</span>                values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(red *= <span class="d">2.55</span>);
-</code><code id="L749"><span class="ln">749</span>                green<span class="s"> = </span>toFloat(values[<span class="d">1</span>]);
-</code><code id="L750"><span class="ln">750</span>                values[<span class="d">1</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(green *= <span class="d">2.55</span>);
-</code><code id="L751"><span class="ln">751</span>                blue<span class="s"> = </span>toFloat(values[<span class="d">2</span>]);
-</code><code id="L752"><span class="ln">752</span>                values[<span class="d">2</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(blue *= <span class="d">2.55</span>);
-</code><code id="L753"><span class="ln">753</span>                (values[<span class="d">0</span>].slice(-<span class="d">3</span>)<span class="s"> == </span><i>"deg"</i><span class="s"> || </span>values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"\xb0"</i>)<span class="s"> &amp;&amp; </span>(red /= <span class="d">360</span>);
-</code><code id="L754"><span class="ln">754</span>                rgb[<span class="d">1</span>].toLowerCase().slice(<span class="d">0</span>, <span class="d">4</span>)<span class="s"> == </span><i>"hsba"</i><span class="s"> &amp;&amp; </span>(opacity<span class="s"> = </span>toFloat(values[<span class="d">3</span>]));
-</code><code id="L755"><span class="ln">755</span>                values[<span class="d">3</span>]<span class="s"> &amp;&amp; </span>values[<span class="d">3</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(opacity /= <span class="d">100</span>);
-</code><code id="L756"><span class="ln">756</span>                <b>return</b> R.hsb2rgb(red, green, blue, opacity);
-</code><code id="L757"><span class="ln">757</span>            }
-</code><code id="L758"><span class="ln">758</span>            <b>if</b> (rgb[<span class="d">6</span>]) {
-</code><code id="L759"><span class="ln">759</span>                values<span class="s"> = </span>rgb[<span class="d">6</span>].split(commaSpaces);
-</code><code id="L760"><span class="ln">760</span>                red<span class="s"> = </span>toFloat(values[<span class="d">0</span>]);
-</code><code id="L761"><span class="ln">761</span>                values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(red *= <span class="d">2.55</span>);
-</code><code id="L762"><span class="ln">762</span>                green<span class="s"> = </span>toFloat(values[<span class="d">1</span>]);
-</code><code id="L763"><span class="ln">763</span>                values[<span class="d">1</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(green *= <span class="d">2.55</span>);
-</code><code id="L764"><span class="ln">764</span>                blue<span class="s"> = </span>toFloat(values[<span class="d">2</span>]);
-</code><code id="L765"><span class="ln">765</span>                values[<span class="d">2</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(blue *= <span class="d">2.55</span>);
-</code><code id="L766"><span class="ln">766</span>                (values[<span class="d">0</span>].slice(-<span class="d">3</span>)<span class="s"> == </span><i>"deg"</i><span class="s"> || </span>values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"\xb0"</i>)<span class="s"> &amp;&amp; </span>(red /= <span class="d">360</span>);
-</code><code id="L767"><span class="ln">767</span>                rgb[<span class="d">1</span>].toLowerCase().slice(<span class="d">0</span>, <span class="d">4</span>)<span class="s"> == </span><i>"hsla"</i><span class="s"> &amp;&amp; </span>(opacity<span class="s"> = </span>toFloat(values[<span class="d">3</span>]));
-</code><code id="L768"><span class="ln">768</span>                values[<span class="d">3</span>]<span class="s"> &amp;&amp; </span>values[<span class="d">3</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(opacity /= <span class="d">100</span>);
-</code><code id="L769"><span class="ln">769</span>                <b>return</b> R.hsl2rgb(red, green, blue, opacity);
-</code><code id="L770"><span class="ln">770</span>            }
-</code><code id="L771"><span class="ln">771</span>            rgb<span class="s"> = </span>{r: red, g: green, b: blue};
-</code><code id="L772"><span class="ln">772</span>            rgb.hex<span class="s"> = </span><i>"#"</i><span class="s"> + </span>(<span class="d">16777216</span><span class="s"> | </span>blue<span class="s"> | </span>(green &lt;&lt; <span class="d">8</span>)<span class="s"> | </span>(red &lt;&lt; <span class="d">16</span>)).toString(<span class="d">16</span>).slice(<span class="d">1</span>);
-</code><code id="L773"><span class="ln">773</span>            R.is(opacity, <i>"finite"</i>)<span class="s"> &amp;&amp; </span>(rgb.opacity<span class="s"> = </span>opacity);
-</code><code id="L774"><span class="ln">774</span>            <b>return</b> rgb;
-</code><code id="L775"><span class="ln">775</span>        }
-</code><code id="L776"><span class="ln">776</span>        <b>return</b> {r: -<span class="d">1</span>, g: -<span class="d">1</span>, b: -<span class="d">1</span>, hex: <i>"none"</i>, error: <span class="d">1</span>};
-</code><code id="L777"><span class="ln">777</span>    }, R);
-</code><code id="L778"><span class="ln">778</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L779"><span class="ln">779</span><span class="c">    <span class="s"> * </span>Raphael.hsb
-</span></code><code id="L780"><span class="ln">780</span><span class="c">     [ method ]
-</span></code><code id="L781"><span class="ln">781</span><span class="c">     **
-</span></code><code id="L782"><span class="ln">782</span><span class="c">    <span class="s"> * </span>Converts HSB values to hex representation of the colour.
-</span></code><code id="L783"><span class="ln">783</span><span class="c">     > Parameters
-</span></code><code id="L784"><span class="ln">784</span><span class="c">    <span class="s"> - </span>h (number) hue
-</span></code><code id="L785"><span class="ln">785</span><span class="c">    <span class="s"> - </span>s (number) saturation
-</span></code><code id="L786"><span class="ln">786</span><span class="c">    <span class="s"> - </span>b (number) value or brightness
-</span></code><code id="L787"><span class="ln">787</span><span class="c">    <span class="s"> = </span>(string) hex representation of the colour.
-</span></code><code id="L788"><span class="ln">788</span><span class="c">    \*/</span>
-</code><code id="L789"><span class="ln">789</span>    R.hsb<span class="s"> = </span>cacher(<b>function</b> (h, s, b) {
-</code><code id="L790"><span class="ln">790</span>        <b>return</b> R.hsb2rgb(h, s, b).hex;
-</code><code id="L791"><span class="ln">791</span>    });
-</code><code id="L792"><span class="ln">792</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L793"><span class="ln">793</span><span class="c">    <span class="s"> * </span>Raphael.hsl
-</span></code><code id="L794"><span class="ln">794</span><span class="c">     [ method ]
-</span></code><code id="L795"><span class="ln">795</span><span class="c">     **
-</span></code><code id="L796"><span class="ln">796</span><span class="c">    <span class="s"> * </span>Converts HSL values to hex representation of the colour.
-</span></code><code id="L797"><span class="ln">797</span><span class="c">     > Parameters
-</span></code><code id="L798"><span class="ln">798</span><span class="c">    <span class="s"> - </span>h (number) hue
-</span></code><code id="L799"><span class="ln">799</span><span class="c">    <span class="s"> - </span>s (number) saturation
-</span></code><code id="L800"><span class="ln">800</span><span class="c">    <span class="s"> - </span>l (number) luminosity
-</span></code><code id="L801"><span class="ln">801</span><span class="c">    <span class="s"> = </span>(string) hex representation of the colour.
-</span></code><code id="L802"><span class="ln">802</span><span class="c">    \*/</span>
-</code><code id="L803"><span class="ln">803</span>    R.hsl<span class="s"> = </span>cacher(<b>function</b> (h, s, l) {
-</code><code id="L804"><span class="ln">804</span>        <b>return</b> R.hsl2rgb(h, s, l).hex;
-</code><code id="L805"><span class="ln">805</span>    });
-</code><code id="L806"><span class="ln">806</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L807"><span class="ln">807</span><span class="c">    <span class="s"> * </span>Raphael.rgb
-</span></code><code id="L808"><span class="ln">808</span><span class="c">     [ method ]
-</span></code><code id="L809"><span class="ln">809</span><span class="c">     **
-</span></code><code id="L810"><span class="ln">810</span><span class="c">    <span class="s"> * </span>Converts RGB values to hex representation of the colour.
-</span></code><code id="L811"><span class="ln">811</span><span class="c">     > Parameters
-</span></code><code id="L812"><span class="ln">812</span><span class="c">    <span class="s"> - </span>r (number) red
-</span></code><code id="L813"><span class="ln">813</span><span class="c">    <span class="s"> - </span>g (number) green
-</span></code><code id="L814"><span class="ln">814</span><span class="c">    <span class="s"> - </span>b (number) blue
-</span></code><code id="L815"><span class="ln">815</span><span class="c">    <span class="s"> = </span>(string) hex representation of the colour.
-</span></code><code id="L816"><span class="ln">816</span><span class="c">    \*/</span>
-</code><code id="L817"><span class="ln">817</span>    R.rgb<span class="s"> = </span>cacher(<b>function</b> (r, g, b) {
-</code><code id="L818"><span class="ln">818</span>        <b>return</b> <i>"#"</i><span class="s"> + </span>(<span class="d">16777216</span><span class="s"> | </span>b<span class="s"> | </span>(g &lt;&lt; <span class="d">8</span>)<span class="s"> | </span>(r &lt;&lt; <span class="d">16</span>)).toString(<span class="d">16</span>).slice(<span class="d">1</span>);
-</code><code id="L819"><span class="ln">819</span>    });
-</code><code id="L820"><span class="ln">820</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L821"><span class="ln">821</span><span class="c">    <span class="s"> * </span>Raphael.getColor
-</span></code><code id="L822"><span class="ln">822</span><span class="c">     [ method ]
-</span></code><code id="L823"><span class="ln">823</span><span class="c">     **
-</span></code><code id="L824"><span class="ln">824</span><span class="c">    <span class="s"> * </span>On each call returns next colour <b>in</b> the spectrum. To reset it back to red call @Raphael.getColor.reset
-</span></code><code id="L825"><span class="ln">825</span><span class="c">     > Parameters
-</span></code><code id="L826"><span class="ln">826</span><span class="c">    <span class="s"> - </span>value (number) #optional brightness, <b>default</b> is `<span class="d">0.75</span>`
-</span></code><code id="L827"><span class="ln">827</span><span class="c">    <span class="s"> = </span>(string) hex representation of the colour.
-</span></code><code id="L828"><span class="ln">828</span><span class="c">    \*/</span>
-</code><code id="L829"><span class="ln">829</span>    R.getColor<span class="s"> = </span><b>function</b> (value) {
-</code><code id="L830"><span class="ln">830</span>        <b>var</b> start<span class="s"> = </span><b>this</b>.getColor.start<span class="s"> = </span><b>this</b>.getColor.start<span class="s"> || </span>{h: <span class="d">0</span>, s: <span class="d">1</span>, b: value<span class="s"> || </span><span class="d">.75</span>},
-</code><code id="L831"><span class="ln">831</span>            rgb<span class="s"> = </span><b>this</b>.hsb2rgb(start.h, start.s, start.b);
-</code><code id="L832"><span class="ln">832</span>        start.h += <span class="d">.075</span>;
-</code><code id="L833"><span class="ln">833</span>        <b>if</b> (start.h > <span class="d">1</span>) {
-</code><code id="L834"><span class="ln">834</span>            start.h<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L835"><span class="ln">835</span>            start.s -= <span class="d">.2</span>;
-</code><code id="L836"><span class="ln">836</span>            start.s &lt;= <span class="d">0</span><span class="s"> &amp;&amp; </span>(<b>this</b>.getColor.start<span class="s"> = </span>{h: <span class="d">0</span>, s: <span class="d">1</span>, b: start.b});
-</code><code id="L837"><span class="ln">837</span>        }
-</code><code id="L838"><span class="ln">838</span>        <b>return</b> rgb.hex;
-</code><code id="L839"><span class="ln">839</span>    };
-</code><code id="L840"><span class="ln">840</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L841"><span class="ln">841</span><span class="c">    <span class="s"> * </span>Raphael.getColor.reset
-</span></code><code id="L842"><span class="ln">842</span><span class="c">     [ method ]
-</span></code><code id="L843"><span class="ln">843</span><span class="c">     **
-</span></code><code id="L844"><span class="ln">844</span><span class="c">    <span class="s"> * </span>Resets spectrum position <b>for</b> @Raphael.getColor back to red.
-</span></code><code id="L845"><span class="ln">845</span><span class="c">    \*/</span>
-</code><code id="L846"><span class="ln">846</span>    R.getColor.reset<span class="s"> = </span><b>function</b> () {
-</code><code id="L847"><span class="ln">847</span>        <b>delete</b> <b>this</b>.start;
-</code><code id="L848"><span class="ln">848</span>    };
-</code><code id="L849"><span class="ln">849</span>
-</code><code id="L850"><span class="ln">850</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L851"><span class="ln">851</span><span class="c">    <span class="s"> * </span>Raphael.parsePathString
-</span></code><code id="L852"><span class="ln">852</span><span class="c">     [ method ]
-</span></code><code id="L853"><span class="ln">853</span><span class="c">     **
-</span></code><code id="L854"><span class="ln">854</span><span class="c">    <span class="s"> * </span>Utility method
-</span></code><code id="L855"><span class="ln">855</span><span class="c">     **
-</span></code><code id="L856"><span class="ln">856</span><span class="c">    <span class="s"> * </span>Parses given path string into an array of arrays of path segments.
-</span></code><code id="L857"><span class="ln">857</span><span class="c">     > Parameters
-</span></code><code id="L858"><span class="ln">858</span><span class="c">    <span class="s"> - </span>pathString (string|array) path string or array of segments (<b>in</b> the last <b>case</b> it will be returned stright away)
-</span></code><code id="L859"><span class="ln">859</span><span class="c">    <span class="s"> = </span>(array) array of segments.
-</span></code><code id="L860"><span class="ln">860</span><span class="c">    \*/</span>
-</code><code id="L861"><span class="ln">861</span>    R.parsePathString<span class="s"> = </span>cacher(<b>function</b> (pathString) {
-</code><code id="L862"><span class="ln">862</span>        <b>if</b> (!pathString) {
-</code><code id="L863"><span class="ln">863</span>            <b>return</b> <b>null</b>;
-</code><code id="L864"><span class="ln">864</span>        }
-</code><code id="L865"><span class="ln">865</span>        <b>var</b> paramCounts<span class="s"> = </span>{a: <span class="d">7</span>, c: <span class="d">6</span>, h: <span class="d">1</span>, l: <span class="d">2</span>, m: <span class="d">2</span>, q: <span class="d">4</span>, s: <span class="d">4</span>, t: <span class="d">2</span>, v: <span class="d">1</span>, z: <span class="d">0</span>},
-</code><code id="L866"><span class="ln">866</span>            data<span class="s"> = </span>[];
-</code><code id="L867"><span class="ln">867</span>        <b>if</b> (R.is(pathString, array)<span class="s"> &amp;&amp; </span>R.is(pathString[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
-</code><code id="L868"><span class="ln">868</span>            data<span class="s"> = </span>pathClone(pathString);
-</code><code id="L869"><span class="ln">869</span>        }
-</code><code id="L870"><span class="ln">870</span>        <b>if</b> (!data.length) {
-</code><code id="L871"><span class="ln">871</span>            Str(pathString).replace(pathCommand, <b>function</b> (a, b, c) {
-</code><code id="L872"><span class="ln">872</span>                <b>var</b> params<span class="s"> = </span>[],
-</code><code id="L873"><span class="ln">873</span>                    name<span class="s"> = </span>lowerCase.call(b);
-</code><code id="L874"><span class="ln">874</span>                c.replace(pathValues, <b>function</b> (a, b) {
-</code><code id="L875"><span class="ln">875</span>                    b<span class="s"> &amp;&amp; </span>params.push(+b);
-</code><code id="L876"><span class="ln">876</span>                });
-</code><code id="L877"><span class="ln">877</span>                <b>if</b> (name<span class="s"> == </span><i>"m"</i><span class="s"> &amp;&amp; </span>params.length > <span class="d">2</span>) {
-</code><code id="L878"><span class="ln">878</span>                    data.push([b][concat](params.splice(<span class="d">0</span>, <span class="d">2</span>)));
-</code><code id="L879"><span class="ln">879</span>                    name<span class="s"> = </span><i>"l"</i>;
-</code><code id="L880"><span class="ln">880</span>                    b<span class="s"> = </span>b<span class="s"> == </span><i>"m"</i> ? <i>"l"</i> : <i>"L"</i>;
-</code><code id="L881"><span class="ln">881</span>                }
-</code><code id="L882"><span class="ln">882</span>                <b>while</b> (params.length >= paramCounts[name]) {
-</code><code id="L883"><span class="ln">883</span>                    data.push([b][concat](params.splice(<span class="d">0</span>, paramCounts[name])));
-</code><code id="L884"><span class="ln">884</span>                    <b>if</b> (!paramCounts[name]) {
-</code><code id="L885"><span class="ln">885</span>                        <b>break</b>;
-</code><code id="L886"><span class="ln">886</span>                    }
-</code><code id="L887"><span class="ln">887</span>                }
-</code><code id="L888"><span class="ln">888</span>            });
-</code><code id="L889"><span class="ln">889</span>        }
-</code><code id="L890"><span class="ln">890</span>        data.toString<span class="s"> = </span>R._path2string;
-</code><code id="L891"><span class="ln">891</span>        <b>return</b> data;
-</code><code id="L892"><span class="ln">892</span>    });
-</code><code id="L893"><span class="ln">893</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L894"><span class="ln">894</span><span class="c">    <span class="s"> * </span>Raphael.parseTransformString
-</span></code><code id="L895"><span class="ln">895</span><span class="c">     [ method ]
-</span></code><code id="L896"><span class="ln">896</span><span class="c">     **
-</span></code><code id="L897"><span class="ln">897</span><span class="c">    <span class="s"> * </span>Utility method
-</span></code><code id="L898"><span class="ln">898</span><span class="c">     **
-</span></code><code id="L899"><span class="ln">899</span><span class="c">    <span class="s"> * </span>Parses given path string into an array of transformations.
-</span></code><code id="L900"><span class="ln">900</span><span class="c">     > Parameters
-</span></code><code id="L901"><span class="ln">901</span><span class="c">    <span class="s"> - </span>TString (string|array) transform string or array of transformations (<b>in</b> the last <b>case</b> it will be returned stright away)
-</span></code><code id="L902"><span class="ln">902</span><span class="c">    <span class="s"> = </span>(array) array of transformations.
-</span></code><code id="L903"><span class="ln">903</span><span class="c">    \*/</span>
-</code><code id="L904"><span class="ln">904</span>    R.parseTransformString<span class="s"> = </span>cacher(<b>function</b> (TString) {
-</code><code id="L905"><span class="ln">905</span>        <b>if</b> (!TString) {
-</code><code id="L906"><span class="ln">906</span>            <b>return</b> <b>null</b>;
-</code><code id="L907"><span class="ln">907</span>        }
-</code><code id="L908"><span class="ln">908</span>        <b>var</b> paramCounts<span class="s"> = </span>{r: <span class="d">3</span>, s: <span class="d">4</span>, t: <span class="d">2</span>, m: <span class="d">6</span>},
-</code><code id="L909"><span class="ln">909</span>            data<span class="s"> = </span>[];
-</code><code id="L910"><span class="ln">910</span>        <b>if</b> (R.is(TString, array)<span class="s"> &amp;&amp; </span>R.is(TString[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
-</code><code id="L911"><span class="ln">911</span>            data<span class="s"> = </span>pathClone(TString);
-</code><code id="L912"><span class="ln">912</span>        }
-</code><code id="L913"><span class="ln">913</span>        <b>if</b> (!data.length) {
-</code><code id="L914"><span class="ln">914</span>            Str(TString).replace(tCommand, <b>function</b> (a, b, c) {
-</code><code id="L915"><span class="ln">915</span>                <b>var</b> params<span class="s"> = </span>[],
-</code><code id="L916"><span class="ln">916</span>                    name<span class="s"> = </span>lowerCase.call(b);
-</code><code id="L917"><span class="ln">917</span>                c.replace(pathValues, <b>function</b> (a, b) {
-</code><code id="L918"><span class="ln">918</span>                    b<span class="s"> &amp;&amp; </span>params.push(+b);
-</code><code id="L919"><span class="ln">919</span>                });
-</code><code id="L920"><span class="ln">920</span>                data.push([name][concat](params));
-</code><code id="L921"><span class="ln">921</span>            });
-</code><code id="L922"><span class="ln">922</span>        }
-</code><code id="L923"><span class="ln">923</span>        data.toString<span class="s"> = </span>R._path2string;
-</code><code id="L924"><span class="ln">924</span>        <b>return</b> data;
-</code><code id="L925"><span class="ln">925</span>    });
-</code><code id="L926"><span class="ln">926</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L927"><span class="ln">927</span><span class="c">    <span class="s"> * </span>Raphael.findDotsAtSegment
-</span></code><code id="L928"><span class="ln">928</span><span class="c">     [ method ]
-</span></code><code id="L929"><span class="ln">929</span><span class="c">     **
-</span></code><code id="L930"><span class="ln">930</span><span class="c">    <span class="s"> * </span>Utility method
-</span></code><code id="L931"><span class="ln">931</span><span class="c">     **
-</span></code><code id="L932"><span class="ln">932</span><span class="c">    <span class="s"> * </span>Find dot coordinates on the given cubic bezier curve at the given t.
-</span></code><code id="L933"><span class="ln">933</span><span class="c">     > Parameters
-</span></code><code id="L934"><span class="ln">934</span><span class="c">    <span class="s"> - </span>p1x (number) x of the first point of the curve
-</span></code><code id="L935"><span class="ln">935</span><span class="c">    <span class="s"> - </span>p1y (number) y of the first point of the curve
-</span></code><code id="L936"><span class="ln">936</span><span class="c">    <span class="s"> - </span>c1x (number) x of the first anchor of the curve
-</span></code><code id="L937"><span class="ln">937</span><span class="c">    <span class="s"> - </span>c1y (number) y of the first anchor of the curve
-</span></code><code id="L938"><span class="ln">938</span><span class="c">    <span class="s"> - </span>c2x (number) x of the second anchor of the curve
-</span></code><code id="L939"><span class="ln">939</span><span class="c">    <span class="s"> - </span>c2y (number) y of the second anchor of the curve
-</span></code><code id="L940"><span class="ln">940</span><span class="c">    <span class="s"> - </span>p2x (number) x of the second point of the curve
-</span></code><code id="L941"><span class="ln">941</span><span class="c">    <span class="s"> - </span>p2y (number) y of the second point of the curve
-</span></code><code id="L942"><span class="ln">942</span><span class="c">    <span class="s"> - </span>t (number) position on the curve (<span class="d">0</span>.<span class="d">.1</span>)
-</span></code><code id="L943"><span class="ln">943</span><span class="c">    <span class="s"> = </span>(object) point information <b>in</b> format:
-</span></code><code id="L944"><span class="ln">944</span><span class="c">     o {
-</span></code><code id="L945"><span class="ln">945</span><span class="c">     o     x: (number) x coordinate of the point
-</span></code><code id="L946"><span class="ln">946</span><span class="c">     o     y: (number) y coordinate of the point
-</span></code><code id="L947"><span class="ln">947</span><span class="c">     o     m: {
-</span></code><code id="L948"><span class="ln">948</span><span class="c">     o         x: (number) x coordinate of the left anchor
-</span></code><code id="L949"><span class="ln">949</span><span class="c">     o         y: (number) y coordinate of the left anchor
-</span></code><code id="L950"><span class="ln">950</span><span class="c">     o     }
-</span></code><code id="L951"><span class="ln">951</span><span class="c">     o     n: {
-</span></code><code id="L952"><span class="ln">952</span><span class="c">     o         x: (number) x coordinate of the right anchor
-</span></code><code id="L953"><span class="ln">953</span><span class="c">     o         y: (number) y coordinate of the right anchor
-</span></code><code id="L954"><span class="ln">954</span><span class="c">     o     }
-</span></code><code id="L955"><span class="ln">955</span><span class="c">     o     start: {
-</span></code><code id="L956"><span class="ln">956</span><span class="c">     o         x: (number) x coordinate of the start of the curve
-</span></code><code id="L957"><span class="ln">957</span><span class="c">     o         y: (number) y coordinate of the start of the curve
-</span></code><code id="L958"><span class="ln">958</span><span class="c">     o     }
-</span></code><code id="L959"><span class="ln">959</span><span class="c">     o     end: {
-</span></code><code id="L960"><span class="ln">960</span><span class="c">     o         x: (number) x coordinate of the end of the curve
-</span></code><code id="L961"><span class="ln">961</span><span class="c">     o         y: (number) y coordinate of the end of the curve
-</span></code><code id="L962"><span class="ln">962</span><span class="c">     o     }
-</span></code><code id="L963"><span class="ln">963</span><span class="c">     o     alpha: (number) angle of the curve derivative at the point
-</span></code><code id="L964"><span class="ln">964</span><span class="c">     o }
-</span></code><code id="L965"><span class="ln">965</span><span class="c">    \*/</span>
-</code><code id="L966"><span class="ln">966</span>    R.findDotsAtSegment<span class="s"> = </span><b>function</b> (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) {
-</code><code id="L967"><span class="ln">967</span>        <b>var</b> t1<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>t,
-</code><code id="L968"><span class="ln">968</span>            x<span class="s"> = </span>pow(t1, <span class="d">3</span>)<span class="s"> * </span>p1x<span class="s"> + </span>pow(t1, <span class="d">2</span>)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>c1x<span class="s"> + </span>t1<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> * </span>c2x<span class="s"> + </span>pow(t, <span class="d">3</span>)<span class="s"> * </span>p2x,
-</code><code id="L969"><span class="ln">969</span>            y<span class="s"> = </span>pow(t1, <span class="d">3</span>)<span class="s"> * </span>p1y<span class="s"> + </span>pow(t1, <span class="d">2</span>)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>c1y<span class="s"> + </span>t1<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> * </span>c2y<span class="s"> + </span>pow(t, <span class="d">3</span>)<span class="s"> * </span>p2y,
-</code><code id="L970"><span class="ln">970</span>            mx<span class="s"> = </span>p1x<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>t<span class="s"> * </span>(c1x<span class="s"> - </span>p1x)<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>(c2x<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c1x<span class="s"> + </span>p1x),
-</code><code id="L971"><span class="ln">971</span>            my<span class="s"> = </span>p1y<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>t<span class="s"> * </span>(c1y<span class="s"> - </span>p1y)<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>(c2y<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c1y<span class="s"> + </span>p1y),
-</code><code id="L972"><span class="ln">972</span>            nx<span class="s"> = </span>c1x<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>t<span class="s"> * </span>(c2x<span class="s"> - </span>c1x)<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>(p2x<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c2x<span class="s"> + </span>c1x),
-</code><code id="L973"><span class="ln">973</span>            ny<span class="s"> = </span>c1y<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>t<span class="s"> * </span>(c2y<span class="s"> - </span>c1y)<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>(p2y<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c2y<span class="s"> + </span>c1y),
-</code><code id="L974"><span class="ln">974</span>            ax<span class="s"> = </span>(<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span>p1x<span class="s"> + </span>t<span class="s"> * </span>c1x,
-</code><code id="L975"><span class="ln">975</span>            ay<span class="s"> = </span>(<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span>p1y<span class="s"> + </span>t<span class="s"> * </span>c1y,
-</code><code id="L976"><span class="ln">976</span>            cx<span class="s"> = </span>(<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span>c2x<span class="s"> + </span>t<span class="s"> * </span>p2x,
-</code><code id="L977"><span class="ln">977</span>            cy<span class="s"> = </span>(<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span>c2y<span class="s"> + </span>t<span class="s"> * </span>p2y,
-</code><code id="L978"><span class="ln">978</span>            alpha<span class="s"> = </span>(<span class="d">90</span><span class="s"> - </span>math.atan2(mx<span class="s"> - </span>nx, my<span class="s"> - </span>ny)<span class="s"> * </span><span class="d">180</span><span class="s"> / </span>PI);
-</code><code id="L979"><span class="ln">979</span>        (mx > nx<span class="s"> || </span>my &lt; ny)<span class="s"> &amp;&amp; </span>(alpha += <span class="d">180</span>);
-</code><code id="L980"><span class="ln">980</span>        <b>return</b> {x: x, y: y, m: {x: mx, y: my}, n: {x: nx, y: ny}, start: {x: ax, y: ay}, end: {x: cx, y: cy}, alpha: alpha};
-</code><code id="L981"><span class="ln">981</span>    };
-</code><code id="L982"><span class="ln">982</span>    <b>var</b> pathDimensions<span class="s"> = </span>cacher(<b>function</b> (path) {
-</code><code id="L983"><span class="ln">983</span>        <b>if</b> (!path) {
-</code><code id="L984"><span class="ln">984</span>            <b>return</b> {x: <span class="d">0</span>, y: <span class="d">0</span>, width: <span class="d">0</span>, height: <span class="d">0</span>};
-</code><code id="L985"><span class="ln">985</span>        }
-</code><code id="L986"><span class="ln">986</span>        path<span class="s"> = </span>path2curve(path);
-</code><code id="L987"><span class="ln">987</span>        <b>var</b> x<span class="s"> = </span><span class="d">0</span>, 
-</code><code id="L988"><span class="ln">988</span>            y<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L989"><span class="ln">989</span>            X<span class="s"> = </span>[],
-</code><code id="L990"><span class="ln">990</span>            Y<span class="s"> = </span>[],
-</code><code id="L991"><span class="ln">991</span>            p;
-</code><code id="L992"><span class="ln">992</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>path.length; i &lt; ii; i++) {
-</code><code id="L993"><span class="ln">993</span>            p<span class="s"> = </span>path[i];
-</code><code id="L994"><span class="ln">994</span>            <b>if</b> (p[<span class="d">0</span>]<span class="s"> == </span><i>"M"</i>) {
-</code><code id="L995"><span class="ln">995</span>                x<span class="s"> = </span>p[<span class="d">1</span>];
-</code><code id="L996"><span class="ln">996</span>                y<span class="s"> = </span>p[<span class="d">2</span>];
-</code><code id="L997"><span class="ln">997</span>                X.push(x);
-</code><code id="L998"><span class="ln">998</span>                Y.push(y);
-</code><code id="L999"><span class="ln">999</span>            } <b>else</b> {
-</code><code id="L1000"><span class="ln">1000</span>                <b>var</b> dim<span class="s"> = </span>curveDim(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>]);
-</code><code id="L1001"><span class="ln">1001</span>                X<span class="s"> = </span>X[concat](dim.min.x, dim.max.x);
-</code><code id="L1002"><span class="ln">1002</span>                Y<span class="s"> = </span>Y[concat](dim.min.y, dim.max.y);
-</code><code id="L1003"><span class="ln">1003</span>                x<span class="s"> = </span>p[<span class="d">5</span>];
-</code><code id="L1004"><span class="ln">1004</span>                y<span class="s"> = </span>p[<span class="d">6</span>];
-</code><code id="L1005"><span class="ln">1005</span>            }
-</code><code id="L1006"><span class="ln">1006</span>        }
-</code><code id="L1007"><span class="ln">1007</span>        <b>var</b> xmin<span class="s"> = </span>mmin[apply](<span class="d">0</span>, X),
-</code><code id="L1008"><span class="ln">1008</span>            ymin<span class="s"> = </span>mmin[apply](<span class="d">0</span>, Y);
-</code><code id="L1009"><span class="ln">1009</span>        <b>return</b> {
-</code><code id="L1010"><span class="ln">1010</span>            x: xmin,
-</code><code id="L1011"><span class="ln">1011</span>            y: ymin,
-</code><code id="L1012"><span class="ln">1012</span>            width: mmax[apply](<span class="d">0</span>, X)<span class="s"> - </span>xmin,
-</code><code id="L1013"><span class="ln">1013</span>            height: mmax[apply](<span class="d">0</span>, Y)<span class="s"> - </span>ymin
-</code><code id="L1014"><span class="ln">1014</span>        };
-</code><code id="L1015"><span class="ln">1015</span>    }),
-</code><code id="L1016"><span class="ln">1016</span>        pathClone<span class="s"> = </span><b>function</b> (pathArray) {
-</code><code id="L1017"><span class="ln">1017</span>            <b>var</b> res<span class="s"> = </span>[];
-</code><code id="L1018"><span class="ln">1018</span>            <b>if</b> (!R.is(pathArray, array)<span class="s"> || </span>!R.is(pathArray<span class="s"> &amp;&amp; </span>pathArray[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
-</code><code id="L1019"><span class="ln">1019</span>                pathArray<span class="s"> = </span>R.parsePathString(pathArray);
-</code><code id="L1020"><span class="ln">1020</span>            }
-</code><code id="L1021"><span class="ln">1021</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>pathArray.length; i &lt; ii; i++) {
-</code><code id="L1022"><span class="ln">1022</span>                res[i]<span class="s"> = </span>[];
-</code><code id="L1023"><span class="ln">1023</span>                <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>pathArray[i].length; j &lt; jj; j++) {
-</code><code id="L1024"><span class="ln">1024</span>                    res[i][j]<span class="s"> = </span>pathArray[i][j];
-</code><code id="L1025"><span class="ln">1025</span>                }
-</code><code id="L1026"><span class="ln">1026</span>            }
-</code><code id="L1027"><span class="ln">1027</span>            res.toString<span class="s"> = </span>R._path2string;
-</code><code id="L1028"><span class="ln">1028</span>            <b>return</b> res;
-</code><code id="L1029"><span class="ln">1029</span>        },
-</code><code id="L1030"><span class="ln">1030</span>        pathToRelative<span class="s"> = </span>cacher(<b>function</b> (pathArray) {
-</code><code id="L1031"><span class="ln">1031</span>            <b>if</b> (!R.is(pathArray, array)<span class="s"> || </span>!R.is(pathArray<span class="s"> &amp;&amp; </span>pathArray[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
-</code><code id="L1032"><span class="ln">1032</span>                pathArray<span class="s"> = </span>R.parsePathString(pathArray);
-</code><code id="L1033"><span class="ln">1033</span>            }
-</code><code id="L1034"><span class="ln">1034</span>            <b>var</b> res<span class="s"> = </span>[],
-</code><code id="L1035"><span class="ln">1035</span>                x<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1036"><span class="ln">1036</span>                y<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1037"><span class="ln">1037</span>                mx<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1038"><span class="ln">1038</span>                my<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1039"><span class="ln">1039</span>                start<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L1040"><span class="ln">1040</span>            <b>if</b> (pathArray[<span class="d">0</span>][<span class="d">0</span>]<span class="s"> == </span><i>"M"</i>) {
-</code><code id="L1041"><span class="ln">1041</span>                x<span class="s"> = </span>pathArray[<span class="d">0</span>][<span class="d">1</span>];
-</code><code id="L1042"><span class="ln">1042</span>                y<span class="s"> = </span>pathArray[<span class="d">0</span>][<span class="d">2</span>];
-</code><code id="L1043"><span class="ln">1043</span>                mx<span class="s"> = </span>x;
-</code><code id="L1044"><span class="ln">1044</span>                my<span class="s"> = </span>y;
-</code><code id="L1045"><span class="ln">1045</span>                start++;
-</code><code id="L1046"><span class="ln">1046</span>                res.push([<i>"M"</i>, x, y]);
-</code><code id="L1047"><span class="ln">1047</span>            }
-</code><code id="L1048"><span class="ln">1048</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span>start, ii<span class="s"> = </span>pathArray.length; i &lt; ii; i++) {
-</code><code id="L1049"><span class="ln">1049</span>                <b>var</b> r<span class="s"> = </span>res[i]<span class="s"> = </span>[],
-</code><code id="L1050"><span class="ln">1050</span>                    pa<span class="s"> = </span>pathArray[i];
-</code><code id="L1051"><span class="ln">1051</span>                <b>if</b> (pa[<span class="d">0</span>] != lowerCase.call(pa[<span class="d">0</span>])) {
-</code><code id="L1052"><span class="ln">1052</span>                    r[<span class="d">0</span>]<span class="s"> = </span>lowerCase.call(pa[<span class="d">0</span>]);
-</code><code id="L1053"><span class="ln">1053</span>                    <b>switch</b> (r[<span class="d">0</span>]) {
-</code><code id="L1054"><span class="ln">1054</span>                        <b>case</b> <i>"a"</i>:
-</code><code id="L1055"><span class="ln">1055</span>                            r[<span class="d">1</span>]<span class="s"> = </span>pa[<span class="d">1</span>];
-</code><code id="L1056"><span class="ln">1056</span>                            r[<span class="d">2</span>]<span class="s"> = </span>pa[<span class="d">2</span>];
-</code><code id="L1057"><span class="ln">1057</span>                            r[<span class="d">3</span>]<span class="s"> = </span>pa[<span class="d">3</span>];
-</code><code id="L1058"><span class="ln">1058</span>                            r[<span class="d">4</span>]<span class="s"> = </span>pa[<span class="d">4</span>];
-</code><code id="L1059"><span class="ln">1059</span>                            r[<span class="d">5</span>]<span class="s"> = </span>pa[<span class="d">5</span>];
-</code><code id="L1060"><span class="ln">1060</span>                            r[<span class="d">6</span>]<span class="s"> = </span>+(pa[<span class="d">6</span>]<span class="s"> - </span>x).toFixed(<span class="d">3</span>);
-</code><code id="L1061"><span class="ln">1061</span>                            r[<span class="d">7</span>]<span class="s"> = </span>+(pa[<span class="d">7</span>]<span class="s"> - </span>y).toFixed(<span class="d">3</span>);
-</code><code id="L1062"><span class="ln">1062</span>                            <b>break</b>;
-</code><code id="L1063"><span class="ln">1063</span>                        <b>case</b> <i>"v"</i>:
-</code><code id="L1064"><span class="ln">1064</span>                            r[<span class="d">1</span>]<span class="s"> = </span>+(pa[<span class="d">1</span>]<span class="s"> - </span>y).toFixed(<span class="d">3</span>);
-</code><code id="L1065"><span class="ln">1065</span>                            <b>break</b>;
-</code><code id="L1066"><span class="ln">1066</span>                        <b>case</b> <i>"m"</i>:
-</code><code id="L1067"><span class="ln">1067</span>                            mx<span class="s"> = </span>pa[<span class="d">1</span>];
-</code><code id="L1068"><span class="ln">1068</span>                            my<span class="s"> = </span>pa[<span class="d">2</span>];
-</code><code id="L1069"><span class="ln">1069</span>                        <b>default</b>:
-</code><code id="L1070"><span class="ln">1070</span>                            <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>pa.length; j &lt; jj; j++) {
-</code><code id="L1071"><span class="ln">1071</span>                                r[j]<span class="s"> = </span>+(pa[j]<span class="s"> - </span>((j<span class="s"> % </span><span class="d">2</span>) ? x : y)).toFixed(<span class="d">3</span>);
-</code><code id="L1072"><span class="ln">1072</span>                            }
-</code><code id="L1073"><span class="ln">1073</span>                    }
-</code><code id="L1074"><span class="ln">1074</span>                } <b>else</b> {
-</code><code id="L1075"><span class="ln">1075</span>                    r<span class="s"> = </span>res[i]<span class="s"> = </span>[];
-</code><code id="L1076"><span class="ln">1076</span>                    <b>if</b> (pa[<span class="d">0</span>]<span class="s"> == </span><i>"m"</i>) {
-</code><code id="L1077"><span class="ln">1077</span>                        mx<span class="s"> = </span>pa[<span class="d">1</span>]<span class="s"> + </span>x;
-</code><code id="L1078"><span class="ln">1078</span>                        my<span class="s"> = </span>pa[<span class="d">2</span>]<span class="s"> + </span>y;
-</code><code id="L1079"><span class="ln">1079</span>                    }
-</code><code id="L1080"><span class="ln">1080</span>                    <b>for</b> (<b>var</b> k<span class="s"> = </span><span class="d">0</span>, kk<span class="s"> = </span>pa.length; k &lt; kk; k++) {
-</code><code id="L1081"><span class="ln">1081</span>                        res[i][k]<span class="s"> = </span>pa[k];
-</code><code id="L1082"><span class="ln">1082</span>                    }
-</code><code id="L1083"><span class="ln">1083</span>                }
-</code><code id="L1084"><span class="ln">1084</span>                <b>var</b> len<span class="s"> = </span>res[i].length;
-</code><code id="L1085"><span class="ln">1085</span>                <b>switch</b> (res[i][<span class="d">0</span>]) {
-</code><code id="L1086"><span class="ln">1086</span>                    <b>case</b> <i>"z"</i>:
-</code><code id="L1087"><span class="ln">1087</span>                        x<span class="s"> = </span>mx;
-</code><code id="L1088"><span class="ln">1088</span>                        y<span class="s"> = </span>my;
-</code><code id="L1089"><span class="ln">1089</span>                        <b>break</b>;
-</code><code id="L1090"><span class="ln">1090</span>                    <b>case</b> <i>"h"</i>:
-</code><code id="L1091"><span class="ln">1091</span>                        x += +res[i][len<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L1092"><span class="ln">1092</span>                        <b>break</b>;
-</code><code id="L1093"><span class="ln">1093</span>                    <b>case</b> <i>"v"</i>:
-</code><code id="L1094"><span class="ln">1094</span>                        y += +res[i][len<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L1095"><span class="ln">1095</span>                        <b>break</b>;
-</code><code id="L1096"><span class="ln">1096</span>                    <b>default</b>:
-</code><code id="L1097"><span class="ln">1097</span>                        x += +res[i][len<span class="s"> - </span><span class="d">2</span>];
-</code><code id="L1098"><span class="ln">1098</span>                        y += +res[i][len<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L1099"><span class="ln">1099</span>                }
-</code><code id="L1100"><span class="ln">1100</span>            }
-</code><code id="L1101"><span class="ln">1101</span>            res.toString<span class="s"> = </span>R._path2string;
-</code><code id="L1102"><span class="ln">1102</span>            <b>return</b> res;
-</code><code id="L1103"><span class="ln">1103</span>        }, <span class="d">0</span>, pathClone),
-</code><code id="L1104"><span class="ln">1104</span>        pathToAbsolute<span class="s"> = </span>cacher(<b>function</b> (pathArray) {
-</code><code id="L1105"><span class="ln">1105</span>            <b>if</b> (!R.is(pathArray, array)<span class="s"> || </span>!R.is(pathArray<span class="s"> &amp;&amp; </span>pathArray[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
-</code><code id="L1106"><span class="ln">1106</span>                pathArray<span class="s"> = </span>R.parsePathString(pathArray);
-</code><code id="L1107"><span class="ln">1107</span>            }
-</code><code id="L1108"><span class="ln">1108</span>            <b>var</b> res<span class="s"> = </span>[],
-</code><code id="L1109"><span class="ln">1109</span>                x<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1110"><span class="ln">1110</span>                y<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1111"><span class="ln">1111</span>                mx<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1112"><span class="ln">1112</span>                my<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1113"><span class="ln">1113</span>                start<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L1114"><span class="ln">1114</span>            <b>if</b> (pathArray[<span class="d">0</span>][<span class="d">0</span>]<span class="s"> == </span><i>"M"</i>) {
-</code><code id="L1115"><span class="ln">1115</span>                x<span class="s"> = </span>+pathArray[<span class="d">0</span>][<span class="d">1</span>];
-</code><code id="L1116"><span class="ln">1116</span>                y<span class="s"> = </span>+pathArray[<span class="d">0</span>][<span class="d">2</span>];
-</code><code id="L1117"><span class="ln">1117</span>                mx<span class="s"> = </span>x;
-</code><code id="L1118"><span class="ln">1118</span>                my<span class="s"> = </span>y;
-</code><code id="L1119"><span class="ln">1119</span>                start++;
-</code><code id="L1120"><span class="ln">1120</span>                res[<span class="d">0</span>]<span class="s"> = </span>[<i>"M"</i>, x, y];
-</code><code id="L1121"><span class="ln">1121</span>            }
-</code><code id="L1122"><span class="ln">1122</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span>start, ii<span class="s"> = </span>pathArray.length; i &lt; ii; i++) {
-</code><code id="L1123"><span class="ln">1123</span>                <b>var</b> r<span class="s"> = </span>res[i]<span class="s"> = </span>[],
-</code><code id="L1124"><span class="ln">1124</span>                    pa<span class="s"> = </span>pathArray[i];
-</code><code id="L1125"><span class="ln">1125</span>                <b>if</b> (pa[<span class="d">0</span>] != upperCase.call(pa[<span class="d">0</span>])) {
-</code><code id="L1126"><span class="ln">1126</span>                    r[<span class="d">0</span>]<span class="s"> = </span>upperCase.call(pa[<span class="d">0</span>]);
-</code><code id="L1127"><span class="ln">1127</span>                    <b>switch</b> (r[<span class="d">0</span>]) {
-</code><code id="L1128"><span class="ln">1128</span>                        <b>case</b> <i>"A"</i>:
-</code><code id="L1129"><span class="ln">1129</span>                            r[<span class="d">1</span>]<span class="s"> = </span>pa[<span class="d">1</span>];
-</code><code id="L1130"><span class="ln">1130</span>                            r[<span class="d">2</span>]<span class="s"> = </span>pa[<span class="d">2</span>];
-</code><code id="L1131"><span class="ln">1131</span>                            r[<span class="d">3</span>]<span class="s"> = </span>pa[<span class="d">3</span>];
-</code><code id="L1132"><span class="ln">1132</span>                            r[<span class="d">4</span>]<span class="s"> = </span>pa[<span class="d">4</span>];
-</code><code id="L1133"><span class="ln">1133</span>                            r[<span class="d">5</span>]<span class="s"> = </span>pa[<span class="d">5</span>];
-</code><code id="L1134"><span class="ln">1134</span>                            r[<span class="d">6</span>]<span class="s"> = </span>+(pa[<span class="d">6</span>]<span class="s"> + </span>x);
-</code><code id="L1135"><span class="ln">1135</span>                            r[<span class="d">7</span>]<span class="s"> = </span>+(pa[<span class="d">7</span>]<span class="s"> + </span>y);
-</code><code id="L1136"><span class="ln">1136</span>                            <b>break</b>;
-</code><code id="L1137"><span class="ln">1137</span>                        <b>case</b> <i>"V"</i>:
-</code><code id="L1138"><span class="ln">1138</span>                            r[<span class="d">1</span>]<span class="s"> = </span>+pa[<span class="d">1</span>]<span class="s"> + </span>y;
-</code><code id="L1139"><span class="ln">1139</span>                            <b>break</b>;
-</code><code id="L1140"><span class="ln">1140</span>                        <b>case</b> <i>"H"</i>:
-</code><code id="L1141"><span class="ln">1141</span>                            r[<span class="d">1</span>]<span class="s"> = </span>+pa[<span class="d">1</span>]<span class="s"> + </span>x;
-</code><code id="L1142"><span class="ln">1142</span>                            <b>break</b>;
-</code><code id="L1143"><span class="ln">1143</span>                        <b>case</b> <i>"M"</i>:
-</code><code id="L1144"><span class="ln">1144</span>                            mx<span class="s"> = </span>+pa[<span class="d">1</span>]<span class="s"> + </span>x;
-</code><code id="L1145"><span class="ln">1145</span>                            my<span class="s"> = </span>+pa[<span class="d">2</span>]<span class="s"> + </span>y;
-</code><code id="L1146"><span class="ln">1146</span>                        <b>default</b>:
-</code><code id="L1147"><span class="ln">1147</span>                            <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>pa.length; j &lt; jj; j++) {
-</code><code id="L1148"><span class="ln">1148</span>                                r[j]<span class="s"> = </span>+pa[j]<span class="s"> + </span>((j<span class="s"> % </span><span class="d">2</span>) ? x : y);
-</code><code id="L1149"><span class="ln">1149</span>                            }
-</code><code id="L1150"><span class="ln">1150</span>                    }
-</code><code id="L1151"><span class="ln">1151</span>                } <b>else</b> {
-</code><code id="L1152"><span class="ln">1152</span>                    <b>for</b> (<b>var</b> k<span class="s"> = </span><span class="d">0</span>, kk<span class="s"> = </span>pa.length; k &lt; kk; k++) {
-</code><code id="L1153"><span class="ln">1153</span>                        res[i][k]<span class="s"> = </span>pa[k];
-</code><code id="L1154"><span class="ln">1154</span>                    }
-</code><code id="L1155"><span class="ln">1155</span>                }
-</code><code id="L1156"><span class="ln">1156</span>                <b>switch</b> (r[<span class="d">0</span>]) {
-</code><code id="L1157"><span class="ln">1157</span>                    <b>case</b> <i>"Z"</i>:
-</code><code id="L1158"><span class="ln">1158</span>                        x<span class="s"> = </span>mx;
-</code><code id="L1159"><span class="ln">1159</span>                        y<span class="s"> = </span>my;
-</code><code id="L1160"><span class="ln">1160</span>                        <b>break</b>;
-</code><code id="L1161"><span class="ln">1161</span>                    <b>case</b> <i>"H"</i>:
-</code><code id="L1162"><span class="ln">1162</span>                        x<span class="s"> = </span>r[<span class="d">1</span>];
-</code><code id="L1163"><span class="ln">1163</span>                        <b>break</b>;
-</code><code id="L1164"><span class="ln">1164</span>                    <b>case</b> <i>"V"</i>:
-</code><code id="L1165"><span class="ln">1165</span>                        y<span class="s"> = </span>r[<span class="d">1</span>];
-</code><code id="L1166"><span class="ln">1166</span>                        <b>break</b>;
-</code><code id="L1167"><span class="ln">1167</span>                    <b>case</b> <i>"M"</i>:
-</code><code id="L1168"><span class="ln">1168</span>                        mx<span class="s"> = </span>res[i][res[i].length<span class="s"> - </span><span class="d">2</span>];
-</code><code id="L1169"><span class="ln">1169</span>                        my<span class="s"> = </span>res[i][res[i].length<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L1170"><span class="ln">1170</span>                    <b>default</b>:
-</code><code id="L1171"><span class="ln">1171</span>                        x<span class="s"> = </span>res[i][res[i].length<span class="s"> - </span><span class="d">2</span>];
-</code><code id="L1172"><span class="ln">1172</span>                        y<span class="s"> = </span>res[i][res[i].length<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L1173"><span class="ln">1173</span>                }
-</code><code id="L1174"><span class="ln">1174</span>            }
-</code><code id="L1175"><span class="ln">1175</span>            res.toString<span class="s"> = </span>R._path2string;
-</code><code id="L1176"><span class="ln">1176</span>            <b>return</b> res;
-</code><code id="L1177"><span class="ln">1177</span>        }, <b>null</b>, pathClone),
-</code><code id="L1178"><span class="ln">1178</span>        l2c<span class="s"> = </span><b>function</b> (x1, y1, x2, y2) {
-</code><code id="L1179"><span class="ln">1179</span>            <b>return</b> [x1, y1, x2, y2, x2, y2];
-</code><code id="L1180"><span class="ln">1180</span>        },
-</code><code id="L1181"><span class="ln">1181</span>        q2c<span class="s"> = </span><b>function</b> (x1, y1, ax, ay, x2, y2) {
-</code><code id="L1182"><span class="ln">1182</span>            <b>var</b> _13<span class="s"> = </span><span class="d">1</span><span class="s"> / </span><span class="d">3</span>,
-</code><code id="L1183"><span class="ln">1183</span>                _23<span class="s"> = </span><span class="d">2</span><span class="s"> / </span><span class="d">3</span>;
-</code><code id="L1184"><span class="ln">1184</span>            <b>return</b> [
-</code><code id="L1185"><span class="ln">1185</span>                    _13<span class="s"> * </span>x1<span class="s"> + </span>_23<span class="s"> * </span>ax,
-</code><code id="L1186"><span class="ln">1186</span>                    _13<span class="s"> * </span>y1<span class="s"> + </span>_23<span class="s"> * </span>ay,
-</code><code id="L1187"><span class="ln">1187</span>                    _13<span class="s"> * </span>x2<span class="s"> + </span>_23<span class="s"> * </span>ax,
-</code><code id="L1188"><span class="ln">1188</span>                    _13<span class="s"> * </span>y2<span class="s"> + </span>_23<span class="s"> * </span>ay,
-</code><code id="L1189"><span class="ln">1189</span>                    x2,
-</code><code id="L1190"><span class="ln">1190</span>                    y2
-</code><code id="L1191"><span class="ln">1191</span>                ];
-</code><code id="L1192"><span class="ln">1192</span>        },
-</code><code id="L1193"><span class="ln">1193</span>        a2c<span class="s"> = </span><b>function</b> (x1, y1, rx, ry, angle, large_arc_flag, sweep_flag, x2, y2, recursive) {
-</code><code id="L1194"><span class="ln">1194</span>            <span class="c">// <b>for</b> more information of where <b>this</b> math came from visit:</span>
-</code><code id="L1195"><span class="ln">1195</span>            <span class="c">// http://www.w3.org/TR/SVG11/implnote.html#ArcImplementationNotes</span>
-</code><code id="L1196"><span class="ln">1196</span>            <b>var</b> _120<span class="s"> = </span>PI<span class="s"> * </span><span class="d">120</span><span class="s"> / </span><span class="d">180</span>,
-</code><code id="L1197"><span class="ln">1197</span>                rad<span class="s"> = </span>PI<span class="s"> / </span><span class="d">180</span><span class="s"> * </span>(+angle<span class="s"> || </span><span class="d">0</span>),
-</code><code id="L1198"><span class="ln">1198</span>                res<span class="s"> = </span>[],
-</code><code id="L1199"><span class="ln">1199</span>                xy,
-</code><code id="L1200"><span class="ln">1200</span>                rotate<span class="s"> = </span>cacher(<b>function</b> (x, y, rad) {
-</code><code id="L1201"><span class="ln">1201</span>                    <b>var</b> X<span class="s"> = </span>x<span class="s"> * </span>math.cos(rad)<span class="s"> - </span>y<span class="s"> * </span>math.sin(rad),
-</code><code id="L1202"><span class="ln">1202</span>                        Y<span class="s"> = </span>x<span class="s"> * </span>math.sin(rad)<span class="s"> + </span>y<span class="s"> * </span>math.cos(rad);
-</code><code id="L1203"><span class="ln">1203</span>                    <b>return</b> {x: X, y: Y};
-</code><code id="L1204"><span class="ln">1204</span>                });
-</code><code id="L1205"><span class="ln">1205</span>            <b>if</b> (!recursive) {
-</code><code id="L1206"><span class="ln">1206</span>                xy<span class="s"> = </span>rotate(x1, y1, -rad);
-</code><code id="L1207"><span class="ln">1207</span>                x1<span class="s"> = </span>xy.x;
-</code><code id="L1208"><span class="ln">1208</span>                y1<span class="s"> = </span>xy.y;
-</code><code id="L1209"><span class="ln">1209</span>                xy<span class="s"> = </span>rotate(x2, y2, -rad);
-</code><code id="L1210"><span class="ln">1210</span>                x2<span class="s"> = </span>xy.x;
-</code><code id="L1211"><span class="ln">1211</span>                y2<span class="s"> = </span>xy.y;
-</code><code id="L1212"><span class="ln">1212</span>                <b>var</b> cos<span class="s"> = </span>math.cos(PI<span class="s"> / </span><span class="d">180</span><span class="s"> * </span>angle),
-</code><code id="L1213"><span class="ln">1213</span>                    sin<span class="s"> = </span>math.sin(PI<span class="s"> / </span><span class="d">180</span><span class="s"> * </span>angle),
-</code><code id="L1214"><span class="ln">1214</span>                    x<span class="s"> = </span>(x1<span class="s"> - </span>x2)<span class="s"> / </span><span class="d">2</span>,
-</code><code id="L1215"><span class="ln">1215</span>                    y<span class="s"> = </span>(y1<span class="s"> - </span>y2)<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L1216"><span class="ln">1216</span>                <b>var</b> h<span class="s"> = </span>(x<span class="s"> * </span>x)<span class="s"> / </span>(rx<span class="s"> * </span>rx)<span class="s"> + </span>(y<span class="s"> * </span>y)<span class="s"> / </span>(ry<span class="s"> * </span>ry);
-</code><code id="L1217"><span class="ln">1217</span>                <b>if</b> (h > <span class="d">1</span>) {
-</code><code id="L1218"><span class="ln">1218</span>                    h<span class="s"> = </span>math.sqrt(h);
-</code><code id="L1219"><span class="ln">1219</span>                    rx<span class="s"> = </span>h<span class="s"> * </span>rx;
-</code><code id="L1220"><span class="ln">1220</span>                    ry<span class="s"> = </span>h<span class="s"> * </span>ry;
-</code><code id="L1221"><span class="ln">1221</span>                }
-</code><code id="L1222"><span class="ln">1222</span>                <b>var</b> rx2<span class="s"> = </span>rx<span class="s"> * </span>rx,
-</code><code id="L1223"><span class="ln">1223</span>                    ry2<span class="s"> = </span>ry<span class="s"> * </span>ry,
-</code><code id="L1224"><span class="ln">1224</span>                    k<span class="s"> = </span>(large_arc_flag<span class="s"> == </span>sweep_flag ? -<span class="d">1</span> : <span class="d">1</span>) *
-</code><code id="L1225"><span class="ln">1225</span>                        math.sqrt(abs((rx2<span class="s"> * </span>ry2<span class="s"> - </span>rx2<span class="s"> * </span>y<span class="s"> * </span>y<span class="s"> - </span>ry2<span class="s"> * </span>x<span class="s"> * </span>x)<span class="s"> / </span>(rx2<span class="s"> * </span>y<span class="s"> * </span>y<span class="s"> + </span>ry2<span class="s"> * </span>x<span class="s"> * </span>x))),
-</code><code id="L1226"><span class="ln">1226</span>                    cx<span class="s"> = </span>k<span class="s"> * </span>rx<span class="s"> * </span>y<span class="s"> / </span>ry<span class="s"> + </span>(x1<span class="s"> + </span>x2)<span class="s"> / </span><span class="d">2</span>,
-</code><code id="L1227"><span class="ln">1227</span>                    cy<span class="s"> = </span>k<span class="s"> * </span>-ry<span class="s"> * </span>x<span class="s"> / </span>rx<span class="s"> + </span>(y1<span class="s"> + </span>y2)<span class="s"> / </span><span class="d">2</span>,
-</code><code id="L1228"><span class="ln">1228</span>                    f1<span class="s"> = </span>math.asin(((y1<span class="s"> - </span>cy)<span class="s"> / </span>ry).toFixed(<span class="d">9</span>)),
-</code><code id="L1229"><span class="ln">1229</span>                    f2<span class="s"> = </span>math.asin(((y2<span class="s"> - </span>cy)<span class="s"> / </span>ry).toFixed(<span class="d">9</span>));
-</code><code id="L1230"><span class="ln">1230</span>
-</code><code id="L1231"><span class="ln">1231</span>                f1<span class="s"> = </span>x1 &lt; cx ? PI<span class="s"> - </span>f1 : f1;
-</code><code id="L1232"><span class="ln">1232</span>                f2<span class="s"> = </span>x2 &lt; cx ? PI<span class="s"> - </span>f2 : f2;
-</code><code id="L1233"><span class="ln">1233</span>                f1 &lt; <span class="d">0</span><span class="s"> &amp;&amp; </span>(f1<span class="s"> = </span>PI<span class="s"> * </span><span class="d">2</span><span class="s"> + </span>f1);
-</code><code id="L1234"><span class="ln">1234</span>                f2 &lt; <span class="d">0</span><span class="s"> &amp;&amp; </span>(f2<span class="s"> = </span>PI<span class="s"> * </span><span class="d">2</span><span class="s"> + </span>f2);
-</code><code id="L1235"><span class="ln">1235</span>                <b>if</b> (sweep_flag<span class="s"> &amp;&amp; </span>f1 > f2) {
-</code><code id="L1236"><span class="ln">1236</span>                    f1<span class="s"> = </span>f1<span class="s"> - </span>PI<span class="s"> * </span><span class="d">2</span>;
-</code><code id="L1237"><span class="ln">1237</span>                }
-</code><code id="L1238"><span class="ln">1238</span>                <b>if</b> (!sweep_flag<span class="s"> &amp;&amp; </span>f2 > f1) {
-</code><code id="L1239"><span class="ln">1239</span>                    f2<span class="s"> = </span>f2<span class="s"> - </span>PI<span class="s"> * </span><span class="d">2</span>;
-</code><code id="L1240"><span class="ln">1240</span>                }
-</code><code id="L1241"><span class="ln">1241</span>            } <b>else</b> {
-</code><code id="L1242"><span class="ln">1242</span>                f1<span class="s"> = </span>recursive[<span class="d">0</span>];
-</code><code id="L1243"><span class="ln">1243</span>                f2<span class="s"> = </span>recursive[<span class="d">1</span>];
-</code><code id="L1244"><span class="ln">1244</span>                cx<span class="s"> = </span>recursive[<span class="d">2</span>];
-</code><code id="L1245"><span class="ln">1245</span>                cy<span class="s"> = </span>recursive[<span class="d">3</span>];
-</code><code id="L1246"><span class="ln">1246</span>            }
-</code><code id="L1247"><span class="ln">1247</span>            <b>var</b> df<span class="s"> = </span>f2<span class="s"> - </span>f1;
-</code><code id="L1248"><span class="ln">1248</span>            <b>if</b> (abs(df) > _120) {
-</code><code id="L1249"><span class="ln">1249</span>                <b>var</b> f2old<span class="s"> = </span>f2,
-</code><code id="L1250"><span class="ln">1250</span>                    x2old<span class="s"> = </span>x2,
-</code><code id="L1251"><span class="ln">1251</span>                    y2old<span class="s"> = </span>y2;
-</code><code id="L1252"><span class="ln">1252</span>                f2<span class="s"> = </span>f1<span class="s"> + </span>_120<span class="s"> * </span>(sweep_flag<span class="s"> &amp;&amp; </span>f2 > f1 ? <span class="d">1</span> : -<span class="d">1</span>);
-</code><code id="L1253"><span class="ln">1253</span>                x2<span class="s"> = </span>cx<span class="s"> + </span>rx<span class="s"> * </span>math.cos(f2);
-</code><code id="L1254"><span class="ln">1254</span>                y2<span class="s"> = </span>cy<span class="s"> + </span>ry<span class="s"> * </span>math.sin(f2);
-</code><code id="L1255"><span class="ln">1255</span>                res<span class="s"> = </span>a2c(x2, y2, rx, ry, angle, <span class="d">0</span>, sweep_flag, x2old, y2old, [f2, f2old, cx, cy]);
-</code><code id="L1256"><span class="ln">1256</span>            }
-</code><code id="L1257"><span class="ln">1257</span>            df<span class="s"> = </span>f2<span class="s"> - </span>f1;
-</code><code id="L1258"><span class="ln">1258</span>            <b>var</b> c1<span class="s"> = </span>math.cos(f1),
-</code><code id="L1259"><span class="ln">1259</span>                s1<span class="s"> = </span>math.sin(f1),
-</code><code id="L1260"><span class="ln">1260</span>                c2<span class="s"> = </span>math.cos(f2),
-</code><code id="L1261"><span class="ln">1261</span>                s2<span class="s"> = </span>math.sin(f2),
-</code><code id="L1262"><span class="ln">1262</span>                t<span class="s"> = </span>math.tan(df<span class="s"> / </span><span class="d">4</span>),
-</code><code id="L1263"><span class="ln">1263</span>                hx<span class="s"> = </span><span class="d">4</span><span class="s"> / </span><span class="d">3</span><span class="s"> * </span>rx<span class="s"> * </span>t,
-</code><code id="L1264"><span class="ln">1264</span>                hy<span class="s"> = </span><span class="d">4</span><span class="s"> / </span><span class="d">3</span><span class="s"> * </span>ry<span class="s"> * </span>t,
-</code><code id="L1265"><span class="ln">1265</span>                m1<span class="s"> = </span>[x1, y1],
-</code><code id="L1266"><span class="ln">1266</span>                m2<span class="s"> = </span>[x1<span class="s"> + </span>hx<span class="s"> * </span>s1, y1<span class="s"> - </span>hy<span class="s"> * </span>c1],
-</code><code id="L1267"><span class="ln">1267</span>                m3<span class="s"> = </span>[x2<span class="s"> + </span>hx<span class="s"> * </span>s2, y2<span class="s"> - </span>hy<span class="s"> * </span>c2],
-</code><code id="L1268"><span class="ln">1268</span>                m4<span class="s"> = </span>[x2, y2];
-</code><code id="L1269"><span class="ln">1269</span>            m2[<span class="d">0</span>]<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>m1[<span class="d">0</span>]<span class="s"> - </span>m2[<span class="d">0</span>];
-</code><code id="L1270"><span class="ln">1270</span>            m2[<span class="d">1</span>]<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>m1[<span class="d">1</span>]<span class="s"> - </span>m2[<span class="d">1</span>];
-</code><code id="L1271"><span class="ln">1271</span>            <b>if</b> (recursive) {
-</code><code id="L1272"><span class="ln">1272</span>                <b>return</b> [m2, m3, m4][concat](res);
-</code><code id="L1273"><span class="ln">1273</span>            } <b>else</b> {
-</code><code id="L1274"><span class="ln">1274</span>                res<span class="s"> = </span>[m2, m3, m4][concat](res).join().split(<i>","</i>);
-</code><code id="L1275"><span class="ln">1275</span>                <b>var</b> newres<span class="s"> = </span>[];
-</code><code id="L1276"><span class="ln">1276</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>res.length; i &lt; ii; i++) {
-</code><code id="L1277"><span class="ln">1277</span>                    newres[i]<span class="s"> = </span>i<span class="s"> % </span><span class="d">2</span> ? rotate(res[i<span class="s"> - </span><span class="d">1</span>], res[i], rad).y : rotate(res[i], res[i<span class="s"> + </span><span class="d">1</span>], rad).x;
-</code><code id="L1278"><span class="ln">1278</span>                }
-</code><code id="L1279"><span class="ln">1279</span>                <b>return</b> newres;
-</code><code id="L1280"><span class="ln">1280</span>            }
-</code><code id="L1281"><span class="ln">1281</span>        },
-</code><code id="L1282"><span class="ln">1282</span>        findDotAtSegment<span class="s"> = </span><b>function</b> (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) {
-</code><code id="L1283"><span class="ln">1283</span>            <b>var</b> t1<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>t;
-</code><code id="L1284"><span class="ln">1284</span>            <b>return</b> {
-</code><code id="L1285"><span class="ln">1285</span>                x: pow(t1, <span class="d">3</span>)<span class="s"> * </span>p1x<span class="s"> + </span>pow(t1, <span class="d">2</span>)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>c1x<span class="s"> + </span>t1<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> * </span>c2x<span class="s"> + </span>pow(t, <span class="d">3</span>)<span class="s"> * </span>p2x,
-</code><code id="L1286"><span class="ln">1286</span>                y: pow(t1, <span class="d">3</span>)<span class="s"> * </span>p1y<span class="s"> + </span>pow(t1, <span class="d">2</span>)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>c1y<span class="s"> + </span>t1<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> * </span>c2y<span class="s"> + </span>pow(t, <span class="d">3</span>)<span class="s"> * </span>p2y
-</code><code id="L1287"><span class="ln">1287</span>            };
-</code><code id="L1288"><span class="ln">1288</span>        },
-</code><code id="L1289"><span class="ln">1289</span>        curveDim<span class="s"> = </span>cacher(<b>function</b> (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y) {
-</code><code id="L1290"><span class="ln">1290</span>            <b>var</b> a<span class="s"> = </span>(c2x<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c1x<span class="s"> + </span>p1x)<span class="s"> - </span>(p2x<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c2x<span class="s"> + </span>c1x),
-</code><code id="L1291"><span class="ln">1291</span>                b<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>(c1x<span class="s"> - </span>p1x)<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>(c2x<span class="s"> - </span>c1x),
-</code><code id="L1292"><span class="ln">1292</span>                c<span class="s"> = </span>p1x<span class="s"> - </span>c1x,
-</code><code id="L1293"><span class="ln">1293</span>                t1<span class="s"> = </span>(-b<span class="s"> + </span>math.sqrt(b<span class="s"> * </span>b<span class="s"> - </span><span class="d">4</span><span class="s"> * </span>a<span class="s"> * </span>c))<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>a,
-</code><code id="L1294"><span class="ln">1294</span>                t2<span class="s"> = </span>(-b<span class="s"> - </span>math.sqrt(b<span class="s"> * </span>b<span class="s"> - </span><span class="d">4</span><span class="s"> * </span>a<span class="s"> * </span>c))<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>a,
-</code><code id="L1295"><span class="ln">1295</span>                y<span class="s"> = </span>[p1y, p2y],
-</code><code id="L1296"><span class="ln">1296</span>                x<span class="s"> = </span>[p1x, p2x],
-</code><code id="L1297"><span class="ln">1297</span>                dot;
-</code><code id="L1298"><span class="ln">1298</span>            abs(t1) > <i>"<span class="d">1e12</span>"</i><span class="s"> &amp;&amp; </span>(t1<span class="s"> = </span><span class="d">.5</span>);
-</code><code id="L1299"><span class="ln">1299</span>            abs(t2) > <i>"<span class="d">1e12</span>"</i><span class="s"> &amp;&amp; </span>(t2<span class="s"> = </span><span class="d">.5</span>);
-</code><code id="L1300"><span class="ln">1300</span>            <b>if</b> (t1 > <span class="d">0</span><span class="s"> &amp;&amp; </span>t1 &lt; <span class="d">1</span>) {
-</code><code id="L1301"><span class="ln">1301</span>                dot<span class="s"> = </span>findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t1);
-</code><code id="L1302"><span class="ln">1302</span>                x.push(dot.x);
-</code><code id="L1303"><span class="ln">1303</span>                y.push(dot.y);
-</code><code id="L1304"><span class="ln">1304</span>            }
-</code><code id="L1305"><span class="ln">1305</span>            <b>if</b> (t2 > <span class="d">0</span><span class="s"> &amp;&amp; </span>t2 &lt; <span class="d">1</span>) {
-</code><code id="L1306"><span class="ln">1306</span>                dot<span class="s"> = </span>findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t2);
-</code><code id="L1307"><span class="ln">1307</span>                x.push(dot.x);
-</code><code id="L1308"><span class="ln">1308</span>                y.push(dot.y);
-</code><code id="L1309"><span class="ln">1309</span>            }
-</code><code id="L1310"><span class="ln">1310</span>            a<span class="s"> = </span>(c2y<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c1y<span class="s"> + </span>p1y)<span class="s"> - </span>(p2y<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c2y<span class="s"> + </span>c1y);
-</code><code id="L1311"><span class="ln">1311</span>            b<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>(c1y<span class="s"> - </span>p1y)<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>(c2y<span class="s"> - </span>c1y);
-</code><code id="L1312"><span class="ln">1312</span>            c<span class="s"> = </span>p1y<span class="s"> - </span>c1y;
-</code><code id="L1313"><span class="ln">1313</span>            t1<span class="s"> = </span>(-b<span class="s"> + </span>math.sqrt(b<span class="s"> * </span>b<span class="s"> - </span><span class="d">4</span><span class="s"> * </span>a<span class="s"> * </span>c))<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>a;
-</code><code id="L1314"><span class="ln">1314</span>            t2<span class="s"> = </span>(-b<span class="s"> - </span>math.sqrt(b<span class="s"> * </span>b<span class="s"> - </span><span class="d">4</span><span class="s"> * </span>a<span class="s"> * </span>c))<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>a;
-</code><code id="L1315"><span class="ln">1315</span>            abs(t1) > <i>"<span class="d">1e12</span>"</i><span class="s"> &amp;&amp; </span>(t1<span class="s"> = </span><span class="d">.5</span>);
-</code><code id="L1316"><span class="ln">1316</span>            abs(t2) > <i>"<span class="d">1e12</span>"</i><span class="s"> &amp;&amp; </span>(t2<span class="s"> = </span><span class="d">.5</span>);
-</code><code id="L1317"><span class="ln">1317</span>            <b>if</b> (t1 > <span class="d">0</span><span class="s"> &amp;&amp; </span>t1 &lt; <span class="d">1</span>) {
-</code><code id="L1318"><span class="ln">1318</span>                dot<span class="s"> = </span>findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t1);
-</code><code id="L1319"><span class="ln">1319</span>                x.push(dot.x);
-</code><code id="L1320"><span class="ln">1320</span>                y.push(dot.y);
-</code><code id="L1321"><span class="ln">1321</span>            }
-</code><code id="L1322"><span class="ln">1322</span>            <b>if</b> (t2 > <span class="d">0</span><span class="s"> &amp;&amp; </span>t2 &lt; <span class="d">1</span>) {
-</code><code id="L1323"><span class="ln">1323</span>                dot<span class="s"> = </span>findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t2);
-</code><code id="L1324"><span class="ln">1324</span>                x.push(dot.x);
-</code><code id="L1325"><span class="ln">1325</span>                y.push(dot.y);
-</code><code id="L1326"><span class="ln">1326</span>            }
-</code><code id="L1327"><span class="ln">1327</span>            <b>return</b> {
-</code><code id="L1328"><span class="ln">1328</span>                min: {x: mmin[apply](<span class="d">0</span>, x), y: mmin[apply](<span class="d">0</span>, y)},
-</code><code id="L1329"><span class="ln">1329</span>                max: {x: mmax[apply](<span class="d">0</span>, x), y: mmax[apply](<span class="d">0</span>, y)}
-</code><code id="L1330"><span class="ln">1330</span>            };
-</code><code id="L1331"><span class="ln">1331</span>        }),
-</code><code id="L1332"><span class="ln">1332</span>        path2curve<span class="s"> = </span>cacher(<b>function</b> (path, path2) {
-</code><code id="L1333"><span class="ln">1333</span>            <b>var</b> p<span class="s"> = </span>pathToAbsolute(path),
-</code><code id="L1334"><span class="ln">1334</span>                p2<span class="s"> = </span>path2<span class="s"> &amp;&amp; </span>pathToAbsolute(path2),
-</code><code id="L1335"><span class="ln">1335</span>                attrs<span class="s"> = </span>{x: <span class="d">0</span>, y: <span class="d">0</span>, bx: <span class="d">0</span>, by: <span class="d">0</span>, X: <span class="d">0</span>, Y: <span class="d">0</span>, qx: <b>null</b>, qy: <b>null</b>},
-</code><code id="L1336"><span class="ln">1336</span>                attrs2<span class="s"> = </span>{x: <span class="d">0</span>, y: <span class="d">0</span>, bx: <span class="d">0</span>, by: <span class="d">0</span>, X: <span class="d">0</span>, Y: <span class="d">0</span>, qx: <b>null</b>, qy: <b>null</b>},
-</code><code id="L1337"><span class="ln">1337</span>                processPath<span class="s"> = </span><b>function</b> (path, d) {
-</code><code id="L1338"><span class="ln">1338</span>                    <b>var</b> nx, ny;
-</code><code id="L1339"><span class="ln">1339</span>                    <b>if</b> (!path) {
-</code><code id="L1340"><span class="ln">1340</span>                        <b>return</b> [<i>"C"</i>, d.x, d.y, d.x, d.y, d.x, d.y];
-</code><code id="L1341"><span class="ln">1341</span>                    }
-</code><code id="L1342"><span class="ln">1342</span>                    !(path[<span class="d">0</span>] <b>in</b> {T:<span class="d">1</span>, Q:<span class="d">1</span>})<span class="s"> &amp;&amp; </span>(d.qx<span class="s"> = </span>d.qy<span class="s"> = </span><b>null</b>);
-</code><code id="L1343"><span class="ln">1343</span>                    <b>switch</b> (path[<span class="d">0</span>]) {
-</code><code id="L1344"><span class="ln">1344</span>                        <b>case</b> <i>"M"</i>:
-</code><code id="L1345"><span class="ln">1345</span>                            d.X<span class="s"> = </span>path[<span class="d">1</span>];
-</code><code id="L1346"><span class="ln">1346</span>                            d.Y<span class="s"> = </span>path[<span class="d">2</span>];
-</code><code id="L1347"><span class="ln">1347</span>                            <b>break</b>;
-</code><code id="L1348"><span class="ln">1348</span>                        <b>case</b> <i>"A"</i>:
-</code><code id="L1349"><span class="ln">1349</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](a2c[apply](<span class="d">0</span>, [d.x, d.y][concat](path.slice(<span class="d">1</span>))));
-</code><code id="L1350"><span class="ln">1350</span>                            <b>break</b>;
-</code><code id="L1351"><span class="ln">1351</span>                        <b>case</b> <i>"S"</i>:
-</code><code id="L1352"><span class="ln">1352</span>                            nx<span class="s"> = </span>d.x<span class="s"> + </span>(d.x<span class="s"> - </span>(d.bx<span class="s"> || </span>d.x));
-</code><code id="L1353"><span class="ln">1353</span>                            ny<span class="s"> = </span>d.y<span class="s"> + </span>(d.y<span class="s"> - </span>(d.by<span class="s"> || </span>d.y));
-</code><code id="L1354"><span class="ln">1354</span>                            path<span class="s"> = </span>[<i>"C"</i>, nx, ny][concat](path.slice(<span class="d">1</span>));
-</code><code id="L1355"><span class="ln">1355</span>                            <b>break</b>;
-</code><code id="L1356"><span class="ln">1356</span>                        <b>case</b> <i>"T"</i>:
-</code><code id="L1357"><span class="ln">1357</span>                            d.qx<span class="s"> = </span>d.x<span class="s"> + </span>(d.x<span class="s"> - </span>(d.qx<span class="s"> || </span>d.x));
-</code><code id="L1358"><span class="ln">1358</span>                            d.qy<span class="s"> = </span>d.y<span class="s"> + </span>(d.y<span class="s"> - </span>(d.qy<span class="s"> || </span>d.y));
-</code><code id="L1359"><span class="ln">1359</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](q2c(d.x, d.y, d.qx, d.qy, path[<span class="d">1</span>], path[<span class="d">2</span>]));
-</code><code id="L1360"><span class="ln">1360</span>                            <b>break</b>;
-</code><code id="L1361"><span class="ln">1361</span>                        <b>case</b> <i>"Q"</i>:
-</code><code id="L1362"><span class="ln">1362</span>                            d.qx<span class="s"> = </span>path[<span class="d">1</span>];
-</code><code id="L1363"><span class="ln">1363</span>                            d.qy<span class="s"> = </span>path[<span class="d">2</span>];
-</code><code id="L1364"><span class="ln">1364</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](q2c(d.x, d.y, path[<span class="d">1</span>], path[<span class="d">2</span>], path[<span class="d">3</span>], path[<span class="d">4</span>]));
-</code><code id="L1365"><span class="ln">1365</span>                            <b>break</b>;
-</code><code id="L1366"><span class="ln">1366</span>                        <b>case</b> <i>"L"</i>:
-</code><code id="L1367"><span class="ln">1367</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](l2c(d.x, d.y, path[<span class="d">1</span>], path[<span class="d">2</span>]));
-</code><code id="L1368"><span class="ln">1368</span>                            <b>break</b>;
-</code><code id="L1369"><span class="ln">1369</span>                        <b>case</b> <i>"H"</i>:
-</code><code id="L1370"><span class="ln">1370</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](l2c(d.x, d.y, path[<span class="d">1</span>], d.y));
-</code><code id="L1371"><span class="ln">1371</span>                            <b>break</b>;
-</code><code id="L1372"><span class="ln">1372</span>                        <b>case</b> <i>"V"</i>:
-</code><code id="L1373"><span class="ln">1373</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](l2c(d.x, d.y, d.x, path[<span class="d">1</span>]));
-</code><code id="L1374"><span class="ln">1374</span>                            <b>break</b>;
-</code><code id="L1375"><span class="ln">1375</span>                        <b>case</b> <i>"Z"</i>:
-</code><code id="L1376"><span class="ln">1376</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](l2c(d.x, d.y, d.X, d.Y));
-</code><code id="L1377"><span class="ln">1377</span>                            <b>break</b>;
-</code><code id="L1378"><span class="ln">1378</span>                    }
-</code><code id="L1379"><span class="ln">1379</span>                    <b>return</b> path;
-</code><code id="L1380"><span class="ln">1380</span>                },
-</code><code id="L1381"><span class="ln">1381</span>                fixArc<span class="s"> = </span><b>function</b> (pp, i) {
-</code><code id="L1382"><span class="ln">1382</span>                    <b>if</b> (pp[i].length > <span class="d">7</span>) {
-</code><code id="L1383"><span class="ln">1383</span>                        pp[i].shift();
-</code><code id="L1384"><span class="ln">1384</span>                        <b>var</b> pi<span class="s"> = </span>pp[i];
-</code><code id="L1385"><span class="ln">1385</span>                        <b>while</b> (pi.length) {
-</code><code id="L1386"><span class="ln">1386</span>                            pp.splice(i++, <span class="d">0</span>, [<i>"C"</i>][concat](pi.splice(<span class="d">0</span>, <span class="d">6</span>)));
-</code><code id="L1387"><span class="ln">1387</span>                        }
-</code><code id="L1388"><span class="ln">1388</span>                        pp.splice(i, <span class="d">1</span>);
-</code><code id="L1389"><span class="ln">1389</span>                        ii<span class="s"> = </span>mmax(p.length, p2<span class="s"> &amp;&amp; </span>p2.length<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L1390"><span class="ln">1390</span>                    }
-</code><code id="L1391"><span class="ln">1391</span>                },
-</code><code id="L1392"><span class="ln">1392</span>                fixM<span class="s"> = </span><b>function</b> (path1, path2, a1, a2, i) {
-</code><code id="L1393"><span class="ln">1393</span>                    <b>if</b> (path1<span class="s"> &amp;&amp; </span>path2<span class="s"> &amp;&amp; </span>path1[i][<span class="d">0</span>]<span class="s"> == </span><i>"M"</i><span class="s"> &amp;&amp; </span>path2[i][<span class="d">0</span>] != <i>"M"</i>) {
-</code><code id="L1394"><span class="ln">1394</span>                        path2.splice(i, <span class="d">0</span>, [<i>"M"</i>, a2.x, a2.y]);
-</code><code id="L1395"><span class="ln">1395</span>                        a1.bx<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L1396"><span class="ln">1396</span>                        a1.by<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L1397"><span class="ln">1397</span>                        a1.x<span class="s"> = </span>path1[i][<span class="d">1</span>];
-</code><code id="L1398"><span class="ln">1398</span>                        a1.y<span class="s"> = </span>path1[i][<span class="d">2</span>];
-</code><code id="L1399"><span class="ln">1399</span>                        ii<span class="s"> = </span>mmax(p.length, p2<span class="s"> &amp;&amp; </span>p2.length<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L1400"><span class="ln">1400</span>                    }
-</code><code id="L1401"><span class="ln">1401</span>                };
-</code><code id="L1402"><span class="ln">1402</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>mmax(p.length, p2<span class="s"> &amp;&amp; </span>p2.length<span class="s"> || </span><span class="d">0</span>); i &lt; ii; i++) {
-</code><code id="L1403"><span class="ln">1403</span>                p[i]<span class="s"> = </span>processPath(p[i], attrs);
-</code><code id="L1404"><span class="ln">1404</span>                fixArc(p, i);
-</code><code id="L1405"><span class="ln">1405</span>                p2<span class="s"> &amp;&amp; </span>(p2[i]<span class="s"> = </span>processPath(p2[i], attrs2));
-</code><code id="L1406"><span class="ln">1406</span>                p2<span class="s"> &amp;&amp; </span>fixArc(p2, i);
-</code><code id="L1407"><span class="ln">1407</span>                fixM(p, p2, attrs, attrs2, i);
-</code><code id="L1408"><span class="ln">1408</span>                fixM(p2, p, attrs2, attrs, i);
-</code><code id="L1409"><span class="ln">1409</span>                <b>var</b> seg<span class="s"> = </span>p[i],
-</code><code id="L1410"><span class="ln">1410</span>                    seg2<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>p2[i],
-</code><code id="L1411"><span class="ln">1411</span>                    seglen<span class="s"> = </span>seg.length,
-</code><code id="L1412"><span class="ln">1412</span>                    seg2len<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>seg2.length;
-</code><code id="L1413"><span class="ln">1413</span>                attrs.x<span class="s"> = </span>seg[seglen<span class="s"> - </span><span class="d">2</span>];
-</code><code id="L1414"><span class="ln">1414</span>                attrs.y<span class="s"> = </span>seg[seglen<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L1415"><span class="ln">1415</span>                attrs.bx<span class="s"> = </span>toFloat(seg[seglen<span class="s"> - </span><span class="d">4</span>])<span class="s"> || </span>attrs.x;
-</code><code id="L1416"><span class="ln">1416</span>                attrs.by<span class="s"> = </span>toFloat(seg[seglen<span class="s"> - </span><span class="d">3</span>])<span class="s"> || </span>attrs.y;
-</code><code id="L1417"><span class="ln">1417</span>                attrs2.bx<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>(toFloat(seg2[seg2len<span class="s"> - </span><span class="d">4</span>])<span class="s"> || </span>attrs2.x);
-</code><code id="L1418"><span class="ln">1418</span>                attrs2.by<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>(toFloat(seg2[seg2len<span class="s"> - </span><span class="d">3</span>])<span class="s"> || </span>attrs2.y);
-</code><code id="L1419"><span class="ln">1419</span>                attrs2.x<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>seg2[seg2len<span class="s"> - </span><span class="d">2</span>];
-</code><code id="L1420"><span class="ln">1420</span>                attrs2.y<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>seg2[seg2len<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L1421"><span class="ln">1421</span>            }
-</code><code id="L1422"><span class="ln">1422</span>            <b>return</b> p2 ? [p, p2] : p;
-</code><code id="L1423"><span class="ln">1423</span>        }, <b>null</b>, pathClone),
-</code><code id="L1424"><span class="ln">1424</span>        parseDots<span class="s"> = </span>cacher(<b>function</b> (gradient) {
-</code><code id="L1425"><span class="ln">1425</span>            <b>var</b> dots<span class="s"> = </span>[];
-</code><code id="L1426"><span class="ln">1426</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>gradient.length; i &lt; ii; i++) {
-</code><code id="L1427"><span class="ln">1427</span>                <b>var</b> dot<span class="s"> = </span>{},
-</code><code id="L1428"><span class="ln">1428</span>                    par<span class="s"> = </span>gradient[i].match(/^([^:]*):?([\d\.]*)/);
-</code><code id="L1429"><span class="ln">1429</span>                dot.color<span class="s"> = </span>R.getRGB(par[<span class="d">1</span>]);
-</code><code id="L1430"><span class="ln">1430</span>                <b>if</b> (dot.color.error) {
-</code><code id="L1431"><span class="ln">1431</span>                    <b>return</b> <b>null</b>;
-</code><code id="L1432"><span class="ln">1432</span>                }
-</code><code id="L1433"><span class="ln">1433</span>                dot.color<span class="s"> = </span>dot.color.hex;
-</code><code id="L1434"><span class="ln">1434</span>                par[<span class="d">2</span>]<span class="s"> &amp;&amp; </span>(dot.offset<span class="s"> = </span>par[<span class="d">2</span>]<span class="s"> + </span><i>"%"</i>);
-</code><code id="L1435"><span class="ln">1435</span>                dots.push(dot);
-</code><code id="L1436"><span class="ln">1436</span>            }
-</code><code id="L1437"><span class="ln">1437</span>            <b>for</b> (i<span class="s"> = </span><span class="d">1</span>, ii<span class="s"> = </span>dots.length<span class="s"> - </span><span class="d">1</span>; i &lt; ii; i++) {
-</code><code id="L1438"><span class="ln">1438</span>                <b>if</b> (!dots[i].offset) {
-</code><code id="L1439"><span class="ln">1439</span>                    <b>var</b> start<span class="s"> = </span>toFloat(dots[i<span class="s"> - </span><span class="d">1</span>].offset<span class="s"> || </span><span class="d">0</span>),
-</code><code id="L1440"><span class="ln">1440</span>                        end<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L1441"><span class="ln">1441</span>                    <b>for</b> (<b>var</b> j<span class="s"> = </span>i<span class="s"> + </span><span class="d">1</span>; j &lt; ii; j++) {
-</code><code id="L1442"><span class="ln">1442</span>                        <b>if</b> (dots[j].offset) {
-</code><code id="L1443"><span class="ln">1443</span>                            end<span class="s"> = </span>dots[j].offset;
-</code><code id="L1444"><span class="ln">1444</span>                            <b>break</b>;
-</code><code id="L1445"><span class="ln">1445</span>                        }
-</code><code id="L1446"><span class="ln">1446</span>                    }
-</code><code id="L1447"><span class="ln">1447</span>                    <b>if</b> (!end) {
-</code><code id="L1448"><span class="ln">1448</span>                        end<span class="s"> = </span><span class="d">100</span>;
-</code><code id="L1449"><span class="ln">1449</span>                        j<span class="s"> = </span>ii;
-</code><code id="L1450"><span class="ln">1450</span>                    }
-</code><code id="L1451"><span class="ln">1451</span>                    end<span class="s"> = </span>toFloat(end);
-</code><code id="L1452"><span class="ln">1452</span>                    <b>var</b> d<span class="s"> = </span>(end<span class="s"> - </span>start)<span class="s"> / </span>(j<span class="s"> - </span>i<span class="s"> + </span><span class="d">1</span>);
-</code><code id="L1453"><span class="ln">1453</span>                    <b>for</b> (; i &lt; j; i++) {
-</code><code id="L1454"><span class="ln">1454</span>                        start += d;
-</code><code id="L1455"><span class="ln">1455</span>                        dots[i].offset<span class="s"> = </span>start<span class="s"> + </span><i>"%"</i>;
-</code><code id="L1456"><span class="ln">1456</span>                    }
-</code><code id="L1457"><span class="ln">1457</span>                }
-</code><code id="L1458"><span class="ln">1458</span>            }
-</code><code id="L1459"><span class="ln">1459</span>            <b>return</b> dots;
-</code><code id="L1460"><span class="ln">1460</span>        }),
-</code><code id="L1461"><span class="ln">1461</span>        getContainer<span class="s"> = </span><b>function</b> (x, y, w, h) {
-</code><code id="L1462"><span class="ln">1462</span>            <b>var</b> container;
-</code><code id="L1463"><span class="ln">1463</span>            container<span class="s"> = </span>h<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>!R.is(x, <i>"object"</i>) ? g.doc.getElementById(x) : x;
-</code><code id="L1464"><span class="ln">1464</span>            <b>if</b> (container<span class="s"> == </span><b>null</b>) {
-</code><code id="L1465"><span class="ln">1465</span>                <b>return</b>;
-</code><code id="L1466"><span class="ln">1466</span>            }
-</code><code id="L1467"><span class="ln">1467</span>            <b>if</b> (container.tagName) {
-</code><code id="L1468"><span class="ln">1468</span>                <b>if</b> (y<span class="s"> == </span><b>null</b>) {
-</code><code id="L1469"><span class="ln">1469</span>                    <b>return</b> {
-</code><code id="L1470"><span class="ln">1470</span>                        container: container,
-</code><code id="L1471"><span class="ln">1471</span>                        width: container.style.pixelWidth<span class="s"> || </span>container.offsetWidth,
-</code><code id="L1472"><span class="ln">1472</span>                        height: container.style.pixelHeight<span class="s"> || </span>container.offsetHeight
-</code><code id="L1473"><span class="ln">1473</span>                    };
-</code><code id="L1474"><span class="ln">1474</span>                } <b>else</b> {
-</code><code id="L1475"><span class="ln">1475</span>                    <b>return</b> {container: container, width: y, height: w};
-</code><code id="L1476"><span class="ln">1476</span>                }
-</code><code id="L1477"><span class="ln">1477</span>            }
-</code><code id="L1478"><span class="ln">1478</span>            <b>return</b> {container: <span class="d">1</span>, x: x, y: y, width: w, height: h};
-</code><code id="L1479"><span class="ln">1479</span>        },
-</code><code id="L1480"><span class="ln">1480</span>        plugins<span class="s"> = </span><b>function</b> (con, add) {
-</code><code id="L1481"><span class="ln">1481</span>            <b>var</b> that<span class="s"> = </span><b>this</b>;
-</code><code id="L1482"><span class="ln">1482</span>            <b>for</b> (<b>var</b> prop <b>in</b> add) {
-</code><code id="L1483"><span class="ln">1483</span>                <b>if</b> (add[has](prop)<span class="s"> &amp;&amp; </span>!(prop <b>in</b> con)) {
-</code><code id="L1484"><span class="ln">1484</span>                    <b>switch</b> (<b>typeof</b> add[prop]) {
-</code><code id="L1485"><span class="ln">1485</span>                        <b>case</b> <i>"<b>function</b>"</i>:
-</code><code id="L1486"><span class="ln">1486</span>                            (<b>function</b> (f) {
-</code><code id="L1487"><span class="ln">1487</span>                                con[prop]<span class="s"> = </span>con<span class="s"> === </span>that ? f : <b>function</b> () { <b>return</b> f[apply](that, arguments); };
-</code><code id="L1488"><span class="ln">1488</span>                            })(add[prop]);
-</code><code id="L1489"><span class="ln">1489</span>                        <b>break</b>;
-</code><code id="L1490"><span class="ln">1490</span>                        <b>case</b> <i>"object"</i>:
-</code><code id="L1491"><span class="ln">1491</span>                            con[prop]<span class="s"> = </span>con[prop]<span class="s"> || </span>{};
-</code><code id="L1492"><span class="ln">1492</span>                            plugins.call(<b>this</b>, con[prop], add[prop]);
-</code><code id="L1493"><span class="ln">1493</span>                        <b>break</b>;
-</code><code id="L1494"><span class="ln">1494</span>                        <b>default</b>:
-</code><code id="L1495"><span class="ln">1495</span>                            con[prop]<span class="s"> = </span>add[prop];
-</code><code id="L1496"><span class="ln">1496</span>                        <b>break</b>;
-</code><code id="L1497"><span class="ln">1497</span>                    }
-</code><code id="L1498"><span class="ln">1498</span>                }
-</code><code id="L1499"><span class="ln">1499</span>            }
-</code><code id="L1500"><span class="ln">1500</span>        },
-</code><code id="L1501"><span class="ln">1501</span>        tear<span class="s"> = </span><b>function</b> (el, paper) {
-</code><code id="L1502"><span class="ln">1502</span>            el<span class="s"> == </span>paper.top<span class="s"> &amp;&amp; </span>(paper.top<span class="s"> = </span>el.prev);
-</code><code id="L1503"><span class="ln">1503</span>            el<span class="s"> == </span>paper.bottom<span class="s"> &amp;&amp; </span>(paper.bottom<span class="s"> = </span>el.next);
-</code><code id="L1504"><span class="ln">1504</span>            el.next<span class="s"> &amp;&amp; </span>(el.next.prev<span class="s"> = </span>el.prev);
-</code><code id="L1505"><span class="ln">1505</span>            el.prev<span class="s"> &amp;&amp; </span>(el.prev.next<span class="s"> = </span>el.next);
-</code><code id="L1506"><span class="ln">1506</span>        },
-</code><code id="L1507"><span class="ln">1507</span>        tofront<span class="s"> = </span><b>function</b> (el, paper) {
-</code><code id="L1508"><span class="ln">1508</span>            <b>if</b> (paper.top<span class="s"> === </span>el) {
-</code><code id="L1509"><span class="ln">1509</span>                <b>return</b>;
-</code><code id="L1510"><span class="ln">1510</span>            }
-</code><code id="L1511"><span class="ln">1511</span>            tear(el, paper);
-</code><code id="L1512"><span class="ln">1512</span>            el.next<span class="s"> = </span><b>null</b>;
-</code><code id="L1513"><span class="ln">1513</span>            el.prev<span class="s"> = </span>paper.top;
-</code><code id="L1514"><span class="ln">1514</span>            paper.top.next<span class="s"> = </span>el;
-</code><code id="L1515"><span class="ln">1515</span>            paper.top<span class="s"> = </span>el;
-</code><code id="L1516"><span class="ln">1516</span>        },
-</code><code id="L1517"><span class="ln">1517</span>        toback<span class="s"> = </span><b>function</b> (el, paper) {
-</code><code id="L1518"><span class="ln">1518</span>            <b>if</b> (paper.bottom<span class="s"> === </span>el) {
-</code><code id="L1519"><span class="ln">1519</span>                <b>return</b>;
-</code><code id="L1520"><span class="ln">1520</span>            }
-</code><code id="L1521"><span class="ln">1521</span>            tear(el, paper);
-</code><code id="L1522"><span class="ln">1522</span>            el.next<span class="s"> = </span>paper.bottom;
-</code><code id="L1523"><span class="ln">1523</span>            el.prev<span class="s"> = </span><b>null</b>;
-</code><code id="L1524"><span class="ln">1524</span>            paper.bottom.prev<span class="s"> = </span>el;
-</code><code id="L1525"><span class="ln">1525</span>            paper.bottom<span class="s"> = </span>el;
-</code><code id="L1526"><span class="ln">1526</span>        },
-</code><code id="L1527"><span class="ln">1527</span>        insertafter<span class="s"> = </span><b>function</b> (el, el2, paper) {
-</code><code id="L1528"><span class="ln">1528</span>            tear(el, paper);
-</code><code id="L1529"><span class="ln">1529</span>            el2<span class="s"> == </span>paper.top<span class="s"> &amp;&amp; </span>(paper.top<span class="s"> = </span>el);
-</code><code id="L1530"><span class="ln">1530</span>            el2.next<span class="s"> &amp;&amp; </span>(el2.next.prev<span class="s"> = </span>el);
-</code><code id="L1531"><span class="ln">1531</span>            el.next<span class="s"> = </span>el2.next;
-</code><code id="L1532"><span class="ln">1532</span>            el.prev<span class="s"> = </span>el2;
-</code><code id="L1533"><span class="ln">1533</span>            el2.next<span class="s"> = </span>el;
-</code><code id="L1534"><span class="ln">1534</span>        },
-</code><code id="L1535"><span class="ln">1535</span>        insertbefore<span class="s"> = </span><b>function</b> (el, el2, paper) {
-</code><code id="L1536"><span class="ln">1536</span>            tear(el, paper);
-</code><code id="L1537"><span class="ln">1537</span>            el2<span class="s"> == </span>paper.bottom<span class="s"> &amp;&amp; </span>(paper.bottom<span class="s"> = </span>el);
-</code><code id="L1538"><span class="ln">1538</span>            el2.prev<span class="s"> &amp;&amp; </span>(el2.prev.next<span class="s"> = </span>el);
-</code><code id="L1539"><span class="ln">1539</span>            el.prev<span class="s"> = </span>el2.prev;
-</code><code id="L1540"><span class="ln">1540</span>            el2.prev<span class="s"> = </span>el;
-</code><code id="L1541"><span class="ln">1541</span>            el.next<span class="s"> = </span>el2;
-</code><code id="L1542"><span class="ln">1542</span>        },
-</code><code id="L1543"><span class="ln">1543</span>        removed<span class="s"> = </span><b>function</b> (methodname) {
-</code><code id="L1544"><span class="ln">1544</span>            <b>return</b> <b>function</b> () {
-</code><code id="L1545"><span class="ln">1545</span>                <b>throw</b> <b>new</b> Error(<i>"Rapha\xebl: you are calling to method \u201c"</i><span class="s"> + </span>methodname<span class="s"> + </span><i>"\u201d of removed object"</i>);
-</code><code id="L1546"><span class="ln">1546</span>            };
-</code><code id="L1547"><span class="ln">1547</span>        },
-</code><code id="L1548"><span class="ln">1548</span>        extractTransform<span class="s"> = </span><b>function</b> (el, tstr) {
-</code><code id="L1549"><span class="ln">1549</span>            <b>if</b> (tstr<span class="s"> == </span><b>null</b>) {
-</code><code id="L1550"><span class="ln">1550</span>                <b>return</b> el._.transform;
-</code><code id="L1551"><span class="ln">1551</span>            }
-</code><code id="L1552"><span class="ln">1552</span>            tstr<span class="s"> = </span>Str(tstr).replace(/\.{<span class="d">3</span>}|\u2026/g, el._.transform<span class="s"> || </span>E);
-</code><code id="L1553"><span class="ln">1553</span>            <b>var</b> tdata<span class="s"> = </span>R.parseTransformString(tstr),
-</code><code id="L1554"><span class="ln">1554</span>                deg<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1555"><span class="ln">1555</span>                dx<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1556"><span class="ln">1556</span>                dy<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L1557"><span class="ln">1557</span>                sx<span class="s"> = </span><span class="d">1</span>,
-</code><code id="L1558"><span class="ln">1558</span>                sy<span class="s"> = </span><span class="d">1</span>,
-</code><code id="L1559"><span class="ln">1559</span>                _<span class="s"> = </span>el._,
-</code><code id="L1560"><span class="ln">1560</span>                m<span class="s"> = </span><b>new</b> Matrix;
-</code><code id="L1561"><span class="ln">1561</span>            _.transform<span class="s"> = </span>tdata<span class="s"> || </span>[];
-</code><code id="L1562"><span class="ln">1562</span>            <b>if</b> (tdata) {
-</code><code id="L1563"><span class="ln">1563</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>tdata.length; i &lt; ii; i++) {
-</code><code id="L1564"><span class="ln">1564</span>                    <b>var</b> t<span class="s"> = </span>tdata[i],
-</code><code id="L1565"><span class="ln">1565</span>                        tlen<span class="s"> = </span>t.length,
-</code><code id="L1566"><span class="ln">1566</span>                        bb;
-</code><code id="L1567"><span class="ln">1567</span>                    t[<span class="d">0</span>]<span class="s"> = </span>Str(t[<span class="d">0</span>]).toLowerCase();
-</code><code id="L1568"><span class="ln">1568</span>                    <b>if</b> (t[<span class="d">0</span>]<span class="s"> == </span><i>"t"</i><span class="s"> &amp;&amp; </span>tlen<span class="s"> == </span><span class="d">3</span>) {
-</code><code id="L1569"><span class="ln">1569</span>                        m.translate(t[<span class="d">1</span>], t[<span class="d">2</span>]);
-</code><code id="L1570"><span class="ln">1570</span>                    } <b>else</b> <b>if</b> (t[<span class="d">0</span>]<span class="s"> == </span><i>"r"</i>) {
-</code><code id="L1571"><span class="ln">1571</span>                        <b>if</b> (tlen<span class="s"> == </span><span class="d">2</span>) {
-</code><code id="L1572"><span class="ln">1572</span>                            bb<span class="s"> = </span>bb<span class="s"> || </span>el.getBBox(<span class="d">1</span>);
-</code><code id="L1573"><span class="ln">1573</span>                            m.rotate(t[<span class="d">1</span>], bb.x<span class="s"> + </span>bb.width<span class="s"> / </span><span class="d">2</span>, bb.y<span class="s"> + </span>bb.height<span class="s"> / </span><span class="d">2</span>);
-</code><code id="L1574"><span class="ln">1574</span>                            deg += t[<span class="d">1</span>];
-</code><code id="L1575"><span class="ln">1575</span>                        } <b>else</b> <b>if</b> (tlen<span class="s"> == </span><span class="d">4</span>) {
-</code><code id="L1576"><span class="ln">1576</span>                            m.rotate(t[<span class="d">1</span>], t[<span class="d">2</span>], t[<span class="d">3</span>]);
-</code><code id="L1577"><span class="ln">1577</span>                            deg += t[<span class="d">1</span>];
-</code><code id="L1578"><span class="ln">1578</span>                        }
-</code><code id="L1579"><span class="ln">1579</span>                    } <b>else</b> <b>if</b> (t[<span class="d">0</span>]<span class="s"> == </span><i>"s"</i>) {
-</code><code id="L1580"><span class="ln">1580</span>                        <b>if</b> (tlen<span class="s"> == </span><span class="d">2</span><span class="s"> || </span>tlen<span class="s"> == </span><span class="d">3</span>) {
-</code><code id="L1581"><span class="ln">1581</span>                            bb<span class="s"> = </span>bb<span class="s"> || </span>el.getBBox(<span class="d">1</span>);
-</code><code id="L1582"><span class="ln">1582</span>                            m.scale(t[<span class="d">1</span>], t[tlen<span class="s"> - </span><span class="d">1</span>], bb.x<span class="s"> + </span>bb.width<span class="s"> / </span><span class="d">2</span>, bb.y<span class="s"> + </span>bb.height<span class="s"> / </span><span class="d">2</span>);
-</code><code id="L1583"><span class="ln">1583</span>                            sx *= t[<span class="d">1</span>];
-</code><code id="L1584"><span class="ln">1584</span>                            sy *= t[tlen<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L1585"><span class="ln">1585</span>                        } <b>else</b> <b>if</b> (tlen<span class="s"> == </span><span class="d">5</span>) {
-</code><code id="L1586"><span class="ln">1586</span>                            m.scale(t[<span class="d">1</span>], t[<span class="d">2</span>], t[<span class="d">3</span>], t[<span class="d">4</span>]);
-</code><code id="L1587"><span class="ln">1587</span>                            sx *= t[<span class="d">1</span>];
-</code><code id="L1588"><span class="ln">1588</span>                            sy *= t[<span class="d">2</span>];
-</code><code id="L1589"><span class="ln">1589</span>                        }
-</code><code id="L1590"><span class="ln">1590</span>                    } <b>else</b> <b>if</b> (t[<span class="d">0</span>]<span class="s"> == </span><i>"m"</i><span class="s"> &amp;&amp; </span>tlen<span class="s"> == </span><span class="d">7</span>) {
-</code><code id="L1591"><span class="ln">1591</span>                        m.add(t[<span class="d">1</span>], t[<span class="d">2</span>], t[<span class="d">3</span>], t[<span class="d">4</span>], t[<span class="d">5</span>], t[<span class="d">6</span>]);
-</code><code id="L1592"><span class="ln">1592</span>                    }
-</code><code id="L1593"><span class="ln">1593</span>                    _.dirtyT<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L1594"><span class="ln">1594</span>                    el.matrix<span class="s"> = </span>m;
-</code><code id="L1595"><span class="ln">1595</span>                }
-</code><code id="L1596"><span class="ln">1596</span>            }
-</code><code id="L1597"><span class="ln">1597</span>
-</code><code id="L1598"><span class="ln">1598</span>            el.matrix<span class="s"> = </span>m;
-</code><code id="L1599"><span class="ln">1599</span>
-</code><code id="L1600"><span class="ln">1600</span>            _.sx<span class="s"> = </span>sx;
-</code><code id="L1601"><span class="ln">1601</span>            _.sy<span class="s"> = </span>sy;
-</code><code id="L1602"><span class="ln">1602</span>            _.deg<span class="s"> = </span>deg;
-</code><code id="L1603"><span class="ln">1603</span>            _.dx<span class="s"> = </span>dx<span class="s"> = </span>m.m[<span class="d">0</span>][<span class="d">2</span>];
-</code><code id="L1604"><span class="ln">1604</span>            _.dy<span class="s"> = </span>dy<span class="s"> = </span>m.m[<span class="d">1</span>][<span class="d">2</span>];
-</code><code id="L1605"><span class="ln">1605</span>
-</code><code id="L1606"><span class="ln">1606</span>            <b>if</b> (sx<span class="s"> == </span><span class="d">1</span><span class="s"> &amp;&amp; </span>sy<span class="s"> == </span><span class="d">1</span><span class="s"> &amp;&amp; </span>!deg<span class="s"> &amp;&amp; </span>_.bbox) {
-</code><code id="L1607"><span class="ln">1607</span>                _.bbox.x += +dx;
-</code><code id="L1608"><span class="ln">1608</span>                _.bbox.y += +dy;
-</code><code id="L1609"><span class="ln">1609</span>            } <b>else</b> {
-</code><code id="L1610"><span class="ln">1610</span>                _.dirtyT<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L1611"><span class="ln">1611</span>            }
-</code><code id="L1612"><span class="ln">1612</span>        },
-</code><code id="L1613"><span class="ln">1613</span>        getEmpty<span class="s"> = </span><b>function</b> (item) {
-</code><code id="L1614"><span class="ln">1614</span>            <b>switch</b> (item[<span class="d">0</span>]) {
-</code><code id="L1615"><span class="ln">1615</span>                <b>case</b> <i>"t"</i>: <b>return</b> [<i>"t"</i>, <span class="d">0</span>, <span class="d">0</span>];
-</code><code id="L1616"><span class="ln">1616</span>                <b>case</b> <i>"m"</i>: <b>return</b> [<i>"m"</i>, <span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>];
-</code><code id="L1617"><span class="ln">1617</span>                <b>case</b> <i>"r"</i>: <b>if</b> (item.length<span class="s"> == </span><span class="d">4</span>) {
-</code><code id="L1618"><span class="ln">1618</span>                    <b>return</b> [<i>"r"</i>, <span class="d">0</span>, item[<span class="d">2</span>], item[<span class="d">3</span>]];
-</code><code id="L1619"><span class="ln">1619</span>                } <b>else</b> {
-</code><code id="L1620"><span class="ln">1620</span>                    <b>return</b> [<i>"r"</i>, <span class="d">0</span>];
-</code><code id="L1621"><span class="ln">1621</span>                }
-</code><code id="L1622"><span class="ln">1622</span>                <b>case</b> <i>"s"</i>: <b>if</b> (item.length<span class="s"> == </span><span class="d">5</span>) {
-</code><code id="L1623"><span class="ln">1623</span>                    <b>return</b> [<i>"s"</i>, <span class="d">1</span>, <span class="d">1</span>, item[<span class="d">3</span>], item[<span class="d">4</span>]];
-</code><code id="L1624"><span class="ln">1624</span>                } <b>else</b> <b>if</b> (item.length<span class="s"> == </span><span class="d">3</span>) {
-</code><code id="L1625"><span class="ln">1625</span>                    <b>return</b> [<i>"s"</i>, <span class="d">1</span>, <span class="d">1</span>];
-</code><code id="L1626"><span class="ln">1626</span>                } <b>else</b> {
-</code><code id="L1627"><span class="ln">1627</span>                    <b>return</b> [<i>"s"</i>, <span class="d">1</span>];
-</code><code id="L1628"><span class="ln">1628</span>                }
-</code><code id="L1629"><span class="ln">1629</span>            }
-</code><code id="L1630"><span class="ln">1630</span>        },
-</code><code id="L1631"><span class="ln">1631</span>        equaliseTransform<span class="s"> = </span><b>function</b> (t1, t2) {
-</code><code id="L1632"><span class="ln">1632</span>            t1<span class="s"> = </span>R.parseTransformString(t1)<span class="s"> || </span>[];
-</code><code id="L1633"><span class="ln">1633</span>            t2<span class="s"> = </span>R.parseTransformString(t2)<span class="s"> || </span>[];
-</code><code id="L1634"><span class="ln">1634</span>            <b>var</b> maxlength<span class="s"> = </span>mmax(t1.length, t2.length),
-</code><code id="L1635"><span class="ln">1635</span>                from<span class="s"> = </span>[],
-</code><code id="L1636"><span class="ln">1636</span>                to<span class="s"> = </span>[],
-</code><code id="L1637"><span class="ln">1637</span>                i<span class="s"> = </span><span class="d">0</span>, j, jj,
-</code><code id="L1638"><span class="ln">1638</span>                tt1, tt2;
-</code><code id="L1639"><span class="ln">1639</span>            <b>for</b> (; i &lt; maxlength; i++) {
-</code><code id="L1640"><span class="ln">1640</span>                tt1<span class="s"> = </span>t1[i]<span class="s"> || </span>getEmpty(t2[i]);
-</code><code id="L1641"><span class="ln">1641</span>                tt2<span class="s"> = </span>t2[i]<span class="s"> || </span>getEmpty(tt1);
-</code><code id="L1642"><span class="ln">1642</span>                <b>if</b> (    (tt1[<span class="d">0</span>] != tt2[<span class="d">0</span>]) ||
-</code><code id="L1643"><span class="ln">1643</span>                        (tt1[<span class="d">0</span>]<span class="s"> == </span><i>"r"</i><span class="s"> &amp;&amp; </span>(tt1[<span class="d">2</span>] != tt2[<span class="d">2</span>]<span class="s"> || </span>tt1[<span class="d">3</span>] != tt2[<span class="d">3</span>])) ||
-</code><code id="L1644"><span class="ln">1644</span>                        (tt1[<span class="d">0</span>]<span class="s"> == </span><i>"s"</i><span class="s"> &amp;&amp; </span>(tt1[<span class="d">3</span>] != tt2[<span class="d">3</span>]<span class="s"> || </span>tt1[<span class="d">4</span>] != tt2[<span class="d">4</span>]))
-</code><code id="L1645"><span class="ln">1645</span>                    ) {
-</code><code id="L1646"><span class="ln">1646</span>                    <b>return</b>;
-</code><code id="L1647"><span class="ln">1647</span>                }
-</code><code id="L1648"><span class="ln">1648</span>                from[i]<span class="s"> = </span>[];
-</code><code id="L1649"><span class="ln">1649</span>                to[i]<span class="s"> = </span>[];
-</code><code id="L1650"><span class="ln">1650</span>                <b>for</b> (j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>mmax(tt1.length, tt2.length); j &lt; jj; j++) {
-</code><code id="L1651"><span class="ln">1651</span>                    j <b>in</b> tt1<span class="s"> &amp;&amp; </span>(from[i][j]<span class="s"> = </span>tt1[j]);
-</code><code id="L1652"><span class="ln">1652</span>                    j <b>in</b> tt2<span class="s"> &amp;&amp; </span>(to[i][j]<span class="s"> = </span>tt2[j]);
-</code><code id="L1653"><span class="ln">1653</span>                }
-</code><code id="L1654"><span class="ln">1654</span>            }
-</code><code id="L1655"><span class="ln">1655</span>            <b>return</b> {
-</code><code id="L1656"><span class="ln">1656</span>                from: from,
-</code><code id="L1657"><span class="ln">1657</span>                to: to
-</code><code id="L1658"><span class="ln">1658</span>            };
-</code><code id="L1659"><span class="ln">1659</span>        };
-</code><code id="L1660"><span class="ln">1660</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L1661"><span class="ln">1661</span><span class="c">    <span class="s"> * </span>Raphael.pathToRelative
-</span></code><code id="L1662"><span class="ln">1662</span><span class="c">     [ method ]
-</span></code><code id="L1663"><span class="ln">1663</span><span class="c">     **
-</span></code><code id="L1664"><span class="ln">1664</span><span class="c">    <span class="s"> * </span>Utility method
-</span></code><code id="L1665"><span class="ln">1665</span><span class="c">     **
-</span></code><code id="L1666"><span class="ln">1666</span><span class="c">    <span class="s"> * </span>Converts path to relative form
-</span></code><code id="L1667"><span class="ln">1667</span><span class="c">     > Parameters
-</span></code><code id="L1668"><span class="ln">1668</span><span class="c">    <span class="s"> - </span>pathString (string|array) path string or array of segments
-</span></code><code id="L1669"><span class="ln">1669</span><span class="c">    <span class="s"> = </span>(array) array of segments.
-</span></code><code id="L1670"><span class="ln">1670</span><span class="c">    \*/</span>
-</code><code id="L1671"><span class="ln">1671</span>    R.pathToRelative<span class="s"> = </span>pathToRelative;
-</code><code id="L1672"><span class="ln">1672</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L1673"><span class="ln">1673</span><span class="c">    <span class="s"> * </span>Raphael.path2curve
-</span></code><code id="L1674"><span class="ln">1674</span><span class="c">     [ method ]
-</span></code><code id="L1675"><span class="ln">1675</span><span class="c">     **
-</span></code><code id="L1676"><span class="ln">1676</span><span class="c">    <span class="s"> * </span>Utility method
-</span></code><code id="L1677"><span class="ln">1677</span><span class="c">     **
-</span></code><code id="L1678"><span class="ln">1678</span><span class="c">    <span class="s"> * </span>Converts path to path where all segments are cubic bezier curves.
-</span></code><code id="L1679"><span class="ln">1679</span><span class="c">     > Parameters
-</span></code><code id="L1680"><span class="ln">1680</span><span class="c">    <span class="s"> - </span>pathString (string|array) path string or array of segments
-</span></code><code id="L1681"><span class="ln">1681</span><span class="c">    <span class="s"> = </span>(array) array of segments.
-</span></code><code id="L1682"><span class="ln">1682</span><span class="c">    \*/</span>
-</code><code id="L1683"><span class="ln">1683</span>    R.path2curve<span class="s"> = </span>path2curve;
-</code><code id="L1684"><span class="ln">1684</span>    <span class="c">// Matrix</span>
-</code><code id="L1685"><span class="ln">1685</span>    <span class="c">// <b>var</b> m<span class="s"> = </span>document.createElementNS(<i>"http://www.w3.org/<span class="d">2000</span>/svg"</i>, <i>"svg"</i>).createSVGMatrix();</span>
-</code><code id="L1686"><span class="ln">1686</span>    <b>function</b> Matrix(a, b, c, d, e, f) {
-</code><code id="L1687"><span class="ln">1687</span>        <b>if</b> (a != <b>null</b>) {
-</code><code id="L1688"><span class="ln">1688</span>            <b>this</b>.m<span class="s"> = </span>[[a, c, e], [b, d, f], [<span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>]];
-</code><code id="L1689"><span class="ln">1689</span>        } <b>else</b> {
-</code><code id="L1690"><span class="ln">1690</span>            <b>this</b>.m<span class="s"> = </span>[[<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>], [<span class="d">0</span>, <span class="d">1</span>, <span class="d">0</span>], [<span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>]];
-</code><code id="L1691"><span class="ln">1691</span>        }
-</code><code id="L1692"><span class="ln">1692</span>    }
-</code><code id="L1693"><span class="ln">1693</span>    <b>var</b> matrixproto<span class="s"> = </span>Matrix.prototype;
-</code><code id="L1694"><span class="ln">1694</span>    matrixproto.add<span class="s"> = </span><b>function</b> (a, b, c, d, e, f) {
-</code><code id="L1695"><span class="ln">1695</span>        <b>var</b> out<span class="s"> = </span>[[], [], []],
-</code><code id="L1696"><span class="ln">1696</span>            matrix<span class="s"> = </span>[[a, c, e], [b, d, f], [<span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>]],
-</code><code id="L1697"><span class="ln">1697</span>            x, y, z, res;
-</code><code id="L1698"><span class="ln">1698</span>
-</code><code id="L1699"><span class="ln">1699</span>        <b>for</b> (x<span class="s"> = </span><span class="d">0</span>; x &lt; <span class="d">3</span>; x++) {
-</code><code id="L1700"><span class="ln">1700</span>            <b>for</b> (y<span class="s"> = </span><span class="d">0</span>; y &lt; <span class="d">3</span>; y++) {
-</code><code id="L1701"><span class="ln">1701</span>                res<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L1702"><span class="ln">1702</span>                <b>for</b> (z<span class="s"> = </span><span class="d">0</span>; z &lt; <span class="d">3</span>; z++) {
-</code><code id="L1703"><span class="ln">1703</span>                    res += <b>this</b>.m[x][z]<span class="s"> * </span>matrix[z][y];
-</code><code id="L1704"><span class="ln">1704</span>                }
-</code><code id="L1705"><span class="ln">1705</span>                out[x][y]<span class="s"> = </span>res;
-</code><code id="L1706"><span class="ln">1706</span>            }
-</code><code id="L1707"><span class="ln">1707</span>        }
-</code><code id="L1708"><span class="ln">1708</span>        <b>this</b>.m<span class="s"> = </span>out;
-</code><code id="L1709"><span class="ln">1709</span>    };
-</code><code id="L1710"><span class="ln">1710</span>    matrixproto.invert<span class="s"> = </span><b>function</b> () {
-</code><code id="L1711"><span class="ln">1711</span>        <b>var</b> a<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">0</span>],
-</code><code id="L1712"><span class="ln">1712</span>            b<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">0</span>],
-</code><code id="L1713"><span class="ln">1713</span>            c<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">1</span>],
-</code><code id="L1714"><span class="ln">1714</span>            d<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">1</span>],
-</code><code id="L1715"><span class="ln">1715</span>            e<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">2</span>],
-</code><code id="L1716"><span class="ln">1716</span>            f<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">2</span>],
-</code><code id="L1717"><span class="ln">1717</span>            x<span class="s"> = </span>a<span class="s"> * </span>d<span class="s"> - </span>b<span class="s"> * </span>c;
-</code><code id="L1718"><span class="ln">1718</span>        <b>return</b> <b>new</b> Matrix(d<span class="s"> / </span>x, -b<span class="s"> / </span>x, -c<span class="s"> / </span>x, a<span class="s"> / </span>x, (c<span class="s"> * </span>f<span class="s"> - </span>d<span class="s"> * </span>e)<span class="s"> / </span>x, (b<span class="s"> * </span>e<span class="s"> - </span>a<span class="s"> * </span>f)<span class="s"> / </span>x);
-</code><code id="L1719"><span class="ln">1719</span>    };
-</code><code id="L1720"><span class="ln">1720</span>    matrixproto.clone<span class="s"> = </span><b>function</b> () {
-</code><code id="L1721"><span class="ln">1721</span>        <b>var</b> a<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">0</span>],
-</code><code id="L1722"><span class="ln">1722</span>            b<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">0</span>],
-</code><code id="L1723"><span class="ln">1723</span>            c<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">1</span>],
-</code><code id="L1724"><span class="ln">1724</span>            d<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">1</span>],
-</code><code id="L1725"><span class="ln">1725</span>            e<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">2</span>],
-</code><code id="L1726"><span class="ln">1726</span>            f<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">2</span>];
-</code><code id="L1727"><span class="ln">1727</span>        <b>return</b> <b>new</b> Matrix(a, b, c, d, e, f);
-</code><code id="L1728"><span class="ln">1728</span>    };
-</code><code id="L1729"><span class="ln">1729</span>    matrixproto.translate<span class="s"> = </span><b>function</b> (x, y) {
-</code><code id="L1730"><span class="ln">1730</span>        <b>this</b>.add(<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, x, y);
-</code><code id="L1731"><span class="ln">1731</span>    };
-</code><code id="L1732"><span class="ln">1732</span>    matrixproto.scale<span class="s"> = </span><b>function</b> (x, y, cx, cy) {
-</code><code id="L1733"><span class="ln">1733</span>        y<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>(y<span class="s"> = </span>x);
-</code><code id="L1734"><span class="ln">1734</span>        <b>this</b>.add(<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, cx, cy);
-</code><code id="L1735"><span class="ln">1735</span>        <b>this</b>.add(x, <span class="d">0</span>, <span class="d">0</span>, y, <span class="d">0</span>, <span class="d">0</span>);
-</code><code id="L1736"><span class="ln">1736</span>        <b>this</b>.add(<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, -cx, -cy);
-</code><code id="L1737"><span class="ln">1737</span>    };
-</code><code id="L1738"><span class="ln">1738</span>    matrixproto.rotate<span class="s"> = </span><b>function</b> (a, x, y) {
-</code><code id="L1739"><span class="ln">1739</span>        a<span class="s"> = </span>R.rad(a);
-</code><code id="L1740"><span class="ln">1740</span>        <b>var</b> cos<span class="s"> = </span>+math.cos(a).toFixed(<span class="d">9</span>),
-</code><code id="L1741"><span class="ln">1741</span>            sin<span class="s"> = </span>+math.sin(a).toFixed(<span class="d">9</span>);
-</code><code id="L1742"><span class="ln">1742</span>        <b>this</b>.add(cos, sin, -sin, cos, x, y);
-</code><code id="L1743"><span class="ln">1743</span>        <b>this</b>.add(<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, -x, -y);
-</code><code id="L1744"><span class="ln">1744</span>    };
-</code><code id="L1745"><span class="ln">1745</span>    matrixproto.x<span class="s"> = </span><b>function</b> (x, y) {
-</code><code id="L1746"><span class="ln">1746</span>        <b>return</b> x<span class="s"> * </span><b>this</b>.m[<span class="d">0</span>][<span class="d">0</span>]<span class="s"> + </span>y<span class="s"> * </span><b>this</b>.m[<span class="d">0</span>][<span class="d">1</span>]<span class="s"> + </span><b>this</b>.m[<span class="d">0</span>][<span class="d">2</span>];
-</code><code id="L1747"><span class="ln">1747</span>    };
-</code><code id="L1748"><span class="ln">1748</span>    matrixproto.y<span class="s"> = </span><b>function</b> (x, y) {
-</code><code id="L1749"><span class="ln">1749</span>        <b>return</b> x<span class="s"> * </span><b>this</b>.m[<span class="d">1</span>][<span class="d">0</span>]<span class="s"> + </span>y<span class="s"> * </span><b>this</b>.m[<span class="d">1</span>][<span class="d">1</span>]<span class="s"> + </span><b>this</b>.m[<span class="d">1</span>][<span class="d">2</span>];
-</code><code id="L1750"><span class="ln">1750</span>    };
-</code><code id="L1751"><span class="ln">1751</span>    matrixproto.get<span class="s"> = </span><b>function</b> (i, j) {
-</code><code id="L1752"><span class="ln">1752</span>        <b>return</b> +<b>this</b>.m[i][j].toFixed(<span class="d">4</span>);
-</code><code id="L1753"><span class="ln">1753</span>    };
-</code><code id="L1754"><span class="ln">1754</span>    matrixproto.toString<span class="s"> = </span><b>function</b> () {
-</code><code id="L1755"><span class="ln">1755</span>        <b>return</b> R.svg ?
-</code><code id="L1756"><span class="ln">1756</span>            <i>"matrix("</i><span class="s"> + </span>[<b>this</b>.get(<span class="d">0</span>, <span class="d">0</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">0</span>), <b>this</b>.get(<span class="d">0</span>, <span class="d">1</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">1</span>), <b>this</b>.get(<span class="d">0</span>, <span class="d">2</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">2</span>)].join()<span class="s"> + </span><i>")"</i> :
-</code><code id="L1757"><span class="ln">1757</span>            [<b>this</b>.get(<span class="d">0</span>, <span class="d">0</span>), <b>this</b>.get(<span class="d">0</span>, <span class="d">1</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">0</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">1</span>), <span class="d">0</span>, <span class="d">0</span>].join();
-</code><code id="L1758"><span class="ln">1758</span>    };
-</code><code id="L1759"><span class="ln">1759</span>    matrixproto.toFilter<span class="s"> = </span><b>function</b> () {
-</code><code id="L1760"><span class="ln">1760</span>        <b>return</b> <i>"progid:DXImageTransform.Microsoft.Matrix(M11="</i><span class="s"> + </span><b>this</b>.get(<span class="d">0</span>, <span class="d">0</span>) +
-</code><code id="L1761"><span class="ln">1761</span>            <i>", M12="</i><span class="s"> + </span><b>this</b>.get(<span class="d">0</span>, <span class="d">1</span>)<span class="s"> + </span><i>", M21="</i><span class="s"> + </span><b>this</b>.get(<span class="d">1</span>, <span class="d">0</span>)<span class="s"> + </span><i>", M22="</i><span class="s"> + </span><b>this</b>.get(<span class="d">1</span>, <span class="d">1</span>) +
-</code><code id="L1762"><span class="ln">1762</span>            <i>", Dx="</i><span class="s"> + </span><b>this</b>.get(<span class="d">0</span>, <span class="d">2</span>)<span class="s"> + </span><i>", Dy="</i><span class="s"> + </span><b>this</b>.get(<span class="d">1</span>, <span class="d">2</span>)<span class="s"> + </span><i>", sizingmedthod='auto expand')"</i>;
-</code><code id="L1763"><span class="ln">1763</span>    };
-</code><code id="L1764"><span class="ln">1764</span>    matrixproto.offset<span class="s"> = </span><b>function</b> () {
-</code><code id="L1765"><span class="ln">1765</span>        <b>return</b> [<b>this</b>.m[<span class="d">0</span>][<span class="d">2</span>].toFixed(<span class="d">4</span>), <b>this</b>.m[<span class="d">1</span>][<span class="d">2</span>].toFixed(<span class="d">4</span>)];
-</code><code id="L1766"><span class="ln">1766</span>    };
-</code><code id="L1767"><span class="ln">1767</span>
-</code><code id="L1768"><span class="ln">1768</span>    R.Matrix<span class="s"> = </span>Matrix;
-</code><code id="L1769"><span class="ln">1769</span>
-</code><code id="L1770"><span class="ln">1770</span>    <span class="c">// SVG</span>
-</code><code id="L1771"><span class="ln">1771</span>    <b>if</b> (R.svg) {
-</code><code id="L1772"><span class="ln">1772</span>        <b>var</b> xlink<span class="s"> = </span><i>"http:<span class="c">//www.w3.org/<span class="d">1999</span>/xlink"</i>,</span>
-</code><code id="L1773"><span class="ln">1773</span>            markers<span class="s"> = </span>{
-</code><code id="L1774"><span class="ln">1774</span>                block: <i>"M5,<span class="d">0</span> <span class="d">0</span>,<span class="d">2.5</span> <span class="d">5</span>,5z"</i>,
-</code><code id="L1775"><span class="ln">1775</span>                classic: <i>"M5,<span class="d">0</span> <span class="d">0</span>,<span class="d">2.5</span> <span class="d">5</span>,<span class="d">5</span> <span class="d">3.5</span>,<span class="d">3</span> <span class="d">3.5</span>,2z"</i>,
-</code><code id="L1776"><span class="ln">1776</span>                diamond: <i>"M2<span class="d">.5</span>,<span class="d">0</span> <span class="d">5</span>,<span class="d">2.5</span> <span class="d">2.5</span>,<span class="d">5</span> <span class="d">0</span>,<span class="d">2</span>.5z"</i>,
-</code><code id="L1777"><span class="ln">1777</span>                open: <i>"M6,<span class="d">1</span> <span class="d">1</span>,<span class="d">3.5</span> <span class="d">6</span>,<span class="d">6</span>"</i>,
-</code><code id="L1778"><span class="ln">1778</span>                oval: <i>"M2<span class="d">.5</span>,0A2<span class="d">.5</span>,<span class="d">2.5</span>,<span class="d">0</span>,<span class="d">0</span>,<span class="d">1</span>,<span class="d">2.5</span>,<span class="d">5</span> <span class="d">2.5</span>,<span class="d">2.5</span>,<span class="d">0</span>,<span class="d">0</span>,<span class="d">1</span>,<span class="d">2.5</span>,0z"</i>
-</code><code id="L1779"><span class="ln">1779</span>            },
-</code><code id="L1780"><span class="ln">1780</span>            markerCounter<span class="s"> = </span>{};
-</code><code id="L1781"><span class="ln">1781</span>        R.toString<span class="s"> = </span><b>function</b> () {
-</code><code id="L1782"><span class="ln">1782</span>            <b>return</b>  <i>"Your browser supports SVG.\nYou are running Rapha\xebl "</i><span class="s"> + </span><b>this</b>.version;
-</code><code id="L1783"><span class="ln">1783</span>        };
-</code><code id="L1784"><span class="ln">1784</span>        <b>var</b> $<span class="s"> = </span><b>function</b> (el, attr) {
-</code><code id="L1785"><span class="ln">1785</span>            <b>if</b> (attr) {
-</code><code id="L1786"><span class="ln">1786</span>                <b>if</b> (<b>typeof</b> el<span class="s"> == </span><i>"string"</i>) {
-</code><code id="L1787"><span class="ln">1787</span>                    el<span class="s"> = </span>$(el);
-</code><code id="L1788"><span class="ln">1788</span>                }
-</code><code id="L1789"><span class="ln">1789</span>                <b>for</b> (<b>var</b> key <b>in</b> attr) <b>if</b> (attr[has](key)) {
-</code><code id="L1790"><span class="ln">1790</span>                    <b>if</b> (key.substring(<span class="d">0</span>, <span class="d">6</span>)<span class="s"> == </span><i>"xlink:"</i>) {
-</code><code id="L1791"><span class="ln">1791</span>                        el.setAttributeNS(xlink, key.substring(<span class="d">6</span>), Str(attr[key]));
-</code><code id="L1792"><span class="ln">1792</span>                    } <b>else</b> {
-</code><code id="L1793"><span class="ln">1793</span>                        el[setAttribute](key, Str(attr[key]));
-</code><code id="L1794"><span class="ln">1794</span>                    }
-</code><code id="L1795"><span class="ln">1795</span>                }
-</code><code id="L1796"><span class="ln">1796</span>            } <b>else</b> {
-</code><code id="L1797"><span class="ln">1797</span>                el<span class="s"> = </span>g.doc.createElementNS(<i>"http:<span class="c">//www.w3.org/<span class="d">2000</span>/svg"</i>, el);</span>
-</code><code id="L1798"><span class="ln">1798</span>                el.style<span class="s"> &amp;&amp; </span>(el.style.webkitTapHighlightColor<span class="s"> = </span><i>"rgba(<span class="d">0</span>,<span class="d">0</span>,<span class="d">0</span>,<span class="d">0</span>)"</i>);
-</code><code id="L1799"><span class="ln">1799</span>            }
-</code><code id="L1800"><span class="ln">1800</span>            <b>return</b> el;
-</code><code id="L1801"><span class="ln">1801</span>        },
-</code><code id="L1802"><span class="ln">1802</span>        thePath<span class="s"> = </span><b>function</b> (pathString, SVG) {
-</code><code id="L1803"><span class="ln">1803</span>            <b>var</b> el<span class="s"> = </span>$(<i>"path"</i>);
-</code><code id="L1804"><span class="ln">1804</span>            SVG.canvas<span class="s"> &amp;&amp; </span>SVG.canvas.appendChild(el);
-</code><code id="L1805"><span class="ln">1805</span>            <b>var</b> p<span class="s"> = </span><b>new</b> Element(el, SVG);
-</code><code id="L1806"><span class="ln">1806</span>            p.type<span class="s"> = </span><i>"path"</i>;
-</code><code id="L1807"><span class="ln">1807</span>            setFillAndStroke(p, {fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>, path: pathString});
-</code><code id="L1808"><span class="ln">1808</span>            <b>return</b> p;
-</code><code id="L1809"><span class="ln">1809</span>        },
-</code><code id="L1810"><span class="ln">1810</span>        gradients<span class="s"> = </span>{},
-</code><code id="L1811"><span class="ln">1811</span>        rgGrad<span class="s"> = </span>/^url\(#(.*)\)$/,
-</code><code id="L1812"><span class="ln">1812</span>        removeGradientFill<span class="s"> = </span><b>function</b> (node, paper) {
-</code><code id="L1813"><span class="ln">1813</span>            <b>var</b> oid<span class="s"> = </span>node.getAttribute(fillString);
-</code><code id="L1814"><span class="ln">1814</span>            oid<span class="s"> = </span>oid<span class="s"> &amp;&amp; </span>oid.match(rgGrad);
-</code><code id="L1815"><span class="ln">1815</span>            <b>if</b> (oid<span class="s"> &amp;&amp; </span>!--gradients[oid[<span class="d">1</span>]]) {
-</code><code id="L1816"><span class="ln">1816</span>                <b>delete</b> gradients[oid[<span class="d">1</span>]];
-</code><code id="L1817"><span class="ln">1817</span>                paper.defs.removeChild(g.doc.getElementById(oid[<span class="d">1</span>]));
-</code><code id="L1818"><span class="ln">1818</span>            }
-</code><code id="L1819"><span class="ln">1819</span>        },
-</code><code id="L1820"><span class="ln">1820</span>        addGradientFill<span class="s"> = </span><b>function</b> (element, gradient) {
-</code><code id="L1821"><span class="ln">1821</span>            <b>var</b> type<span class="s"> = </span><i>"linear"</i>,
-</code><code id="L1822"><span class="ln">1822</span>                id<span class="s"> = </span>element.id<span class="s"> + </span>gradient,
-</code><code id="L1823"><span class="ln">1823</span>                fx<span class="s"> = </span><span class="d">.5</span>, fy<span class="s"> = </span><span class="d">.5</span>,
-</code><code id="L1824"><span class="ln">1824</span>                o<span class="s"> = </span>element.node,
-</code><code id="L1825"><span class="ln">1825</span>                SVG<span class="s"> = </span>element.paper,
-</code><code id="L1826"><span class="ln">1826</span>                s<span class="s"> = </span>o.style,
-</code><code id="L1827"><span class="ln">1827</span>                el<span class="s"> = </span>g.doc.getElementById(id);
-</code><code id="L1828"><span class="ln">1828</span>            <b>if</b> (!el) {
-</code><code id="L1829"><span class="ln">1829</span>                gradient<span class="s"> = </span>Str(gradient).replace(radial_gradient, <b>function</b> (all, _fx, _fy) {
-</code><code id="L1830"><span class="ln">1830</span>                    type<span class="s"> = </span><i>"radial"</i>;
-</code><code id="L1831"><span class="ln">1831</span>                    <b>if</b> (_fx<span class="s"> &amp;&amp; </span>_fy) {
-</code><code id="L1832"><span class="ln">1832</span>                        fx<span class="s"> = </span>toFloat(_fx);
-</code><code id="L1833"><span class="ln">1833</span>                        fy<span class="s"> = </span>toFloat(_fy);
-</code><code id="L1834"><span class="ln">1834</span>                        <b>var</b> dir<span class="s"> = </span>((fy > <span class="d">.5</span>)<span class="s"> * </span><span class="d">2</span><span class="s"> - </span><span class="d">1</span>);
-</code><code id="L1835"><span class="ln">1835</span>                        pow(fx<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>)<span class="s"> + </span>pow(fy<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>) > <span class="d">.25</span> &amp;&amp;
-</code><code id="L1836"><span class="ln">1836</span>                            (fy<span class="s"> = </span>math.sqrt(<span class="d">.25</span><span class="s"> - </span>pow(fx<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>))<span class="s"> * </span>dir<span class="s"> + </span><span class="d">.5</span>) &amp;&amp;
-</code><code id="L1837"><span class="ln">1837</span>                            fy != <span class="d">.5</span> &amp;&amp;
-</code><code id="L1838"><span class="ln">1838</span>                            (fy<span class="s"> = </span>fy.toFixed(<span class="d">5</span>)<span class="s"> - </span><span class="d">1e-5</span><span class="s"> * </span>dir);
-</code><code id="L1839"><span class="ln">1839</span>                    }
-</code><code id="L1840"><span class="ln">1840</span>                    <b>return</b> E;
-</code><code id="L1841"><span class="ln">1841</span>                });
-</code><code id="L1842"><span class="ln">1842</span>                gradient<span class="s"> = </span>gradient.split(/\s*\-\s*/);
-</code><code id="L1843"><span class="ln">1843</span>                <b>if</b> (type<span class="s"> == </span><i>"linear"</i>) {
-</code><code id="L1844"><span class="ln">1844</span>                    <b>var</b> angle<span class="s"> = </span>gradient.shift();
-</code><code id="L1845"><span class="ln">1845</span>                    angle<span class="s"> = </span>-toFloat(angle);
-</code><code id="L1846"><span class="ln">1846</span>                    <b>if</b> (isNaN(angle)) {
-</code><code id="L1847"><span class="ln">1847</span>                        <b>return</b> <b>null</b>;
-</code><code id="L1848"><span class="ln">1848</span>                    }
-</code><code id="L1849"><span class="ln">1849</span>                    <b>var</b> vector<span class="s"> = </span>[<span class="d">0</span>, <span class="d">0</span>, math.cos(R.rad(angle)), math.sin(R.rad(angle))],
-</code><code id="L1850"><span class="ln">1850</span>                        max<span class="s"> = </span><span class="d">1</span><span class="s"> / </span>(mmax(abs(vector[<span class="d">2</span>]), abs(vector[<span class="d">3</span>]))<span class="s"> || </span><span class="d">1</span>);
-</code><code id="L1851"><span class="ln">1851</span>                    vector[<span class="d">2</span>] *= max;
-</code><code id="L1852"><span class="ln">1852</span>                    vector[<span class="d">3</span>] *= max;
-</code><code id="L1853"><span class="ln">1853</span>                    <b>if</b> (vector[<span class="d">2</span>] &lt; <span class="d">0</span>) {
-</code><code id="L1854"><span class="ln">1854</span>                        vector[<span class="d">0</span>]<span class="s"> = </span>-vector[<span class="d">2</span>];
-</code><code id="L1855"><span class="ln">1855</span>                        vector[<span class="d">2</span>]<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L1856"><span class="ln">1856</span>                    }
-</code><code id="L1857"><span class="ln">1857</span>                    <b>if</b> (vector[<span class="d">3</span>] &lt; <span class="d">0</span>) {
-</code><code id="L1858"><span class="ln">1858</span>                        vector[<span class="d">1</span>]<span class="s"> = </span>-vector[<span class="d">3</span>];
-</code><code id="L1859"><span class="ln">1859</span>                        vector[<span class="d">3</span>]<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L1860"><span class="ln">1860</span>                    }
-</code><code id="L1861"><span class="ln">1861</span>                }
-</code><code id="L1862"><span class="ln">1862</span>                <b>var</b> dots<span class="s"> = </span>parseDots(gradient);
-</code><code id="L1863"><span class="ln">1863</span>                <b>if</b> (!dots) {
-</code><code id="L1864"><span class="ln">1864</span>                    <b>return</b> <b>null</b>;
-</code><code id="L1865"><span class="ln">1865</span>                }
-</code><code id="L1866"><span class="ln">1866</span>                <b>if</b> (element.gradient) {
-</code><code id="L1867"><span class="ln">1867</span>                    SVG.defs.removeChild(element.gradient);
-</code><code id="L1868"><span class="ln">1868</span>                    <b>delete</b> element.gradient;
-</code><code id="L1869"><span class="ln">1869</span>                }
-</code><code id="L1870"><span class="ln">1870</span>
-</code><code id="L1871"><span class="ln">1871</span>                el<span class="s"> = </span>$(type<span class="s"> + </span><i>"Gradient"</i>, {id: id});
-</code><code id="L1872"><span class="ln">1872</span>                element.gradient<span class="s"> = </span>el;
-</code><code id="L1873"><span class="ln">1873</span>                $(el, type<span class="s"> == </span><i>"radial"</i> ? {
-</code><code id="L1874"><span class="ln">1874</span>                    fx: fx,
-</code><code id="L1875"><span class="ln">1875</span>                    fy: fy
-</code><code id="L1876"><span class="ln">1876</span>                } : {
-</code><code id="L1877"><span class="ln">1877</span>                    x1: vector[<span class="d">0</span>],
-</code><code id="L1878"><span class="ln">1878</span>                    y1: vector[<span class="d">1</span>],
-</code><code id="L1879"><span class="ln">1879</span>                    x2: vector[<span class="d">2</span>],
-</code><code id="L1880"><span class="ln">1880</span>                    y2: vector[<span class="d">3</span>],
-</code><code id="L1881"><span class="ln">1881</span>                    gradientTransform: element.matrix.invert()
-</code><code id="L1882"><span class="ln">1882</span>                });
-</code><code id="L1883"><span class="ln">1883</span>                SVG.defs.appendChild(el);
-</code><code id="L1884"><span class="ln">1884</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>dots.length; i &lt; ii; i++) {
-</code><code id="L1885"><span class="ln">1885</span>                    el.appendChild($(<i>"stop"</i>, {
-</code><code id="L1886"><span class="ln">1886</span>                        offset: dots[i].offset ? dots[i].offset : i ? <i>"<span class="d">100</span>%"</i> : <i>"<span class="d">0</span>%"</i>,
-</code><code id="L1887"><span class="ln">1887</span>                        <i>"stop-color"</i>: dots[i].color<span class="s"> || </span><i>"#fff"</i>
-</code><code id="L1888"><span class="ln">1888</span>                    }));
-</code><code id="L1889"><span class="ln">1889</span>                }
-</code><code id="L1890"><span class="ln">1890</span>            }
-</code><code id="L1891"><span class="ln">1891</span>            $(o, {
-</code><code id="L1892"><span class="ln">1892</span>                fill: <i>"url(#"</i><span class="s"> + </span>id<span class="s"> + </span><i>")"</i>,
-</code><code id="L1893"><span class="ln">1893</span>                opacity: <span class="d">1</span>,
-</code><code id="L1894"><span class="ln">1894</span>                <i>"fill-opacity"</i>: <span class="d">1</span>
-</code><code id="L1895"><span class="ln">1895</span>            });
-</code><code id="L1896"><span class="ln">1896</span>            s.fill<span class="s"> = </span>E;
-</code><code id="L1897"><span class="ln">1897</span>            s.opacity<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L1898"><span class="ln">1898</span>            s.fillOpacity<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L1899"><span class="ln">1899</span>            <b>return</b> <span class="d">1</span>;
-</code><code id="L1900"><span class="ln">1900</span>        },
-</code><code id="L1901"><span class="ln">1901</span>        updatePosition<span class="s"> = </span><b>function</b> (o) {
-</code><code id="L1902"><span class="ln">1902</span>            <b>var</b> bbox<span class="s"> = </span>o.getBBox(<span class="d">1</span>);
-</code><code id="L1903"><span class="ln">1903</span>            $(o.pattern, {patternTransform: o.matrix.invert()<span class="s"> + </span><i>" translate("</i><span class="s"> + </span>bbox.x<span class="s"> + </span><i>","</i><span class="s"> + </span>bbox.y<span class="s"> + </span><i>")"</i>});
-</code><code id="L1904"><span class="ln">1904</span>        },
-</code><code id="L1905"><span class="ln">1905</span>        addArrow<span class="s"> = </span><b>function</b> (o, value, isEnd) {
-</code><code id="L1906"><span class="ln">1906</span>            <b>if</b> (o.type<span class="s"> == </span><i>"path"</i>) {
-</code><code id="L1907"><span class="ln">1907</span>                <b>var</b> values<span class="s"> = </span>Str(value).toLowerCase().split(<i>"-"</i>),
-</code><code id="L1908"><span class="ln">1908</span>                    p<span class="s"> = </span>o.paper,
-</code><code id="L1909"><span class="ln">1909</span>                    se<span class="s"> = </span>isEnd ? <i>"end"</i> : <i>"start"</i>,
-</code><code id="L1910"><span class="ln">1910</span>                    node<span class="s"> = </span>o.node,
-</code><code id="L1911"><span class="ln">1911</span>                    attrs<span class="s"> = </span>o.attrs,
-</code><code id="L1912"><span class="ln">1912</span>                    stroke<span class="s"> = </span>attrs[<i>"stroke-width"</i>],
-</code><code id="L1913"><span class="ln">1913</span>                    i<span class="s"> = </span>values.length,
-</code><code id="L1914"><span class="ln">1914</span>                    type<span class="s"> = </span><i>"classic"</i>,
-</code><code id="L1915"><span class="ln">1915</span>                    from,
-</code><code id="L1916"><span class="ln">1916</span>                    to,
-</code><code id="L1917"><span class="ln">1917</span>                    dx,
-</code><code id="L1918"><span class="ln">1918</span>                    refX,
-</code><code id="L1919"><span class="ln">1919</span>                    attr,
-</code><code id="L1920"><span class="ln">1920</span>                    w<span class="s"> = </span><span class="d">3</span>,
-</code><code id="L1921"><span class="ln">1921</span>                    h<span class="s"> = </span><span class="d">3</span>,
-</code><code id="L1922"><span class="ln">1922</span>                    t<span class="s"> = </span><span class="d">5</span>;
-</code><code id="L1923"><span class="ln">1923</span>                <b>while</b> (i--) {
-</code><code id="L1924"><span class="ln">1924</span>                    <b>switch</b> (values[i]) {
-</code><code id="L1925"><span class="ln">1925</span>                        <b>case</b> <i>"block"</i>:
-</code><code id="L1926"><span class="ln">1926</span>                        <b>case</b> <i>"classic"</i>:
-</code><code id="L1927"><span class="ln">1927</span>                        <b>case</b> <i>"oval"</i>:
-</code><code id="L1928"><span class="ln">1928</span>                        <b>case</b> <i>"diamond"</i>:
-</code><code id="L1929"><span class="ln">1929</span>                        <b>case</b> <i>"open"</i>:
-</code><code id="L1930"><span class="ln">1930</span>                        <b>case</b> <i>"none"</i>:
-</code><code id="L1931"><span class="ln">1931</span>                            type<span class="s"> = </span>values[i];
-</code><code id="L1932"><span class="ln">1932</span>                            <b>break</b>;
-</code><code id="L1933"><span class="ln">1933</span>                        <b>case</b> <i>"wide"</i>: h<span class="s"> = </span><span class="d">5</span>; <b>break</b>;
-</code><code id="L1934"><span class="ln">1934</span>                        <b>case</b> <i>"narrow"</i>: h<span class="s"> = </span><span class="d">2</span>; <b>break</b>;
-</code><code id="L1935"><span class="ln">1935</span>                        <b>case</b> <i>"<b>long</b>"</i>: w<span class="s"> = </span><span class="d">5</span>; <b>break</b>;
-</code><code id="L1936"><span class="ln">1936</span>                        <b>case</b> <i>"<b>short</b>"</i>: w<span class="s"> = </span><span class="d">2</span>; <b>break</b>;
-</code><code id="L1937"><span class="ln">1937</span>                    }
-</code><code id="L1938"><span class="ln">1938</span>                }
-</code><code id="L1939"><span class="ln">1939</span>                <b>if</b> (type<span class="s"> == </span><i>"open"</i>) {
-</code><code id="L1940"><span class="ln">1940</span>                    w += <span class="d">2</span>;
-</code><code id="L1941"><span class="ln">1941</span>                    h += <span class="d">2</span>;
-</code><code id="L1942"><span class="ln">1942</span>                    t += <span class="d">2</span>;
-</code><code id="L1943"><span class="ln">1943</span>                    dx<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L1944"><span class="ln">1944</span>                    refX<span class="s"> = </span>isEnd ? <span class="d">4</span> : <span class="d">1</span>;
-</code><code id="L1945"><span class="ln">1945</span>                    attr<span class="s"> = </span>{
-</code><code id="L1946"><span class="ln">1946</span>                        fill: <i>"none"</i>,
-</code><code id="L1947"><span class="ln">1947</span>                        stroke: attrs.stroke
-</code><code id="L1948"><span class="ln">1948</span>                    };
-</code><code id="L1949"><span class="ln">1949</span>                } <b>else</b> {
-</code><code id="L1950"><span class="ln">1950</span>                    refX<span class="s"> = </span>dx<span class="s"> = </span>w<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L1951"><span class="ln">1951</span>                    attr<span class="s"> = </span>{
-</code><code id="L1952"><span class="ln">1952</span>                        fill: attrs.stroke,
-</code><code id="L1953"><span class="ln">1953</span>                        stroke: <i>"none"</i>
-</code><code id="L1954"><span class="ln">1954</span>                    };
-</code><code id="L1955"><span class="ln">1955</span>                }
-</code><code id="L1956"><span class="ln">1956</span>                <b>if</b> (o._.arrows) {
-</code><code id="L1957"><span class="ln">1957</span>                    <b>if</b> (isEnd) {
-</code><code id="L1958"><span class="ln">1958</span>                        o._.arrows.endPath<span class="s"> &amp;&amp; </span>markerCounter[o._.arrows.endPath]--;
-</code><code id="L1959"><span class="ln">1959</span>                        o._.arrows.endMarker<span class="s"> &amp;&amp; </span>markerCounter[o._.arrows.endMarker]--;
-</code><code id="L1960"><span class="ln">1960</span>                    } <b>else</b> {
-</code><code id="L1961"><span class="ln">1961</span>                        o._.arrows.startPath<span class="s"> &amp;&amp; </span>markerCounter[o._.arrows.startPath]--;
-</code><code id="L1962"><span class="ln">1962</span>                        o._.arrows.startMarker<span class="s"> &amp;&amp; </span>markerCounter[o._.arrows.startMarker]--;
-</code><code id="L1963"><span class="ln">1963</span>                    }
-</code><code id="L1964"><span class="ln">1964</span>                } <b>else</b> {
-</code><code id="L1965"><span class="ln">1965</span>                    o._.arrows<span class="s"> = </span>{};
-</code><code id="L1966"><span class="ln">1966</span>                }
-</code><code id="L1967"><span class="ln">1967</span>                <b>if</b> (type != <i>"none"</i>) {
-</code><code id="L1968"><span class="ln">1968</span>                    <b>var</b> pathId<span class="s"> = </span><i>"raphael-marker-"</i><span class="s"> + </span>type,
-</code><code id="L1969"><span class="ln">1969</span>                        markerId<span class="s"> = </span><i>"raphael-marker-"</i><span class="s"> + </span>se<span class="s"> + </span>type<span class="s"> + </span>w<span class="s"> + </span>h;
-</code><code id="L1970"><span class="ln">1970</span>                    <b>if</b> (!g.doc.getElementById(pathId)) {
-</code><code id="L1971"><span class="ln">1971</span>                        p.defs.appendChild($($(<i>"path"</i>), {
-</code><code id="L1972"><span class="ln">1972</span>                            <i>"stroke-linecap"</i>: <i>"round"</i>,
-</code><code id="L1973"><span class="ln">1973</span>                            d: markers[type],
-</code><code id="L1974"><span class="ln">1974</span>                            id: pathId
-</code><code id="L1975"><span class="ln">1975</span>                        }));
-</code><code id="L1976"><span class="ln">1976</span>                        markerCounter[pathId]<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L1977"><span class="ln">1977</span>                    } <b>else</b> {
-</code><code id="L1978"><span class="ln">1978</span>                        markerCounter[pathId]++;
-</code><code id="L1979"><span class="ln">1979</span>                    }
-</code><code id="L1980"><span class="ln">1980</span>                    <b>var</b> marker<span class="s"> = </span>g.doc.getElementById(markerId),
-</code><code id="L1981"><span class="ln">1981</span>                        use;
-</code><code id="L1982"><span class="ln">1982</span>                    <b>if</b> (!marker) {
-</code><code id="L1983"><span class="ln">1983</span>                        marker<span class="s"> = </span>$($(<i>"marker"</i>), {
-</code><code id="L1984"><span class="ln">1984</span>                            id: markerId,
-</code><code id="L1985"><span class="ln">1985</span>                            markerHeight: h,
-</code><code id="L1986"><span class="ln">1986</span>                            markerWidth: w,
-</code><code id="L1987"><span class="ln">1987</span>                            orient: <i>"auto"</i>,
-</code><code id="L1988"><span class="ln">1988</span>                            refX: refX,
-</code><code id="L1989"><span class="ln">1989</span>                            refY: h<span class="s"> / </span><span class="d">2</span>
-</code><code id="L1990"><span class="ln">1990</span>                        });
-</code><code id="L1991"><span class="ln">1991</span>                        use<span class="s"> = </span>$($(<i>"use"</i>), {
-</code><code id="L1992"><span class="ln">1992</span>                            <i>"xlink:href"</i>: <i>"#"</i><span class="s"> + </span>pathId,
-</code><code id="L1993"><span class="ln">1993</span>                            transform: (isEnd ? <i>" rotate(<span class="d">180</span> "</i><span class="s"> + </span>w<span class="s"> / </span><span class="d">2</span><span class="s"> + </span><i>" "</i><span class="s"> + </span>h<span class="s"> / </span><span class="d">2</span><span class="s"> + </span><i>") "</i> : S)<span class="s"> + </span><i>"scale("</i><span class="s"> + </span>w<span class="s"> / </span>t<span class="s"> + </span><i>","</i><span class="s"> + </span>h<span class="s"> / </span>t<span class="s"> + </span><i>")"</i>,
-</code><code id="L1994"><span class="ln">1994</span>                            <i>"stroke-width"</i>: <span class="d">1</span><span class="s"> / </span>((w<span class="s"> / </span>t<span class="s"> + </span>h<span class="s"> / </span>t)<span class="s"> / </span><span class="d">2</span>)
-</code><code id="L1995"><span class="ln">1995</span>                        });
-</code><code id="L1996"><span class="ln">1996</span>                        marker.appendChild(use);
-</code><code id="L1997"><span class="ln">1997</span>                        p.defs.appendChild(marker);
-</code><code id="L1998"><span class="ln">1998</span>                        markerCounter[markerId]<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L1999"><span class="ln">1999</span>                    } <b>else</b> {
-</code><code id="L2000"><span class="ln">2000</span>                        markerCounter[markerId]++;
-</code><code id="L2001"><span class="ln">2001</span>                        use<span class="s"> = </span>marker.getElementsByTagName(<i>"use"</i>)[<span class="d">0</span>];
-</code><code id="L2002"><span class="ln">2002</span>                    }
-</code><code id="L2003"><span class="ln">2003</span>                    $(use, attr);
-</code><code id="L2004"><span class="ln">2004</span>                    <b>var</b> delta<span class="s"> = </span>dx<span class="s"> * </span>(type != <i>"diamond"</i><span class="s"> &amp;&amp; </span>type != <i>"oval"</i>);
-</code><code id="L2005"><span class="ln">2005</span>                    <b>if</b> (isEnd) {
-</code><code id="L2006"><span class="ln">2006</span>                        from<span class="s"> = </span>o._.arrows.startdx<span class="s"> * </span>stroke<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L2007"><span class="ln">2007</span>                        to<span class="s"> = </span>R.getTotalLength(attrs.path)<span class="s"> - </span>delta<span class="s"> * </span>stroke;
-</code><code id="L2008"><span class="ln">2008</span>                    } <b>else</b> {
-</code><code id="L2009"><span class="ln">2009</span>                        from<span class="s"> = </span>delta<span class="s"> * </span>stroke;
-</code><code id="L2010"><span class="ln">2010</span>                        to<span class="s"> = </span>R.getTotalLength(attrs.path)<span class="s"> - </span>(o._.arrows.enddx<span class="s"> * </span>stroke<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L2011"><span class="ln">2011</span>                    }
-</code><code id="L2012"><span class="ln">2012</span>                    attr<span class="s"> = </span>{};
-</code><code id="L2013"><span class="ln">2013</span>                    attr[<i>"marker-"</i><span class="s"> + </span>se]<span class="s"> = </span><i>"url(#"</i><span class="s"> + </span>markerId<span class="s"> + </span><i>")"</i>;
-</code><code id="L2014"><span class="ln">2014</span>                    <b>if</b> (to<span class="s"> || </span>from) {
-</code><code id="L2015"><span class="ln">2015</span>                        attr.d<span class="s"> = </span>Raphael.getSubpath(attrs.path, from, to);
-</code><code id="L2016"><span class="ln">2016</span>                    }
-</code><code id="L2017"><span class="ln">2017</span>                    $(node, attr);
-</code><code id="L2018"><span class="ln">2018</span>                    o._.arrows[se<span class="s"> + </span><i>"Path"</i>]<span class="s"> = </span>pathId;
-</code><code id="L2019"><span class="ln">2019</span>                    o._.arrows[se<span class="s"> + </span><i>"Marker"</i>]<span class="s"> = </span>markerId;
-</code><code id="L2020"><span class="ln">2020</span>                    o._.arrows[se<span class="s"> + </span><i>"dx"</i>]<span class="s"> = </span>delta;
-</code><code id="L2021"><span class="ln">2021</span>                    o._.arrows[se<span class="s"> + </span><i>"Type"</i>]<span class="s"> = </span>type;
-</code><code id="L2022"><span class="ln">2022</span>                    o._.arrows[se<span class="s"> + </span><i>"String"</i>]<span class="s"> = </span>value;
-</code><code id="L2023"><span class="ln">2023</span>                } <b>else</b> {
-</code><code id="L2024"><span class="ln">2024</span>                    <b>if</b> (isEnd) {
-</code><code id="L2025"><span class="ln">2025</span>                        from<span class="s"> = </span>o._.arrows.startdx<span class="s"> * </span>stroke<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L2026"><span class="ln">2026</span>                        to<span class="s"> = </span>R.getTotalLength(attrs.path)<span class="s"> - </span>from;
-</code><code id="L2027"><span class="ln">2027</span>                    } <b>else</b> {
-</code><code id="L2028"><span class="ln">2028</span>                        from<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L2029"><span class="ln">2029</span>                        to<span class="s"> = </span>R.getTotalLength(attrs.path)<span class="s"> - </span>(o._.arrows.enddx<span class="s"> * </span>stroke<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L2030"><span class="ln">2030</span>                    }
-</code><code id="L2031"><span class="ln">2031</span>                    o._.arrows[se<span class="s"> + </span><i>"Path"</i>]<span class="s"> &amp;&amp; </span>$(node, {d: Raphael.getSubpath(attrs.path, from, to)});
-</code><code id="L2032"><span class="ln">2032</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"Path"</i>];
-</code><code id="L2033"><span class="ln">2033</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"Marker"</i>];
-</code><code id="L2034"><span class="ln">2034</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"dx"</i>];
-</code><code id="L2035"><span class="ln">2035</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"Type"</i>];
-</code><code id="L2036"><span class="ln">2036</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"String"</i>];
-</code><code id="L2037"><span class="ln">2037</span>                }
-</code><code id="L2038"><span class="ln">2038</span>                <b>for</b> (attr <b>in</b> markerCounter) <b>if</b> (markerCounter[has](attr)<span class="s"> &amp;&amp; </span>!markerCounter[attr]) {
-</code><code id="L2039"><span class="ln">2039</span>                    <b>var</b> item<span class="s"> = </span>g.doc.getElementById(attr);
-</code><code id="L2040"><span class="ln">2040</span>                    item<span class="s"> &amp;&amp; </span>item.parentNode.removeChild(item);
-</code><code id="L2041"><span class="ln">2041</span>                }
-</code><code id="L2042"><span class="ln">2042</span>            }
-</code><code id="L2043"><span class="ln">2043</span>        },
-</code><code id="L2044"><span class="ln">2044</span>        setFillAndStroke<span class="s"> = </span><b>function</b> (o, params) {
-</code><code id="L2045"><span class="ln">2045</span>            <b>var</b> dasharray<span class="s"> = </span>{
-</code><code id="L2046"><span class="ln">2046</span>                    <i>""</i>: [<span class="d">0</span>],
-</code><code id="L2047"><span class="ln">2047</span>                    <i>"none"</i>: [<span class="d">0</span>],
-</code><code id="L2048"><span class="ln">2048</span>                    <i>"-"</i>: [<span class="d">3</span>, <span class="d">1</span>],
-</code><code id="L2049"><span class="ln">2049</span>                    <i>"."</i>: [<span class="d">1</span>, <span class="d">1</span>],
-</code><code id="L2050"><span class="ln">2050</span>                    <i>"-."</i>: [<span class="d">3</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">1</span>],
-</code><code id="L2051"><span class="ln">2051</span>                    <i>"-.."</i>: [<span class="d">3</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">1</span>],
-</code><code id="L2052"><span class="ln">2052</span>                    <i>". "</i>: [<span class="d">1</span>, <span class="d">3</span>],
-</code><code id="L2053"><span class="ln">2053</span>                    <i>"- "</i>: [<span class="d">4</span>, <span class="d">3</span>],
-</code><code id="L2054"><span class="ln">2054</span>                    <i>"--"</i>: [<span class="d">8</span>, <span class="d">3</span>],
-</code><code id="L2055"><span class="ln">2055</span>                    <i>"- ."</i>: [<span class="d">4</span>, <span class="d">3</span>, <span class="d">1</span>, <span class="d">3</span>],
-</code><code id="L2056"><span class="ln">2056</span>                    <i>"--."</i>: [<span class="d">8</span>, <span class="d">3</span>, <span class="d">1</span>, <span class="d">3</span>],
-</code><code id="L2057"><span class="ln">2057</span>                    <i>"--.."</i>: [<span class="d">8</span>, <span class="d">3</span>, <span class="d">1</span>, <span class="d">3</span>, <span class="d">1</span>, <span class="d">3</span>]
-</code><code id="L2058"><span class="ln">2058</span>                },
-</code><code id="L2059"><span class="ln">2059</span>                node<span class="s"> = </span>o.node,
-</code><code id="L2060"><span class="ln">2060</span>                attrs<span class="s"> = </span>o.attrs,
-</code><code id="L2061"><span class="ln">2061</span>                addDashes<span class="s"> = </span><b>function</b> (o, value) {
-</code><code id="L2062"><span class="ln">2062</span>                    value<span class="s"> = </span>dasharray[lowerCase.call(value)];
-</code><code id="L2063"><span class="ln">2063</span>                    <b>if</b> (value) {
-</code><code id="L2064"><span class="ln">2064</span>                        <b>var</b> width<span class="s"> = </span>o.attrs[<i>"stroke-width"</i>]<span class="s"> || </span><i>"<span class="d">1</span>"</i>,
-</code><code id="L2065"><span class="ln">2065</span>                            butt<span class="s"> = </span>{round: width, square: width, butt: <span class="d">0</span>}[o.attrs[<i>"stroke-linecap"</i>]<span class="s"> || </span>params[<i>"stroke-linecap"</i>]]<span class="s"> || </span><span class="d">0</span>,
-</code><code id="L2066"><span class="ln">2066</span>                            dashes<span class="s"> = </span>[],
-</code><code id="L2067"><span class="ln">2067</span>                            i<span class="s"> = </span>value.length;
-</code><code id="L2068"><span class="ln">2068</span>                        <b>while</b> (i--) {
-</code><code id="L2069"><span class="ln">2069</span>                            dashes[i]<span class="s"> = </span>value[i]<span class="s"> * </span>width<span class="s"> + </span>((i<span class="s"> % </span><span class="d">2</span>) ? <span class="d">1</span> : -<span class="d">1</span>)<span class="s"> * </span>butt;
-</code><code id="L2070"><span class="ln">2070</span>                        }
-</code><code id="L2071"><span class="ln">2071</span>                        $(node, {<i>"stroke-dasharray"</i>: dashes.join(<i>","</i>)});
-</code><code id="L2072"><span class="ln">2072</span>                    }
-</code><code id="L2073"><span class="ln">2073</span>                };
-</code><code id="L2074"><span class="ln">2074</span>            <b>for</b> (<b>var</b> att <b>in</b> params) {
-</code><code id="L2075"><span class="ln">2075</span>                <b>if</b> (params[has](att)) {
-</code><code id="L2076"><span class="ln">2076</span>                    <b>if</b> (!availableAttrs[has](att)) {
-</code><code id="L2077"><span class="ln">2077</span>                        <b>continue</b>;
-</code><code id="L2078"><span class="ln">2078</span>                    }
-</code><code id="L2079"><span class="ln">2079</span>                    <b>var</b> value<span class="s"> = </span>params[att];
-</code><code id="L2080"><span class="ln">2080</span>                    attrs[att]<span class="s"> = </span>value;
-</code><code id="L2081"><span class="ln">2081</span>                    <b>switch</b> (att) {
-</code><code id="L2082"><span class="ln">2082</span>                        <b>case</b> <i>"blur"</i>:
-</code><code id="L2083"><span class="ln">2083</span>                            o.blur(value);
-</code><code id="L2084"><span class="ln">2084</span>                            <b>break</b>;
-</code><code id="L2085"><span class="ln">2085</span>                        <b>case</b> <i>"href"</i>:
-</code><code id="L2086"><span class="ln">2086</span>                        <b>case</b> <i>"title"</i>:
-</code><code id="L2087"><span class="ln">2087</span>                        <b>case</b> <i>"target"</i>:
-</code><code id="L2088"><span class="ln">2088</span>                            <b>var</b> pn<span class="s"> = </span>node.parentNode;
-</code><code id="L2089"><span class="ln">2089</span>                            <b>if</b> (lowerCase.call(pn.tagName) != <i>"a"</i>) {
-</code><code id="L2090"><span class="ln">2090</span>                                <b>var</b> hl<span class="s"> = </span>$(<i>"a"</i>);
-</code><code id="L2091"><span class="ln">2091</span>                                pn.insertBefore(hl, node);
-</code><code id="L2092"><span class="ln">2092</span>                                hl.appendChild(node);
-</code><code id="L2093"><span class="ln">2093</span>                                pn<span class="s"> = </span>hl;
-</code><code id="L2094"><span class="ln">2094</span>                            }
-</code><code id="L2095"><span class="ln">2095</span>                            <b>if</b> (att<span class="s"> == </span><i>"target"</i><span class="s"> &amp;&amp; </span>value<span class="s"> == </span><i>"blank"</i>) {
-</code><code id="L2096"><span class="ln">2096</span>                                pn.setAttributeNS(xlink, <i>"show"</i>, <i>"<b>new</b>"</i>);
-</code><code id="L2097"><span class="ln">2097</span>                            } <b>else</b> {
-</code><code id="L2098"><span class="ln">2098</span>                                pn.setAttributeNS(xlink, att, value);
-</code><code id="L2099"><span class="ln">2099</span>                            }
-</code><code id="L2100"><span class="ln">2100</span>                            <b>break</b>;
-</code><code id="L2101"><span class="ln">2101</span>                        <b>case</b> <i>"cursor"</i>:
-</code><code id="L2102"><span class="ln">2102</span>                            node.style.cursor<span class="s"> = </span>value;
-</code><code id="L2103"><span class="ln">2103</span>                            <b>break</b>;
-</code><code id="L2104"><span class="ln">2104</span>                        <b>case</b> <i>"transform"</i>:
-</code><code id="L2105"><span class="ln">2105</span>                            o.transform(value);
-</code><code id="L2106"><span class="ln">2106</span>                            <b>break</b>;
-</code><code id="L2107"><span class="ln">2107</span>                        <b>case</b> <i>"arrow-start"</i>:
-</code><code id="L2108"><span class="ln">2108</span>                            addArrow(o, value);
-</code><code id="L2109"><span class="ln">2109</span>                            <b>break</b>;
-</code><code id="L2110"><span class="ln">2110</span>                        <b>case</b> <i>"arrow-end"</i>:
-</code><code id="L2111"><span class="ln">2111</span>                            addArrow(o, value, <span class="d">1</span>);
-</code><code id="L2112"><span class="ln">2112</span>                            <b>break</b>;
-</code><code id="L2113"><span class="ln">2113</span>                        <b>case</b> <i>"clip-rect"</i>:
-</code><code id="L2114"><span class="ln">2114</span>                            <b>var</b> rect<span class="s"> = </span>Str(value).split(separator);
-</code><code id="L2115"><span class="ln">2115</span>                            <b>if</b> (rect.length<span class="s"> == </span><span class="d">4</span>) {
-</code><code id="L2116"><span class="ln">2116</span>                                o.clip<span class="s"> &amp;&amp; </span>o.clip.parentNode.parentNode.removeChild(o.clip.parentNode);
-</code><code id="L2117"><span class="ln">2117</span>                                <b>var</b> el<span class="s"> = </span>$(<i>"clipPath"</i>),
-</code><code id="L2118"><span class="ln">2118</span>                                    rc<span class="s"> = </span>$(<i>"rect"</i>);
-</code><code id="L2119"><span class="ln">2119</span>                                el.id<span class="s"> = </span>createUUID();
-</code><code id="L2120"><span class="ln">2120</span>                                $(rc, {
-</code><code id="L2121"><span class="ln">2121</span>                                    x: rect[<span class="d">0</span>],
-</code><code id="L2122"><span class="ln">2122</span>                                    y: rect[<span class="d">1</span>],
-</code><code id="L2123"><span class="ln">2123</span>                                    width: rect[<span class="d">2</span>],
-</code><code id="L2124"><span class="ln">2124</span>                                    height: rect[<span class="d">3</span>]
-</code><code id="L2125"><span class="ln">2125</span>                                });
-</code><code id="L2126"><span class="ln">2126</span>                                el.appendChild(rc);
-</code><code id="L2127"><span class="ln">2127</span>                                o.paper.defs.appendChild(el);
-</code><code id="L2128"><span class="ln">2128</span>                                $(node, {<i>"clip-path"</i>: <i>"url(#"</i><span class="s"> + </span>el.id<span class="s"> + </span><i>")"</i>});
-</code><code id="L2129"><span class="ln">2129</span>                                o.clip<span class="s"> = </span>rc;
-</code><code id="L2130"><span class="ln">2130</span>                            }
-</code><code id="L2131"><span class="ln">2131</span>                            <b>if</b> (!value) {
-</code><code id="L2132"><span class="ln">2132</span>                                <b>var</b> clip<span class="s"> = </span>g.doc.getElementById(node.getAttribute(<i>"clip-path"</i>).replace(/(^url\(#|\)$)/g, E));
-</code><code id="L2133"><span class="ln">2133</span>                                clip<span class="s"> &amp;&amp; </span>clip.parentNode.removeChild(clip);
-</code><code id="L2134"><span class="ln">2134</span>                                $(node, {<i>"clip-path"</i>: E});
-</code><code id="L2135"><span class="ln">2135</span>                                <b>delete</b> o.clip;
-</code><code id="L2136"><span class="ln">2136</span>                            }
-</code><code id="L2137"><span class="ln">2137</span>                        <b>break</b>;
-</code><code id="L2138"><span class="ln">2138</span>                        <b>case</b> <i>"path"</i>:
-</code><code id="L2139"><span class="ln">2139</span>                            <b>if</b> (o.type<span class="s"> == </span><i>"path"</i>) {
-</code><code id="L2140"><span class="ln">2140</span>                                $(node, {d: value ? attrs.path<span class="s"> = </span>pathToAbsolute(value) : <i>"M0,<span class="d">0</span>"</i>});
-</code><code id="L2141"><span class="ln">2141</span>                                o._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2142"><span class="ln">2142</span>                                <b>if</b> (o._.arrows) {
-</code><code id="L2143"><span class="ln">2143</span>                                    <i>"startString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.startString);
-</code><code id="L2144"><span class="ln">2144</span>                                    <i>"endString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.endString, <span class="d">1</span>);
-</code><code id="L2145"><span class="ln">2145</span>                                }
-</code><code id="L2146"><span class="ln">2146</span>                            }
-</code><code id="L2147"><span class="ln">2147</span>                            <b>break</b>;
-</code><code id="L2148"><span class="ln">2148</span>                        <b>case</b> <i>"width"</i>:
-</code><code id="L2149"><span class="ln">2149</span>                            node[setAttribute](att, value);
-</code><code id="L2150"><span class="ln">2150</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2151"><span class="ln">2151</span>                            <b>if</b> (attrs.fx) {
-</code><code id="L2152"><span class="ln">2152</span>                                att<span class="s"> = </span><i>"x"</i>;
-</code><code id="L2153"><span class="ln">2153</span>                                value<span class="s"> = </span>attrs.x;
-</code><code id="L2154"><span class="ln">2154</span>                            } <b>else</b> {
-</code><code id="L2155"><span class="ln">2155</span>                                <b>break</b>;
-</code><code id="L2156"><span class="ln">2156</span>                            }
-</code><code id="L2157"><span class="ln">2157</span>                        <b>case</b> <i>"x"</i>:
-</code><code id="L2158"><span class="ln">2158</span>                            <b>if</b> (attrs.fx) {
-</code><code id="L2159"><span class="ln">2159</span>                                value<span class="s"> = </span>-attrs.x<span class="s"> - </span>(attrs.width<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L2160"><span class="ln">2160</span>                            }
-</code><code id="L2161"><span class="ln">2161</span>                        <b>case</b> <i>"rx"</i>:
-</code><code id="L2162"><span class="ln">2162</span>                            <b>if</b> (att<span class="s"> == </span><i>"rx"</i><span class="s"> &amp;&amp; </span>o.type<span class="s"> == </span><i>"rect"</i>) {
-</code><code id="L2163"><span class="ln">2163</span>                                <b>break</b>;
-</code><code id="L2164"><span class="ln">2164</span>                            }
-</code><code id="L2165"><span class="ln">2165</span>                        <b>case</b> <i>"cx"</i>:
-</code><code id="L2166"><span class="ln">2166</span>                            node[setAttribute](att, value);
-</code><code id="L2167"><span class="ln">2167</span>                            o.pattern<span class="s"> &amp;&amp; </span>updatePosition(o);
-</code><code id="L2168"><span class="ln">2168</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2169"><span class="ln">2169</span>                            <b>break</b>;
-</code><code id="L2170"><span class="ln">2170</span>                        <b>case</b> <i>"height"</i>:
-</code><code id="L2171"><span class="ln">2171</span>                            node[setAttribute](att, value);
-</code><code id="L2172"><span class="ln">2172</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2173"><span class="ln">2173</span>                            <b>if</b> (attrs.fy) {
-</code><code id="L2174"><span class="ln">2174</span>                                att<span class="s"> = </span><i>"y"</i>;
-</code><code id="L2175"><span class="ln">2175</span>                                value<span class="s"> = </span>attrs.y;
-</code><code id="L2176"><span class="ln">2176</span>                            } <b>else</b> {
-</code><code id="L2177"><span class="ln">2177</span>                                <b>break</b>;
-</code><code id="L2178"><span class="ln">2178</span>                            }
-</code><code id="L2179"><span class="ln">2179</span>                        <b>case</b> <i>"y"</i>:
-</code><code id="L2180"><span class="ln">2180</span>                            <b>if</b> (attrs.fy) {
-</code><code id="L2181"><span class="ln">2181</span>                                value<span class="s"> = </span>-attrs.y<span class="s"> - </span>(attrs.height<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L2182"><span class="ln">2182</span>                            }
-</code><code id="L2183"><span class="ln">2183</span>                        <b>case</b> <i>"ry"</i>:
-</code><code id="L2184"><span class="ln">2184</span>                            <b>if</b> (att<span class="s"> == </span><i>"ry"</i><span class="s"> &amp;&amp; </span>o.type<span class="s"> == </span><i>"rect"</i>) {
-</code><code id="L2185"><span class="ln">2185</span>                                <b>break</b>;
-</code><code id="L2186"><span class="ln">2186</span>                            }
-</code><code id="L2187"><span class="ln">2187</span>                        <b>case</b> <i>"cy"</i>:
-</code><code id="L2188"><span class="ln">2188</span>                            node[setAttribute](att, value);
-</code><code id="L2189"><span class="ln">2189</span>                            o.pattern<span class="s"> &amp;&amp; </span>updatePosition(o);
-</code><code id="L2190"><span class="ln">2190</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2191"><span class="ln">2191</span>                            <b>break</b>;
-</code><code id="L2192"><span class="ln">2192</span>                        <b>case</b> <i>"r"</i>:
-</code><code id="L2193"><span class="ln">2193</span>                            <b>if</b> (o.type<span class="s"> == </span><i>"rect"</i>) {
-</code><code id="L2194"><span class="ln">2194</span>                                $(node, {rx: value, ry: value});
-</code><code id="L2195"><span class="ln">2195</span>                            } <b>else</b> {
-</code><code id="L2196"><span class="ln">2196</span>                                node[setAttribute](att, value);
-</code><code id="L2197"><span class="ln">2197</span>                            }
-</code><code id="L2198"><span class="ln">2198</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2199"><span class="ln">2199</span>                            <b>break</b>;
-</code><code id="L2200"><span class="ln">2200</span>                        <b>case</b> <i>"src"</i>:
-</code><code id="L2201"><span class="ln">2201</span>                            <b>if</b> (o.type<span class="s"> == </span><i>"image"</i>) {
-</code><code id="L2202"><span class="ln">2202</span>                                node.setAttributeNS(xlink, <i>"href"</i>, value);
-</code><code id="L2203"><span class="ln">2203</span>                            }
-</code><code id="L2204"><span class="ln">2204</span>                            <b>break</b>;
-</code><code id="L2205"><span class="ln">2205</span>                        <b>case</b> <i>"stroke-width"</i>:
-</code><code id="L2206"><span class="ln">2206</span>                            <b>if</b> (o._.sx != <span class="d">1</span><span class="s"> || </span>o._.sy != <span class="d">1</span>) {
-</code><code id="L2207"><span class="ln">2207</span>                                value /= mmax(abs(o._.sx), abs(o._.sy))<span class="s"> || </span><span class="d">1</span>;
-</code><code id="L2208"><span class="ln">2208</span>                            }
-</code><code id="L2209"><span class="ln">2209</span>                            <b>if</b> (o.paper._vbSize) {
-</code><code id="L2210"><span class="ln">2210</span>                                value *= o.paper._vbSize;
-</code><code id="L2211"><span class="ln">2211</span>                            }
-</code><code id="L2212"><span class="ln">2212</span>                            node[setAttribute](att, value);
-</code><code id="L2213"><span class="ln">2213</span>                            <b>if</b> (attrs[<i>"stroke-dasharray"</i>]) {
-</code><code id="L2214"><span class="ln">2214</span>                                addDashes(o, attrs[<i>"stroke-dasharray"</i>]);
-</code><code id="L2215"><span class="ln">2215</span>                            }
-</code><code id="L2216"><span class="ln">2216</span>                            <b>if</b> (o._.arrows) {
-</code><code id="L2217"><span class="ln">2217</span>                                <i>"startString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.startString);
-</code><code id="L2218"><span class="ln">2218</span>                                <i>"endString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.endString, <span class="d">1</span>);
-</code><code id="L2219"><span class="ln">2219</span>                            }
-</code><code id="L2220"><span class="ln">2220</span>                            <b>break</b>;
-</code><code id="L2221"><span class="ln">2221</span>                        <b>case</b> <i>"stroke-dasharray"</i>:
-</code><code id="L2222"><span class="ln">2222</span>                            addDashes(o, value);
-</code><code id="L2223"><span class="ln">2223</span>                            <b>break</b>;
-</code><code id="L2224"><span class="ln">2224</span>                        <b>case</b> fillString:
-</code><code id="L2225"><span class="ln">2225</span>                            <b>var</b> isURL<span class="s"> = </span>Str(value).match(ISURL);
-</code><code id="L2226"><span class="ln">2226</span>                            <b>if</b> (isURL) {
-</code><code id="L2227"><span class="ln">2227</span>                                el<span class="s"> = </span>$(<i>"pattern"</i>);
-</code><code id="L2228"><span class="ln">2228</span>                                <b>var</b> ig<span class="s"> = </span>$(<i>"image"</i>);
-</code><code id="L2229"><span class="ln">2229</span>                                el.id<span class="s"> = </span>createUUID();
-</code><code id="L2230"><span class="ln">2230</span>                                $(el, {x: <span class="d">0</span>, y: <span class="d">0</span>, patternUnits: <i>"userSpaceOnUse"</i>, height: <span class="d">1</span>, width: <span class="d">1</span>});
-</code><code id="L2231"><span class="ln">2231</span>                                $(ig, {x: <span class="d">0</span>, y: <span class="d">0</span>, <i>"xlink:href"</i>: isURL[<span class="d">1</span>]});
-</code><code id="L2232"><span class="ln">2232</span>                                el.appendChild(ig);
-</code><code id="L2233"><span class="ln">2233</span>
-</code><code id="L2234"><span class="ln">2234</span>                                (<b>function</b> (el) {
-</code><code id="L2235"><span class="ln">2235</span>                                    preload(isURL[<span class="d">1</span>], <b>function</b> () {
-</code><code id="L2236"><span class="ln">2236</span>                                        <b>var</b> w<span class="s"> = </span><b>this</b>.offsetWidth,
-</code><code id="L2237"><span class="ln">2237</span>                                            h<span class="s"> = </span><b>this</b>.offsetHeight;
-</code><code id="L2238"><span class="ln">2238</span>                                        $(el, {width: w, height: h});
-</code><code id="L2239"><span class="ln">2239</span>                                        $(ig, {width: w, height: h});
-</code><code id="L2240"><span class="ln">2240</span>                                        o.paper.safari();
-</code><code id="L2241"><span class="ln">2241</span>                                    });
-</code><code id="L2242"><span class="ln">2242</span>                                })(el);
-</code><code id="L2243"><span class="ln">2243</span>                                o.paper.defs.appendChild(el);
-</code><code id="L2244"><span class="ln">2244</span>                                node.style.fill<span class="s"> = </span><i>"url(#"</i><span class="s"> + </span>el.id<span class="s"> + </span><i>")"</i>;
-</code><code id="L2245"><span class="ln">2245</span>                                $(node, {fill: <i>"url(#"</i><span class="s"> + </span>el.id<span class="s"> + </span><i>")"</i>});
-</code><code id="L2246"><span class="ln">2246</span>                                o.pattern<span class="s"> = </span>el;
-</code><code id="L2247"><span class="ln">2247</span>                                o.pattern<span class="s"> &amp;&amp; </span>updatePosition(o);
-</code><code id="L2248"><span class="ln">2248</span>                                <b>break</b>;
-</code><code id="L2249"><span class="ln">2249</span>                            }
-</code><code id="L2250"><span class="ln">2250</span>                            <b>var</b> clr<span class="s"> = </span>R.getRGB(value);
-</code><code id="L2251"><span class="ln">2251</span>                            <b>if</b> (!clr.error) {
-</code><code id="L2252"><span class="ln">2252</span>                                <b>delete</b> params.gradient;
-</code><code id="L2253"><span class="ln">2253</span>                                <b>delete</b> attrs.gradient;
-</code><code id="L2254"><span class="ln">2254</span>                                !R.is(attrs.opacity, <i>"<b>undefined</b>"</i>) &amp;&amp;
-</code><code id="L2255"><span class="ln">2255</span>                                    R.is(params.opacity, <i>"<b>undefined</b>"</i>) &amp;&amp;
-</code><code id="L2256"><span class="ln">2256</span>                                    $(node, {opacity: attrs.opacity});
-</code><code id="L2257"><span class="ln">2257</span>                                !R.is(attrs[<i>"fill-opacity"</i>], <i>"<b>undefined</b>"</i>) &amp;&amp;
-</code><code id="L2258"><span class="ln">2258</span>                                    R.is(params[<i>"fill-opacity"</i>], <i>"<b>undefined</b>"</i>) &amp;&amp;
-</code><code id="L2259"><span class="ln">2259</span>                                    $(node, {<i>"fill-opacity"</i>: attrs[<i>"fill-opacity"</i>]});
-</code><code id="L2260"><span class="ln">2260</span>                            } <b>else</b> <b>if</b> ((o.type<span class="s"> == </span><i>"circle"</i><span class="s"> || </span>o.type<span class="s"> == </span><i>"ellipse"</i><span class="s"> || </span>Str(value).charAt() != <i>"r"</i>)<span class="s"> &amp;&amp; </span>addGradientFill(o, value)) {
-</code><code id="L2261"><span class="ln">2261</span>                                <b>if</b> (<i>"opacity"</i> <b>in</b> attrs<span class="s"> || </span><i>"fill-opacity"</i> <b>in</b> attrs) {
-</code><code id="L2262"><span class="ln">2262</span>                                    <b>var</b> gradient<span class="s"> = </span>g.doc.getElementById(node.getAttribute(fillString).replace(/^url\(#|\)$/g, E));
-</code><code id="L2263"><span class="ln">2263</span>                                    <b>if</b> (gradient) {
-</code><code id="L2264"><span class="ln">2264</span>                                        <b>var</b> stops<span class="s"> = </span>gradient.getElementsByTagName(<i>"stop"</i>);
-</code><code id="L2265"><span class="ln">2265</span>                                        $(stops[stops.length<span class="s"> - </span><span class="d">1</span>], {<i>"stop-opacity"</i>: (<i>"opacity"</i> <b>in</b> attrs ? attrs.opacity : <span class="d">1</span>)<span class="s"> * </span>(<i>"fill-opacity"</i> <b>in</b> attrs ? attrs[<i>"fill-opacity"</i>] : <span class="d">1</span>)});
-</code><code id="L2266"><span class="ln">2266</span>                                    }
-</code><code id="L2267"><span class="ln">2267</span>                                }
-</code><code id="L2268"><span class="ln">2268</span>                                attrs.gradient<span class="s"> = </span>value;
-</code><code id="L2269"><span class="ln">2269</span>                                attrs.fill<span class="s"> = </span><i>"none"</i>;
-</code><code id="L2270"><span class="ln">2270</span>                                <b>break</b>;
-</code><code id="L2271"><span class="ln">2271</span>                            }
-</code><code id="L2272"><span class="ln">2272</span>                            clr[has](<i>"opacity"</i>)<span class="s"> &amp;&amp; </span>$(node, {<i>"fill-opacity"</i>: clr.opacity > <span class="d">1</span> ? clr.opacity<span class="s"> / </span><span class="d">100</span> : clr.opacity});
-</code><code id="L2273"><span class="ln">2273</span>                        <b>case</b> <i>"stroke"</i>:
-</code><code id="L2274"><span class="ln">2274</span>                            clr<span class="s"> = </span>R.getRGB(value);
-</code><code id="L2275"><span class="ln">2275</span>                            node[setAttribute](att, clr.hex);
-</code><code id="L2276"><span class="ln">2276</span>                            att<span class="s"> == </span><i>"stroke"</i><span class="s"> &amp;&amp; </span>clr[has](<i>"opacity"</i>)<span class="s"> &amp;&amp; </span>$(node, {<i>"stroke-opacity"</i>: clr.opacity > <span class="d">1</span> ? clr.opacity<span class="s"> / </span><span class="d">100</span> : clr.opacity});
-</code><code id="L2277"><span class="ln">2277</span>                            <b>if</b> (att<span class="s"> == </span><i>"stroke"</i><span class="s"> &amp;&amp; </span>o._.arrows) {
-</code><code id="L2278"><span class="ln">2278</span>                                <i>"startString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.startString);
-</code><code id="L2279"><span class="ln">2279</span>                                <i>"endString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.endString, <span class="d">1</span>);
-</code><code id="L2280"><span class="ln">2280</span>                            }
-</code><code id="L2281"><span class="ln">2281</span>                            <b>break</b>;
-</code><code id="L2282"><span class="ln">2282</span>                        <b>case</b> <i>"gradient"</i>:
-</code><code id="L2283"><span class="ln">2283</span>                            (o.type<span class="s"> == </span><i>"circle"</i><span class="s"> || </span>o.type<span class="s"> == </span><i>"ellipse"</i><span class="s"> || </span>Str(value).charAt() != <i>"r"</i>)<span class="s"> &amp;&amp; </span>addGradientFill(o, value);
-</code><code id="L2284"><span class="ln">2284</span>                            <b>break</b>;
-</code><code id="L2285"><span class="ln">2285</span>                        <b>case</b> <i>"opacity"</i>:
-</code><code id="L2286"><span class="ln">2286</span>                            <b>if</b> (attrs.gradient<span class="s"> &amp;&amp; </span>!attrs[has](<i>"stroke-opacity"</i>)) {
-</code><code id="L2287"><span class="ln">2287</span>                                $(node, {<i>"stroke-opacity"</i>: value > <span class="d">1</span> ? value<span class="s"> / </span><span class="d">100</span> : value});
-</code><code id="L2288"><span class="ln">2288</span>                            }
-</code><code id="L2289"><span class="ln">2289</span>                            <span class="c">// fall</span>
-</code><code id="L2290"><span class="ln">2290</span>                        <b>case</b> <i>"fill-opacity"</i>:
-</code><code id="L2291"><span class="ln">2291</span>                            <b>if</b> (attrs.gradient) {
-</code><code id="L2292"><span class="ln">2292</span>                                gradient<span class="s"> = </span>g.doc.getElementById(node.getAttribute(fillString).replace(/^url\(#|\)$/g, E));
-</code><code id="L2293"><span class="ln">2293</span>                                <b>if</b> (gradient) {
-</code><code id="L2294"><span class="ln">2294</span>                                    stops<span class="s"> = </span>gradient.getElementsByTagName(<i>"stop"</i>);
-</code><code id="L2295"><span class="ln">2295</span>                                    $(stops[stops.length<span class="s"> - </span><span class="d">1</span>], {<i>"stop-opacity"</i>: value});
-</code><code id="L2296"><span class="ln">2296</span>                                }
-</code><code id="L2297"><span class="ln">2297</span>                                <b>break</b>;
-</code><code id="L2298"><span class="ln">2298</span>                            }
-</code><code id="L2299"><span class="ln">2299</span>                        <b>default</b>:
-</code><code id="L2300"><span class="ln">2300</span>                            att<span class="s"> == </span><i>"font-size"</i><span class="s"> &amp;&amp; </span>(value<span class="s"> = </span>toInt(value, <span class="d">10</span>)<span class="s"> + </span><i>"px"</i>);
-</code><code id="L2301"><span class="ln">2301</span>                            <b>var</b> cssrule<span class="s"> = </span>att.replace(/(\-.)/g, <b>function</b> (w) {
-</code><code id="L2302"><span class="ln">2302</span>                                <b>return</b> upperCase.call(w.substring(<span class="d">1</span>));
-</code><code id="L2303"><span class="ln">2303</span>                            });
-</code><code id="L2304"><span class="ln">2304</span>                            node.style[cssrule]<span class="s"> = </span>value;
-</code><code id="L2305"><span class="ln">2305</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2306"><span class="ln">2306</span>                            node[setAttribute](att, value);
-</code><code id="L2307"><span class="ln">2307</span>                            <b>break</b>;
-</code><code id="L2308"><span class="ln">2308</span>                    }
-</code><code id="L2309"><span class="ln">2309</span>                }
-</code><code id="L2310"><span class="ln">2310</span>            }
-</code><code id="L2311"><span class="ln">2311</span>
-</code><code id="L2312"><span class="ln">2312</span>            tuneText(o, params);
-</code><code id="L2313"><span class="ln">2313</span>        },
-</code><code id="L2314"><span class="ln">2314</span>        leading<span class="s"> = </span><span class="d">1.2</span>,
-</code><code id="L2315"><span class="ln">2315</span>        tuneText<span class="s"> = </span><b>function</b> (el, params) {
-</code><code id="L2316"><span class="ln">2316</span>            <b>if</b> (el.type != <i>"text"</i><span class="s"> || </span>!(params[has](<i>"text"</i>)<span class="s"> || </span>params[has](<i>"font"</i>)<span class="s"> || </span>params[has](<i>"font-size"</i>)<span class="s"> || </span>params[has](<i>"x"</i>)<span class="s"> || </span>params[has](<i>"y"</i>))) {
-</code><code id="L2317"><span class="ln">2317</span>                <b>return</b>;
-</code><code id="L2318"><span class="ln">2318</span>            }
-</code><code id="L2319"><span class="ln">2319</span>            <b>var</b> a<span class="s"> = </span>el.attrs,
-</code><code id="L2320"><span class="ln">2320</span>                node<span class="s"> = </span>el.node,
-</code><code id="L2321"><span class="ln">2321</span>                fontSize<span class="s"> = </span>node.firstChild ? toInt(g.doc.defaultView.getComputedStyle(node.firstChild, E).getPropertyValue(<i>"font-size"</i>), <span class="d">10</span>) : <span class="d">10</span>;
-</code><code id="L2322"><span class="ln">2322</span> 
-</code><code id="L2323"><span class="ln">2323</span>            <b>if</b> (params[has](<i>"text"</i>)) {
-</code><code id="L2324"><span class="ln">2324</span>                a.text<span class="s"> = </span>params.text;
-</code><code id="L2325"><span class="ln">2325</span>                <b>while</b> (node.firstChild) {
-</code><code id="L2326"><span class="ln">2326</span>                    node.removeChild(node.firstChild);
-</code><code id="L2327"><span class="ln">2327</span>                }
-</code><code id="L2328"><span class="ln">2328</span>                <b>var</b> texts<span class="s"> = </span>Str(params.text).split(<i>"\n"</i>),
-</code><code id="L2329"><span class="ln">2329</span>                    tspans<span class="s"> = </span>[],
-</code><code id="L2330"><span class="ln">2330</span>                    tspan;
-</code><code id="L2331"><span class="ln">2331</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>texts.length; i &lt; ii; i++) <b>if</b> (texts[i]) {
-</code><code id="L2332"><span class="ln">2332</span>                    tspan<span class="s"> = </span>$(<i>"tspan"</i>);
-</code><code id="L2333"><span class="ln">2333</span>                    i<span class="s"> &amp;&amp; </span>$(tspan, {dy: fontSize<span class="s"> * </span>leading, x: a.x});
-</code><code id="L2334"><span class="ln">2334</span>                    tspan.appendChild(g.doc.createTextNode(texts[i]));
-</code><code id="L2335"><span class="ln">2335</span>                    node.appendChild(tspan);
-</code><code id="L2336"><span class="ln">2336</span>                    tspans[i]<span class="s"> = </span>tspan;
-</code><code id="L2337"><span class="ln">2337</span>                }
-</code><code id="L2338"><span class="ln">2338</span>            } <b>else</b> {
-</code><code id="L2339"><span class="ln">2339</span>                tspans<span class="s"> = </span>node.getElementsByTagName(<i>"tspan"</i>);
-</code><code id="L2340"><span class="ln">2340</span>                <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>tspans.length; i &lt; ii; i++) {
-</code><code id="L2341"><span class="ln">2341</span>                    i<span class="s"> &amp;&amp; </span>$(tspans[i], {dy: fontSize<span class="s"> * </span>leading, x: a.x});
-</code><code id="L2342"><span class="ln">2342</span>                }
-</code><code id="L2343"><span class="ln">2343</span>            }
-</code><code id="L2344"><span class="ln">2344</span>            $(node, {y: a.y});
-</code><code id="L2345"><span class="ln">2345</span>            el._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2346"><span class="ln">2346</span>            <b>var</b> bb<span class="s"> = </span>el._getBBox(),
-</code><code id="L2347"><span class="ln">2347</span>                dif<span class="s"> = </span>a.y<span class="s"> - </span>(bb.y<span class="s"> + </span>bb.height<span class="s"> / </span><span class="d">2</span>);
-</code><code id="L2348"><span class="ln">2348</span>            dif<span class="s"> &amp;&amp; </span>R.is(dif, <i>"finite"</i>)<span class="s"> &amp;&amp; </span>$(tspans[<span class="d">0</span>], {dy: a.y<span class="s"> + </span>dif});
-</code><code id="L2349"><span class="ln">2349</span>        },
-</code><code id="L2350"><span class="ln">2350</span>        Element<span class="s"> = </span><b>function</b> (node, svg) {
-</code><code id="L2351"><span class="ln">2351</span>            <b>var</b> X<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L2352"><span class="ln">2352</span>                Y<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L2353"><span class="ln">2353</span><span class="c">            <span class="c">/*\</span>
-</span></code><code id="L2354"><span class="ln">2354</span><span class="c">            <span class="s"> * </span>Element.node
-</span></code><code id="L2355"><span class="ln">2355</span><span class="c">             [ property (object) ]
-</span></code><code id="L2356"><span class="ln">2356</span><span class="c">             **
-</span></code><code id="L2357"><span class="ln">2357</span><span class="c">            <span class="s"> * </span>Gives you a reference to the DOM object, so you can assign event handlers or just mess around.
-</span></code><code id="L2358"><span class="ln">2358</span><span class="c">             > Usage
-</span></code><code id="L2359"><span class="ln">2359</span><span class="c">            <span class="s"> | </span><span class="c">// draw a circle at coordinate <span class="d">10</span>,<span class="d">10</span> <b>with</b> radius of <span class="d">10</span></span>
-</span></code><code id="L2360"><span class="ln">2360</span><span class="c">            <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.circle(<span class="d">10</span>, <span class="d">10</span>, <span class="d">10</span>);
-</span></code><code id="L2361"><span class="ln">2361</span><span class="c">            <span class="s"> | </span>c.node.onclick<span class="s"> = </span><b>function</b> () {
-</span></code><code id="L2362"><span class="ln">2362</span><span class="c">            <span class="s"> | </span>    c.attr(<i>"fill"</i>, <i>"red"</i>);
-</span></code><code id="L2363"><span class="ln">2363</span><span class="c">            <span class="s"> | </span>};
-</span></code><code id="L2364"><span class="ln">2364</span><span class="c">            \*/</span>
-</code><code id="L2365"><span class="ln">2365</span>            <b>this</b>[<span class="d">0</span>]<span class="s"> = </span><b>this</b>.node<span class="s"> = </span>node;
-</code><code id="L2366"><span class="ln">2366</span><span class="c">            <span class="c">/*\</span>
-</span></code><code id="L2367"><span class="ln">2367</span><span class="c">            <span class="s"> * </span>Element.raphael
-</span></code><code id="L2368"><span class="ln">2368</span><span class="c">             [ property (object) ]
-</span></code><code id="L2369"><span class="ln">2369</span><span class="c">             **
-</span></code><code id="L2370"><span class="ln">2370</span><span class="c">            <span class="s"> * </span>Internal reference to @Raphael object. In <b>case</b> it is not available.
-</span></code><code id="L2371"><span class="ln">2371</span><span class="c">             > Usage
-</span></code><code id="L2372"><span class="ln">2372</span><span class="c">            <span class="s"> | </span>Raphael.el.red<span class="s"> = </span><b>function</b> () {
-</span></code><code id="L2373"><span class="ln">2373</span><span class="c">            <span class="s"> | </span>    <b>var</b> hsb<span class="s"> = </span><b>this</b>.paper.raphael.rgb2hsb(<b>this</b>.attr(<i>"fill"</i>));
-</span></code><code id="L2374"><span class="ln">2374</span><span class="c">            <span class="s"> | </span>    hsb.h<span class="s"> = </span><span class="d">1</span>;
-</span></code><code id="L2375"><span class="ln">2375</span><span class="c">            <span class="s"> | </span>    <b>this</b>.attr({fill: <b>this</b>.paper.raphael.hsb2rgb(hsb).hex});
-</span></code><code id="L2376"><span class="ln">2376</span><span class="c">            <span class="s"> | </span>}
-</span></code><code id="L2377"><span class="ln">2377</span><span class="c">            \*/</span>
-</code><code id="L2378"><span class="ln">2378</span>            node.raphael<span class="s"> = </span><b>true</b>;
-</code><code id="L2379"><span class="ln">2379</span><span class="c">            <span class="c">/*\</span>
-</span></code><code id="L2380"><span class="ln">2380</span><span class="c">            <span class="s"> * </span>Element.id
-</span></code><code id="L2381"><span class="ln">2381</span><span class="c">             [ property (number) ]
-</span></code><code id="L2382"><span class="ln">2382</span><span class="c">             **
-</span></code><code id="L2383"><span class="ln">2383</span><span class="c">            <span class="s"> * </span>Unique id of the element. Especially usesful when you want to listen to events of the element, 
-</span></code><code id="L2384"><span class="ln">2384</span><span class="c">            <span class="s"> * </span>because all events are fired <b>in</b> format `&lt;module>.&lt;action>.&lt;id>`. Also useful <b>for</b> @Paper.getById method.
-</span></code><code id="L2385"><span class="ln">2385</span><span class="c">            \*/</span>
-</code><code id="L2386"><span class="ln">2386</span>            <b>this</b>.id<span class="s"> = </span>R._oid++;
-</code><code id="L2387"><span class="ln">2387</span>            node.raphaelid<span class="s"> = </span><b>this</b>.id;
-</code><code id="L2388"><span class="ln">2388</span>            <b>this</b>.matrix<span class="s"> = </span><b>new</b> Matrix;
-</code><code id="L2389"><span class="ln">2389</span>            <b>this</b>.realPath<span class="s"> = </span><b>null</b>;
-</code><code id="L2390"><span class="ln">2390</span><span class="c">            <span class="c">/*\</span>
-</span></code><code id="L2391"><span class="ln">2391</span><span class="c">            <span class="s"> * </span>Element.paper
-</span></code><code id="L2392"><span class="ln">2392</span><span class="c">             [ property (object) ]
-</span></code><code id="L2393"><span class="ln">2393</span><span class="c">             **
-</span></code><code id="L2394"><span class="ln">2394</span><span class="c">            <span class="s"> * </span>Internal reference to “paper” where object drawn. Mainly <b>for</b> use <b>in</b> plugins and element extensions.
-</span></code><code id="L2395"><span class="ln">2395</span><span class="c">             > Usage
-</span></code><code id="L2396"><span class="ln">2396</span><span class="c">            <span class="s"> | </span>Raphael.el.cross<span class="s"> = </span><b>function</b> () {
-</span></code><code id="L2397"><span class="ln">2397</span><span class="c">            <span class="s"> | </span>    <b>this</b>.attr({fill: <i>"red"</i>});
-</span></code><code id="L2398"><span class="ln">2398</span><span class="c">            <span class="s"> | </span>    <b>this</b>.paper.path(<i>"M10,10L50,50M50,10L10,<span class="d">50</span>"</i>)
-</span></code><code id="L2399"><span class="ln">2399</span><span class="c">            <span class="s"> | </span>        .attr({stroke: <i>"red"</i>});
-</span></code><code id="L2400"><span class="ln">2400</span><span class="c">            <span class="s"> | </span>}
-</span></code><code id="L2401"><span class="ln">2401</span><span class="c">            \*/</span>
-</code><code id="L2402"><span class="ln">2402</span>            <b>this</b>.paper<span class="s"> = </span>svg;
-</code><code id="L2403"><span class="ln">2403</span>            <b>this</b>.attrs<span class="s"> = </span><b>this</b>.attrs<span class="s"> || </span>{};
-</code><code id="L2404"><span class="ln">2404</span>            <b>this</b>._<span class="s"> = </span>{
-</code><code id="L2405"><span class="ln">2405</span>                transform: [],
-</code><code id="L2406"><span class="ln">2406</span>                sx: <span class="d">1</span>,
-</code><code id="L2407"><span class="ln">2407</span>                sy: <span class="d">1</span>,
-</code><code id="L2408"><span class="ln">2408</span>                deg: <span class="d">0</span>,
-</code><code id="L2409"><span class="ln">2409</span>                dx: <span class="d">0</span>,
-</code><code id="L2410"><span class="ln">2410</span>                dy: <span class="d">0</span>,
-</code><code id="L2411"><span class="ln">2411</span>                dirty: <span class="d">1</span>
-</code><code id="L2412"><span class="ln">2412</span>            };
-</code><code id="L2413"><span class="ln">2413</span>            !svg.bottom<span class="s"> &amp;&amp; </span>(svg.bottom<span class="s"> = </span><b>this</b>);
-</code><code id="L2414"><span class="ln">2414</span><span class="c">            <span class="c">/*\</span>
-</span></code><code id="L2415"><span class="ln">2415</span><span class="c">            <span class="s"> * </span>Element.prev
-</span></code><code id="L2416"><span class="ln">2416</span><span class="c">             [ property (object) ]
-</span></code><code id="L2417"><span class="ln">2417</span><span class="c">             **
-</span></code><code id="L2418"><span class="ln">2418</span><span class="c">            <span class="s"> * </span>Reference to the previous element <b>in</b> the hierarchy.
-</span></code><code id="L2419"><span class="ln">2419</span><span class="c">            \*/</span>
-</code><code id="L2420"><span class="ln">2420</span>            <b>this</b>.prev<span class="s"> = </span>svg.top;
-</code><code id="L2421"><span class="ln">2421</span>            svg.top<span class="s"> &amp;&amp; </span>(svg.top.next<span class="s"> = </span><b>this</b>);
-</code><code id="L2422"><span class="ln">2422</span>            svg.top<span class="s"> = </span><b>this</b>;
-</code><code id="L2423"><span class="ln">2423</span><span class="c">            <span class="c">/*\</span>
-</span></code><code id="L2424"><span class="ln">2424</span><span class="c">            <span class="s"> * </span>Element.next
-</span></code><code id="L2425"><span class="ln">2425</span><span class="c">             [ property (object) ]
-</span></code><code id="L2426"><span class="ln">2426</span><span class="c">             **
-</span></code><code id="L2427"><span class="ln">2427</span><span class="c">            <span class="s"> * </span>Reference to the next element <b>in</b> the hierarchy.
-</span></code><code id="L2428"><span class="ln">2428</span><span class="c">            \*/</span>
-</code><code id="L2429"><span class="ln">2429</span>            <b>this</b>.next<span class="s"> = </span><b>null</b>;
-</code><code id="L2430"><span class="ln">2430</span>        },
-</code><code id="L2431"><span class="ln">2431</span>        elproto<span class="s"> = </span>Element.prototype;
-</code><code id="L2432"><span class="ln">2432</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2433"><span class="ln">2433</span><span class="c">        <span class="s"> * </span>Element.rotate
-</span></code><code id="L2434"><span class="ln">2434</span><span class="c">         [ method ]
-</span></code><code id="L2435"><span class="ln">2435</span><span class="c">         **
-</span></code><code id="L2436"><span class="ln">2436</span><span class="c">        <span class="s"> * </span>Adds rotation by given angle around given point to the list of
-</span></code><code id="L2437"><span class="ln">2437</span><span class="c">        <span class="s"> * </span>transformations of the element.
-</span></code><code id="L2438"><span class="ln">2438</span><span class="c">         > Parameters
-</span></code><code id="L2439"><span class="ln">2439</span><span class="c">        <span class="s"> - </span>deg (number) angle <b>in</b> degrees
-</span></code><code id="L2440"><span class="ln">2440</span><span class="c">        <span class="s"> - </span>cx (number) #optional x coordinate of the centre of rotation
-</span></code><code id="L2441"><span class="ln">2441</span><span class="c">        <span class="s"> - </span>cy (number) #optional y coordinate of the centre of rotation
-</span></code><code id="L2442"><span class="ln">2442</span><span class="c">        <span class="s"> * </span>If cx<span class="s"> &amp; </span>cy aren’t specified centre of the shape is used as a point of rotation.
-</span></code><code id="L2443"><span class="ln">2443</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2444"><span class="ln">2444</span><span class="c">        \*/</span>
-</code><code id="L2445"><span class="ln">2445</span>        elproto.rotate<span class="s"> = </span><b>function</b> (deg, cx, cy) {
-</code><code id="L2446"><span class="ln">2446</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L2447"><span class="ln">2447</span>                <b>return</b> <b>this</b>;
-</code><code id="L2448"><span class="ln">2448</span>            }
-</code><code id="L2449"><span class="ln">2449</span>            deg<span class="s"> = </span>Str(deg).split(separator);
-</code><code id="L2450"><span class="ln">2450</span>            <b>if</b> (deg.length<span class="s"> - </span><span class="d">1</span>) {
-</code><code id="L2451"><span class="ln">2451</span>                cx<span class="s"> = </span>toFloat(deg[<span class="d">1</span>]);
-</code><code id="L2452"><span class="ln">2452</span>                cy<span class="s"> = </span>toFloat(deg[<span class="d">2</span>]);
-</code><code id="L2453"><span class="ln">2453</span>            }
-</code><code id="L2454"><span class="ln">2454</span>            deg<span class="s"> = </span>toFloat(deg[<span class="d">0</span>]);
-</code><code id="L2455"><span class="ln">2455</span>            (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
-</code><code id="L2456"><span class="ln">2456</span>            <b>if</b> (cx<span class="s"> == </span><b>null</b><span class="s"> || </span>cy<span class="s"> == </span><b>null</b>) {
-</code><code id="L2457"><span class="ln">2457</span>                <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
-</code><code id="L2458"><span class="ln">2458</span>                cx<span class="s"> = </span>bbox.x<span class="s"> + </span>bbox.width<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L2459"><span class="ln">2459</span>                cy<span class="s"> = </span>bbox.y<span class="s"> + </span>bbox.height<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L2460"><span class="ln">2460</span>            }
-</code><code id="L2461"><span class="ln">2461</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"r"</i>, deg, cx, cy]]));
-</code><code id="L2462"><span class="ln">2462</span>            <b>return</b> <b>this</b>;
-</code><code id="L2463"><span class="ln">2463</span>        };
-</code><code id="L2464"><span class="ln">2464</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2465"><span class="ln">2465</span><span class="c">        <span class="s"> * </span>Element.scale
-</span></code><code id="L2466"><span class="ln">2466</span><span class="c">         [ method ]
-</span></code><code id="L2467"><span class="ln">2467</span><span class="c">         **
-</span></code><code id="L2468"><span class="ln">2468</span><span class="c">        <span class="s"> * </span>Adds scale by given amount relative to given point to the list of
-</span></code><code id="L2469"><span class="ln">2469</span><span class="c">        <span class="s"> * </span>transformations of the element.
-</span></code><code id="L2470"><span class="ln">2470</span><span class="c">         > Parameters
-</span></code><code id="L2471"><span class="ln">2471</span><span class="c">        <span class="s"> - </span>sx (number) horisontal scale amount
-</span></code><code id="L2472"><span class="ln">2472</span><span class="c">        <span class="s"> - </span>sy (number) vertical scale amount
-</span></code><code id="L2473"><span class="ln">2473</span><span class="c">        <span class="s"> - </span>cx (number) #optional x coordinate of the centre of scale
-</span></code><code id="L2474"><span class="ln">2474</span><span class="c">        <span class="s"> - </span>cy (number) #optional y coordinate of the centre of scale
-</span></code><code id="L2475"><span class="ln">2475</span><span class="c">        <span class="s"> * </span>If cx<span class="s"> &amp; </span>cy aren’t specified centre of the shape is used instead.
-</span></code><code id="L2476"><span class="ln">2476</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2477"><span class="ln">2477</span><span class="c">        \*/</span>
-</code><code id="L2478"><span class="ln">2478</span>        elproto.scale<span class="s"> = </span><b>function</b> (sx, sy, cx, cy) {
-</code><code id="L2479"><span class="ln">2479</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L2480"><span class="ln">2480</span>                <b>return</b> <b>this</b>;
-</code><code id="L2481"><span class="ln">2481</span>            }
-</code><code id="L2482"><span class="ln">2482</span>            sx<span class="s"> = </span>Str(sx).split(separator);
-</code><code id="L2483"><span class="ln">2483</span>            <b>if</b> (sx.length<span class="s"> - </span><span class="d">1</span>) {
-</code><code id="L2484"><span class="ln">2484</span>                sy<span class="s"> = </span>toFloat(sx[<span class="d">1</span>]);
-</code><code id="L2485"><span class="ln">2485</span>                cx<span class="s"> = </span>toFloat(sx[<span class="d">2</span>]);
-</code><code id="L2486"><span class="ln">2486</span>                cy<span class="s"> = </span>toFloat(sx[<span class="d">3</span>]);
-</code><code id="L2487"><span class="ln">2487</span>            }
-</code><code id="L2488"><span class="ln">2488</span>            sx<span class="s"> = </span>toFloat(sx[<span class="d">0</span>]);
-</code><code id="L2489"><span class="ln">2489</span>            (sy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(sy<span class="s"> = </span>sx);
-</code><code id="L2490"><span class="ln">2490</span>            (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
-</code><code id="L2491"><span class="ln">2491</span>            <b>if</b> (cx<span class="s"> == </span><b>null</b><span class="s"> || </span>cy<span class="s"> == </span><b>null</b>) {
-</code><code id="L2492"><span class="ln">2492</span>                <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
-</code><code id="L2493"><span class="ln">2493</span>            }
-</code><code id="L2494"><span class="ln">2494</span>            cx<span class="s"> = </span>cx<span class="s"> == </span><b>null</b> ? bbox.x<span class="s"> + </span>bbox.width<span class="s"> / </span><span class="d">2</span> : cx;
-</code><code id="L2495"><span class="ln">2495</span>            cy<span class="s"> = </span>cy<span class="s"> == </span><b>null</b> ? bbox.y<span class="s"> + </span>bbox.height<span class="s"> / </span><span class="d">2</span> : cy;
-</code><code id="L2496"><span class="ln">2496</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"s"</i>, sx, sy, cx, cy]]));
-</code><code id="L2497"><span class="ln">2497</span>            <b>return</b> <b>this</b>;
-</code><code id="L2498"><span class="ln">2498</span>        };
-</code><code id="L2499"><span class="ln">2499</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2500"><span class="ln">2500</span><span class="c">        <span class="s"> * </span>Element.translate
-</span></code><code id="L2501"><span class="ln">2501</span><span class="c">         [ method ]
-</span></code><code id="L2502"><span class="ln">2502</span><span class="c">         **
-</span></code><code id="L2503"><span class="ln">2503</span><span class="c">        <span class="s"> * </span>Adds translation by given amount to the list of transformations of the element.
-</span></code><code id="L2504"><span class="ln">2504</span><span class="c">         > Parameters
-</span></code><code id="L2505"><span class="ln">2505</span><span class="c">        <span class="s"> - </span>dx (number) horisontal shift
-</span></code><code id="L2506"><span class="ln">2506</span><span class="c">        <span class="s"> - </span>dy (number) vertical shift
-</span></code><code id="L2507"><span class="ln">2507</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2508"><span class="ln">2508</span><span class="c">        \*/</span>
-</code><code id="L2509"><span class="ln">2509</span>        elproto.translate<span class="s"> = </span><b>function</b> (dx, dy) {
-</code><code id="L2510"><span class="ln">2510</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L2511"><span class="ln">2511</span>                <b>return</b> <b>this</b>;
-</code><code id="L2512"><span class="ln">2512</span>            }
-</code><code id="L2513"><span class="ln">2513</span>            dx<span class="s"> = </span>Str(dx).split(separator);
-</code><code id="L2514"><span class="ln">2514</span>            <b>if</b> (dx.length<span class="s"> - </span><span class="d">1</span>) {
-</code><code id="L2515"><span class="ln">2515</span>                dy<span class="s"> = </span>toFloat(dx[<span class="d">1</span>]);
-</code><code id="L2516"><span class="ln">2516</span>            }
-</code><code id="L2517"><span class="ln">2517</span>            dx<span class="s"> = </span>toFloat(dx[<span class="d">0</span>])<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L2518"><span class="ln">2518</span>            dy<span class="s"> = </span>+dy<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L2519"><span class="ln">2519</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"t"</i>, dx, dy]]));
-</code><code id="L2520"><span class="ln">2520</span>            <b>return</b> <b>this</b>;
-</code><code id="L2521"><span class="ln">2521</span>        };
-</code><code id="L2522"><span class="ln">2522</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2523"><span class="ln">2523</span><span class="c">        <span class="s"> * </span>Element.transform
-</span></code><code id="L2524"><span class="ln">2524</span><span class="c">         [ method ]
-</span></code><code id="L2525"><span class="ln">2525</span><span class="c">         **
-</span></code><code id="L2526"><span class="ln">2526</span><span class="c">        <span class="s"> * </span>Adds transformation to the element which is separate to other attributes,
-</span></code><code id="L2527"><span class="ln">2527</span><span class="c">        <span class="s"> * </span>i.e. translation doesn’t change `x` or `y` of the rectange. The format
-</span></code><code id="L2528"><span class="ln">2528</span><span class="c">        <span class="s"> * </span>of transformation string is similar to the path string syntax:
-</span></code><code id="L2529"><span class="ln">2529</span><span class="c">        <span class="s"> | </span><i>"t100,100r30,<span class="d">100</span>,100s2,<span class="d">2</span>,<span class="d">100</span>,100r45s1<span class="d">.5</span>"</i>
-</span></code><code id="L2530"><span class="ln">2530</span><span class="c">        <span class="s"> * </span>Each letter is a command. There are four commands: `t` is <b>for</b> translate, `r` is <b>for</b> rotate, `s` is <b>for</b>
-</span></code><code id="L2531"><span class="ln">2531</span><span class="c">        <span class="s"> * </span>scale and `m` is <b>for</b> matrix.
-</span></code><code id="L2532"><span class="ln">2532</span><span class="c">         *
-</span></code><code id="L2533"><span class="ln">2533</span><span class="c">        <span class="s"> * </span>So, example line could be read like “translate by <span class="d">100</span>, <span class="d">100</span>, rotate <span class="d">30</span>° around <span class="d">100</span>, <span class="d">100</span>, scale twice around <span class="d">100</span>, <span class="d">100</span>
-</span></code><code id="L2534"><span class="ln">2534</span><span class="c">        <span class="s"> * </span>rotate <span class="d">45</span>° around centre and scale <span class="d">1.5</span> times relative to centre”. As you see rotate and scale commands has origin
-</span></code><code id="L2535"><span class="ln">2535</span><span class="c">        <span class="s"> * </span>coordinates as a optional parameters.
-</span></code><code id="L2536"><span class="ln">2536</span><span class="c">        <span class="s"> * </span>Matrix accepts six parameters.
-</span></code><code id="L2537"><span class="ln">2537</span><span class="c">         > Usage
-</span></code><code id="L2538"><span class="ln">2538</span><span class="c">        <span class="s"> | </span><b>var</b> el<span class="s"> = </span>paper.rect(<span class="d">10</span>, <span class="d">20</span>, <span class="d">300</span>, <span class="d">200</span>);
-</span></code><code id="L2539"><span class="ln">2539</span><span class="c">        <span class="s"> | </span><span class="c">// translate <span class="d">100</span>, <span class="d">100</span>, rotate <span class="d">45</span>°, translate -<span class="d">100</span>, <span class="d">0</span></span>
-</span></code><code id="L2540"><span class="ln">2540</span><span class="c">        <span class="s"> | </span>el.transform(<i>"t100,100r45t-<span class="d">100</span>,<span class="d">0</span>"</i>);
-</span></code><code id="L2541"><span class="ln">2541</span><span class="c">        <span class="s"> | </span><span class="c">// <b>if</b> you want you can append or prepend transformations</span>
-</span></code><code id="L2542"><span class="ln">2542</span><span class="c">        <span class="s"> | </span>el.transform(<i>"...t50,<span class="d">50</span>"</i>);
-</span></code><code id="L2543"><span class="ln">2543</span><span class="c">        <span class="s"> | </span>el.transform(<i>"s2..."</i>);
-</span></code><code id="L2544"><span class="ln">2544</span><span class="c">        <span class="s"> | </span><span class="c">// or even wrap</span>
-</span></code><code id="L2545"><span class="ln">2545</span><span class="c">        <span class="s"> | </span>el.transform(<i>"t50,<span class="d">50</span>...t-<span class="d">50</span>-<span class="d">50</span>"</i>);
-</span></code><code id="L2546"><span class="ln">2546</span><span class="c">        <span class="s"> | </span><span class="c">// to reset transformation call method <b>with</b> empty string</span>
-</span></code><code id="L2547"><span class="ln">2547</span><span class="c">        <span class="s"> | </span>el.transform(<i>""</i>);
-</span></code><code id="L2548"><span class="ln">2548</span><span class="c">        <span class="s"> | </span><span class="c">// to get current value call it without parameters</span>
-</span></code><code id="L2549"><span class="ln">2549</span><span class="c">        <span class="s"> | </span>console.log(el.transform());
-</span></code><code id="L2550"><span class="ln">2550</span><span class="c">         > Parameters
-</span></code><code id="L2551"><span class="ln">2551</span><span class="c">        <span class="s"> - </span>tstr (string) #optional transformation string
-</span></code><code id="L2552"><span class="ln">2552</span><span class="c">        <span class="s"> * </span>If tstr isn’t specified
-</span></code><code id="L2553"><span class="ln">2553</span><span class="c">        <span class="s"> = </span>(string) current transformation string
-</span></code><code id="L2554"><span class="ln">2554</span><span class="c">        <span class="s"> * </span><b>else</b>
-</span></code><code id="L2555"><span class="ln">2555</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2556"><span class="ln">2556</span><span class="c">        \*/</span>
-</code><code id="L2557"><span class="ln">2557</span>        elproto.transform<span class="s"> = </span><b>function</b> (tstr) {
-</code><code id="L2558"><span class="ln">2558</span>            <b>var</b> _<span class="s"> = </span><b>this</b>._;
-</code><code id="L2559"><span class="ln">2559</span>            <b>if</b> (!tstr) {
-</code><code id="L2560"><span class="ln">2560</span>                <b>return</b> _.transform;
-</code><code id="L2561"><span class="ln">2561</span>            }
-</code><code id="L2562"><span class="ln">2562</span>            extractTransform(<b>this</b>, tstr);
-</code><code id="L2563"><span class="ln">2563</span>
-</code><code id="L2564"><span class="ln">2564</span>            <b>this</b>.clip<span class="s"> &amp;&amp; </span>$(<b>this</b>.clip, {transform: <b>this</b>.matrix.invert()});
-</code><code id="L2565"><span class="ln">2565</span>            <span class="c">// <b>this</b>.gradient<span class="s"> &amp;&amp; </span>$(<b>this</b>.gradient, {gradientTransform: <b>this</b>.matrix.invert()});</span>
-</code><code id="L2566"><span class="ln">2566</span>            <b>this</b>.pattern<span class="s"> &amp;&amp; </span>updatePosition(<b>this</b>);
-</code><code id="L2567"><span class="ln">2567</span>            <b>this</b>.node<span class="s"> &amp;&amp; </span>$(<b>this</b>.node, {transform: <b>this</b>.matrix});
-</code><code id="L2568"><span class="ln">2568</span>            
-</code><code id="L2569"><span class="ln">2569</span>            <b>if</b> (_.sx != <span class="d">1</span><span class="s"> || </span>_.sy != <span class="d">1</span>) {
-</code><code id="L2570"><span class="ln">2570</span>                <b>var</b> sw<span class="s"> = </span><b>this</b>.attrs[has](<i>"stroke-width"</i>) ? <b>this</b>.attrs[<i>"stroke-width"</i>] : <span class="d">1</span>;
-</code><code id="L2571"><span class="ln">2571</span>                <b>this</b>.attr({<i>"stroke-width"</i>: sw});
-</code><code id="L2572"><span class="ln">2572</span>            }
-</code><code id="L2573"><span class="ln">2573</span>
-</code><code id="L2574"><span class="ln">2574</span>            <b>return</b> <b>this</b>;
-</code><code id="L2575"><span class="ln">2575</span>        };
-</code><code id="L2576"><span class="ln">2576</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2577"><span class="ln">2577</span><span class="c">        <span class="s"> * </span>Element.hide
-</span></code><code id="L2578"><span class="ln">2578</span><span class="c">         [ method ]
-</span></code><code id="L2579"><span class="ln">2579</span><span class="c">         **
-</span></code><code id="L2580"><span class="ln">2580</span><span class="c">        <span class="s"> * </span>Makes element invisible. See @Element.show.
-</span></code><code id="L2581"><span class="ln">2581</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2582"><span class="ln">2582</span><span class="c">        \*/</span>
-</code><code id="L2583"><span class="ln">2583</span>        elproto.hide<span class="s"> = </span><b>function</b> () {
-</code><code id="L2584"><span class="ln">2584</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span><b>this</b>.paper.safari(<b>this</b>.node.style.display<span class="s"> = </span><i>"none"</i>);
-</code><code id="L2585"><span class="ln">2585</span>            <b>return</b> <b>this</b>;
-</code><code id="L2586"><span class="ln">2586</span>        };
-</code><code id="L2587"><span class="ln">2587</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2588"><span class="ln">2588</span><span class="c">        <span class="s"> * </span>Element.show
-</span></code><code id="L2589"><span class="ln">2589</span><span class="c">         [ method ]
-</span></code><code id="L2590"><span class="ln">2590</span><span class="c">         **
-</span></code><code id="L2591"><span class="ln">2591</span><span class="c">        <span class="s"> * </span>Makes element visible. See @Element.hide.
-</span></code><code id="L2592"><span class="ln">2592</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2593"><span class="ln">2593</span><span class="c">        \*/</span>
-</code><code id="L2594"><span class="ln">2594</span>        elproto.show<span class="s"> = </span><b>function</b> () {
-</code><code id="L2595"><span class="ln">2595</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span><b>this</b>.paper.safari(<b>this</b>.node.style.display<span class="s"> = </span><i>""</i>);
-</code><code id="L2596"><span class="ln">2596</span>            <b>return</b> <b>this</b>;
-</code><code id="L2597"><span class="ln">2597</span>        };
-</code><code id="L2598"><span class="ln">2598</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2599"><span class="ln">2599</span><span class="c">        <span class="s"> * </span>Element.remove
-</span></code><code id="L2600"><span class="ln">2600</span><span class="c">         [ method ]
-</span></code><code id="L2601"><span class="ln">2601</span><span class="c">         **
-</span></code><code id="L2602"><span class="ln">2602</span><span class="c">        <span class="s"> * </span>Removes element form the paper.
-</span></code><code id="L2603"><span class="ln">2603</span><span class="c">        \*/</span>
-</code><code id="L2604"><span class="ln">2604</span>        elproto.remove<span class="s"> = </span><b>function</b> () {
-</code><code id="L2605"><span class="ln">2605</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L2606"><span class="ln">2606</span>                <b>return</b>;
-</code><code id="L2607"><span class="ln">2607</span>            }
-</code><code id="L2608"><span class="ln">2608</span>            eve.unbind(<i>"*.*."</i><span class="s"> + </span><b>this</b>.id);
-</code><code id="L2609"><span class="ln">2609</span>            tear(<b>this</b>, <b>this</b>.paper);
-</code><code id="L2610"><span class="ln">2610</span>            <b>this</b>.node.parentNode.removeChild(<b>this</b>.node);
-</code><code id="L2611"><span class="ln">2611</span>            <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
-</code><code id="L2612"><span class="ln">2612</span>                <b>delete</b> <b>this</b>[i];
-</code><code id="L2613"><span class="ln">2613</span>            }
-</code><code id="L2614"><span class="ln">2614</span>            <b>this</b>.removed<span class="s"> = </span><b>true</b>;
-</code><code id="L2615"><span class="ln">2615</span>        };
-</code><code id="L2616"><span class="ln">2616</span>        elproto._getBBox<span class="s"> = </span><b>function</b> () {
-</code><code id="L2617"><span class="ln">2617</span>            <b>if</b> (<b>this</b>.node.style.display<span class="s"> == </span><i>"none"</i>) {
-</code><code id="L2618"><span class="ln">2618</span>                <b>this</b>.show();
-</code><code id="L2619"><span class="ln">2619</span>                <b>var</b> hide<span class="s"> = </span><b>true</b>;
-</code><code id="L2620"><span class="ln">2620</span>            }
-</code><code id="L2621"><span class="ln">2621</span>            <b>var</b> bbox<span class="s"> = </span>{};
-</code><code id="L2622"><span class="ln">2622</span>            <b>try</b> {
-</code><code id="L2623"><span class="ln">2623</span>                bbox<span class="s"> = </span><b>this</b>.node.getBBox();
-</code><code id="L2624"><span class="ln">2624</span>            } <b>catch</b>(e) {
-</code><code id="L2625"><span class="ln">2625</span>                <span class="c">// Firefox <span class="d">3.0</span>.x plays badly here</span>
-</code><code id="L2626"><span class="ln">2626</span>            } <b>finally</b> {
-</code><code id="L2627"><span class="ln">2627</span>                bbox<span class="s"> = </span>bbox<span class="s"> || </span>{};
-</code><code id="L2628"><span class="ln">2628</span>            }
-</code><code id="L2629"><span class="ln">2629</span>            hide<span class="s"> &amp;&amp; </span><b>this</b>.hide();
-</code><code id="L2630"><span class="ln">2630</span>            <b>return</b> bbox;
-</code><code id="L2631"><span class="ln">2631</span>        };
-</code><code id="L2632"><span class="ln">2632</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2633"><span class="ln">2633</span><span class="c">        <span class="s"> * </span>Element.attr
-</span></code><code id="L2634"><span class="ln">2634</span><span class="c">         [ method ]
-</span></code><code id="L2635"><span class="ln">2635</span><span class="c">         **
-</span></code><code id="L2636"><span class="ln">2636</span><span class="c">        <span class="s"> * </span>Sets the attributes of the element.
-</span></code><code id="L2637"><span class="ln">2637</span><span class="c">         > Parameters
-</span></code><code id="L2638"><span class="ln">2638</span><span class="c">        <span class="s"> - </span>attrName (string) attribute’s name
-</span></code><code id="L2639"><span class="ln">2639</span><span class="c">        <span class="s"> - </span>value (string) value
-</span></code><code id="L2640"><span class="ln">2640</span><span class="c">        <span class="s"> * </span>or
-</span></code><code id="L2641"><span class="ln">2641</span><span class="c">        <span class="s"> - </span>params (object) object of name/value pairs
-</span></code><code id="L2642"><span class="ln">2642</span><span class="c">        <span class="s"> * </span>or
-</span></code><code id="L2643"><span class="ln">2643</span><span class="c">        <span class="s"> - </span>attrName (string) attribute’s name
-</span></code><code id="L2644"><span class="ln">2644</span><span class="c">        <span class="s"> * </span>or
-</span></code><code id="L2645"><span class="ln">2645</span><span class="c">        <span class="s"> - </span>attrNames (array) <b>in</b> <b>this</b> <b>case</b> method returns array of current values <b>for</b> given attribute names
-</span></code><code id="L2646"><span class="ln">2646</span><span class="c">        <span class="s"> = </span>(object) @Element <b>if</b> attrsName<span class="s"> &amp; </span>value or params are passed <b>in</b>.
-</span></code><code id="L2647"><span class="ln">2647</span><span class="c">        <span class="s"> = </span>(...) value of the attribute <b>if</b> only attrsName is passed <b>in</b>.
-</span></code><code id="L2648"><span class="ln">2648</span><span class="c">        <span class="s"> = </span>(array) array of values of the attribute <b>if</b> attrsNames is passed <b>in</b>.
-</span></code><code id="L2649"><span class="ln">2649</span><span class="c">        <span class="s"> = </span>(object) object of attributes <b>if</b> nothing is passed <b>in</b>.
-</span></code><code id="L2650"><span class="ln">2650</span><span class="c">         > Possible parameters
-</span></code><code id="L2651"><span class="ln">2651</span><span class="c">         # &lt;p>Please refer to the &lt;a href=<i>"http:<span class="c">//www.w3.org/TR/SVG/"</i> title=<i>"The W3C Recommendation <b>for</b> the SVG language describes these properties <b>in</b> detail."</i>>SVG specification&lt;/a> <b>for</b> an explanation of these parameters.&lt;/p></span>
-</span></code><code id="L2652"><span class="ln">2652</span><span class="c">         o arrow-end (string) arrowhead on the end of the path. The format <b>for</b> string is `&lt;type>[-&lt;width>[-&lt;length>]]`. Possible types: `classic`, `block`, `open`, `oval`, `diamond`, `none`, width: `wide`, `narrow`, `midium`, length: `<b>long</b>`, `<b>short</b>`, `midium`.
-</span></code><code id="L2653"><span class="ln">2653</span><span class="c">         o clip-rect (string) comma or space separated values: x, y, width and height
-</span></code><code id="L2654"><span class="ln">2654</span><span class="c">         o cursor (string) CSS type of the cursor
-</span></code><code id="L2655"><span class="ln">2655</span><span class="c">         o cx (number)
-</span></code><code id="L2656"><span class="ln">2656</span><span class="c">         o cy (number)
-</span></code><code id="L2657"><span class="ln">2657</span><span class="c">         o fill (string) colour, gradient or image
-</span></code><code id="L2658"><span class="ln">2658</span><span class="c">         o fill-opacity (number)
-</span></code><code id="L2659"><span class="ln">2659</span><span class="c">         o font (string)
-</span></code><code id="L2660"><span class="ln">2660</span><span class="c">         o font-family (string)
-</span></code><code id="L2661"><span class="ln">2661</span><span class="c">         o font-size (number) font size <b>in</b> pixels
-</span></code><code id="L2662"><span class="ln">2662</span><span class="c">         o font-weight (string)
-</span></code><code id="L2663"><span class="ln">2663</span><span class="c">         o height (number)
-</span></code><code id="L2664"><span class="ln">2664</span><span class="c">         o href (string) URL, <b>if</b> specified element behaves as hyperlink
-</span></code><code id="L2665"><span class="ln">2665</span><span class="c">         o opacity (number)
-</span></code><code id="L2666"><span class="ln">2666</span><span class="c">         o path (string) SVG path string format
-</span></code><code id="L2667"><span class="ln">2667</span><span class="c">         o r (number)
-</span></code><code id="L2668"><span class="ln">2668</span><span class="c">         o rx (number)
-</span></code><code id="L2669"><span class="ln">2669</span><span class="c">         o ry (number)
-</span></code><code id="L2670"><span class="ln">2670</span><span class="c">         o src (string) image URL, only works <b>for</b> @Element.image element
-</span></code><code id="L2671"><span class="ln">2671</span><span class="c">         o stroke (string) stroke colour
-</span></code><code id="L2672"><span class="ln">2672</span><span class="c">         o stroke-dasharray (string) [“”, “`-`”, “`.`”, “`-.`”, “`-..`”, “`. `”, “`- `”, “`--`”, “`- .`”, “`--.`”, “`--..`”]
-</span></code><code id="L2673"><span class="ln">2673</span><span class="c">         o stroke-linecap (string) [“`butt`”, “`square`”, “`round`”]
-</span></code><code id="L2674"><span class="ln">2674</span><span class="c">         o stroke-linejoin (string) [“`bevel`”, “`round`”, “`miter`”]
-</span></code><code id="L2675"><span class="ln">2675</span><span class="c">         o stroke-miterlimit (number)
-</span></code><code id="L2676"><span class="ln">2676</span><span class="c">         o stroke-opacity (number)
-</span></code><code id="L2677"><span class="ln">2677</span><span class="c">         o stroke-width (number) stroke width <b>in</b> pixels, <b>default</b> is <i>'<span class="d">1</span>'</i>
-</span></code><code id="L2678"><span class="ln">2678</span><span class="c">         o target (string) used <b>with</b> href
-</span></code><code id="L2679"><span class="ln">2679</span><span class="c">         o text (string) contents of the text element. Use `\n` <b>for</b> multiline text
-</span></code><code id="L2680"><span class="ln">2680</span><span class="c">         o text-anchor (string) [“`start`”, “`middle`”, “`end`”], <b>default</b> is “`middle`”
-</span></code><code id="L2681"><span class="ln">2681</span><span class="c">         o title (string) will create tooltip <b>with</b> a given text
-</span></code><code id="L2682"><span class="ln">2682</span><span class="c">         o transform (string) see @Element.transform
-</span></code><code id="L2683"><span class="ln">2683</span><span class="c">         o width (number)
-</span></code><code id="L2684"><span class="ln">2684</span><span class="c">         o x (number)
-</span></code><code id="L2685"><span class="ln">2685</span><span class="c">         o y (number)
-</span></code><code id="L2686"><span class="ln">2686</span><span class="c">         > Gradients
-</span></code><code id="L2687"><span class="ln">2687</span><span class="c">        <span class="s"> * </span>Linear gradient format: “`‹angle›-‹colour›[-‹colour›[:‹offset›]]*-‹colour›`”, example: “`<span class="d">90</span>-#fff-#<span class="d">000</span>`” – <span class="d">90</span>°
-</span></code><code id="L2688"><span class="ln">2688</span><span class="c">        <span class="s"> * </span>gradient from white to black or “`<span class="d">0</span>-#fff-#f00:<span class="d">20</span>-#<span class="d">000</span>`” – <span class="d">0</span>° gradient from white via red (at <span class="d">20</span>%) to black.
-</span></code><code id="L2689"><span class="ln">2689</span><span class="c">         *
-</span></code><code id="L2690"><span class="ln">2690</span><span class="c">        <span class="s"> * </span>radial gradient: “`r[(‹fx›, ‹fy›)]‹colour›[-‹colour›[:‹offset›]]*-‹colour›`”, example: “`r#fff-#<span class="d">000</span>`” –
-</span></code><code id="L2691"><span class="ln">2691</span><span class="c">        <span class="s"> * </span>gradient from white to black or “`r(<span class="d">0.25</span>, <span class="d">0.75</span>)#fff-#<span class="d">000</span>`” – gradient from white to black <b>with</b> focus point
-</span></code><code id="L2692"><span class="ln">2692</span><span class="c">        <span class="s"> * </span>at <span class="d">0.25</span>, <span class="d">0.75</span>. Focus point coordinates are <b>in</b> <span class="d">0</span>.<span class="d">.1</span> range. Radial gradients can only be applied to circles and ellipses.
-</span></code><code id="L2693"><span class="ln">2693</span><span class="c">         > Path String
-</span></code><code id="L2694"><span class="ln">2694</span><span class="c">         # &lt;p>Please refer to &lt;a href=<i>"http:<span class="c">//www.w3.org/TR/SVG/paths.html#PathData"</i> title=<i>"Details of a path’s data attribute’s format are described <b>in</b> the SVG specification."</i>>SVG documentation regarding path string&lt;/a>. Raphaël fully supports it.&lt;/p></span>
-</span></code><code id="L2695"><span class="ln">2695</span><span class="c">         > Colour Parsing
-</span></code><code id="L2696"><span class="ln">2696</span><span class="c">         # &lt;ul>
-</span></code><code id="L2697"><span class="ln">2697</span><span class="c">         #     &lt;li>Colour name (“&lt;code>red&lt;/code>”, “&lt;code>green&lt;/code>”, “&lt;code>cornflowerblue&lt;/code>”, etc)&lt;/li>
-</span></code><code id="L2698"><span class="ln">2698</span><span class="c">         #     &lt;li>#••• — shortened HTML colour: (“&lt;code>#<span class="d">000</span>&lt;/code>”, “&lt;code>#fc0&lt;/code>”, etc)&lt;/li>
-</span></code><code id="L2699"><span class="ln">2699</span><span class="c">         #     &lt;li>#•••••• — full length HTML colour: (“&lt;code>#<span class="d">000000</span>&lt;/code>”, “&lt;code>#bd2300&lt;/code>”)&lt;/li>
-</span></code><code id="L2700"><span class="ln">2700</span><span class="c">         #     &lt;li>rgb(•••, •••, •••) — red, green and blue channels’ values: (“&lt;code>rgb(<span class="d">200</span>,&nbsp;<span class="d">100</span>,&nbsp;<span class="d">0</span>)&lt;/code>”)&lt;/li>
-</span></code><code id="L2701"><span class="ln">2701</span><span class="c">         #     &lt;li>rgb(•••%, •••%, •••%) — same as above, but <b>in</b> %: (“&lt;code>rgb(<span class="d">100</span>%,&nbsp;<span class="d">175</span>%,&nbsp;<span class="d">0</span>%)&lt;/code>”)&lt;/li>
-</span></code><code id="L2702"><span class="ln">2702</span><span class="c">         #     &lt;li>rgba(•••, •••, •••, •••) — red, green and blue channels’ values: (“&lt;code>rgba(<span class="d">200</span>,&nbsp;<span class="d">100</span>,&nbsp;<span class="d">0</span>, <span class="d">.5</span>)&lt;/code>”)&lt;/li>
-</span></code><code id="L2703"><span class="ln">2703</span><span class="c">         #     &lt;li>rgba(•••%, •••%, •••%, •••%) — same as above, but <b>in</b> %: (“&lt;code>rgba(<span class="d">100</span>%,&nbsp;<span class="d">175</span>%,&nbsp;<span class="d">0</span>%, <span class="d">50</span>%)&lt;/code>”)&lt;/li>
-</span></code><code id="L2704"><span class="ln">2704</span><span class="c">         #     &lt;li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“&lt;code>hsb(<span class="d">0.5</span>,&nbsp;<span class="d">0.25</span>,&nbsp;<span class="d">1</span>)&lt;/code>”)&lt;/li>
-</span></code><code id="L2705"><span class="ln">2705</span><span class="c">         #     &lt;li>hsb(•••%, •••%, •••%) — same as above, but <b>in</b> %&lt;/li>
-</span></code><code id="L2706"><span class="ln">2706</span><span class="c">         #     &lt;li>hsba(•••, •••, •••, •••) — same as above, but <b>with</b> opacity&lt;/li>
-</span></code><code id="L2707"><span class="ln">2707</span><span class="c">         #     &lt;li>hsl(•••, •••, •••) — almost the same as hsb, see &lt;a href=<i>"http:<span class="c">//en.wikipedia.org/wiki/HSL_and_HSV"</i> title=<i>"HSL and HSV<span class="s"> - </span>Wikipedia, the free encyclopedia"</i>>Wikipedia page&lt;/a>&lt;/li></span>
-</span></code><code id="L2708"><span class="ln">2708</span><span class="c">         #     &lt;li>hsl(•••%, •••%, •••%) — same as above, but <b>in</b> %&lt;/li>
-</span></code><code id="L2709"><span class="ln">2709</span><span class="c">         #     &lt;li>hsla(•••, •••, •••) — same as above, but <b>with</b> opacity&lt;/li>
-</span></code><code id="L2710"><span class="ln">2710</span><span class="c">         #     &lt;li>Optionally <b>for</b> hsb and hsl you could specify hue as a degree: “&lt;code>hsl(240deg,&nbsp;<span class="d">1</span>,&nbsp;<span class="d">.5</span>)&lt;/code>” or, <b>if</b> you want to go fancy, “&lt;code>hsl(<span class="d">240</span>°,&nbsp;<span class="d">1</span>,&nbsp;<span class="d">.5</span>)&lt;/code>”&lt;/li>
-</span></code><code id="L2711"><span class="ln">2711</span><span class="c">         # &lt;/ul>
-</span></code><code id="L2712"><span class="ln">2712</span><span class="c">        \*/</span>
-</code><code id="L2713"><span class="ln">2713</span>        elproto.attr<span class="s"> = </span><b>function</b> (name, value) {
-</code><code id="L2714"><span class="ln">2714</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L2715"><span class="ln">2715</span>                <b>return</b> <b>this</b>;
-</code><code id="L2716"><span class="ln">2716</span>            }
-</code><code id="L2717"><span class="ln">2717</span>            <b>if</b> (name<span class="s"> == </span><b>null</b>) {
-</code><code id="L2718"><span class="ln">2718</span>                <b>var</b> res<span class="s"> = </span>{};
-</code><code id="L2719"><span class="ln">2719</span>                <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>.attrs) <b>if</b> (<b>this</b>.attrs[has](i)) {
-</code><code id="L2720"><span class="ln">2720</span>                    res[i]<span class="s"> = </span><b>this</b>.attrs[i];
-</code><code id="L2721"><span class="ln">2721</span>                }
-</code><code id="L2722"><span class="ln">2722</span>                res.gradient<span class="s"> &amp;&amp; </span>res.fill<span class="s"> == </span><i>"none"</i><span class="s"> &amp;&amp; </span>(res.fill<span class="s"> = </span>res.gradient)<span class="s"> &amp;&amp; </span><b>delete</b> res.gradient;
-</code><code id="L2723"><span class="ln">2723</span>                res.transform<span class="s"> = </span><b>this</b>._.transform;
-</code><code id="L2724"><span class="ln">2724</span>                <b>return</b> res;
-</code><code id="L2725"><span class="ln">2725</span>            }
-</code><code id="L2726"><span class="ln">2726</span>            <b>if</b> (value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, string)) {
-</code><code id="L2727"><span class="ln">2727</span>                <b>if</b> (name<span class="s"> == </span>fillString<span class="s"> &amp;&amp; </span><b>this</b>.attrs.fill<span class="s"> == </span><i>"none"</i><span class="s"> &amp;&amp; </span><b>this</b>.attrs.gradient) {
-</code><code id="L2728"><span class="ln">2728</span>                    <b>return</b> <b>this</b>.attrs.gradient;
-</code><code id="L2729"><span class="ln">2729</span>                }
-</code><code id="L2730"><span class="ln">2730</span>                <b>if</b> (name<span class="s"> == </span><i>"transform"</i>) {
-</code><code id="L2731"><span class="ln">2731</span>                    <b>return</b> <b>this</b>._.transform;
-</code><code id="L2732"><span class="ln">2732</span>                }
-</code><code id="L2733"><span class="ln">2733</span>                <b>if</b> (name <b>in</b> <b>this</b>.attrs) {
-</code><code id="L2734"><span class="ln">2734</span>                    <b>return</b> <b>this</b>.attrs[name];
-</code><code id="L2735"><span class="ln">2735</span>                } <b>else</b> <b>if</b> (R.is(<b>this</b>.paper.customAttributes[name], <i>"<b>function</b>"</i>)) {
-</code><code id="L2736"><span class="ln">2736</span>                    <b>return</b> <b>this</b>.paper.customAttributes[name].def;
-</code><code id="L2737"><span class="ln">2737</span>                } <b>else</b> {
-</code><code id="L2738"><span class="ln">2738</span>                    <b>return</b> availableAttrs[name];
-</code><code id="L2739"><span class="ln">2739</span>                }
-</code><code id="L2740"><span class="ln">2740</span>            }
-</code><code id="L2741"><span class="ln">2741</span>            <b>if</b> (value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, array)) {
-</code><code id="L2742"><span class="ln">2742</span>                <b>var</b> values<span class="s"> = </span>{};
-</code><code id="L2743"><span class="ln">2743</span>                <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>name.length; j &lt; jj; j++) {
-</code><code id="L2744"><span class="ln">2744</span>                    values[name[j]]<span class="s"> = </span><b>this</b>.attr(name[j]);
-</code><code id="L2745"><span class="ln">2745</span>                }
-</code><code id="L2746"><span class="ln">2746</span>                <b>return</b> values;
-</code><code id="L2747"><span class="ln">2747</span>            }
-</code><code id="L2748"><span class="ln">2748</span>            <b>if</b> (value != <b>null</b>) {
-</code><code id="L2749"><span class="ln">2749</span>                <b>var</b> params<span class="s"> = </span>{};
-</code><code id="L2750"><span class="ln">2750</span>                params[name]<span class="s"> = </span>value;
-</code><code id="L2751"><span class="ln">2751</span>            } <b>else</b> <b>if</b> (name != <b>null</b><span class="s"> &amp;&amp; </span>R.is(name, <i>"object"</i>)) {
-</code><code id="L2752"><span class="ln">2752</span>                params<span class="s"> = </span>name;
-</code><code id="L2753"><span class="ln">2753</span>            }
-</code><code id="L2754"><span class="ln">2754</span>            <b>for</b> (<b>var</b> key <b>in</b> <b>this</b>.paper.customAttributes) <b>if</b> (<b>this</b>.paper.customAttributes[has](key)<span class="s"> &amp;&amp; </span>params[has](key)<span class="s"> &amp;&amp; </span>R.is(<b>this</b>.paper.customAttributes[key], <i>"<b>function</b>"</i>)) {
-</code><code id="L2755"><span class="ln">2755</span>                <b>var</b> par<span class="s"> = </span><b>this</b>.paper.customAttributes[key].apply(<b>this</b>, [][concat](params[key]));
-</code><code id="L2756"><span class="ln">2756</span>                <b>this</b>.attrs[key]<span class="s"> = </span>params[key];
-</code><code id="L2757"><span class="ln">2757</span>                <b>for</b> (<b>var</b> subkey <b>in</b> par) <b>if</b> (par[has](subkey)) {
-</code><code id="L2758"><span class="ln">2758</span>                    params[subkey]<span class="s"> = </span>par[subkey];
-</code><code id="L2759"><span class="ln">2759</span>                }
-</code><code id="L2760"><span class="ln">2760</span>            }
-</code><code id="L2761"><span class="ln">2761</span>            setFillAndStroke(<b>this</b>, params);
-</code><code id="L2762"><span class="ln">2762</span>            <b>return</b> <b>this</b>;
-</code><code id="L2763"><span class="ln">2763</span>        };
-</code><code id="L2764"><span class="ln">2764</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2765"><span class="ln">2765</span><span class="c">        <span class="s"> * </span>Element.toFront
-</span></code><code id="L2766"><span class="ln">2766</span><span class="c">         [ method ]
-</span></code><code id="L2767"><span class="ln">2767</span><span class="c">         **
-</span></code><code id="L2768"><span class="ln">2768</span><span class="c">        <span class="s"> * </span>Moves the element so it is the closest to the viewer’s eyes, on top of other elements.
-</span></code><code id="L2769"><span class="ln">2769</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2770"><span class="ln">2770</span><span class="c">        \*/</span>
-</code><code id="L2771"><span class="ln">2771</span>        elproto.toFront<span class="s"> = </span><b>function</b> () {
-</code><code id="L2772"><span class="ln">2772</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L2773"><span class="ln">2773</span>                <b>return</b> <b>this</b>;
-</code><code id="L2774"><span class="ln">2774</span>            }
-</code><code id="L2775"><span class="ln">2775</span>            <b>this</b>.node.parentNode.appendChild(<b>this</b>.node);
-</code><code id="L2776"><span class="ln">2776</span>            <b>var</b> svg<span class="s"> = </span><b>this</b>.paper;
-</code><code id="L2777"><span class="ln">2777</span>            svg.top != <b>this</b><span class="s"> &amp;&amp; </span>tofront(<b>this</b>, svg);
-</code><code id="L2778"><span class="ln">2778</span>            <b>return</b> <b>this</b>;
-</code><code id="L2779"><span class="ln">2779</span>        };
-</code><code id="L2780"><span class="ln">2780</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2781"><span class="ln">2781</span><span class="c">        <span class="s"> * </span>Element.toBack
-</span></code><code id="L2782"><span class="ln">2782</span><span class="c">         [ method ]
-</span></code><code id="L2783"><span class="ln">2783</span><span class="c">         **
-</span></code><code id="L2784"><span class="ln">2784</span><span class="c">        <span class="s"> * </span>Moves the element so it is the furthest from the viewer’s eyes, behind other elements.
-</span></code><code id="L2785"><span class="ln">2785</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2786"><span class="ln">2786</span><span class="c">        \*/</span>
-</code><code id="L2787"><span class="ln">2787</span>        elproto.toBack<span class="s"> = </span><b>function</b> () {
-</code><code id="L2788"><span class="ln">2788</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L2789"><span class="ln">2789</span>                <b>return</b> <b>this</b>;
-</code><code id="L2790"><span class="ln">2790</span>            }
-</code><code id="L2791"><span class="ln">2791</span>            <b>if</b> (<b>this</b>.node.parentNode.firstChild != <b>this</b>.node) {
-</code><code id="L2792"><span class="ln">2792</span>                <b>this</b>.node.parentNode.insertBefore(<b>this</b>.node, <b>this</b>.node.parentNode.firstChild);
-</code><code id="L2793"><span class="ln">2793</span>                toback(<b>this</b>, <b>this</b>.paper);
-</code><code id="L2794"><span class="ln">2794</span>                <b>var</b> svg<span class="s"> = </span><b>this</b>.paper;
-</code><code id="L2795"><span class="ln">2795</span>            }
-</code><code id="L2796"><span class="ln">2796</span>            <b>return</b> <b>this</b>;
-</code><code id="L2797"><span class="ln">2797</span>        };
-</code><code id="L2798"><span class="ln">2798</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2799"><span class="ln">2799</span><span class="c">        <span class="s"> * </span>Element.insertAfter
-</span></code><code id="L2800"><span class="ln">2800</span><span class="c">         [ method ]
-</span></code><code id="L2801"><span class="ln">2801</span><span class="c">         **
-</span></code><code id="L2802"><span class="ln">2802</span><span class="c">        <span class="s"> * </span>Inserts current object after the given one.
-</span></code><code id="L2803"><span class="ln">2803</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2804"><span class="ln">2804</span><span class="c">        \*/</span>
-</code><code id="L2805"><span class="ln">2805</span>        elproto.insertAfter<span class="s"> = </span><b>function</b> (element) {
-</code><code id="L2806"><span class="ln">2806</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L2807"><span class="ln">2807</span>                <b>return</b> <b>this</b>;
-</code><code id="L2808"><span class="ln">2808</span>            }
-</code><code id="L2809"><span class="ln">2809</span>            <b>var</b> node<span class="s"> = </span>element.node<span class="s"> || </span>element[element.length<span class="s"> - </span><span class="d">1</span>].node;
-</code><code id="L2810"><span class="ln">2810</span>            <b>if</b> (node.nextSibling) {
-</code><code id="L2811"><span class="ln">2811</span>                node.parentNode.insertBefore(<b>this</b>.node, node.nextSibling);
-</code><code id="L2812"><span class="ln">2812</span>            } <b>else</b> {
-</code><code id="L2813"><span class="ln">2813</span>                node.parentNode.appendChild(<b>this</b>.node);
-</code><code id="L2814"><span class="ln">2814</span>            }
-</code><code id="L2815"><span class="ln">2815</span>            insertafter(<b>this</b>, element, <b>this</b>.paper);
-</code><code id="L2816"><span class="ln">2816</span>            <b>return</b> <b>this</b>;
-</code><code id="L2817"><span class="ln">2817</span>        };
-</code><code id="L2818"><span class="ln">2818</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2819"><span class="ln">2819</span><span class="c">        <span class="s"> * </span>Element.insertBefore
-</span></code><code id="L2820"><span class="ln">2820</span><span class="c">         [ method ]
-</span></code><code id="L2821"><span class="ln">2821</span><span class="c">         **
-</span></code><code id="L2822"><span class="ln">2822</span><span class="c">        <span class="s"> * </span>Inserts current object before the given one.
-</span></code><code id="L2823"><span class="ln">2823</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L2824"><span class="ln">2824</span><span class="c">        \*/</span>
-</code><code id="L2825"><span class="ln">2825</span>        elproto.insertBefore<span class="s"> = </span><b>function</b> (element) {
-</code><code id="L2826"><span class="ln">2826</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L2827"><span class="ln">2827</span>                <b>return</b> <b>this</b>;
-</code><code id="L2828"><span class="ln">2828</span>            }
-</code><code id="L2829"><span class="ln">2829</span>            <b>var</b> node<span class="s"> = </span>element.node<span class="s"> || </span>element[<span class="d">0</span>].node;
-</code><code id="L2830"><span class="ln">2830</span>            node.parentNode.insertBefore(<b>this</b>.node, node);
-</code><code id="L2831"><span class="ln">2831</span>            insertbefore(<b>this</b>, element, <b>this</b>.paper);
-</code><code id="L2832"><span class="ln">2832</span>            <b>return</b> <b>this</b>;
-</code><code id="L2833"><span class="ln">2833</span>        };
-</code><code id="L2834"><span class="ln">2834</span>        elproto.blur<span class="s"> = </span><b>function</b> (size) {
-</code><code id="L2835"><span class="ln">2835</span>            <span class="c">// Experimental. No Safari support. Use it on your own risk.</span>
-</code><code id="L2836"><span class="ln">2836</span>            <b>var</b> t<span class="s"> = </span><b>this</b>;
-</code><code id="L2837"><span class="ln">2837</span>            <b>if</b> (+size !== <span class="d">0</span>) {
-</code><code id="L2838"><span class="ln">2838</span>                <b>var</b> fltr<span class="s"> = </span>$(<i>"filter"</i>),
-</code><code id="L2839"><span class="ln">2839</span>                    blur<span class="s"> = </span>$(<i>"feGaussianBlur"</i>);
-</code><code id="L2840"><span class="ln">2840</span>                t.attrs.blur<span class="s"> = </span>size;
-</code><code id="L2841"><span class="ln">2841</span>                fltr.id<span class="s"> = </span>createUUID();
-</code><code id="L2842"><span class="ln">2842</span>                $(blur, {stdDeviation: +size<span class="s"> || </span><span class="d">1.5</span>});
-</code><code id="L2843"><span class="ln">2843</span>                fltr.appendChild(blur);
-</code><code id="L2844"><span class="ln">2844</span>                t.paper.defs.appendChild(fltr);
-</code><code id="L2845"><span class="ln">2845</span>                t._blur<span class="s"> = </span>fltr;
-</code><code id="L2846"><span class="ln">2846</span>                $(t.node, {filter: <i>"url(#"</i><span class="s"> + </span>fltr.id<span class="s"> + </span><i>")"</i>});
-</code><code id="L2847"><span class="ln">2847</span>            } <b>else</b> {
-</code><code id="L2848"><span class="ln">2848</span>                <b>if</b> (t._blur) {
-</code><code id="L2849"><span class="ln">2849</span>                    t._blur.parentNode.removeChild(t._blur);
-</code><code id="L2850"><span class="ln">2850</span>                    <b>delete</b> t._blur;
-</code><code id="L2851"><span class="ln">2851</span>                    <b>delete</b> t.attrs.blur;
-</code><code id="L2852"><span class="ln">2852</span>                }
-</code><code id="L2853"><span class="ln">2853</span>                t.node.removeAttribute(<i>"filter"</i>);
-</code><code id="L2854"><span class="ln">2854</span>            }
-</code><code id="L2855"><span class="ln">2855</span>        };
-</code><code id="L2856"><span class="ln">2856</span>        <b>var</b> theCircle<span class="s"> = </span><b>function</b> (svg, x, y, r) {
-</code><code id="L2857"><span class="ln">2857</span>            <b>var</b> el<span class="s"> = </span>$(<i>"circle"</i>);
-</code><code id="L2858"><span class="ln">2858</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
-</code><code id="L2859"><span class="ln">2859</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
-</code><code id="L2860"><span class="ln">2860</span>            res.attrs<span class="s"> = </span>{cx: x, cy: y, r: r, fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>};
-</code><code id="L2861"><span class="ln">2861</span>            res.type<span class="s"> = </span><i>"circle"</i>;
-</code><code id="L2862"><span class="ln">2862</span>            $(el, res.attrs);
-</code><code id="L2863"><span class="ln">2863</span>            <b>return</b> res;
-</code><code id="L2864"><span class="ln">2864</span>        },
-</code><code id="L2865"><span class="ln">2865</span>        theRect<span class="s"> = </span><b>function</b> (svg, x, y, w, h, r) {
-</code><code id="L2866"><span class="ln">2866</span>            <b>var</b> el<span class="s"> = </span>$(<i>"rect"</i>);
-</code><code id="L2867"><span class="ln">2867</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
-</code><code id="L2868"><span class="ln">2868</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
-</code><code id="L2869"><span class="ln">2869</span>            res.attrs<span class="s"> = </span>{x: x, y: y, width: w, height: h, r: r<span class="s"> || </span><span class="d">0</span>, rx: r<span class="s"> || </span><span class="d">0</span>, ry: r<span class="s"> || </span><span class="d">0</span>, fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>};
-</code><code id="L2870"><span class="ln">2870</span>            res.type<span class="s"> = </span><i>"rect"</i>;
-</code><code id="L2871"><span class="ln">2871</span>            $(el, res.attrs);
-</code><code id="L2872"><span class="ln">2872</span>            <b>return</b> res;
-</code><code id="L2873"><span class="ln">2873</span>        },
-</code><code id="L2874"><span class="ln">2874</span>        theEllipse<span class="s"> = </span><b>function</b> (svg, x, y, rx, ry) {
-</code><code id="L2875"><span class="ln">2875</span>            <b>var</b> el<span class="s"> = </span>$(<i>"ellipse"</i>);
-</code><code id="L2876"><span class="ln">2876</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
-</code><code id="L2877"><span class="ln">2877</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
-</code><code id="L2878"><span class="ln">2878</span>            res.attrs<span class="s"> = </span>{cx: x, cy: y, rx: rx, ry: ry, fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>};
-</code><code id="L2879"><span class="ln">2879</span>            res.type<span class="s"> = </span><i>"ellipse"</i>;
-</code><code id="L2880"><span class="ln">2880</span>            $(el, res.attrs);
-</code><code id="L2881"><span class="ln">2881</span>            <b>return</b> res;
-</code><code id="L2882"><span class="ln">2882</span>        },
-</code><code id="L2883"><span class="ln">2883</span>        theImage<span class="s"> = </span><b>function</b> (svg, src, x, y, w, h) {
-</code><code id="L2884"><span class="ln">2884</span>            <b>var</b> el<span class="s"> = </span>$(<i>"image"</i>);
-</code><code id="L2885"><span class="ln">2885</span>            $(el, {x: x, y: y, width: w, height: h, preserveAspectRatio: <i>"none"</i>});
-</code><code id="L2886"><span class="ln">2886</span>            el.setAttributeNS(xlink, <i>"href"</i>, src);
-</code><code id="L2887"><span class="ln">2887</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
-</code><code id="L2888"><span class="ln">2888</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
-</code><code id="L2889"><span class="ln">2889</span>            res.attrs<span class="s"> = </span>{x: x, y: y, width: w, height: h, src: src};
-</code><code id="L2890"><span class="ln">2890</span>            res.type<span class="s"> = </span><i>"image"</i>;
-</code><code id="L2891"><span class="ln">2891</span>            <b>return</b> res;
-</code><code id="L2892"><span class="ln">2892</span>        },
-</code><code id="L2893"><span class="ln">2893</span>        theText<span class="s"> = </span><b>function</b> (svg, x, y, text) {
-</code><code id="L2894"><span class="ln">2894</span>            <b>var</b> el<span class="s"> = </span>$(<i>"text"</i>);
-</code><code id="L2895"><span class="ln">2895</span>            $(el, {x: x, y: y, <i>"text-anchor"</i>: <i>"middle"</i>});
-</code><code id="L2896"><span class="ln">2896</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
-</code><code id="L2897"><span class="ln">2897</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
-</code><code id="L2898"><span class="ln">2898</span>            res.attrs<span class="s"> = </span>{x: x, y: y, <i>"text-anchor"</i>: <i>"middle"</i>, text: text, font: availableAttrs.font, stroke: <i>"none"</i>, fill: <i>"#<span class="d">000</span>"</i>};
-</code><code id="L2899"><span class="ln">2899</span>            res.type<span class="s"> = </span><i>"text"</i>;
-</code><code id="L2900"><span class="ln">2900</span>            setFillAndStroke(res, res.attrs);
-</code><code id="L2901"><span class="ln">2901</span>            <b>return</b> res;
-</code><code id="L2902"><span class="ln">2902</span>        },
-</code><code id="L2903"><span class="ln">2903</span>        setSize<span class="s"> = </span><b>function</b> (width, height) {
-</code><code id="L2904"><span class="ln">2904</span>            <b>this</b>.width<span class="s"> = </span>width<span class="s"> || </span><b>this</b>.width;
-</code><code id="L2905"><span class="ln">2905</span>            <b>this</b>.height<span class="s"> = </span>height<span class="s"> || </span><b>this</b>.height;
-</code><code id="L2906"><span class="ln">2906</span>            <b>this</b>.canvas[setAttribute](<i>"width"</i>, <b>this</b>.width);
-</code><code id="L2907"><span class="ln">2907</span>            <b>this</b>.canvas[setAttribute](<i>"height"</i>, <b>this</b>.height);
-</code><code id="L2908"><span class="ln">2908</span>            <b>if</b> (<b>this</b>._viewBox) {
-</code><code id="L2909"><span class="ln">2909</span>                <b>this</b>.setViewBox.apply(<b>this</b>, <b>this</b>._viewBox);
-</code><code id="L2910"><span class="ln">2910</span>            }
-</code><code id="L2911"><span class="ln">2911</span>            <b>return</b> <b>this</b>;
-</code><code id="L2912"><span class="ln">2912</span>        },
-</code><code id="L2913"><span class="ln">2913</span>        create<span class="s"> = </span><b>function</b> () {
-</code><code id="L2914"><span class="ln">2914</span>            <b>var</b> con<span class="s"> = </span>getContainer[apply](<span class="d">0</span>, arguments),
-</code><code id="L2915"><span class="ln">2915</span>                container<span class="s"> = </span>con<span class="s"> &amp;&amp; </span>con.container,
-</code><code id="L2916"><span class="ln">2916</span>                x<span class="s"> = </span>con.x,
-</code><code id="L2917"><span class="ln">2917</span>                y<span class="s"> = </span>con.y,
-</code><code id="L2918"><span class="ln">2918</span>                width<span class="s"> = </span>con.width,
-</code><code id="L2919"><span class="ln">2919</span>                height<span class="s"> = </span>con.height;
-</code><code id="L2920"><span class="ln">2920</span>            <b>if</b> (!container) {
-</code><code id="L2921"><span class="ln">2921</span>                <b>throw</b> <b>new</b> Error(<i>"SVG container not found."</i>);
-</code><code id="L2922"><span class="ln">2922</span>            }
-</code><code id="L2923"><span class="ln">2923</span>            <b>var</b> cnvs<span class="s"> = </span>$(<i>"svg"</i>),
-</code><code id="L2924"><span class="ln">2924</span>                css<span class="s"> = </span><i>"overflow:hidden;"</i>;
-</code><code id="L2925"><span class="ln">2925</span>            x<span class="s"> = </span>x<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L2926"><span class="ln">2926</span>            y<span class="s"> = </span>y<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L2927"><span class="ln">2927</span>            width<span class="s"> = </span>width<span class="s"> || </span><span class="d">512</span>;
-</code><code id="L2928"><span class="ln">2928</span>            height<span class="s"> = </span>height<span class="s"> || </span><span class="d">342</span>;
-</code><code id="L2929"><span class="ln">2929</span>            $(cnvs, {
-</code><code id="L2930"><span class="ln">2930</span>                height: height,
-</code><code id="L2931"><span class="ln">2931</span>                version: <span class="d">1.1</span>,
-</code><code id="L2932"><span class="ln">2932</span>                width: width,
-</code><code id="L2933"><span class="ln">2933</span>                xmlns: <i>"http:<span class="c">//www.w3.org/<span class="d">2000</span>/svg"</i></span>
-</code><code id="L2934"><span class="ln">2934</span>            });
-</code><code id="L2935"><span class="ln">2935</span>            <b>if</b> (container<span class="s"> == </span><span class="d">1</span>) {
-</code><code id="L2936"><span class="ln">2936</span>                cnvs.style.cssText<span class="s"> = </span>css<span class="s"> + </span><i>"position:absolute;left:"</i><span class="s"> + </span>x<span class="s"> + </span><i>"px;top:"</i><span class="s"> + </span>y<span class="s"> + </span><i>"px"</i>;
-</code><code id="L2937"><span class="ln">2937</span>                g.doc.body.appendChild(cnvs);
-</code><code id="L2938"><span class="ln">2938</span>            } <b>else</b> {
-</code><code id="L2939"><span class="ln">2939</span>                cnvs.style.cssText<span class="s"> = </span>css;
-</code><code id="L2940"><span class="ln">2940</span>                <b>if</b> (container.firstChild) {
-</code><code id="L2941"><span class="ln">2941</span>                    container.insertBefore(cnvs, container.firstChild);
-</code><code id="L2942"><span class="ln">2942</span>                } <b>else</b> {
-</code><code id="L2943"><span class="ln">2943</span>                    container.appendChild(cnvs);
-</code><code id="L2944"><span class="ln">2944</span>                }
-</code><code id="L2945"><span class="ln">2945</span>            }
-</code><code id="L2946"><span class="ln">2946</span>            container<span class="s"> = </span><b>new</b> Paper;
-</code><code id="L2947"><span class="ln">2947</span>            container.width<span class="s"> = </span>width;
-</code><code id="L2948"><span class="ln">2948</span>            container.height<span class="s"> = </span>height;
-</code><code id="L2949"><span class="ln">2949</span>            container.canvas<span class="s"> = </span>cnvs;
-</code><code id="L2950"><span class="ln">2950</span>            plugins.call(container, container, R.fn);
-</code><code id="L2951"><span class="ln">2951</span>            container.clear();
-</code><code id="L2952"><span class="ln">2952</span>            <b>return</b> container;
-</code><code id="L2953"><span class="ln">2953</span>        },
-</code><code id="L2954"><span class="ln">2954</span>        setViewBox<span class="s"> = </span><b>function</b> (x, y, w, h, fit) {
-</code><code id="L2955"><span class="ln">2955</span>            eve(<i>"setViewBox"</i>, <b>this</b>, <b>this</b>._viewBox, [x, y, w, h, fit]);
-</code><code id="L2956"><span class="ln">2956</span>            <b>var</b> size<span class="s"> = </span>mmax(w<span class="s"> / </span><b>this</b>.width, h<span class="s"> / </span><b>this</b>.height),
-</code><code id="L2957"><span class="ln">2957</span>                top<span class="s"> = </span><b>this</b>.top,
-</code><code id="L2958"><span class="ln">2958</span>                aspectRatio<span class="s"> = </span>fit ? <i>"meet"</i> : <i>"xMinYMin"</i>,
-</code><code id="L2959"><span class="ln">2959</span>                vb,
-</code><code id="L2960"><span class="ln">2960</span>                sw;
-</code><code id="L2961"><span class="ln">2961</span>            <b>if</b> (x<span class="s"> == </span><b>null</b>) {
-</code><code id="L2962"><span class="ln">2962</span>                <b>if</b> (<b>this</b>._vbSize) {
-</code><code id="L2963"><span class="ln">2963</span>                    size<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2964"><span class="ln">2964</span>                }
-</code><code id="L2965"><span class="ln">2965</span>                <b>delete</b> <b>this</b>._vbSize;
-</code><code id="L2966"><span class="ln">2966</span>                vb<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span> "</i><span class="s"> + </span><b>this</b>.width<span class="s"> + </span>S<span class="s"> + </span><b>this</b>.height;
-</code><code id="L2967"><span class="ln">2967</span>            } <b>else</b> {
-</code><code id="L2968"><span class="ln">2968</span>                <b>this</b>._vbSize<span class="s"> = </span>size;
-</code><code id="L2969"><span class="ln">2969</span>                vb<span class="s"> = </span>x<span class="s"> + </span>S<span class="s"> + </span>y<span class="s"> + </span>S<span class="s"> + </span>w<span class="s"> + </span>S<span class="s"> + </span>h;
-</code><code id="L2970"><span class="ln">2970</span>            }
-</code><code id="L2971"><span class="ln">2971</span>            $(<b>this</b>.canvas, {
-</code><code id="L2972"><span class="ln">2972</span>                viewBox: vb,
-</code><code id="L2973"><span class="ln">2973</span>                preserveAspectRatio: aspectRatio
-</code><code id="L2974"><span class="ln">2974</span>            });
-</code><code id="L2975"><span class="ln">2975</span>            <b>while</b> (size<span class="s"> &amp;&amp; </span>top) {
-</code><code id="L2976"><span class="ln">2976</span>                sw<span class="s"> = </span><i>"stroke-width"</i> <b>in</b> top.attrs ? top.attrs[<i>"stroke-width"</i>] : <span class="d">1</span>;
-</code><code id="L2977"><span class="ln">2977</span>                top.attr({<i>"stroke-width"</i>: sw});
-</code><code id="L2978"><span class="ln">2978</span>                top._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2979"><span class="ln">2979</span>                top._.dirtyT<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L2980"><span class="ln">2980</span>                top<span class="s"> = </span>top.prev;
-</code><code id="L2981"><span class="ln">2981</span>            }
-</code><code id="L2982"><span class="ln">2982</span>            <b>this</b>._viewBox<span class="s"> = </span>[x, y, w, h, !!fit];
-</code><code id="L2983"><span class="ln">2983</span>            <b>return</b> <b>this</b>;
-</code><code id="L2984"><span class="ln">2984</span>        };
-</code><code id="L2985"><span class="ln">2985</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L2986"><span class="ln">2986</span><span class="c">        <span class="s"> * </span>Paper.clear
-</span></code><code id="L2987"><span class="ln">2987</span><span class="c">         [ method ]
-</span></code><code id="L2988"><span class="ln">2988</span><span class="c">         **
-</span></code><code id="L2989"><span class="ln">2989</span><span class="c">        <span class="s"> * </span>Clears the paper, i.e. removes all the elements.
-</span></code><code id="L2990"><span class="ln">2990</span><span class="c">        \*/</span>
-</code><code id="L2991"><span class="ln">2991</span>        paperproto.clear<span class="s"> = </span><b>function</b> () {
-</code><code id="L2992"><span class="ln">2992</span>            eve(<i>"clear"</i>, <b>this</b>);
-</code><code id="L2993"><span class="ln">2993</span>            <b>var</b> c<span class="s"> = </span><b>this</b>.canvas;
-</code><code id="L2994"><span class="ln">2994</span>            <b>while</b> (c.firstChild) {
-</code><code id="L2995"><span class="ln">2995</span>                c.removeChild(c.firstChild);
-</code><code id="L2996"><span class="ln">2996</span>            }
-</code><code id="L2997"><span class="ln">2997</span>            <b>this</b>.bottom<span class="s"> = </span><b>this</b>.top<span class="s"> = </span><b>null</b>;
-</code><code id="L2998"><span class="ln">2998</span>            (<b>this</b>.desc<span class="s"> = </span>$(<i>"desc"</i>)).appendChild(g.doc.createTextNode(<i>"Created <b>with</b> Rapha\xebl "</i><span class="s"> + </span>R.version));
-</code><code id="L2999"><span class="ln">2999</span>            c.appendChild(<b>this</b>.desc);
-</code><code id="L3000"><span class="ln">3000</span>            c.appendChild(<b>this</b>.defs<span class="s"> = </span>$(<i>"defs"</i>));
-</code><code id="L3001"><span class="ln">3001</span>        };
-</code><code id="L3002"><span class="ln">3002</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L3003"><span class="ln">3003</span><span class="c">        <span class="s"> * </span>Paper.remove
-</span></code><code id="L3004"><span class="ln">3004</span><span class="c">         [ method ]
-</span></code><code id="L3005"><span class="ln">3005</span><span class="c">         **
-</span></code><code id="L3006"><span class="ln">3006</span><span class="c">        <span class="s"> * </span>Removes the paper from the DOM.
-</span></code><code id="L3007"><span class="ln">3007</span><span class="c">        \*/</span>
-</code><code id="L3008"><span class="ln">3008</span>        paperproto.remove<span class="s"> = </span><b>function</b> () {
-</code><code id="L3009"><span class="ln">3009</span>            eve(<i>"remove"</i>, <b>this</b>);
-</code><code id="L3010"><span class="ln">3010</span>            <b>this</b>.canvas.parentNode<span class="s"> &amp;&amp; </span><b>this</b>.canvas.parentNode.removeChild(<b>this</b>.canvas);
-</code><code id="L3011"><span class="ln">3011</span>            <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
-</code><code id="L3012"><span class="ln">3012</span>                <b>this</b>[i]<span class="s"> = </span>removed(i);
-</code><code id="L3013"><span class="ln">3013</span>            }
-</code><code id="L3014"><span class="ln">3014</span>        };
-</code><code id="L3015"><span class="ln">3015</span>    }
-</code><code id="L3016"><span class="ln">3016</span>
-</code><code id="L3017"><span class="ln">3017</span>    <span class="c">// VML</span>
-</code><code id="L3018"><span class="ln">3018</span>    <b>if</b> (R.vml) {
-</code><code id="L3019"><span class="ln">3019</span>        <b>var</b> map<span class="s"> = </span>{M: <i>"m"</i>, L: <i>"l"</i>, C: <i>"c"</i>, Z: <i>"x"</i>, m: <i>"t"</i>, l: <i>"r"</i>, c: <i>"v"</i>, z: <i>"x"</i>},
-</code><code id="L3020"><span class="ln">3020</span>            bites<span class="s"> = </span>/([clmz]),?([^clmz]*)/gi,
-</code><code id="L3021"><span class="ln">3021</span>            blurregexp<span class="s"> = </span>/ progid:\S+Blur\([^\)]+\)/g,
-</code><code id="L3022"><span class="ln">3022</span>            val<span class="s"> = </span>/-?[^,\s-]+/g,
-</code><code id="L3023"><span class="ln">3023</span>            cssDot<span class="s"> = </span><i>"position:absolute;left:<span class="d">0</span>;top:<span class="d">0</span>;width:1px;height:1px"</i>,
-</code><code id="L3024"><span class="ln">3024</span>            zoom<span class="s"> = </span><span class="d">21600</span>,
-</code><code id="L3025"><span class="ln">3025</span>            pathTypes<span class="s"> = </span>{path: <span class="d">1</span>, rect: <span class="d">1</span>},
-</code><code id="L3026"><span class="ln">3026</span>            ovalTypes<span class="s"> = </span>{circle: <span class="d">1</span>, ellipse: <span class="d">1</span>},
-</code><code id="L3027"><span class="ln">3027</span>            path2vml<span class="s"> = </span><b>function</b> (path) {
-</code><code id="L3028"><span class="ln">3028</span>                <b>var</b> total<span class="s"> = </span> /[ahqstv]/ig,
-</code><code id="L3029"><span class="ln">3029</span>                    command<span class="s"> = </span>pathToAbsolute;
-</code><code id="L3030"><span class="ln">3030</span>                Str(path).match(total)<span class="s"> &amp;&amp; </span>(command<span class="s"> = </span>path2curve);
-</code><code id="L3031"><span class="ln">3031</span>                total<span class="s"> = </span>/[clmz]/g;
-</code><code id="L3032"><span class="ln">3032</span>                <b>if</b> (command<span class="s"> == </span>pathToAbsolute<span class="s"> &amp;&amp; </span>!Str(path).match(total)) {
-</code><code id="L3033"><span class="ln">3033</span>                    <b>var</b> res<span class="s"> = </span>Str(path).replace(bites, <b>function</b> (all, command, args) {
-</code><code id="L3034"><span class="ln">3034</span>                        <b>var</b> vals<span class="s"> = </span>[],
-</code><code id="L3035"><span class="ln">3035</span>                            isMove<span class="s"> = </span>lowerCase.call(command)<span class="s"> == </span><i>"m"</i>,
-</code><code id="L3036"><span class="ln">3036</span>                            res<span class="s"> = </span>map[command];
-</code><code id="L3037"><span class="ln">3037</span>                        args.replace(val, <b>function</b> (value) {
-</code><code id="L3038"><span class="ln">3038</span>                            <b>if</b> (isMove<span class="s"> &amp;&amp; </span>vals.length<span class="s"> == </span><span class="d">2</span>) {
-</code><code id="L3039"><span class="ln">3039</span>                                res += vals<span class="s"> + </span>map[command<span class="s"> == </span><i>"m"</i> ? <i>"l"</i> : <i>"L"</i>];
-</code><code id="L3040"><span class="ln">3040</span>                                vals<span class="s"> = </span>[];
-</code><code id="L3041"><span class="ln">3041</span>                            }
-</code><code id="L3042"><span class="ln">3042</span>                            vals.push(round(value<span class="s"> * </span>zoom));
-</code><code id="L3043"><span class="ln">3043</span>                        });
-</code><code id="L3044"><span class="ln">3044</span>                        <b>return</b> res<span class="s"> + </span>vals;
-</code><code id="L3045"><span class="ln">3045</span>                    });
-</code><code id="L3046"><span class="ln">3046</span>                    <b>return</b> res;
-</code><code id="L3047"><span class="ln">3047</span>                }
-</code><code id="L3048"><span class="ln">3048</span>                <b>var</b> pa<span class="s"> = </span>command(path), p, r;
-</code><code id="L3049"><span class="ln">3049</span>                res<span class="s"> = </span>[];
-</code><code id="L3050"><span class="ln">3050</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>pa.length; i &lt; ii; i++) {
-</code><code id="L3051"><span class="ln">3051</span>                    p<span class="s"> = </span>pa[i];
-</code><code id="L3052"><span class="ln">3052</span>                    r<span class="s"> = </span>lowerCase.call(pa[i][<span class="d">0</span>]);
-</code><code id="L3053"><span class="ln">3053</span>                    r<span class="s"> == </span><i>"z"</i><span class="s"> &amp;&amp; </span>(r<span class="s"> = </span><i>"x"</i>);
-</code><code id="L3054"><span class="ln">3054</span>                    <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>p.length; j &lt; jj; j++) {
-</code><code id="L3055"><span class="ln">3055</span>                        r += round(p[j]<span class="s"> * </span>zoom)<span class="s"> + </span>(j != jj<span class="s"> - </span><span class="d">1</span> ? <i>","</i> : E);
-</code><code id="L3056"><span class="ln">3056</span>                    }
-</code><code id="L3057"><span class="ln">3057</span>                    res.push(r);
-</code><code id="L3058"><span class="ln">3058</span>                }
-</code><code id="L3059"><span class="ln">3059</span>                <b>return</b> res.join(S);
-</code><code id="L3060"><span class="ln">3060</span>            },
-</code><code id="L3061"><span class="ln">3061</span>            compensation<span class="s"> = </span><b>function</b> (deg, dx, dy) {
-</code><code id="L3062"><span class="ln">3062</span>                <b>var</b> m<span class="s"> = </span><b>new</b> Matrix;
-</code><code id="L3063"><span class="ln">3063</span>                m.rotate(-deg, <span class="d">.5</span>, <span class="d">.5</span>);
-</code><code id="L3064"><span class="ln">3064</span>                <b>return</b> {
-</code><code id="L3065"><span class="ln">3065</span>                    dx: m.x(dx, dy),
-</code><code id="L3066"><span class="ln">3066</span>                    dy: m.y(dx, dy)
-</code><code id="L3067"><span class="ln">3067</span>                };
-</code><code id="L3068"><span class="ln">3068</span>            },
-</code><code id="L3069"><span class="ln">3069</span>            setCoords<span class="s"> = </span><b>function</b> (p) {
-</code><code id="L3070"><span class="ln">3070</span>                <b>var</b> _<span class="s"> = </span>p._,
-</code><code id="L3071"><span class="ln">3071</span>                    sx<span class="s"> = </span>_.sx,
-</code><code id="L3072"><span class="ln">3072</span>                    sy<span class="s"> = </span>_.sy,
-</code><code id="L3073"><span class="ln">3073</span>                    deg<span class="s"> = </span>_.deg,
-</code><code id="L3074"><span class="ln">3074</span>                    dx<span class="s"> = </span>_.dx,
-</code><code id="L3075"><span class="ln">3075</span>                    dy<span class="s"> = </span>_.dy,
-</code><code id="L3076"><span class="ln">3076</span>                    fillpos<span class="s"> = </span>_.fillpos,
-</code><code id="L3077"><span class="ln">3077</span>                    o<span class="s"> = </span>p.node,
-</code><code id="L3078"><span class="ln">3078</span>                    s<span class="s"> = </span>o.style,
-</code><code id="L3079"><span class="ln">3079</span>                    y<span class="s"> = </span><span class="d">1</span>,
-</code><code id="L3080"><span class="ln">3080</span>                    m<span class="s"> = </span>p.matrix,
-</code><code id="L3081"><span class="ln">3081</span>                    flip<span class="s"> = </span><i>""</i>,
-</code><code id="L3082"><span class="ln">3082</span>                    dxdy,
-</code><code id="L3083"><span class="ln">3083</span>                    kx<span class="s"> = </span>zoom<span class="s"> / </span>sx,
-</code><code id="L3084"><span class="ln">3084</span>                    ky<span class="s"> = </span>zoom<span class="s"> / </span>sy;
-</code><code id="L3085"><span class="ln">3085</span>                s.visibility<span class="s"> = </span><i>"hidden"</i>;
-</code><code id="L3086"><span class="ln">3086</span>                o.coordsize<span class="s"> = </span>abs(kx)<span class="s"> + </span>S<span class="s"> + </span>abs(ky);
-</code><code id="L3087"><span class="ln">3087</span>                s.rotation<span class="s"> = </span>deg<span class="s"> * </span>(sx<span class="s"> * </span>sy &lt; <span class="d">0</span> ? -<span class="d">1</span> : <span class="d">1</span>);
-</code><code id="L3088"><span class="ln">3088</span>                <b>if</b> (deg) {
-</code><code id="L3089"><span class="ln">3089</span>                    <b>var</b> c<span class="s"> = </span>compensation(deg, dx, dy);
-</code><code id="L3090"><span class="ln">3090</span>                    dx<span class="s"> = </span>c.dx;
-</code><code id="L3091"><span class="ln">3091</span>                    dy<span class="s"> = </span>c.dy;
-</code><code id="L3092"><span class="ln">3092</span>                }
-</code><code id="L3093"><span class="ln">3093</span>                sx &lt; <span class="d">0</span><span class="s"> &amp;&amp; </span>(flip += <i>"x"</i>);
-</code><code id="L3094"><span class="ln">3094</span>                sy &lt; <span class="d">0</span><span class="s"> &amp;&amp; </span>(flip += <i>" y"</i>)<span class="s"> &amp;&amp; </span>(y<span class="s"> = </span>-<span class="d">1</span>);
-</code><code id="L3095"><span class="ln">3095</span>                s.flip<span class="s"> = </span>flip;
-</code><code id="L3096"><span class="ln">3096</span>                o.coordorigin<span class="s"> = </span>(dx<span class="s"> * </span>-kx)<span class="s"> + </span>S<span class="s"> + </span>(dy<span class="s"> * </span>-ky);
-</code><code id="L3097"><span class="ln">3097</span>                <b>if</b> (fillpos<span class="s"> || </span>_.fillsize) {
-</code><code id="L3098"><span class="ln">3098</span>                    <b>var</b> fill<span class="s"> = </span>o.getElementsByTagName(fillString);
-</code><code id="L3099"><span class="ln">3099</span>                    fill<span class="s"> = </span>fill<span class="s"> &amp;&amp; </span>fill[<span class="d">0</span>];
-</code><code id="L3100"><span class="ln">3100</span>                    o.removeChild(fill);
-</code><code id="L3101"><span class="ln">3101</span>                    <b>if</b> (fillpos) {
-</code><code id="L3102"><span class="ln">3102</span>                        c<span class="s"> = </span>compensation(deg, m.x(fillpos[<span class="d">0</span>], fillpos[<span class="d">1</span>]), m.y(fillpos[<span class="d">0</span>], fillpos[<span class="d">1</span>]));
-</code><code id="L3103"><span class="ln">3103</span>                        fill.position<span class="s"> = </span>c.dx<span class="s"> * </span>y<span class="s"> + </span>S<span class="s"> + </span>c.dy<span class="s"> * </span>y;
-</code><code id="L3104"><span class="ln">3104</span>                    }
-</code><code id="L3105"><span class="ln">3105</span>                    <b>if</b> (_.fillsize) {
-</code><code id="L3106"><span class="ln">3106</span>                        fill.size<span class="s"> = </span>_.fillsize[<span class="d">0</span>]<span class="s"> * </span>abs(sx)<span class="s"> + </span>S<span class="s"> + </span>_.fillsize[<span class="d">1</span>]<span class="s"> * </span>abs(sy);
-</code><code id="L3107"><span class="ln">3107</span>                    }
-</code><code id="L3108"><span class="ln">3108</span>                    o.appendChild(fill);
-</code><code id="L3109"><span class="ln">3109</span>                }
-</code><code id="L3110"><span class="ln">3110</span>                s.visibility<span class="s"> = </span><i>"visible"</i>;
-</code><code id="L3111"><span class="ln">3111</span>            };
-</code><code id="L3112"><span class="ln">3112</span>        R.toString<span class="s"> = </span><b>function</b> () {
-</code><code id="L3113"><span class="ln">3113</span>            <b>return</b>  <i>"Your browser doesn\u2019t support SVG. Falling down to VML.\nYou are running Rapha\xebl "</i><span class="s"> + </span><b>this</b>.version;
-</code><code id="L3114"><span class="ln">3114</span>        };
-</code><code id="L3115"><span class="ln">3115</span>        addArrow<span class="s"> = </span><b>function</b> (o, value, isEnd) {
-</code><code id="L3116"><span class="ln">3116</span>            <b>var</b> values<span class="s"> = </span>Str(value).toLowerCase().split(<i>"-"</i>),
-</code><code id="L3117"><span class="ln">3117</span>                se<span class="s"> = </span>isEnd ? <i>"end"</i> : <i>"start"</i>,
-</code><code id="L3118"><span class="ln">3118</span>                i<span class="s"> = </span>values.length,
-</code><code id="L3119"><span class="ln">3119</span>                type<span class="s"> = </span><i>"classic"</i>,
-</code><code id="L3120"><span class="ln">3120</span>                w<span class="s"> = </span><i>"medium"</i>,
-</code><code id="L3121"><span class="ln">3121</span>                h<span class="s"> = </span><i>"medium"</i>;
-</code><code id="L3122"><span class="ln">3122</span>            <b>while</b> (i--) {
-</code><code id="L3123"><span class="ln">3123</span>                <b>switch</b> (values[i]) {
-</code><code id="L3124"><span class="ln">3124</span>                    <b>case</b> <i>"block"</i>:
-</code><code id="L3125"><span class="ln">3125</span>                    <b>case</b> <i>"classic"</i>:
-</code><code id="L3126"><span class="ln">3126</span>                    <b>case</b> <i>"oval"</i>:
-</code><code id="L3127"><span class="ln">3127</span>                    <b>case</b> <i>"diamond"</i>:
-</code><code id="L3128"><span class="ln">3128</span>                    <b>case</b> <i>"open"</i>:
-</code><code id="L3129"><span class="ln">3129</span>                    <b>case</b> <i>"none"</i>:
-</code><code id="L3130"><span class="ln">3130</span>                        type<span class="s"> = </span>values[i];
-</code><code id="L3131"><span class="ln">3131</span>                        <b>break</b>;
-</code><code id="L3132"><span class="ln">3132</span>                    <b>case</b> <i>"wide"</i>:
-</code><code id="L3133"><span class="ln">3133</span>                    <b>case</b> <i>"narrow"</i>: h<span class="s"> = </span>values[i]; <b>break</b>;
-</code><code id="L3134"><span class="ln">3134</span>                    <b>case</b> <i>"<b>long</b>"</i>:
-</code><code id="L3135"><span class="ln">3135</span>                    <b>case</b> <i>"<b>short</b>"</i>: w<span class="s"> = </span>values[i]; <b>break</b>;
-</code><code id="L3136"><span class="ln">3136</span>                }
-</code><code id="L3137"><span class="ln">3137</span>            }
-</code><code id="L3138"><span class="ln">3138</span>            <b>var</b> stroke<span class="s"> = </span>o.node.getElementsByTagName(<i>"stroke"</i>)[<span class="d">0</span>];
-</code><code id="L3139"><span class="ln">3139</span>            stroke[se<span class="s"> + </span><i>"arrow"</i>]<span class="s"> = </span>type;
-</code><code id="L3140"><span class="ln">3140</span>            stroke[se<span class="s"> + </span><i>"arrowlength"</i>]<span class="s"> = </span>w;
-</code><code id="L3141"><span class="ln">3141</span>            stroke[se<span class="s"> + </span><i>"arrowwidth"</i>]<span class="s"> = </span>h;
-</code><code id="L3142"><span class="ln">3142</span>        };
-</code><code id="L3143"><span class="ln">3143</span>        setFillAndStroke<span class="s"> = </span><b>function</b> (o, params) {
-</code><code id="L3144"><span class="ln">3144</span>            o.paper.canvas.style.display<span class="s"> = </span><i>"none"</i>;
-</code><code id="L3145"><span class="ln">3145</span>            o.attrs<span class="s"> = </span>o.attrs<span class="s"> || </span>{};
-</code><code id="L3146"><span class="ln">3146</span>            <b>var</b> node<span class="s"> = </span>o.node,
-</code><code id="L3147"><span class="ln">3147</span>                a<span class="s"> = </span>o.attrs,
-</code><code id="L3148"><span class="ln">3148</span>                s<span class="s"> = </span>node.style,
-</code><code id="L3149"><span class="ln">3149</span>                xy,
-</code><code id="L3150"><span class="ln">3150</span>                newpath<span class="s"> = </span>pathTypes[o.type]<span class="s"> &amp;&amp; </span>(params.x != a.x<span class="s"> || </span>params.y != a.y<span class="s"> || </span>params.width != a.width<span class="s"> || </span>params.height != a.height<span class="s"> || </span>params.cx != a.cx<span class="s"> || </span>params.cy != a.cy<span class="s"> || </span>params.rx != a.rx<span class="s"> || </span>params.ry != a.ry<span class="s"> || </span>params.r != a.r),
-</code><code id="L3151"><span class="ln">3151</span>                isOval<span class="s"> = </span>ovalTypes[o.type]<span class="s"> &amp;&amp; </span>(a.cx != params.cx<span class="s"> || </span>a.cy != params.cy<span class="s"> || </span>a.r != params.r<span class="s"> || </span>a.rx != params.rx<span class="s"> || </span>a.ry != params.ry),
-</code><code id="L3152"><span class="ln">3152</span>                res<span class="s"> = </span>o;
-</code><code id="L3153"><span class="ln">3153</span>
+</span></code><code id="L32"><span class="ln">32</span><span class="c">    <span class="s"> | </span><span class="c">// Each of the following examples create a canvas</span>
+</span></code><code id="L33"><span class="ln">33</span><span class="c">    <span class="s"> | </span><span class="c">// that is 320px wide by 200px high.</span>
+</span></code><code id="L34"><span class="ln">34</span><span class="c">    <span class="s"> | </span><span class="c">// Canvas is created at the viewport’s <span class="d">10</span>,<span class="d">50</span> coordinate.</span>
+</span></code><code id="L35"><span class="ln">35</span><span class="c">    <span class="s"> | </span><b>var</b> paper<span class="s"> = </span>Raphael(<span class="d">10</span>, <span class="d">50</span>, <span class="d">320</span>, <span class="d">200</span>);
+</span></code><code id="L36"><span class="ln">36</span><span class="c">    <span class="s"> | </span><span class="c">// Canvas is created at the top left corner of the #notepad element</span>
+</span></code><code id="L37"><span class="ln">37</span><span class="c">    <span class="s"> | </span><span class="c">// (or its top right corner <b>in</b> dir=<i>"rtl"</i> elements)</span>
+</span></code><code id="L38"><span class="ln">38</span><span class="c">    <span class="s"> | </span><b>var</b> paper<span class="s"> = </span>Raphael(document.getElementById(<i>"notepad"</i>), <span class="d">320</span>, <span class="d">200</span>);
+</span></code><code id="L39"><span class="ln">39</span><span class="c">    <span class="s"> | </span><span class="c">// Same as above</span>
+</span></code><code id="L40"><span class="ln">40</span><span class="c">    <span class="s"> | </span><b>var</b> paper<span class="s"> = </span>Raphael(<i>"notepad"</i>, <span class="d">320</span>, <span class="d">200</span>);
+</span></code><code id="L41"><span class="ln">41</span><span class="c">    <span class="s"> | </span><span class="c">// Image dump</span>
+</span></code><code id="L42"><span class="ln">42</span><span class="c">    <span class="s"> | </span><b>var</b> set<span class="s"> = </span>Raphael([<i>"notepad"</i>, <span class="d">320</span>, <span class="d">200</span>, {
+</span></code><code id="L43"><span class="ln">43</span><span class="c">    <span class="s"> | </span>    type: <i>"rect"</i>,
+</span></code><code id="L44"><span class="ln">44</span><span class="c">    <span class="s"> | </span>    x: <span class="d">10</span>,
+</span></code><code id="L45"><span class="ln">45</span><span class="c">    <span class="s"> | </span>    y: <span class="d">10</span>,
+</span></code><code id="L46"><span class="ln">46</span><span class="c">    <span class="s"> | </span>    width: <span class="d">25</span>,
+</span></code><code id="L47"><span class="ln">47</span><span class="c">    <span class="s"> | </span>    height: <span class="d">25</span>,
+</span></code><code id="L48"><span class="ln">48</span><span class="c">    <span class="s"> | </span>    stroke: <i>"#f00"</i>
+</span></code><code id="L49"><span class="ln">49</span><span class="c">    <span class="s"> | </span>}, {
+</span></code><code id="L50"><span class="ln">50</span><span class="c">    <span class="s"> | </span>    type: <i>"text"</i>,
+</span></code><code id="L51"><span class="ln">51</span><span class="c">    <span class="s"> | </span>    x: <span class="d">30</span>,
+</span></code><code id="L52"><span class="ln">52</span><span class="c">    <span class="s"> | </span>    y: <span class="d">40</span>,
+</span></code><code id="L53"><span class="ln">53</span><span class="c">    <span class="s"> | </span>    text: <i>"Dump"</i>
+</span></code><code id="L54"><span class="ln">54</span><span class="c">    <span class="s"> | </span>}]);
+</span></code><code id="L55"><span class="ln">55</span><span class="c">    \*/</span>
+</code><code id="L56"><span class="ln">56</span>    <b>function</b> R(first) {
+</code><code id="L57"><span class="ln">57</span>        <b>if</b> (R.is(first, <i>"<b>function</b>"</i>)) {
+</code><code id="L58"><span class="ln">58</span>            <b>return</b> eve.on(<i>"DOMload"</i>, first);
+</code><code id="L59"><span class="ln">59</span>        } <b>else</b> <b>if</b> (R.is(first, array)) {
+</code><code id="L60"><span class="ln">60</span>            <b>var</b> a<span class="s"> = </span>first,
+</code><code id="L61"><span class="ln">61</span>                cnv<span class="s"> = </span>create[apply](R, a.splice(<span class="d">0</span>, <span class="d">3</span><span class="s"> + </span>R.is(a[<span class="d">0</span>], nu))),
+</code><code id="L62"><span class="ln">62</span>                res<span class="s"> = </span>cnv.set(),
+</code><code id="L63"><span class="ln">63</span>                i<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L64"><span class="ln">64</span>                ii<span class="s"> = </span>a.length,
+</code><code id="L65"><span class="ln">65</span>                j;
+</code><code id="L66"><span class="ln">66</span>            <b>for</b> (; i &lt; ii; i++) {
+</code><code id="L67"><span class="ln">67</span>                j<span class="s"> = </span>a[i]<span class="s"> || </span>{};
+</code><code id="L68"><span class="ln">68</span>                elements[has](j.type)<span class="s"> &amp;&amp; </span>res.push(cnv[j.type]().attr(j));
+</code><code id="L69"><span class="ln">69</span>            }
+</code><code id="L70"><span class="ln">70</span>            <b>return</b> res;
+</code><code id="L71"><span class="ln">71</span>        }
+</code><code id="L72"><span class="ln">72</span>        <b>return</b> create[apply](R, arguments);
+</code><code id="L73"><span class="ln">73</span>    }
+</code><code id="L74"><span class="ln">74</span>    R.version<span class="s"> = </span><i>"<span class="d">2.0</span><span class="d">.0</span>"</i>;
+</code><code id="L75"><span class="ln">75</span>    <b>var</b> separator<span class="s"> = </span>/[, ]+/,
+</code><code id="L76"><span class="ln">76</span>        elements<span class="s"> = </span>{circle: <span class="d">1</span>, rect: <span class="d">1</span>, path: <span class="d">1</span>, ellipse: <span class="d">1</span>, text: <span class="d">1</span>, image: <span class="d">1</span>},
+</code><code id="L77"><span class="ln">77</span>        formatrg<span class="s"> = </span>/\{(\d+)\}/g,
+</code><code id="L78"><span class="ln">78</span>        proto<span class="s"> = </span><i>"prototype"</i>,
+</code><code id="L79"><span class="ln">79</span>        has<span class="s"> = </span><i>"hasOwnProperty"</i>,
+</code><code id="L80"><span class="ln">80</span>        g<span class="s"> = </span>{
+</code><code id="L81"><span class="ln">81</span>            doc: document,
+</code><code id="L82"><span class="ln">82</span>            win: window
+</code><code id="L83"><span class="ln">83</span>        },
+</code><code id="L84"><span class="ln">84</span>        oldRaphael<span class="s"> = </span>{
+</code><code id="L85"><span class="ln">85</span>            was: Object.prototype[has].call(g.win, <i>"Raphael"</i>),
+</code><code id="L86"><span class="ln">86</span>            is: g.win.Raphael
+</code><code id="L87"><span class="ln">87</span>        },
+</code><code id="L88"><span class="ln">88</span>        Paper<span class="s"> = </span><b>function</b> () {},
+</code><code id="L89"><span class="ln">89</span>        paperproto,
+</code><code id="L90"><span class="ln">90</span>        appendChild<span class="s"> = </span><i>"appendChild"</i>,
+</code><code id="L91"><span class="ln">91</span>        apply<span class="s"> = </span><i>"apply"</i>,
+</code><code id="L92"><span class="ln">92</span>        concat<span class="s"> = </span><i>"concat"</i>,
+</code><code id="L93"><span class="ln">93</span>        supportsTouch<span class="s"> = </span><i>"createTouch"</i> <b>in</b> g.doc,
+</code><code id="L94"><span class="ln">94</span>        E<span class="s"> = </span><i>""</i>,
+</code><code id="L95"><span class="ln">95</span>        S<span class="s"> = </span><i>" "</i>,
+</code><code id="L96"><span class="ln">96</span>        Str<span class="s"> = </span>String,
+</code><code id="L97"><span class="ln">97</span>        split<span class="s"> = </span><i>"split"</i>,
+</code><code id="L98"><span class="ln">98</span>        events<span class="s"> = </span><i>"click dblclick mousedown mousemove mouseout mouseover mouseup touchstart touchmove touchend orientationchange touchcancel gesturestart gesturechange gestureend"</i>.split(S),
+</code><code id="L99"><span class="ln">99</span>        touchMap<span class="s"> = </span>{
+</code><code id="L100"><span class="ln">100</span>            mousedown: <i>"touchstart"</i>,
+</code><code id="L101"><span class="ln">101</span>            mousemove: <i>"touchmove"</i>,
+</code><code id="L102"><span class="ln">102</span>            mouseup: <i>"touchend"</i>
+</code><code id="L103"><span class="ln">103</span>        },
+</code><code id="L104"><span class="ln">104</span>        lowerCase<span class="s"> = </span>Str.prototype.toLowerCase,
+</code><code id="L105"><span class="ln">105</span>        math<span class="s"> = </span>Math,
+</code><code id="L106"><span class="ln">106</span>        mmax<span class="s"> = </span>math.max,
+</code><code id="L107"><span class="ln">107</span>        mmin<span class="s"> = </span>math.min,
+</code><code id="L108"><span class="ln">108</span>        abs<span class="s"> = </span>math.abs,
+</code><code id="L109"><span class="ln">109</span>        pow<span class="s"> = </span>math.pow,
+</code><code id="L110"><span class="ln">110</span>        PI<span class="s"> = </span>math.PI,
+</code><code id="L111"><span class="ln">111</span>        nu<span class="s"> = </span><i>"number"</i>,
+</code><code id="L112"><span class="ln">112</span>        string<span class="s"> = </span><i>"string"</i>,
+</code><code id="L113"><span class="ln">113</span>        array<span class="s"> = </span><i>"array"</i>,
+</code><code id="L114"><span class="ln">114</span>        toString<span class="s"> = </span><i>"toString"</i>,
+</code><code id="L115"><span class="ln">115</span>        fillString<span class="s"> = </span><i>"fill"</i>,
+</code><code id="L116"><span class="ln">116</span>        objectToString<span class="s"> = </span>Object.prototype.toString,
+</code><code id="L117"><span class="ln">117</span>        paper<span class="s"> = </span>{},
+</code><code id="L118"><span class="ln">118</span>        push<span class="s"> = </span><i>"push"</i>,
+</code><code id="L119"><span class="ln">119</span>        ISURL<span class="s"> = </span>/^url\([<i>'"]?([^\)]+?)['</i>"]?\)$/i,
+</code><code id="L120"><span class="ln">120</span>        colourRegExp<span class="s"> = </span>/^\s*((#[a-f\d]{<span class="d">6</span>})|(#[a-f\d]{<span class="d">3</span>})|rgba?\(\s*([\d\.]+%?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\)|hsba?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\)|hsla?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\))\s*$/i,
+</code><code id="L121"><span class="ln">121</span>        isnan<span class="s"> = </span>{<i>"NaN"</i>: <span class="d">1</span>, <i>"Infinity"</i>: <span class="d">1</span>, <i>"-Infinity"</i>: <span class="d">1</span>},
+</code><code id="L122"><span class="ln">122</span>        bezierrg<span class="s"> = </span>/^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/,
+</code><code id="L123"><span class="ln">123</span>        round<span class="s"> = </span>math.round,
+</code><code id="L124"><span class="ln">124</span>        setAttribute<span class="s"> = </span><i>"setAttribute"</i>,
+</code><code id="L125"><span class="ln">125</span>        toFloat<span class="s"> = </span>parseFloat,
+</code><code id="L126"><span class="ln">126</span>        toInt<span class="s"> = </span>parseInt,
+</code><code id="L127"><span class="ln">127</span>        ms<span class="s"> = </span><i>" progid:DXImageTransform.Microsoft"</i>,
+</code><code id="L128"><span class="ln">128</span>        upperCase<span class="s"> = </span>Str.prototype.toUpperCase,
+</code><code id="L129"><span class="ln">129</span>        availableAttrs<span class="s"> = </span>{<i>"arrow-end"</i>: <i>"none"</i>, <i>"arrow-start"</i>: <i>"none"</i>, blur: <span class="d">0</span>, <i>"clip-rect"</i>: <i>"<span class="d">0</span> <span class="d">0</span> <span class="d">1e9</span> <span class="d">1e9</span>"</i>, cursor: <i>"<b>default</b>"</i>, cx: <span class="d">0</span>, cy: <span class="d">0</span>, fill: <i>"#fff"</i>, <i>"fill-opacity"</i>: <span class="d">1</span>, font: <i>'10px "Arial"'</i>, <i>"font-family"</i>: <i>'"Arial"'</i>, <i>"font-size"</i>: <i>"<span class="d">10</span>"</i>, <i>"font-style"</i>: <i>"normal"</i>, <i>"font-weight"</i>: <span class="d">400</span>, gradient: <span class="d">0</span>, height: <span class="d">0</span>, href: <i>"http:<span class="c">//raphaeljs.com/"</i>, opacity: <span class="d">1</span>, path: <i>"M0,<span class="d">0</span>"</i>, r: <span class="d">0</span>, rx: <span class="d">0</span>, ry: <span class="d">0</span>, src: <i>""</i>, stroke: <i>"#<span class="d">000</span>"</i>, <i>"stroke-dasharray"</i>: <i>""</i>, <i>"stroke-linecap"</i>: <i>"butt"</i>, <i>"stroke-linejoin"</i>: <i>"butt"</i>, <i>"stroke-miterlimit"</i>: <span class="d">0</span>, <i>"stroke-opacity"</i>: <span class="d">1</span>, <i>"stroke-width"</i>: <span class="d">1</span>, target: <i>"_blank"</i>, <i>"text-anchor"</i>: <i>"middle"</i>, title: <i>"Raphael"</i>, transform: <i>""</i>, width: <span class="d">0</span>, x: <span class="d">0</span>, y: <span class="d">0</span>},</span>
+</code><code id="L130"><span class="ln">130</span>        availableAnimAttrs<span class="s"> = </span>{blur: nu, <i>"clip-rect"</i>: <i>"csv"</i>, cx: nu, cy: nu, fill: <i>"colour"</i>, <i>"fill-opacity"</i>: nu, <i>"font-size"</i>: nu, height: nu, opacity: nu, path: <i>"path"</i>, r: nu, rx: nu, ry: nu, stroke: <i>"colour"</i>, <i>"stroke-opacity"</i>: nu, <i>"stroke-width"</i>: nu, transform: <i>"transform"</i>, width: nu, x: nu, y: nu},
+</code><code id="L131"><span class="ln">131</span>        commaSpaces<span class="s"> = </span>/\s*,\s*/,
+</code><code id="L132"><span class="ln">132</span>        hsrg<span class="s"> = </span>{hs: <span class="d">1</span>, rg: <span class="d">1</span>},
+</code><code id="L133"><span class="ln">133</span>        p2s<span class="s"> = </span>/,?([achlmqrstvxz]),?/gi,
+</code><code id="L134"><span class="ln">134</span>        pathCommand<span class="s"> = </span>/([achlmqstvz])[\s,]*((-?\d*\.?\d*(?:e[-+]?\d+)?\s*,?\s*)+)/ig,
+</code><code id="L135"><span class="ln">135</span>        tCommand<span class="s"> = </span>/([rstm])[\s,]*((-?\d*\.?\d*(?:e[-+]?\d+)?\s*,?\s*)+)/ig,
+</code><code id="L136"><span class="ln">136</span>        pathValues<span class="s"> = </span>/(-?\d*\.?\d*(?:e[-+]?\d+)?)\s*,?\s*/ig,
+</code><code id="L137"><span class="ln">137</span>        radial_gradient<span class="s"> = </span>/^r(?:\(([^,]+?)\s*,\s*([^\)]+?)\))?/,
+</code><code id="L138"><span class="ln">138</span>        sortByKey<span class="s"> = </span><b>function</b> (a, b) {
+</code><code id="L139"><span class="ln">139</span>            <b>return</b> a.key<span class="s"> - </span>b.key;
+</code><code id="L140"><span class="ln">140</span>        },
+</code><code id="L141"><span class="ln">141</span>        sortByNumber<span class="s"> = </span><b>function</b> (a, b) {
+</code><code id="L142"><span class="ln">142</span>            <b>return</b> a<span class="s"> - </span>b;
+</code><code id="L143"><span class="ln">143</span>        },
+</code><code id="L144"><span class="ln">144</span>        fun<span class="s"> = </span><b>function</b> () {},
+</code><code id="L145"><span class="ln">145</span>        pipe<span class="s"> = </span><b>function</b> (x) {
+</code><code id="L146"><span class="ln">146</span>            <b>return</b> x;
+</code><code id="L147"><span class="ln">147</span>        },
+</code><code id="L148"><span class="ln">148</span>        rectPath<span class="s"> = </span><b>function</b> (x, y, w, h, r) {
+</code><code id="L149"><span class="ln">149</span>            <b>if</b> (r) {
+</code><code id="L150"><span class="ln">150</span>                <b>return</b> [[<i>"M"</i>, x<span class="s"> + </span>r, y], [<i>"l"</i>, w<span class="s"> - </span>r<span class="s"> * </span><span class="d">2</span>, <span class="d">0</span>], [<i>"a"</i>, r, r, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, r, r], [<i>"l"</i>, <span class="d">0</span>, h<span class="s"> - </span>r<span class="s"> * </span><span class="d">2</span>], [<i>"a"</i>, r, r, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, -r, r], [<i>"l"</i>, r<span class="s"> * </span><span class="d">2</span><span class="s"> - </span>w, <span class="d">0</span>], [<i>"a"</i>, r, r, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, -r, -r], [<i>"l"</i>, <span class="d">0</span>, r<span class="s"> * </span><span class="d">2</span><span class="s"> - </span>h], [<i>"a"</i>, r, r, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, r, -r], [<i>"z"</i>]];
+</code><code id="L151"><span class="ln">151</span>            }
+</code><code id="L152"><span class="ln">152</span>            <b>return</b> [[<i>"M"</i>, x, y], [<i>"l"</i>, w, <span class="d">0</span>], [<i>"l"</i>, <span class="d">0</span>, h], [<i>"l"</i>, -w, <span class="d">0</span>], [<i>"z"</i>]];
+</code><code id="L153"><span class="ln">153</span>        },
+</code><code id="L154"><span class="ln">154</span>        ellipsePath<span class="s"> = </span><b>function</b> (x, y, rx, ry) {
+</code><code id="L155"><span class="ln">155</span>            <b>if</b> (ry<span class="s"> == </span><b>null</b>) {
+</code><code id="L156"><span class="ln">156</span>                ry<span class="s"> = </span>rx;
+</code><code id="L157"><span class="ln">157</span>            }
+</code><code id="L158"><span class="ln">158</span>            <b>return</b> [[<i>"M"</i>, x, y], [<i>"m"</i>, <span class="d">0</span>, -ry], [<i>"a"</i>, rx, ry, <span class="d">0</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">0</span>, <span class="d">2</span><span class="s"> * </span>ry], [<i>"a"</i>, rx, ry, <span class="d">0</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">0</span>, -<span class="d">2</span><span class="s"> * </span>ry], [<i>"z"</i>]];
+</code><code id="L159"><span class="ln">159</span>        },
+</code><code id="L160"><span class="ln">160</span>        getPath<span class="s"> = </span>{
+</code><code id="L161"><span class="ln">161</span>            path: <b>function</b> (el) {
+</code><code id="L162"><span class="ln">162</span>                <b>return</b> el.attr(<i>"path"</i>);
+</code><code id="L163"><span class="ln">163</span>            },
+</code><code id="L164"><span class="ln">164</span>            circle: <b>function</b> (el) {
+</code><code id="L165"><span class="ln">165</span>                <b>var</b> a<span class="s"> = </span>el.attrs;
+</code><code id="L166"><span class="ln">166</span>                <b>return</b> ellipsePath(a.cx, a.cy, a.r);
+</code><code id="L167"><span class="ln">167</span>            },
+</code><code id="L168"><span class="ln">168</span>            ellipse: <b>function</b> (el) {
+</code><code id="L169"><span class="ln">169</span>                <b>var</b> a<span class="s"> = </span>el.attrs;
+</code><code id="L170"><span class="ln">170</span>                <b>return</b> ellipsePath(a.cx, a.cy, a.rx, a.ry);
+</code><code id="L171"><span class="ln">171</span>            },
+</code><code id="L172"><span class="ln">172</span>            rect: <b>function</b> (el) {
+</code><code id="L173"><span class="ln">173</span>                <b>var</b> a<span class="s"> = </span>el.attrs;
+</code><code id="L174"><span class="ln">174</span>                <b>return</b> rectPath(a.x, a.y, a.width, a.height, a.r);
+</code><code id="L175"><span class="ln">175</span>            },
+</code><code id="L176"><span class="ln">176</span>            image: <b>function</b> (el) {
+</code><code id="L177"><span class="ln">177</span>                <b>var</b> a<span class="s"> = </span>el.attrs;
+</code><code id="L178"><span class="ln">178</span>                <b>return</b> rectPath(a.x, a.y, a.width, a.height);
+</code><code id="L179"><span class="ln">179</span>            },
+</code><code id="L180"><span class="ln">180</span>            text: <b>function</b> (el) {
+</code><code id="L181"><span class="ln">181</span>                <b>var</b> bbox<span class="s"> = </span>el._getBBox();
+</code><code id="L182"><span class="ln">182</span>                <b>return</b> rectPath(bbox.x, bbox.y, bbox.width, bbox.height);
+</code><code id="L183"><span class="ln">183</span>            }
+</code><code id="L184"><span class="ln">184</span>        },
+</code><code id="L185"><span class="ln">185</span>        mapPath<span class="s"> = </span><b>function</b> (path, matrix) {
+</code><code id="L186"><span class="ln">186</span>            <b>if</b> (!matrix) {
+</code><code id="L187"><span class="ln">187</span>                <b>return</b> path;
+</code><code id="L188"><span class="ln">188</span>            }
+</code><code id="L189"><span class="ln">189</span>            <b>var</b> x, y, i, j, pathi;
+</code><code id="L190"><span class="ln">190</span>            path<span class="s"> = </span>path2curve(path);
+</code><code id="L191"><span class="ln">191</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>path.length; i &lt; ii; i++) {
+</code><code id="L192"><span class="ln">192</span>                pathi<span class="s"> = </span>path[i];
+</code><code id="L193"><span class="ln">193</span>                <b>for</b> (j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>pathi.length; j &lt; jj; j += <span class="d">2</span>) {
+</code><code id="L194"><span class="ln">194</span>                    x<span class="s"> = </span>matrix.x(pathi[j], pathi[j<span class="s"> + </span><span class="d">1</span>]);
+</code><code id="L195"><span class="ln">195</span>                    y<span class="s"> = </span>matrix.y(pathi[j], pathi[j<span class="s"> + </span><span class="d">1</span>]);
+</code><code id="L196"><span class="ln">196</span>                    pathi[j]<span class="s"> = </span>x;
+</code><code id="L197"><span class="ln">197</span>                    pathi[j<span class="s"> + </span><span class="d">1</span>]<span class="s"> = </span>y;
+</code><code id="L198"><span class="ln">198</span>                }
+</code><code id="L199"><span class="ln">199</span>            }
+</code><code id="L200"><span class="ln">200</span>            <b>return</b> path;
+</code><code id="L201"><span class="ln">201</span>        };
+</code><code id="L202"><span class="ln">202</span>
+</code><code id="L203"><span class="ln">203</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L204"><span class="ln">204</span><span class="c">    <span class="s"> * </span>Raphael.type
+</span></code><code id="L205"><span class="ln">205</span><span class="c">     [ property (string) ]
+</span></code><code id="L206"><span class="ln">206</span><span class="c">     **
+</span></code><code id="L207"><span class="ln">207</span><span class="c">    <span class="s"> * </span>Can be “SVG”, “VML” or empty, depending on browser support.
+</span></code><code id="L208"><span class="ln">208</span><span class="c">    \*/</span>
+</code><code id="L209"><span class="ln">209</span>    R.type<span class="s"> = </span>(g.win.SVGAngle<span class="s"> || </span>g.doc.implementation.hasFeature(<i>"http:<span class="c">//www.w3.org/TR/SVG11/feature#BasicStructure"</i>, <i>"<span class="d">1.1</span>"</i>) ? <i>"SVG"</i> : <i>"VML"</i>);</span>
+</code><code id="L210"><span class="ln">210</span>    <b>if</b> (R.type<span class="s"> == </span><i>"VML"</i>) {
+</code><code id="L211"><span class="ln">211</span>        <b>var</b> d<span class="s"> = </span>g.doc.createElement(<i>"div"</i>),
+</code><code id="L212"><span class="ln">212</span>            b;
+</code><code id="L213"><span class="ln">213</span>        d.innerHTML<span class="s"> = </span><i>'&lt;v:shape adj="<span class="d">1</span>"/>'</i>;
+</code><code id="L214"><span class="ln">214</span>        b<span class="s"> = </span>d.firstChild;
+</code><code id="L215"><span class="ln">215</span>        b.style.behavior<span class="s"> = </span><i>"url(#<b>default</b>#VML)"</i>;
+</code><code id="L216"><span class="ln">216</span>        <b>if</b> (!(b<span class="s"> &amp;&amp; </span><b>typeof</b> b.adj<span class="s"> == </span><i>"object"</i>)) {
+</code><code id="L217"><span class="ln">217</span>            <b>return</b> R.type<span class="s"> = </span>E;
+</code><code id="L218"><span class="ln">218</span>        }
+</code><code id="L219"><span class="ln">219</span>        d<span class="s"> = </span><b>null</b>;
+</code><code id="L220"><span class="ln">220</span>    }
+</code><code id="L221"><span class="ln">221</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L222"><span class="ln">222</span><span class="c">    <span class="s"> * </span>Raphael.svg
+</span></code><code id="L223"><span class="ln">223</span><span class="c">     [ property (<b>boolean</b>) ]
+</span></code><code id="L224"><span class="ln">224</span><span class="c">     **
+</span></code><code id="L225"><span class="ln">225</span><span class="c">    <span class="s"> * </span>`<b>true</b>` <b>if</b> browser supports SVG.
+</span></code><code id="L226"><span class="ln">226</span><span class="c">    \*/</span>
+</code><code id="L227"><span class="ln">227</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L228"><span class="ln">228</span><span class="c">    <span class="s"> * </span>Raphael.vml
+</span></code><code id="L229"><span class="ln">229</span><span class="c">     [ property (<b>boolean</b>) ]
+</span></code><code id="L230"><span class="ln">230</span><span class="c">     **
+</span></code><code id="L231"><span class="ln">231</span><span class="c">    <span class="s"> * </span>`<b>true</b>` <b>if</b> browser supports VML.
+</span></code><code id="L232"><span class="ln">232</span><span class="c">    \*/</span>
+</code><code id="L233"><span class="ln">233</span>    R.svg<span class="s"> = </span>!(R.vml<span class="s"> = </span>R.type<span class="s"> == </span><i>"VML"</i>);
+</code><code id="L234"><span class="ln">234</span>    paperproto<span class="s"> = </span>Paper.prototype<span class="s"> = </span>R.prototype;
+</code><code id="L235"><span class="ln">235</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L236"><span class="ln">236</span><span class="c">    <span class="s"> * </span>Paper.customAttributes
+</span></code><code id="L237"><span class="ln">237</span><span class="c">     [ property (object) ]
+</span></code><code id="L238"><span class="ln">238</span><span class="c">     **
+</span></code><code id="L239"><span class="ln">239</span><span class="c">    <span class="s"> * </span>If you have a set of attributes that you would like to represent
+</span></code><code id="L240"><span class="ln">240</span><span class="c">    <span class="s"> * </span>as a <b>function</b> of some number you can <b>do</b> it easily <b>with</b> custom attributes:
+</span></code><code id="L241"><span class="ln">241</span><span class="c">     > Usage
+</span></code><code id="L242"><span class="ln">242</span><span class="c">    <span class="s"> | </span>paper.customAttributes.hue<span class="s"> = </span><b>function</b> (num) {
+</span></code><code id="L243"><span class="ln">243</span><span class="c">    <span class="s"> | </span>    num<span class="s"> = </span>num<span class="s"> % </span><span class="d">1</span>;
+</span></code><code id="L244"><span class="ln">244</span><span class="c">    <span class="s"> | </span>    <b>return</b> {fill: <i>"hsb("</i><span class="s"> + </span>num<span class="s"> + </span><i>", <span class="d">.75</span>, <span class="d">1</span>)"</i>};
+</span></code><code id="L245"><span class="ln">245</span><span class="c">    <span class="s"> | </span>};
+</span></code><code id="L246"><span class="ln">246</span><span class="c">    <span class="s"> | </span><span class="c">// Custom attribute “hue” will change fill</span>
+</span></code><code id="L247"><span class="ln">247</span><span class="c">    <span class="s"> | </span><span class="c">// to be given hue <b>with</b> fixed saturation and brightness.</span>
+</span></code><code id="L248"><span class="ln">248</span><span class="c">    <span class="s"> | </span><span class="c">// Now you can use it like <b>this</b>:</span>
+</span></code><code id="L249"><span class="ln">249</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.circle(<span class="d">10</span>, <span class="d">10</span>, <span class="d">10</span>).attr({hue: <span class="d">.45</span>});
+</span></code><code id="L250"><span class="ln">250</span><span class="c">    <span class="s"> | </span><span class="c">// or even like <b>this</b>:</span>
+</span></code><code id="L251"><span class="ln">251</span><span class="c">    <span class="s"> | </span>c.animate({hue: <span class="d">1</span>}, <span class="d">1e3</span>);
+</span></code><code id="L252"><span class="ln">252</span><span class="c">    <span class="s"> | </span>
+</span></code><code id="L253"><span class="ln">253</span><span class="c">    <span class="s"> | </span><span class="c">// You could also create custom attribute</span>
+</span></code><code id="L254"><span class="ln">254</span><span class="c">    <span class="s"> | </span><span class="c">// <b>with</b> multiple parameters:</span>
+</span></code><code id="L255"><span class="ln">255</span><span class="c">    <span class="s"> | </span>paper.customAttributes.hsb<span class="s"> = </span><b>function</b> (h, s, b) {
+</span></code><code id="L256"><span class="ln">256</span><span class="c">    <span class="s"> | </span>    <b>return</b> {fill: <i>"hsb("</i><span class="s"> + </span>[h, s, b].join(<i>","</i>)<span class="s"> + </span><i>")"</i>};
+</span></code><code id="L257"><span class="ln">257</span><span class="c">    <span class="s"> | </span>};
+</span></code><code id="L258"><span class="ln">258</span><span class="c">    <span class="s"> | </span>c.attr({hsb: <i>"<span class="d">.5</span> <span class="d">.8</span> <span class="d">1</span>"</i>});
+</span></code><code id="L259"><span class="ln">259</span><span class="c">    <span class="s"> | </span>c.animate({hsb: <i>"<span class="d">1</span> <span class="d">0</span> <span class="d">.5</span>"</i>}, <span class="d">1e3</span>);
+</span></code><code id="L260"><span class="ln">260</span><span class="c">    \*/</span>
+</code><code id="L261"><span class="ln">261</span>    paperproto.customAttributes<span class="s"> = </span>{};
+</code><code id="L262"><span class="ln">262</span>    R._id<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L263"><span class="ln">263</span>    R._oid<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L264"><span class="ln">264</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L265"><span class="ln">265</span><span class="c">    <span class="s"> * </span>Raphael.fn
+</span></code><code id="L266"><span class="ln">266</span><span class="c">     [ property (object) ]
+</span></code><code id="L267"><span class="ln">267</span><span class="c">     **
+</span></code><code id="L268"><span class="ln">268</span><span class="c">    <span class="s"> * </span>You can add your own method to the canvas. For example <b>if</b> you want to draw a pie chart,
+</span></code><code id="L269"><span class="ln">269</span><span class="c">    <span class="s"> * </span>you can create your own pie chart <b>function</b> and ship it as a Raphaël plugin. To <b>do</b> <b>this</b>
+</span></code><code id="L270"><span class="ln">270</span><span class="c">    <span class="s"> * </span>you need to extend the `Raphael.fn` object. Please note that you can create your own namespaces
+</span></code><code id="L271"><span class="ln">271</span><span class="c">    <span class="s"> * </span>inside the `fn` object — methods will be run <b>in</b> the context of canvas anyway. You should alter
+</span></code><code id="L272"><span class="ln">272</span><span class="c">    <span class="s"> * </span>the `fn` object before a Raphaël instance is created, otherwise it will take no effect.
+</span></code><code id="L273"><span class="ln">273</span><span class="c">     > Usage
+</span></code><code id="L274"><span class="ln">274</span><span class="c">    <span class="s"> | </span>Raphael.fn.arrow<span class="s"> = </span><b>function</b> (x1, y1, x2, y2, size) {
+</span></code><code id="L275"><span class="ln">275</span><span class="c">    <span class="s"> | </span>    <b>return</b> <b>this</b>.path( ... );
+</span></code><code id="L276"><span class="ln">276</span><span class="c">    <span class="s"> | </span>};
+</span></code><code id="L277"><span class="ln">277</span><span class="c">    <span class="s"> | </span><span class="c">// or create namespace</span>
+</span></code><code id="L278"><span class="ln">278</span><span class="c">    <span class="s"> | </span>Raphael.fn.mystuff<span class="s"> = </span>{
+</span></code><code id="L279"><span class="ln">279</span><span class="c">    <span class="s"> | </span>    arrow: <b>function</b> () {…},
+</span></code><code id="L280"><span class="ln">280</span><span class="c">    <span class="s"> | </span>    star: <b>function</b> () {…},
+</span></code><code id="L281"><span class="ln">281</span><span class="c">    <span class="s"> | </span>    <span class="c">// etc…</span>
+</span></code><code id="L282"><span class="ln">282</span><span class="c">    <span class="s"> | </span>};
+</span></code><code id="L283"><span class="ln">283</span><span class="c">    <span class="s"> | </span><b>var</b> paper<span class="s"> = </span>Raphael(<span class="d">10</span>, <span class="d">10</span>, <span class="d">630</span>, <span class="d">480</span>);
+</span></code><code id="L284"><span class="ln">284</span><span class="c">    <span class="s"> | </span><span class="c">// then use it</span>
+</span></code><code id="L285"><span class="ln">285</span><span class="c">    <span class="s"> | </span>paper.arrow(<span class="d">10</span>, <span class="d">10</span>, <span class="d">30</span>, <span class="d">30</span>, <span class="d">5</span>).attr({fill: <i>"#f00"</i>});
+</span></code><code id="L286"><span class="ln">286</span><span class="c">    <span class="s"> | </span>paper.mystuff.arrow();
+</span></code><code id="L287"><span class="ln">287</span><span class="c">    <span class="s"> | </span>paper.mystuff.star();
+</span></code><code id="L288"><span class="ln">288</span><span class="c">    \*/</span>
+</code><code id="L289"><span class="ln">289</span>    R.fn<span class="s"> = </span>{};
+</code><code id="L290"><span class="ln">290</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L291"><span class="ln">291</span><span class="c">    <span class="s"> * </span>Raphael.is
+</span></code><code id="L292"><span class="ln">292</span><span class="c">     [ method ]
+</span></code><code id="L293"><span class="ln">293</span><span class="c">     **
+</span></code><code id="L294"><span class="ln">294</span><span class="c">    <span class="s"> * </span>Handfull replacement <b>for</b> `<b>typeof</b>` operator.
+</span></code><code id="L295"><span class="ln">295</span><span class="c">     > Parameters
+</span></code><code id="L296"><span class="ln">296</span><span class="c">    <span class="s"> - </span>o (…) any object or primitive
+</span></code><code id="L297"><span class="ln">297</span><span class="c">    <span class="s"> - </span>type (string) name of the type, i.e. “string”, “<b>function</b>”, “number”, etc.
+</span></code><code id="L298"><span class="ln">298</span><span class="c">    <span class="s"> = </span>(<b>boolean</b>) is given value is of given type
+</span></code><code id="L299"><span class="ln">299</span><span class="c">    \*/</span>
+</code><code id="L300"><span class="ln">300</span>    R.is<span class="s"> = </span><b>function</b> (o, type) {
+</code><code id="L301"><span class="ln">301</span>        type<span class="s"> = </span>lowerCase.call(type);
+</code><code id="L302"><span class="ln">302</span>        <b>if</b> (type<span class="s"> == </span><i>"finite"</i>) {
+</code><code id="L303"><span class="ln">303</span>            <b>return</b> !isnan[has](+o);
+</code><code id="L304"><span class="ln">304</span>        }
+</code><code id="L305"><span class="ln">305</span>        <b>return</b>  (type<span class="s"> == </span><i>"<b>null</b>"</i><span class="s"> &amp;&amp; </span>o<span class="s"> === </span><b>null</b>) ||
+</code><code id="L306"><span class="ln">306</span>                (type<span class="s"> == </span><b>typeof</b> o) ||
+</code><code id="L307"><span class="ln">307</span>                (type<span class="s"> == </span><i>"object"</i><span class="s"> &amp;&amp; </span>o<span class="s"> === </span>Object(o)) ||
+</code><code id="L308"><span class="ln">308</span>                (type<span class="s"> == </span><i>"array"</i><span class="s"> &amp;&amp; </span>Array.isArray<span class="s"> &amp;&amp; </span>Array.isArray(o)) ||
+</code><code id="L309"><span class="ln">309</span>                objectToString.call(o).slice(<span class="d">8</span>, -<span class="d">1</span>).toLowerCase()<span class="s"> == </span>type;
+</code><code id="L310"><span class="ln">310</span>    };
+</code><code id="L311"><span class="ln">311</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L312"><span class="ln">312</span><span class="c">    <span class="s"> * </span>Raphael.angle
+</span></code><code id="L313"><span class="ln">313</span><span class="c">     [ method ]
+</span></code><code id="L314"><span class="ln">314</span><span class="c">     **
+</span></code><code id="L315"><span class="ln">315</span><span class="c">    <span class="s"> * </span>Returns angle between two or three points
+</span></code><code id="L316"><span class="ln">316</span><span class="c">     > Parameters
+</span></code><code id="L317"><span class="ln">317</span><span class="c">    <span class="s"> - </span>x1 (number) x coord of first point
+</span></code><code id="L318"><span class="ln">318</span><span class="c">    <span class="s"> - </span>y1 (number) y coord of first point
+</span></code><code id="L319"><span class="ln">319</span><span class="c">    <span class="s"> - </span>x2 (number) x coord of second point
+</span></code><code id="L320"><span class="ln">320</span><span class="c">    <span class="s"> - </span>y2 (number) y coord of second point
+</span></code><code id="L321"><span class="ln">321</span><span class="c">    <span class="s"> - </span>x3 (number) #optional x coord of third point
+</span></code><code id="L322"><span class="ln">322</span><span class="c">    <span class="s"> - </span>y3 (number) #optional y coord of third point
+</span></code><code id="L323"><span class="ln">323</span><span class="c">    <span class="s"> = </span>(number) angle <b>in</b> degrees.
+</span></code><code id="L324"><span class="ln">324</span><span class="c">    \*/</span>
+</code><code id="L325"><span class="ln">325</span>    R.angle<span class="s"> = </span><b>function</b> (x1, y1, x2, y2, x3, y3) {
+</code><code id="L326"><span class="ln">326</span>        <b>if</b> (x3<span class="s"> == </span><b>null</b>) {
+</code><code id="L327"><span class="ln">327</span>            <b>var</b> x<span class="s"> = </span>x1<span class="s"> - </span>x2,
+</code><code id="L328"><span class="ln">328</span>                y<span class="s"> = </span>y1<span class="s"> - </span>y2;
+</code><code id="L329"><span class="ln">329</span>            <b>if</b> (!x<span class="s"> &amp;&amp; </span>!y) {
+</code><code id="L330"><span class="ln">330</span>                <b>return</b> <span class="d">0</span>;
+</code><code id="L331"><span class="ln">331</span>            }
+</code><code id="L332"><span class="ln">332</span>            <b>return</b> (<span class="d">180</span><span class="s"> + </span>math.atan2(-y, -x)<span class="s"> * </span><span class="d">180</span><span class="s"> / </span>PI<span class="s"> + </span><span class="d">360</span>)<span class="s"> % </span><span class="d">360</span>;
+</code><code id="L333"><span class="ln">333</span>        } <b>else</b> {
+</code><code id="L334"><span class="ln">334</span>            <b>return</b> R.angle(x1, y1, x3, y3)<span class="s"> - </span>R.angle(x2, y2, x3, y3);
+</code><code id="L335"><span class="ln">335</span>        }
+</code><code id="L336"><span class="ln">336</span>    };
+</code><code id="L337"><span class="ln">337</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L338"><span class="ln">338</span><span class="c">    <span class="s"> * </span>Raphael.rad
+</span></code><code id="L339"><span class="ln">339</span><span class="c">     [ method ]
+</span></code><code id="L340"><span class="ln">340</span><span class="c">     **
+</span></code><code id="L341"><span class="ln">341</span><span class="c">    <span class="s"> * </span>Transform angle to radians
+</span></code><code id="L342"><span class="ln">342</span><span class="c">     > Parameters
+</span></code><code id="L343"><span class="ln">343</span><span class="c">    <span class="s"> - </span>deg (number) angle <b>in</b> degrees
+</span></code><code id="L344"><span class="ln">344</span><span class="c">    <span class="s"> = </span>(number) angle <b>in</b> radians.
+</span></code><code id="L345"><span class="ln">345</span><span class="c">    \*/</span>
+</code><code id="L346"><span class="ln">346</span>    R.rad<span class="s"> = </span><b>function</b> (deg) {
+</code><code id="L347"><span class="ln">347</span>        <b>return</b> deg<span class="s"> % </span><span class="d">360</span><span class="s"> * </span>PI<span class="s"> / </span><span class="d">180</span>;
+</code><code id="L348"><span class="ln">348</span>    };
+</code><code id="L349"><span class="ln">349</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L350"><span class="ln">350</span><span class="c">    <span class="s"> * </span>Raphael.deg
+</span></code><code id="L351"><span class="ln">351</span><span class="c">     [ method ]
+</span></code><code id="L352"><span class="ln">352</span><span class="c">     **
+</span></code><code id="L353"><span class="ln">353</span><span class="c">    <span class="s"> * </span>Transform angle to degrees
+</span></code><code id="L354"><span class="ln">354</span><span class="c">     > Parameters
+</span></code><code id="L355"><span class="ln">355</span><span class="c">    <span class="s"> - </span>deg (number) angle <b>in</b> radians
+</span></code><code id="L356"><span class="ln">356</span><span class="c">    <span class="s"> = </span>(number) angle <b>in</b> degrees.
+</span></code><code id="L357"><span class="ln">357</span><span class="c">    \*/</span>
+</code><code id="L358"><span class="ln">358</span>    R.deg<span class="s"> = </span><b>function</b> (rad) {
+</code><code id="L359"><span class="ln">359</span>        <b>return</b> rad<span class="s"> * </span><span class="d">180</span><span class="s"> / </span>PI<span class="s"> % </span><span class="d">360</span>;
+</code><code id="L360"><span class="ln">360</span>    };
+</code><code id="L361"><span class="ln">361</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L362"><span class="ln">362</span><span class="c">    <span class="s"> * </span>Raphael.snapTo
+</span></code><code id="L363"><span class="ln">363</span><span class="c">     [ method ]
+</span></code><code id="L364"><span class="ln">364</span><span class="c">     **
+</span></code><code id="L365"><span class="ln">365</span><span class="c">    <span class="s"> * </span>Snaps given value to given grid.
+</span></code><code id="L366"><span class="ln">366</span><span class="c">     > Parameters
+</span></code><code id="L367"><span class="ln">367</span><span class="c">    <span class="s"> - </span>values (array|number) given array of values or step of the grid
+</span></code><code id="L368"><span class="ln">368</span><span class="c">    <span class="s"> - </span>value (number) value to adjust
+</span></code><code id="L369"><span class="ln">369</span><span class="c">    <span class="s"> - </span>tolerance (number) #optional tolerance <b>for</b> snapping. Default is `<span class="d">10</span>`.
+</span></code><code id="L370"><span class="ln">370</span><span class="c">    <span class="s"> = </span>(number) adjusted value.
+</span></code><code id="L371"><span class="ln">371</span><span class="c">    \*/</span>
+</code><code id="L372"><span class="ln">372</span>    R.snapTo<span class="s"> = </span><b>function</b> (values, value, tolerance) {
+</code><code id="L373"><span class="ln">373</span>        tolerance<span class="s"> = </span>R.is(tolerance, <i>"finite"</i>) ? tolerance : <span class="d">10</span>;
+</code><code id="L374"><span class="ln">374</span>        <b>if</b> (R.is(values, array)) {
+</code><code id="L375"><span class="ln">375</span>            <b>var</b> i<span class="s"> = </span>values.length;
+</code><code id="L376"><span class="ln">376</span>            <b>while</b> (i--) <b>if</b> (abs(values[i]<span class="s"> - </span>value) &lt;= tolerance) {
+</code><code id="L377"><span class="ln">377</span>                <b>return</b> values[i];
+</code><code id="L378"><span class="ln">378</span>            }
+</code><code id="L379"><span class="ln">379</span>        } <b>else</b> {
+</code><code id="L380"><span class="ln">380</span>            values<span class="s"> = </span>+values;
+</code><code id="L381"><span class="ln">381</span>            <b>var</b> rem<span class="s"> = </span>value<span class="s"> % </span>values;
+</code><code id="L382"><span class="ln">382</span>            <b>if</b> (rem &lt; tolerance) {
+</code><code id="L383"><span class="ln">383</span>                <b>return</b> value<span class="s"> - </span>rem;
+</code><code id="L384"><span class="ln">384</span>            }
+</code><code id="L385"><span class="ln">385</span>            <b>if</b> (rem > values<span class="s"> - </span>tolerance) {
+</code><code id="L386"><span class="ln">386</span>                <b>return</b> value<span class="s"> - </span>rem<span class="s"> + </span>values;
+</code><code id="L387"><span class="ln">387</span>            }
+</code><code id="L388"><span class="ln">388</span>        }
+</code><code id="L389"><span class="ln">389</span>        <b>return</b> value;
+</code><code id="L390"><span class="ln">390</span>    };
+</code><code id="L391"><span class="ln">391</span>    
+</code><code id="L392"><span class="ln">392</span>    <b>var</b> createUUID<span class="s"> = </span>(<b>function</b> (uuidRegEx, uuidReplacer) {
+</code><code id="L393"><span class="ln">393</span>        <b>return</b> <b>function</b> () {
+</code><code id="L394"><span class="ln">394</span>            <b>return</b> <i>"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx"</i>.replace(uuidRegEx, uuidReplacer).toUpperCase();
+</code><code id="L395"><span class="ln">395</span>        };
+</code><code id="L396"><span class="ln">396</span>    })(/[xy]/g, <b>function</b> (c) {
+</code><code id="L397"><span class="ln">397</span>        <b>var</b> r<span class="s"> = </span>math.random()<span class="s"> * </span><span class="d">16</span><span class="s"> | </span><span class="d">0</span>,
+</code><code id="L398"><span class="ln">398</span>            v<span class="s"> = </span>c<span class="s"> == </span><i>"x"</i> ? r : (r<span class="s"> &amp; </span><span class="d">3</span><span class="s"> | </span><span class="d">8</span>);
+</code><code id="L399"><span class="ln">399</span>        <b>return</b> v.toString(<span class="d">16</span>);
+</code><code id="L400"><span class="ln">400</span>    });
+</code><code id="L401"><span class="ln">401</span>
+</code><code id="L402"><span class="ln">402</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L403"><span class="ln">403</span><span class="c">    <span class="s"> * </span>Raphael.setWindow
+</span></code><code id="L404"><span class="ln">404</span><span class="c">     [ method ]
+</span></code><code id="L405"><span class="ln">405</span><span class="c">     **
+</span></code><code id="L406"><span class="ln">406</span><span class="c">    <span class="s"> * </span>Used when you need to draw <b>in</b> `&lt;iframe>`. Switched window to the iframe one.
+</span></code><code id="L407"><span class="ln">407</span><span class="c">     > Parameters
+</span></code><code id="L408"><span class="ln">408</span><span class="c">    <span class="s"> - </span>newwin (window) <b>new</b> window object
+</span></code><code id="L409"><span class="ln">409</span><span class="c">    \*/</span>
+</code><code id="L410"><span class="ln">410</span>    R.setWindow<span class="s"> = </span><b>function</b> (newwin) {
+</code><code id="L411"><span class="ln">411</span>        eve(<i>"setWindow"</i>, R, g.win, newwin);
+</code><code id="L412"><span class="ln">412</span>        g.win<span class="s"> = </span>newwin;
+</code><code id="L413"><span class="ln">413</span>        g.doc<span class="s"> = </span>g.win.document;
+</code><code id="L414"><span class="ln">414</span>        <b>if</b> (initWin) {
+</code><code id="L415"><span class="ln">415</span>            initWin(g.win);
+</code><code id="L416"><span class="ln">416</span>        }
+</code><code id="L417"><span class="ln">417</span>    };
+</code><code id="L418"><span class="ln">418</span>    <span class="c">// colour utilities</span>
+</code><code id="L419"><span class="ln">419</span>    <b>var</b> toHex<span class="s"> = </span><b>function</b> (color) {
+</code><code id="L420"><span class="ln">420</span>        <b>if</b> (R.vml) {
+</code><code id="L421"><span class="ln">421</span>            <span class="c">// http://dean.edwards.name/weblog/<span class="d">2009</span>/<span class="d">10</span>/convert-any-colour-value-to-hex-<b>in</b>-msie/</span>
+</code><code id="L422"><span class="ln">422</span>            <b>var</b> trim<span class="s"> = </span>/^\s+|\s+$/g;
+</code><code id="L423"><span class="ln">423</span>            <b>var</b> bod;
+</code><code id="L424"><span class="ln">424</span>            <b>try</b> {
+</code><code id="L425"><span class="ln">425</span>                <b>var</b> docum<span class="s"> = </span><b>new</b> ActiveXObject(<i>"htmlfile"</i>);
+</code><code id="L426"><span class="ln">426</span>                docum.write(<i>"&lt;body>"</i>);
+</code><code id="L427"><span class="ln">427</span>                docum.close();
+</code><code id="L428"><span class="ln">428</span>                bod<span class="s"> = </span>docum.body;
+</code><code id="L429"><span class="ln">429</span>            } <b>catch</b>(e) {
+</code><code id="L430"><span class="ln">430</span>                bod<span class="s"> = </span>createPopup().document.body;
+</code><code id="L431"><span class="ln">431</span>            }
+</code><code id="L432"><span class="ln">432</span>            <b>var</b> range<span class="s"> = </span>bod.createTextRange();
+</code><code id="L433"><span class="ln">433</span>            toHex<span class="s"> = </span>cacher(<b>function</b> (color) {
+</code><code id="L434"><span class="ln">434</span>                <b>try</b> {
+</code><code id="L435"><span class="ln">435</span>                    bod.style.color<span class="s"> = </span>Str(color).replace(trim, E);
+</code><code id="L436"><span class="ln">436</span>                    <b>var</b> value<span class="s"> = </span>range.queryCommandValue(<i>"ForeColor"</i>);
+</code><code id="L437"><span class="ln">437</span>                    value<span class="s"> = </span>((value<span class="s"> &amp; </span><span class="d">255</span>) &lt;&lt; <span class="d">16</span>)<span class="s"> | </span>(value<span class="s"> &amp; </span><span class="d">65280</span>)<span class="s"> | </span>((value<span class="s"> &amp; </span><span class="d">16711680</span>) >>> <span class="d">16</span>);
+</code><code id="L438"><span class="ln">438</span>                    <b>return</b> <i>"#"</i><span class="s"> + </span>(<i>"<span class="d">000000</span>"</i><span class="s"> + </span>value.toString(<span class="d">16</span>)).slice(-<span class="d">6</span>);
+</code><code id="L439"><span class="ln">439</span>                } <b>catch</b>(e) {
+</code><code id="L440"><span class="ln">440</span>                    <b>return</b> <i>"none"</i>;
+</code><code id="L441"><span class="ln">441</span>                }
+</code><code id="L442"><span class="ln">442</span>            });
+</code><code id="L443"><span class="ln">443</span>        } <b>else</b> {
+</code><code id="L444"><span class="ln">444</span>            <b>var</b> i<span class="s"> = </span>g.doc.createElement(<i>"i"</i>);
+</code><code id="L445"><span class="ln">445</span>            i.title<span class="s"> = </span><i>"Rapha\xebl Colour Picker"</i>;
+</code><code id="L446"><span class="ln">446</span>            i.style.display<span class="s"> = </span><i>"none"</i>;
+</code><code id="L447"><span class="ln">447</span>            g.doc.body.appendChild(i);
+</code><code id="L448"><span class="ln">448</span>            toHex<span class="s"> = </span>cacher(<b>function</b> (color) {
+</code><code id="L449"><span class="ln">449</span>                i.style.color<span class="s"> = </span>color;
+</code><code id="L450"><span class="ln">450</span>                <b>return</b> g.doc.defaultView.getComputedStyle(i, E).getPropertyValue(<i>"color"</i>);
+</code><code id="L451"><span class="ln">451</span>            });
+</code><code id="L452"><span class="ln">452</span>        }
+</code><code id="L453"><span class="ln">453</span>        <b>return</b> toHex(color);
+</code><code id="L454"><span class="ln">454</span>    },
+</code><code id="L455"><span class="ln">455</span>    hsbtoString<span class="s"> = </span><b>function</b> () {
+</code><code id="L456"><span class="ln">456</span>        <b>return</b> <i>"hsb("</i><span class="s"> + </span>[<b>this</b>.h, <b>this</b>.s, <b>this</b>.b]<span class="s"> + </span><i>")"</i>;
+</code><code id="L457"><span class="ln">457</span>    },
+</code><code id="L458"><span class="ln">458</span>    hsltoString<span class="s"> = </span><b>function</b> () {
+</code><code id="L459"><span class="ln">459</span>        <b>return</b> <i>"hsl("</i><span class="s"> + </span>[<b>this</b>.h, <b>this</b>.s, <b>this</b>.l]<span class="s"> + </span><i>")"</i>;
+</code><code id="L460"><span class="ln">460</span>    },
+</code><code id="L461"><span class="ln">461</span>    rgbtoString<span class="s"> = </span><b>function</b> () {
+</code><code id="L462"><span class="ln">462</span>        <b>return</b> <b>this</b>.hex;
+</code><code id="L463"><span class="ln">463</span>    },
+</code><code id="L464"><span class="ln">464</span>    prepareRGB<span class="s"> = </span><b>function</b> (r, g, b) {
+</code><code id="L465"><span class="ln">465</span>        <b>if</b> (g<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(r, <i>"object"</i>)<span class="s"> &amp;&amp; </span><i>"r"</i> <b>in</b> r<span class="s"> &amp;&amp; </span><i>"g"</i> <b>in</b> r<span class="s"> &amp;&amp; </span><i>"b"</i> <b>in</b> r) {
+</code><code id="L466"><span class="ln">466</span>            b<span class="s"> = </span>r.b;
+</code><code id="L467"><span class="ln">467</span>            g<span class="s"> = </span>r.g;
+</code><code id="L468"><span class="ln">468</span>            r<span class="s"> = </span>r.r;
+</code><code id="L469"><span class="ln">469</span>        }
+</code><code id="L470"><span class="ln">470</span>        <b>if</b> (g<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(r, string)) {
+</code><code id="L471"><span class="ln">471</span>            <b>var</b> clr<span class="s"> = </span>R.getRGB(r);
+</code><code id="L472"><span class="ln">472</span>            r<span class="s"> = </span>clr.r;
+</code><code id="L473"><span class="ln">473</span>            g<span class="s"> = </span>clr.g;
+</code><code id="L474"><span class="ln">474</span>            b<span class="s"> = </span>clr.b;
+</code><code id="L475"><span class="ln">475</span>        }
+</code><code id="L476"><span class="ln">476</span>        <b>if</b> (r > <span class="d">1</span><span class="s"> || </span>g > <span class="d">1</span><span class="s"> || </span>b > <span class="d">1</span>) {
+</code><code id="L477"><span class="ln">477</span>            r /= <span class="d">255</span>;
+</code><code id="L478"><span class="ln">478</span>            g /= <span class="d">255</span>;
+</code><code id="L479"><span class="ln">479</span>            b /= <span class="d">255</span>;
+</code><code id="L480"><span class="ln">480</span>        }
+</code><code id="L481"><span class="ln">481</span>        
+</code><code id="L482"><span class="ln">482</span>        <b>return</b> [r, g, b];
+</code><code id="L483"><span class="ln">483</span>    },
+</code><code id="L484"><span class="ln">484</span>    packageRGB<span class="s"> = </span><b>function</b> (r, g, b, o) {
+</code><code id="L485"><span class="ln">485</span>        r *= <span class="d">255</span>;
+</code><code id="L486"><span class="ln">486</span>        g *= <span class="d">255</span>;
+</code><code id="L487"><span class="ln">487</span>        b *= <span class="d">255</span>;
+</code><code id="L488"><span class="ln">488</span>        <b>var</b> rgb<span class="s"> = </span>{
+</code><code id="L489"><span class="ln">489</span>            r: r,
+</code><code id="L490"><span class="ln">490</span>            g: g,
+</code><code id="L491"><span class="ln">491</span>            b: b,
+</code><code id="L492"><span class="ln">492</span>            hex: R.rgb(r, g, b),
+</code><code id="L493"><span class="ln">493</span>            toString: rgbtoString
+</code><code id="L494"><span class="ln">494</span>        };
+</code><code id="L495"><span class="ln">495</span>        R.is(o, <i>"finite"</i>)<span class="s"> &amp;&amp; </span>(rgb.opacity<span class="s"> = </span>o);
+</code><code id="L496"><span class="ln">496</span>        <b>return</b> rgb;
+</code><code id="L497"><span class="ln">497</span>    };
+</code><code id="L498"><span class="ln">498</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L499"><span class="ln">499</span><span class="c">    <span class="s"> * </span>Raphael.hsb2rgb
+</span></code><code id="L500"><span class="ln">500</span><span class="c">     [ method ]
+</span></code><code id="L501"><span class="ln">501</span><span class="c">     **
+</span></code><code id="L502"><span class="ln">502</span><span class="c">    <span class="s"> * </span>Converts HSB values to RGB object.
+</span></code><code id="L503"><span class="ln">503</span><span class="c">     > Parameters
+</span></code><code id="L504"><span class="ln">504</span><span class="c">    <span class="s"> - </span>h (number) hue
+</span></code><code id="L505"><span class="ln">505</span><span class="c">    <span class="s"> - </span>s (number) saturation
+</span></code><code id="L506"><span class="ln">506</span><span class="c">    <span class="s"> - </span>v (number) value or brightness
+</span></code><code id="L507"><span class="ln">507</span><span class="c">    <span class="s"> = </span>(object) RGB object <b>in</b> format:
+</span></code><code id="L508"><span class="ln">508</span><span class="c">     o {
+</span></code><code id="L509"><span class="ln">509</span><span class="c">     o     r (number) red,
+</span></code><code id="L510"><span class="ln">510</span><span class="c">     o     g (number) green,
+</span></code><code id="L511"><span class="ln">511</span><span class="c">     o     b (number) blue,
+</span></code><code id="L512"><span class="ln">512</span><span class="c">     o     hex (string) color <b>in</b> HTML/CSS format: #••••••
+</span></code><code id="L513"><span class="ln">513</span><span class="c">     o }
+</span></code><code id="L514"><span class="ln">514</span><span class="c">    \*/</span>
+</code><code id="L515"><span class="ln">515</span>    R.hsb2rgb<span class="s"> = </span><b>function</b> (h, s, v, o) {
+</code><code id="L516"><span class="ln">516</span>        <b>if</b> (<b>this</b>.is(h, <i>"object"</i>)<span class="s"> &amp;&amp; </span><i>"h"</i> <b>in</b> h<span class="s"> &amp;&amp; </span><i>"s"</i> <b>in</b> h<span class="s"> &amp;&amp; </span><i>"b"</i> <b>in</b> h) {
+</code><code id="L517"><span class="ln">517</span>            v<span class="s"> = </span>h.b;
+</code><code id="L518"><span class="ln">518</span>            s<span class="s"> = </span>h.s;
+</code><code id="L519"><span class="ln">519</span>            h<span class="s"> = </span>h.h;
+</code><code id="L520"><span class="ln">520</span>            o<span class="s"> = </span>h.o;
+</code><code id="L521"><span class="ln">521</span>        }
+</code><code id="L522"><span class="ln">522</span>        h *= <span class="d">360</span>;
+</code><code id="L523"><span class="ln">523</span>        <b>var</b> R, G, B, X, C;
+</code><code id="L524"><span class="ln">524</span>        h<span class="s"> = </span>(h<span class="s"> % </span><span class="d">360</span>)<span class="s"> / </span><span class="d">60</span>;
+</code><code id="L525"><span class="ln">525</span>        C<span class="s"> = </span>v<span class="s"> * </span>s;
+</code><code id="L526"><span class="ln">526</span>        X<span class="s"> = </span>C<span class="s"> * </span>(<span class="d">1</span><span class="s"> - </span>abs(h<span class="s"> % </span><span class="d">2</span><span class="s"> - </span><span class="d">1</span>));
+</code><code id="L527"><span class="ln">527</span>        R<span class="s"> = </span>G<span class="s"> = </span>B<span class="s"> = </span>v<span class="s"> - </span>C;
+</code><code id="L528"><span class="ln">528</span>
+</code><code id="L529"><span class="ln">529</span>        h<span class="s"> = </span>~~h;
+</code><code id="L530"><span class="ln">530</span>        R += [C, X, <span class="d">0</span>, <span class="d">0</span>, X, C][h];
+</code><code id="L531"><span class="ln">531</span>        G += [X, C, C, X, <span class="d">0</span>, <span class="d">0</span>][h];
+</code><code id="L532"><span class="ln">532</span>        B += [<span class="d">0</span>, <span class="d">0</span>, X, C, C, X][h];
+</code><code id="L533"><span class="ln">533</span>        <b>return</b> packageRGB(R, G, B, o);
+</code><code id="L534"><span class="ln">534</span>    };
+</code><code id="L535"><span class="ln">535</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L536"><span class="ln">536</span><span class="c">    <span class="s"> * </span>Raphael.hsl2rgb
+</span></code><code id="L537"><span class="ln">537</span><span class="c">     [ method ]
+</span></code><code id="L538"><span class="ln">538</span><span class="c">     **
+</span></code><code id="L539"><span class="ln">539</span><span class="c">    <span class="s"> * </span>Converts HSL values to RGB object.
+</span></code><code id="L540"><span class="ln">540</span><span class="c">     > Parameters
+</span></code><code id="L541"><span class="ln">541</span><span class="c">    <span class="s"> - </span>h (number) hue
+</span></code><code id="L542"><span class="ln">542</span><span class="c">    <span class="s"> - </span>s (number) saturation
+</span></code><code id="L543"><span class="ln">543</span><span class="c">    <span class="s"> - </span>l (number) luminosity
+</span></code><code id="L544"><span class="ln">544</span><span class="c">    <span class="s"> = </span>(object) RGB object <b>in</b> format:
+</span></code><code id="L545"><span class="ln">545</span><span class="c">     o {
+</span></code><code id="L546"><span class="ln">546</span><span class="c">     o     r (number) red,
+</span></code><code id="L547"><span class="ln">547</span><span class="c">     o     g (number) green,
+</span></code><code id="L548"><span class="ln">548</span><span class="c">     o     b (number) blue,
+</span></code><code id="L549"><span class="ln">549</span><span class="c">     o     hex (string) color <b>in</b> HTML/CSS format: #••••••
+</span></code><code id="L550"><span class="ln">550</span><span class="c">     o }
+</span></code><code id="L551"><span class="ln">551</span><span class="c">    \*/</span>
+</code><code id="L552"><span class="ln">552</span>    R.hsl2rgb<span class="s"> = </span><b>function</b> (h, s, l, o) {
+</code><code id="L553"><span class="ln">553</span>        <b>if</b> (<b>this</b>.is(h, <i>"object"</i>)<span class="s"> &amp;&amp; </span><i>"h"</i> <b>in</b> h<span class="s"> &amp;&amp; </span><i>"s"</i> <b>in</b> h<span class="s"> &amp;&amp; </span><i>"l"</i> <b>in</b> h) {
+</code><code id="L554"><span class="ln">554</span>            l<span class="s"> = </span>h.l;
+</code><code id="L555"><span class="ln">555</span>            s<span class="s"> = </span>h.s;
+</code><code id="L556"><span class="ln">556</span>            h<span class="s"> = </span>h.h;
+</code><code id="L557"><span class="ln">557</span>        }
+</code><code id="L558"><span class="ln">558</span>        <b>if</b> (h > <span class="d">1</span><span class="s"> || </span>s > <span class="d">1</span><span class="s"> || </span>l > <span class="d">1</span>) {
+</code><code id="L559"><span class="ln">559</span>            h /= <span class="d">360</span>;
+</code><code id="L560"><span class="ln">560</span>            s /= <span class="d">100</span>;
+</code><code id="L561"><span class="ln">561</span>            l /= <span class="d">100</span>;
+</code><code id="L562"><span class="ln">562</span>        }
+</code><code id="L563"><span class="ln">563</span>        h *= <span class="d">360</span>;
+</code><code id="L564"><span class="ln">564</span>        <b>var</b> R, G, B, X, C;
+</code><code id="L565"><span class="ln">565</span>        h<span class="s"> = </span>(h<span class="s"> % </span><span class="d">360</span>)<span class="s"> / </span><span class="d">60</span>;
+</code><code id="L566"><span class="ln">566</span>        C<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>s<span class="s"> * </span>(l &lt; <span class="d">.5</span> ? l : <span class="d">1</span><span class="s"> - </span>l);
+</code><code id="L567"><span class="ln">567</span>        X<span class="s"> = </span>C<span class="s"> * </span>(<span class="d">1</span><span class="s"> - </span>abs(h<span class="s"> % </span><span class="d">2</span><span class="s"> - </span><span class="d">1</span>));
+</code><code id="L568"><span class="ln">568</span>        R<span class="s"> = </span>G<span class="s"> = </span>B<span class="s"> = </span>l<span class="s"> - </span>C<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L569"><span class="ln">569</span>
+</code><code id="L570"><span class="ln">570</span>        h<span class="s"> = </span>~~h;
+</code><code id="L571"><span class="ln">571</span>        R += [C, X, <span class="d">0</span>, <span class="d">0</span>, X, C][h];
+</code><code id="L572"><span class="ln">572</span>        G += [X, C, C, X, <span class="d">0</span>, <span class="d">0</span>][h];
+</code><code id="L573"><span class="ln">573</span>        B += [<span class="d">0</span>, <span class="d">0</span>, X, C, C, X][h];
+</code><code id="L574"><span class="ln">574</span>        <b>return</b> packageRGB(R, G, B, o);
+</code><code id="L575"><span class="ln">575</span>    };
+</code><code id="L576"><span class="ln">576</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L577"><span class="ln">577</span><span class="c">    <span class="s"> * </span>Raphael.rgb2hsb
+</span></code><code id="L578"><span class="ln">578</span><span class="c">     [ method ]
+</span></code><code id="L579"><span class="ln">579</span><span class="c">     **
+</span></code><code id="L580"><span class="ln">580</span><span class="c">    <span class="s"> * </span>Converts RGB values to HSB object.
+</span></code><code id="L581"><span class="ln">581</span><span class="c">     > Parameters
+</span></code><code id="L582"><span class="ln">582</span><span class="c">    <span class="s"> - </span>r (number) red
+</span></code><code id="L583"><span class="ln">583</span><span class="c">    <span class="s"> - </span>g (number) green
+</span></code><code id="L584"><span class="ln">584</span><span class="c">    <span class="s"> - </span>b (number) blue
+</span></code><code id="L585"><span class="ln">585</span><span class="c">    <span class="s"> = </span>(object) HSB object <b>in</b> format:
+</span></code><code id="L586"><span class="ln">586</span><span class="c">     o {
+</span></code><code id="L587"><span class="ln">587</span><span class="c">     o     h (number) hue
+</span></code><code id="L588"><span class="ln">588</span><span class="c">     o     s (number) saturation
+</span></code><code id="L589"><span class="ln">589</span><span class="c">     o     b (number) brightness
+</span></code><code id="L590"><span class="ln">590</span><span class="c">     o }
+</span></code><code id="L591"><span class="ln">591</span><span class="c">    \*/</span>
+</code><code id="L592"><span class="ln">592</span>    R.rgb2hsb<span class="s"> = </span><b>function</b> (r, g, b) {
+</code><code id="L593"><span class="ln">593</span>        b<span class="s"> = </span>prepareRGB(r, g, b);
+</code><code id="L594"><span class="ln">594</span>        r<span class="s"> = </span>b[<span class="d">0</span>];
+</code><code id="L595"><span class="ln">595</span>        g<span class="s"> = </span>b[<span class="d">1</span>];
+</code><code id="L596"><span class="ln">596</span>        b<span class="s"> = </span>b[<span class="d">2</span>];
+</code><code id="L597"><span class="ln">597</span>
+</code><code id="L598"><span class="ln">598</span>        <b>var</b> H, S, V, C;
+</code><code id="L599"><span class="ln">599</span>        V<span class="s"> = </span>mmax(r, g, b);
+</code><code id="L600"><span class="ln">600</span>        C<span class="s"> = </span>V<span class="s"> - </span>mmin(r, g, b);
+</code><code id="L601"><span class="ln">601</span>        H<span class="s"> = </span>(C<span class="s"> == </span><span class="d">0</span> ? <b>null</b> :
+</code><code id="L602"><span class="ln">602</span>             V<span class="s"> == </span>r ? (g<span class="s"> - </span>b)<span class="s"> / </span>C :
+</code><code id="L603"><span class="ln">603</span>             V<span class="s"> == </span>g ? (b<span class="s"> - </span>r)<span class="s"> / </span>C<span class="s"> + </span><span class="d">2</span> :
+</code><code id="L604"><span class="ln">604</span>                      (r<span class="s"> - </span>g)<span class="s"> / </span>C<span class="s"> + </span><span class="d">4</span>);
+</code><code id="L605"><span class="ln">605</span>        H<span class="s"> = </span>(H<span class="s"> % </span><span class="d">6</span>)<span class="s"> * </span><span class="d">60</span>;
+</code><code id="L606"><span class="ln">606</span>        S<span class="s"> = </span>C<span class="s"> == </span><span class="d">0</span> ? <span class="d">0</span> : C<span class="s"> / </span>V;
+</code><code id="L607"><span class="ln">607</span>        <b>return</b> {h: H, s: S, b: V, toString: hsbtoString};
+</code><code id="L608"><span class="ln">608</span>    };
+</code><code id="L609"><span class="ln">609</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L610"><span class="ln">610</span><span class="c">    <span class="s"> * </span>Raphael.rgb2hsl
+</span></code><code id="L611"><span class="ln">611</span><span class="c">     [ method ]
+</span></code><code id="L612"><span class="ln">612</span><span class="c">     **
+</span></code><code id="L613"><span class="ln">613</span><span class="c">    <span class="s"> * </span>Converts RGB values to HSL object.
+</span></code><code id="L614"><span class="ln">614</span><span class="c">     > Parameters
+</span></code><code id="L615"><span class="ln">615</span><span class="c">    <span class="s"> - </span>r (number) red
+</span></code><code id="L616"><span class="ln">616</span><span class="c">    <span class="s"> - </span>g (number) green
+</span></code><code id="L617"><span class="ln">617</span><span class="c">    <span class="s"> - </span>b (number) blue
+</span></code><code id="L618"><span class="ln">618</span><span class="c">    <span class="s"> = </span>(object) HSL object <b>in</b> format:
+</span></code><code id="L619"><span class="ln">619</span><span class="c">     o {
+</span></code><code id="L620"><span class="ln">620</span><span class="c">     o     h (number) hue
+</span></code><code id="L621"><span class="ln">621</span><span class="c">     o     s (number) saturation
+</span></code><code id="L622"><span class="ln">622</span><span class="c">     o     l (number) luminosity
+</span></code><code id="L623"><span class="ln">623</span><span class="c">     o }
+</span></code><code id="L624"><span class="ln">624</span><span class="c">    \*/</span>
+</code><code id="L625"><span class="ln">625</span>    R.rgb2hsl<span class="s"> = </span><b>function</b> (r, g, b) {
+</code><code id="L626"><span class="ln">626</span>        b<span class="s"> = </span>prepareRGB(r, g, b);
+</code><code id="L627"><span class="ln">627</span>        r<span class="s"> = </span>b[<span class="d">0</span>];
+</code><code id="L628"><span class="ln">628</span>        g<span class="s"> = </span>b[<span class="d">1</span>];
+</code><code id="L629"><span class="ln">629</span>        b<span class="s"> = </span>b[<span class="d">2</span>];
+</code><code id="L630"><span class="ln">630</span>
+</code><code id="L631"><span class="ln">631</span>        <b>var</b> H, S, L, M, m, C;
+</code><code id="L632"><span class="ln">632</span>        M<span class="s"> = </span>mmax(r, g, b);
+</code><code id="L633"><span class="ln">633</span>        m<span class="s"> = </span>mmin(r, g, b);
+</code><code id="L634"><span class="ln">634</span>        C<span class="s"> = </span>M<span class="s"> - </span>m;
+</code><code id="L635"><span class="ln">635</span>        H<span class="s"> = </span>(C<span class="s"> == </span><span class="d">0</span> ? <b>null</b> :
+</code><code id="L636"><span class="ln">636</span>             M<span class="s"> == </span>r ? (g<span class="s"> - </span>b)<span class="s"> / </span>C :
+</code><code id="L637"><span class="ln">637</span>             M<span class="s"> == </span>g ? (b<span class="s"> - </span>r)<span class="s"> / </span>C<span class="s"> + </span><span class="d">2</span> :
+</code><code id="L638"><span class="ln">638</span>                      (r<span class="s"> - </span>g)<span class="s"> / </span>C<span class="s"> + </span><span class="d">4</span>);
+</code><code id="L639"><span class="ln">639</span>        H<span class="s"> = </span>(H<span class="s"> % </span><span class="d">6</span>)<span class="s"> * </span><span class="d">60</span>;
+</code><code id="L640"><span class="ln">640</span>        L<span class="s"> = </span>(M<span class="s"> + </span>m)<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L641"><span class="ln">641</span>        S<span class="s"> = </span>(C<span class="s"> == </span><span class="d">0</span> ? <span class="d">0</span> :
+</code><code id="L642"><span class="ln">642</span>             L &lt; <span class="d">.5</span> ? C<span class="s"> / </span>(<span class="d">2</span><span class="s"> * </span>L) :
+</code><code id="L643"><span class="ln">643</span>                      C<span class="s"> / </span>(<span class="d">2</span><span class="s"> - </span><span class="d">2</span><span class="s"> * </span>L));
+</code><code id="L644"><span class="ln">644</span>        <b>return</b> {h: H, s: S, l: L, toString: hsltoString};
+</code><code id="L645"><span class="ln">645</span>    };
+</code><code id="L646"><span class="ln">646</span>    R._path2string<span class="s"> = </span><b>function</b> () {
+</code><code id="L647"><span class="ln">647</span>        <b>return</b> <b>this</b>.join(<i>","</i>).replace(p2s, <i>"$<span class="d">1</span>"</i>);
+</code><code id="L648"><span class="ln">648</span>    };
+</code><code id="L649"><span class="ln">649</span>    <b>function</b> cacher(f, scope, postprocessor) {
+</code><code id="L650"><span class="ln">650</span>        <b>function</b> newf() {
+</code><code id="L651"><span class="ln">651</span>            <b>var</b> arg<span class="s"> = </span>Array.prototype.slice.call(arguments, <span class="d">0</span>),
+</code><code id="L652"><span class="ln">652</span>                args<span class="s"> = </span>arg.join(<i>"\u2400"</i>),
+</code><code id="L653"><span class="ln">653</span>                cache<span class="s"> = </span>newf.cache<span class="s"> = </span>newf.cache<span class="s"> || </span>{},
+</code><code id="L654"><span class="ln">654</span>                count<span class="s"> = </span>newf.count<span class="s"> = </span>newf.count<span class="s"> || </span>[];
+</code><code id="L655"><span class="ln">655</span>            <b>if</b> (cache[has](args)) {
+</code><code id="L656"><span class="ln">656</span>                <b>return</b> postprocessor ? postprocessor(cache[args]) : cache[args];
+</code><code id="L657"><span class="ln">657</span>            }
+</code><code id="L658"><span class="ln">658</span>            count.length >= <span class="d">1e3</span><span class="s"> &amp;&amp; </span><b>delete</b> cache[count.shift()];
+</code><code id="L659"><span class="ln">659</span>            count.push(args);
+</code><code id="L660"><span class="ln">660</span>            cache[args]<span class="s"> = </span>f[apply](scope, arg);
+</code><code id="L661"><span class="ln">661</span>            <b>return</b> postprocessor ? postprocessor(cache[args]) : cache[args];
+</code><code id="L662"><span class="ln">662</span>        }
+</code><code id="L663"><span class="ln">663</span>        <b>return</b> newf;
+</code><code id="L664"><span class="ln">664</span>    }
+</code><code id="L665"><span class="ln">665</span>
+</code><code id="L666"><span class="ln">666</span>    <b>function</b> preload(src, f) {
+</code><code id="L667"><span class="ln">667</span>        <b>var</b> img<span class="s"> = </span>g.doc.createElement(<i>"img"</i>);
+</code><code id="L668"><span class="ln">668</span>        img.style.cssText<span class="s"> = </span><i>"position:absolute;left:-9999em;top-9999em"</i>;
+</code><code id="L669"><span class="ln">669</span>        img.onload<span class="s"> = </span><b>function</b> () {
+</code><code id="L670"><span class="ln">670</span>            f.call(<b>this</b>);
+</code><code id="L671"><span class="ln">671</span>            <b>this</b>.onload<span class="s"> = </span><b>null</b>;
+</code><code id="L672"><span class="ln">672</span>            g.doc.body.removeChild(<b>this</b>);
+</code><code id="L673"><span class="ln">673</span>        };
+</code><code id="L674"><span class="ln">674</span>        img.onerror<span class="s"> = </span><b>function</b> () {
+</code><code id="L675"><span class="ln">675</span>            g.doc.body.removeChild(<b>this</b>);
+</code><code id="L676"><span class="ln">676</span>        };
+</code><code id="L677"><span class="ln">677</span>        g.doc.body.appendChild(img);
+</code><code id="L678"><span class="ln">678</span>        img.src<span class="s"> = </span>src;
+</code><code id="L679"><span class="ln">679</span>    }
+</code><code id="L680"><span class="ln">680</span>
+</code><code id="L681"><span class="ln">681</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L682"><span class="ln">682</span><span class="c">    <span class="s"> * </span>Raphael.getRGB
+</span></code><code id="L683"><span class="ln">683</span><span class="c">     [ method ]
+</span></code><code id="L684"><span class="ln">684</span><span class="c">     **
+</span></code><code id="L685"><span class="ln">685</span><span class="c">    <span class="s"> * </span>Parses colour string as RGB object
+</span></code><code id="L686"><span class="ln">686</span><span class="c">     > Parameters
+</span></code><code id="L687"><span class="ln">687</span><span class="c">    <span class="s"> - </span>colour (string) colour string <b>in</b> one of formats:
+</span></code><code id="L688"><span class="ln">688</span><span class="c">     # &lt;ul>
+</span></code><code id="L689"><span class="ln">689</span><span class="c">     #     &lt;li>Colour name (“&lt;code>red&lt;/code>”, “&lt;code>green&lt;/code>”, “&lt;code>cornflowerblue&lt;/code>”, etc)&lt;/li>
+</span></code><code id="L690"><span class="ln">690</span><span class="c">     #     &lt;li>#••• — shortened HTML colour: (“&lt;code>#<span class="d">000</span>&lt;/code>”, “&lt;code>#fc0&lt;/code>”, etc)&lt;/li>
+</span></code><code id="L691"><span class="ln">691</span><span class="c">     #     &lt;li>#•••••• — full length HTML colour: (“&lt;code>#<span class="d">000000</span>&lt;/code>”, “&lt;code>#bd2300&lt;/code>”)&lt;/li>
+</span></code><code id="L692"><span class="ln">692</span><span class="c">     #     &lt;li>rgb(•••, •••, •••) — red, green and blue channels’ values: (“&lt;code>rgb(<span class="d">200</span>,&nbsp;<span class="d">100</span>,&nbsp;<span class="d">0</span>)&lt;/code>”)&lt;/li>
+</span></code><code id="L693"><span class="ln">693</span><span class="c">     #     &lt;li>rgb(•••%, •••%, •••%) — same as above, but <b>in</b> %: (“&lt;code>rgb(<span class="d">100</span>%,&nbsp;<span class="d">175</span>%,&nbsp;<span class="d">0</span>%)&lt;/code>”)&lt;/li>
+</span></code><code id="L694"><span class="ln">694</span><span class="c">     #     &lt;li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“&lt;code>hsb(<span class="d">0.5</span>,&nbsp;<span class="d">0.25</span>,&nbsp;<span class="d">1</span>)&lt;/code>”)&lt;/li>
+</span></code><code id="L695"><span class="ln">695</span><span class="c">     #     &lt;li>hsb(•••%, •••%, •••%) — same as above, but <b>in</b> %&lt;/li>
+</span></code><code id="L696"><span class="ln">696</span><span class="c">     #     &lt;li>hsl(•••, •••, •••) — same as hsb&lt;/li>
+</span></code><code id="L697"><span class="ln">697</span><span class="c">     #     &lt;li>hsl(•••%, •••%, •••%) — same as hsb&lt;/li>
+</span></code><code id="L698"><span class="ln">698</span><span class="c">     # &lt;/ul>
+</span></code><code id="L699"><span class="ln">699</span><span class="c">    <span class="s"> = </span>(object) RGB object <b>in</b> format:
+</span></code><code id="L700"><span class="ln">700</span><span class="c">     o {
+</span></code><code id="L701"><span class="ln">701</span><span class="c">     o     r (number) red,
+</span></code><code id="L702"><span class="ln">702</span><span class="c">     o     g (number) green,
+</span></code><code id="L703"><span class="ln">703</span><span class="c">     o     b (number) blue
+</span></code><code id="L704"><span class="ln">704</span><span class="c">     o     hex (string) color <b>in</b> HTML/CSS format: #••••••,
+</span></code><code id="L705"><span class="ln">705</span><span class="c">     o     error (<b>boolean</b>) <b>true</b> <b>if</b> string can’t be parsed
+</span></code><code id="L706"><span class="ln">706</span><span class="c">     o }
+</span></code><code id="L707"><span class="ln">707</span><span class="c">    \*/</span>
+</code><code id="L708"><span class="ln">708</span>    R.getRGB<span class="s"> = </span>cacher(<b>function</b> (colour) {
+</code><code id="L709"><span class="ln">709</span>        <b>if</b> (!colour<span class="s"> || </span>!!((colour<span class="s"> = </span>Str(colour)).indexOf(<i>"-"</i>)<span class="s"> + </span><span class="d">1</span>)) {
+</code><code id="L710"><span class="ln">710</span>            <b>return</b> {r: -<span class="d">1</span>, g: -<span class="d">1</span>, b: -<span class="d">1</span>, hex: <i>"none"</i>, error: <span class="d">1</span>};
+</code><code id="L711"><span class="ln">711</span>        }
+</code><code id="L712"><span class="ln">712</span>        <b>if</b> (colour<span class="s"> == </span><i>"none"</i>) {
+</code><code id="L713"><span class="ln">713</span>            <b>return</b> {r: -<span class="d">1</span>, g: -<span class="d">1</span>, b: -<span class="d">1</span>, hex: <i>"none"</i>};
+</code><code id="L714"><span class="ln">714</span>        }
+</code><code id="L715"><span class="ln">715</span>        !(hsrg[has](colour.toLowerCase().substring(<span class="d">0</span>, <span class="d">2</span>))<span class="s"> || </span>colour.charAt()<span class="s"> == </span><i>"#"</i>)<span class="s"> &amp;&amp; </span>(colour<span class="s"> = </span>toHex(colour));
+</code><code id="L716"><span class="ln">716</span>        <b>var</b> res,
+</code><code id="L717"><span class="ln">717</span>            red,
+</code><code id="L718"><span class="ln">718</span>            green,
+</code><code id="L719"><span class="ln">719</span>            blue,
+</code><code id="L720"><span class="ln">720</span>            opacity,
+</code><code id="L721"><span class="ln">721</span>            t,
+</code><code id="L722"><span class="ln">722</span>            values,
+</code><code id="L723"><span class="ln">723</span>            rgb<span class="s"> = </span>colour.match(colourRegExp);
+</code><code id="L724"><span class="ln">724</span>        <b>if</b> (rgb) {
+</code><code id="L725"><span class="ln">725</span>            <b>if</b> (rgb[<span class="d">2</span>]) {
+</code><code id="L726"><span class="ln">726</span>                blue<span class="s"> = </span>toInt(rgb[<span class="d">2</span>].substring(<span class="d">5</span>), <span class="d">16</span>);
+</code><code id="L727"><span class="ln">727</span>                green<span class="s"> = </span>toInt(rgb[<span class="d">2</span>].substring(<span class="d">3</span>, <span class="d">5</span>), <span class="d">16</span>);
+</code><code id="L728"><span class="ln">728</span>                red<span class="s"> = </span>toInt(rgb[<span class="d">2</span>].substring(<span class="d">1</span>, <span class="d">3</span>), <span class="d">16</span>);
+</code><code id="L729"><span class="ln">729</span>            }
+</code><code id="L730"><span class="ln">730</span>            <b>if</b> (rgb[<span class="d">3</span>]) {
+</code><code id="L731"><span class="ln">731</span>                blue<span class="s"> = </span>toInt((t<span class="s"> = </span>rgb[<span class="d">3</span>].charAt(<span class="d">3</span>))<span class="s"> + </span>t, <span class="d">16</span>);
+</code><code id="L732"><span class="ln">732</span>                green<span class="s"> = </span>toInt((t<span class="s"> = </span>rgb[<span class="d">3</span>].charAt(<span class="d">2</span>))<span class="s"> + </span>t, <span class="d">16</span>);
+</code><code id="L733"><span class="ln">733</span>                red<span class="s"> = </span>toInt((t<span class="s"> = </span>rgb[<span class="d">3</span>].charAt(<span class="d">1</span>))<span class="s"> + </span>t, <span class="d">16</span>);
+</code><code id="L734"><span class="ln">734</span>            }
+</code><code id="L735"><span class="ln">735</span>            <b>if</b> (rgb[<span class="d">4</span>]) {
+</code><code id="L736"><span class="ln">736</span>                values<span class="s"> = </span>rgb[<span class="d">4</span>].split(commaSpaces);
+</code><code id="L737"><span class="ln">737</span>                red<span class="s"> = </span>toFloat(values[<span class="d">0</span>]);
+</code><code id="L738"><span class="ln">738</span>                values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(red *= <span class="d">2.55</span>);
+</code><code id="L739"><span class="ln">739</span>                green<span class="s"> = </span>toFloat(values[<span class="d">1</span>]);
+</code><code id="L740"><span class="ln">740</span>                values[<span class="d">1</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(green *= <span class="d">2.55</span>);
+</code><code id="L741"><span class="ln">741</span>                blue<span class="s"> = </span>toFloat(values[<span class="d">2</span>]);
+</code><code id="L742"><span class="ln">742</span>                values[<span class="d">2</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(blue *= <span class="d">2.55</span>);
+</code><code id="L743"><span class="ln">743</span>                rgb[<span class="d">1</span>].toLowerCase().slice(<span class="d">0</span>, <span class="d">4</span>)<span class="s"> == </span><i>"rgba"</i><span class="s"> &amp;&amp; </span>(opacity<span class="s"> = </span>toFloat(values[<span class="d">3</span>]));
+</code><code id="L744"><span class="ln">744</span>                values[<span class="d">3</span>]<span class="s"> &amp;&amp; </span>values[<span class="d">3</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(opacity /= <span class="d">100</span>);
+</code><code id="L745"><span class="ln">745</span>            }
+</code><code id="L746"><span class="ln">746</span>            <b>if</b> (rgb[<span class="d">5</span>]) {
+</code><code id="L747"><span class="ln">747</span>                values<span class="s"> = </span>rgb[<span class="d">5</span>].split(commaSpaces);
+</code><code id="L748"><span class="ln">748</span>                red<span class="s"> = </span>toFloat(values[<span class="d">0</span>]);
+</code><code id="L749"><span class="ln">749</span>                values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(red *= <span class="d">2.55</span>);
+</code><code id="L750"><span class="ln">750</span>                green<span class="s"> = </span>toFloat(values[<span class="d">1</span>]);
+</code><code id="L751"><span class="ln">751</span>                values[<span class="d">1</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(green *= <span class="d">2.55</span>);
+</code><code id="L752"><span class="ln">752</span>                blue<span class="s"> = </span>toFloat(values[<span class="d">2</span>]);
+</code><code id="L753"><span class="ln">753</span>                values[<span class="d">2</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(blue *= <span class="d">2.55</span>);
+</code><code id="L754"><span class="ln">754</span>                (values[<span class="d">0</span>].slice(-<span class="d">3</span>)<span class="s"> == </span><i>"deg"</i><span class="s"> || </span>values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"\xb0"</i>)<span class="s"> &amp;&amp; </span>(red /= <span class="d">360</span>);
+</code><code id="L755"><span class="ln">755</span>                rgb[<span class="d">1</span>].toLowerCase().slice(<span class="d">0</span>, <span class="d">4</span>)<span class="s"> == </span><i>"hsba"</i><span class="s"> &amp;&amp; </span>(opacity<span class="s"> = </span>toFloat(values[<span class="d">3</span>]));
+</code><code id="L756"><span class="ln">756</span>                values[<span class="d">3</span>]<span class="s"> &amp;&amp; </span>values[<span class="d">3</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(opacity /= <span class="d">100</span>);
+</code><code id="L757"><span class="ln">757</span>                <b>return</b> R.hsb2rgb(red, green, blue, opacity);
+</code><code id="L758"><span class="ln">758</span>            }
+</code><code id="L759"><span class="ln">759</span>            <b>if</b> (rgb[<span class="d">6</span>]) {
+</code><code id="L760"><span class="ln">760</span>                values<span class="s"> = </span>rgb[<span class="d">6</span>].split(commaSpaces);
+</code><code id="L761"><span class="ln">761</span>                red<span class="s"> = </span>toFloat(values[<span class="d">0</span>]);
+</code><code id="L762"><span class="ln">762</span>                values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(red *= <span class="d">2.55</span>);
+</code><code id="L763"><span class="ln">763</span>                green<span class="s"> = </span>toFloat(values[<span class="d">1</span>]);
+</code><code id="L764"><span class="ln">764</span>                values[<span class="d">1</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(green *= <span class="d">2.55</span>);
+</code><code id="L765"><span class="ln">765</span>                blue<span class="s"> = </span>toFloat(values[<span class="d">2</span>]);
+</code><code id="L766"><span class="ln">766</span>                values[<span class="d">2</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(blue *= <span class="d">2.55</span>);
+</code><code id="L767"><span class="ln">767</span>                (values[<span class="d">0</span>].slice(-<span class="d">3</span>)<span class="s"> == </span><i>"deg"</i><span class="s"> || </span>values[<span class="d">0</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"\xb0"</i>)<span class="s"> &amp;&amp; </span>(red /= <span class="d">360</span>);
+</code><code id="L768"><span class="ln">768</span>                rgb[<span class="d">1</span>].toLowerCase().slice(<span class="d">0</span>, <span class="d">4</span>)<span class="s"> == </span><i>"hsla"</i><span class="s"> &amp;&amp; </span>(opacity<span class="s"> = </span>toFloat(values[<span class="d">3</span>]));
+</code><code id="L769"><span class="ln">769</span>                values[<span class="d">3</span>]<span class="s"> &amp;&amp; </span>values[<span class="d">3</span>].slice(-<span class="d">1</span>)<span class="s"> == </span><i>"%"</i><span class="s"> &amp;&amp; </span>(opacity /= <span class="d">100</span>);
+</code><code id="L770"><span class="ln">770</span>                <b>return</b> R.hsl2rgb(red, green, blue, opacity);
+</code><code id="L771"><span class="ln">771</span>            }
+</code><code id="L772"><span class="ln">772</span>            rgb<span class="s"> = </span>{r: red, g: green, b: blue};
+</code><code id="L773"><span class="ln">773</span>            rgb.hex<span class="s"> = </span><i>"#"</i><span class="s"> + </span>(<span class="d">16777216</span><span class="s"> | </span>blue<span class="s"> | </span>(green &lt;&lt; <span class="d">8</span>)<span class="s"> | </span>(red &lt;&lt; <span class="d">16</span>)).toString(<span class="d">16</span>).slice(<span class="d">1</span>);
+</code><code id="L774"><span class="ln">774</span>            R.is(opacity, <i>"finite"</i>)<span class="s"> &amp;&amp; </span>(rgb.opacity<span class="s"> = </span>opacity);
+</code><code id="L775"><span class="ln">775</span>            <b>return</b> rgb;
+</code><code id="L776"><span class="ln">776</span>        }
+</code><code id="L777"><span class="ln">777</span>        <b>return</b> {r: -<span class="d">1</span>, g: -<span class="d">1</span>, b: -<span class="d">1</span>, hex: <i>"none"</i>, error: <span class="d">1</span>};
+</code><code id="L778"><span class="ln">778</span>    }, R);
+</code><code id="L779"><span class="ln">779</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L780"><span class="ln">780</span><span class="c">    <span class="s"> * </span>Raphael.hsb
+</span></code><code id="L781"><span class="ln">781</span><span class="c">     [ method ]
+</span></code><code id="L782"><span class="ln">782</span><span class="c">     **
+</span></code><code id="L783"><span class="ln">783</span><span class="c">    <span class="s"> * </span>Converts HSB values to hex representation of the colour.
+</span></code><code id="L784"><span class="ln">784</span><span class="c">     > Parameters
+</span></code><code id="L785"><span class="ln">785</span><span class="c">    <span class="s"> - </span>h (number) hue
+</span></code><code id="L786"><span class="ln">786</span><span class="c">    <span class="s"> - </span>s (number) saturation
+</span></code><code id="L787"><span class="ln">787</span><span class="c">    <span class="s"> - </span>b (number) value or brightness
+</span></code><code id="L788"><span class="ln">788</span><span class="c">    <span class="s"> = </span>(string) hex representation of the colour.
+</span></code><code id="L789"><span class="ln">789</span><span class="c">    \*/</span>
+</code><code id="L790"><span class="ln">790</span>    R.hsb<span class="s"> = </span>cacher(<b>function</b> (h, s, b) {
+</code><code id="L791"><span class="ln">791</span>        <b>return</b> R.hsb2rgb(h, s, b).hex;
+</code><code id="L792"><span class="ln">792</span>    });
+</code><code id="L793"><span class="ln">793</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L794"><span class="ln">794</span><span class="c">    <span class="s"> * </span>Raphael.hsl
+</span></code><code id="L795"><span class="ln">795</span><span class="c">     [ method ]
+</span></code><code id="L796"><span class="ln">796</span><span class="c">     **
+</span></code><code id="L797"><span class="ln">797</span><span class="c">    <span class="s"> * </span>Converts HSL values to hex representation of the colour.
+</span></code><code id="L798"><span class="ln">798</span><span class="c">     > Parameters
+</span></code><code id="L799"><span class="ln">799</span><span class="c">    <span class="s"> - </span>h (number) hue
+</span></code><code id="L800"><span class="ln">800</span><span class="c">    <span class="s"> - </span>s (number) saturation
+</span></code><code id="L801"><span class="ln">801</span><span class="c">    <span class="s"> - </span>l (number) luminosity
+</span></code><code id="L802"><span class="ln">802</span><span class="c">    <span class="s"> = </span>(string) hex representation of the colour.
+</span></code><code id="L803"><span class="ln">803</span><span class="c">    \*/</span>
+</code><code id="L804"><span class="ln">804</span>    R.hsl<span class="s"> = </span>cacher(<b>function</b> (h, s, l) {
+</code><code id="L805"><span class="ln">805</span>        <b>return</b> R.hsl2rgb(h, s, l).hex;
+</code><code id="L806"><span class="ln">806</span>    });
+</code><code id="L807"><span class="ln">807</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L808"><span class="ln">808</span><span class="c">    <span class="s"> * </span>Raphael.rgb
+</span></code><code id="L809"><span class="ln">809</span><span class="c">     [ method ]
+</span></code><code id="L810"><span class="ln">810</span><span class="c">     **
+</span></code><code id="L811"><span class="ln">811</span><span class="c">    <span class="s"> * </span>Converts RGB values to hex representation of the colour.
+</span></code><code id="L812"><span class="ln">812</span><span class="c">     > Parameters
+</span></code><code id="L813"><span class="ln">813</span><span class="c">    <span class="s"> - </span>r (number) red
+</span></code><code id="L814"><span class="ln">814</span><span class="c">    <span class="s"> - </span>g (number) green
+</span></code><code id="L815"><span class="ln">815</span><span class="c">    <span class="s"> - </span>b (number) blue
+</span></code><code id="L816"><span class="ln">816</span><span class="c">    <span class="s"> = </span>(string) hex representation of the colour.
+</span></code><code id="L817"><span class="ln">817</span><span class="c">    \*/</span>
+</code><code id="L818"><span class="ln">818</span>    R.rgb<span class="s"> = </span>cacher(<b>function</b> (r, g, b) {
+</code><code id="L819"><span class="ln">819</span>        <b>return</b> <i>"#"</i><span class="s"> + </span>(<span class="d">16777216</span><span class="s"> | </span>b<span class="s"> | </span>(g &lt;&lt; <span class="d">8</span>)<span class="s"> | </span>(r &lt;&lt; <span class="d">16</span>)).toString(<span class="d">16</span>).slice(<span class="d">1</span>);
+</code><code id="L820"><span class="ln">820</span>    });
+</code><code id="L821"><span class="ln">821</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L822"><span class="ln">822</span><span class="c">    <span class="s"> * </span>Raphael.getColor
+</span></code><code id="L823"><span class="ln">823</span><span class="c">     [ method ]
+</span></code><code id="L824"><span class="ln">824</span><span class="c">     **
+</span></code><code id="L825"><span class="ln">825</span><span class="c">    <span class="s"> * </span>On each call returns next colour <b>in</b> the spectrum. To reset it back to red call @Raphael.getColor.reset
+</span></code><code id="L826"><span class="ln">826</span><span class="c">     > Parameters
+</span></code><code id="L827"><span class="ln">827</span><span class="c">    <span class="s"> - </span>value (number) #optional brightness, <b>default</b> is `<span class="d">0.75</span>`
+</span></code><code id="L828"><span class="ln">828</span><span class="c">    <span class="s"> = </span>(string) hex representation of the colour.
+</span></code><code id="L829"><span class="ln">829</span><span class="c">    \*/</span>
+</code><code id="L830"><span class="ln">830</span>    R.getColor<span class="s"> = </span><b>function</b> (value) {
+</code><code id="L831"><span class="ln">831</span>        <b>var</b> start<span class="s"> = </span><b>this</b>.getColor.start<span class="s"> = </span><b>this</b>.getColor.start<span class="s"> || </span>{h: <span class="d">0</span>, s: <span class="d">1</span>, b: value<span class="s"> || </span><span class="d">.75</span>},
+</code><code id="L832"><span class="ln">832</span>            rgb<span class="s"> = </span><b>this</b>.hsb2rgb(start.h, start.s, start.b);
+</code><code id="L833"><span class="ln">833</span>        start.h += <span class="d">.075</span>;
+</code><code id="L834"><span class="ln">834</span>        <b>if</b> (start.h > <span class="d">1</span>) {
+</code><code id="L835"><span class="ln">835</span>            start.h<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L836"><span class="ln">836</span>            start.s -= <span class="d">.2</span>;
+</code><code id="L837"><span class="ln">837</span>            start.s &lt;= <span class="d">0</span><span class="s"> &amp;&amp; </span>(<b>this</b>.getColor.start<span class="s"> = </span>{h: <span class="d">0</span>, s: <span class="d">1</span>, b: start.b});
+</code><code id="L838"><span class="ln">838</span>        }
+</code><code id="L839"><span class="ln">839</span>        <b>return</b> rgb.hex;
+</code><code id="L840"><span class="ln">840</span>    };
+</code><code id="L841"><span class="ln">841</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L842"><span class="ln">842</span><span class="c">    <span class="s"> * </span>Raphael.getColor.reset
+</span></code><code id="L843"><span class="ln">843</span><span class="c">     [ method ]
+</span></code><code id="L844"><span class="ln">844</span><span class="c">     **
+</span></code><code id="L845"><span class="ln">845</span><span class="c">    <span class="s"> * </span>Resets spectrum position <b>for</b> @Raphael.getColor back to red.
+</span></code><code id="L846"><span class="ln">846</span><span class="c">    \*/</span>
+</code><code id="L847"><span class="ln">847</span>    R.getColor.reset<span class="s"> = </span><b>function</b> () {
+</code><code id="L848"><span class="ln">848</span>        <b>delete</b> <b>this</b>.start;
+</code><code id="L849"><span class="ln">849</span>    };
+</code><code id="L850"><span class="ln">850</span>
+</code><code id="L851"><span class="ln">851</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L852"><span class="ln">852</span><span class="c">    <span class="s"> * </span>Raphael.parsePathString
+</span></code><code id="L853"><span class="ln">853</span><span class="c">     [ method ]
+</span></code><code id="L854"><span class="ln">854</span><span class="c">     **
+</span></code><code id="L855"><span class="ln">855</span><span class="c">    <span class="s"> * </span>Utility method
+</span></code><code id="L856"><span class="ln">856</span><span class="c">     **
+</span></code><code id="L857"><span class="ln">857</span><span class="c">    <span class="s"> * </span>Parses given path string into an array of arrays of path segments.
+</span></code><code id="L858"><span class="ln">858</span><span class="c">     > Parameters
+</span></code><code id="L859"><span class="ln">859</span><span class="c">    <span class="s"> - </span>pathString (string|array) path string or array of segments (<b>in</b> the last <b>case</b> it will be returned straight away)
+</span></code><code id="L860"><span class="ln">860</span><span class="c">    <span class="s"> = </span>(array) array of segments.
+</span></code><code id="L861"><span class="ln">861</span><span class="c">    \*/</span>
+</code><code id="L862"><span class="ln">862</span>    R.parsePathString<span class="s"> = </span>cacher(<b>function</b> (pathString) {
+</code><code id="L863"><span class="ln">863</span>        <b>if</b> (!pathString) {
+</code><code id="L864"><span class="ln">864</span>            <b>return</b> <b>null</b>;
+</code><code id="L865"><span class="ln">865</span>        }
+</code><code id="L866"><span class="ln">866</span>        <b>var</b> paramCounts<span class="s"> = </span>{a: <span class="d">7</span>, c: <span class="d">6</span>, h: <span class="d">1</span>, l: <span class="d">2</span>, m: <span class="d">2</span>, q: <span class="d">4</span>, s: <span class="d">4</span>, t: <span class="d">2</span>, v: <span class="d">1</span>, z: <span class="d">0</span>},
+</code><code id="L867"><span class="ln">867</span>            data<span class="s"> = </span>[];
+</code><code id="L868"><span class="ln">868</span>        <b>if</b> (R.is(pathString, array)<span class="s"> &amp;&amp; </span>R.is(pathString[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
+</code><code id="L869"><span class="ln">869</span>            data<span class="s"> = </span>pathClone(pathString);
+</code><code id="L870"><span class="ln">870</span>        }
+</code><code id="L871"><span class="ln">871</span>        <b>if</b> (!data.length) {
+</code><code id="L872"><span class="ln">872</span>            Str(pathString).replace(pathCommand, <b>function</b> (a, b, c) {
+</code><code id="L873"><span class="ln">873</span>                <b>var</b> params<span class="s"> = </span>[],
+</code><code id="L874"><span class="ln">874</span>                    name<span class="s"> = </span>lowerCase.call(b);
+</code><code id="L875"><span class="ln">875</span>                c.replace(pathValues, <b>function</b> (a, b) {
+</code><code id="L876"><span class="ln">876</span>                    b<span class="s"> &amp;&amp; </span>params.push(+b);
+</code><code id="L877"><span class="ln">877</span>                });
+</code><code id="L878"><span class="ln">878</span>                <b>if</b> (name<span class="s"> == </span><i>"m"</i><span class="s"> &amp;&amp; </span>params.length > <span class="d">2</span>) {
+</code><code id="L879"><span class="ln">879</span>                    data.push([b][concat](params.splice(<span class="d">0</span>, <span class="d">2</span>)));
+</code><code id="L880"><span class="ln">880</span>                    name<span class="s"> = </span><i>"l"</i>;
+</code><code id="L881"><span class="ln">881</span>                    b<span class="s"> = </span>b<span class="s"> == </span><i>"m"</i> ? <i>"l"</i> : <i>"L"</i>;
+</code><code id="L882"><span class="ln">882</span>                }
+</code><code id="L883"><span class="ln">883</span>                <b>while</b> (params.length >= paramCounts[name]) {
+</code><code id="L884"><span class="ln">884</span>                    data.push([b][concat](params.splice(<span class="d">0</span>, paramCounts[name])));
+</code><code id="L885"><span class="ln">885</span>                    <b>if</b> (!paramCounts[name]) {
+</code><code id="L886"><span class="ln">886</span>                        <b>break</b>;
+</code><code id="L887"><span class="ln">887</span>                    }
+</code><code id="L888"><span class="ln">888</span>                }
+</code><code id="L889"><span class="ln">889</span>            });
+</code><code id="L890"><span class="ln">890</span>        }
+</code><code id="L891"><span class="ln">891</span>        data.toString<span class="s"> = </span>R._path2string;
+</code><code id="L892"><span class="ln">892</span>        <b>return</b> data;
+</code><code id="L893"><span class="ln">893</span>    });
+</code><code id="L894"><span class="ln">894</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L895"><span class="ln">895</span><span class="c">    <span class="s"> * </span>Raphael.parseTransformString
+</span></code><code id="L896"><span class="ln">896</span><span class="c">     [ method ]
+</span></code><code id="L897"><span class="ln">897</span><span class="c">     **
+</span></code><code id="L898"><span class="ln">898</span><span class="c">    <span class="s"> * </span>Utility method
+</span></code><code id="L899"><span class="ln">899</span><span class="c">     **
+</span></code><code id="L900"><span class="ln">900</span><span class="c">    <span class="s"> * </span>Parses given path string into an array of transformations.
+</span></code><code id="L901"><span class="ln">901</span><span class="c">     > Parameters
+</span></code><code id="L902"><span class="ln">902</span><span class="c">    <span class="s"> - </span>TString (string|array) transform string or array of transformations (<b>in</b> the last <b>case</b> it will be returned straight away)
+</span></code><code id="L903"><span class="ln">903</span><span class="c">    <span class="s"> = </span>(array) array of transformations.
+</span></code><code id="L904"><span class="ln">904</span><span class="c">    \*/</span>
+</code><code id="L905"><span class="ln">905</span>    R.parseTransformString<span class="s"> = </span>cacher(<b>function</b> (TString) {
+</code><code id="L906"><span class="ln">906</span>        <b>if</b> (!TString) {
+</code><code id="L907"><span class="ln">907</span>            <b>return</b> <b>null</b>;
+</code><code id="L908"><span class="ln">908</span>        }
+</code><code id="L909"><span class="ln">909</span>        <b>var</b> paramCounts<span class="s"> = </span>{r: <span class="d">3</span>, s: <span class="d">4</span>, t: <span class="d">2</span>, m: <span class="d">6</span>},
+</code><code id="L910"><span class="ln">910</span>            data<span class="s"> = </span>[];
+</code><code id="L911"><span class="ln">911</span>        <b>if</b> (R.is(TString, array)<span class="s"> &amp;&amp; </span>R.is(TString[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
+</code><code id="L912"><span class="ln">912</span>            data<span class="s"> = </span>pathClone(TString);
+</code><code id="L913"><span class="ln">913</span>        }
+</code><code id="L914"><span class="ln">914</span>        <b>if</b> (!data.length) {
+</code><code id="L915"><span class="ln">915</span>            Str(TString).replace(tCommand, <b>function</b> (a, b, c) {
+</code><code id="L916"><span class="ln">916</span>                <b>var</b> params<span class="s"> = </span>[],
+</code><code id="L917"><span class="ln">917</span>                    name<span class="s"> = </span>lowerCase.call(b);
+</code><code id="L918"><span class="ln">918</span>                c.replace(pathValues, <b>function</b> (a, b) {
+</code><code id="L919"><span class="ln">919</span>                    b<span class="s"> &amp;&amp; </span>params.push(+b);
+</code><code id="L920"><span class="ln">920</span>                });
+</code><code id="L921"><span class="ln">921</span>                data.push([name][concat](params));
+</code><code id="L922"><span class="ln">922</span>            });
+</code><code id="L923"><span class="ln">923</span>        }
+</code><code id="L924"><span class="ln">924</span>        data.toString<span class="s"> = </span>R._path2string;
+</code><code id="L925"><span class="ln">925</span>        <b>return</b> data;
+</code><code id="L926"><span class="ln">926</span>    });
+</code><code id="L927"><span class="ln">927</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L928"><span class="ln">928</span><span class="c">    <span class="s"> * </span>Raphael.findDotsAtSegment
+</span></code><code id="L929"><span class="ln">929</span><span class="c">     [ method ]
+</span></code><code id="L930"><span class="ln">930</span><span class="c">     **
+</span></code><code id="L931"><span class="ln">931</span><span class="c">    <span class="s"> * </span>Utility method
+</span></code><code id="L932"><span class="ln">932</span><span class="c">     **
+</span></code><code id="L933"><span class="ln">933</span><span class="c">    <span class="s"> * </span>Find dot coordinates on the given cubic bezier curve at the given t.
+</span></code><code id="L934"><span class="ln">934</span><span class="c">     > Parameters
+</span></code><code id="L935"><span class="ln">935</span><span class="c">    <span class="s"> - </span>p1x (number) x of the first point of the curve
+</span></code><code id="L936"><span class="ln">936</span><span class="c">    <span class="s"> - </span>p1y (number) y of the first point of the curve
+</span></code><code id="L937"><span class="ln">937</span><span class="c">    <span class="s"> - </span>c1x (number) x of the first anchor of the curve
+</span></code><code id="L938"><span class="ln">938</span><span class="c">    <span class="s"> - </span>c1y (number) y of the first anchor of the curve
+</span></code><code id="L939"><span class="ln">939</span><span class="c">    <span class="s"> - </span>c2x (number) x of the second anchor of the curve
+</span></code><code id="L940"><span class="ln">940</span><span class="c">    <span class="s"> - </span>c2y (number) y of the second anchor of the curve
+</span></code><code id="L941"><span class="ln">941</span><span class="c">    <span class="s"> - </span>p2x (number) x of the second point of the curve
+</span></code><code id="L942"><span class="ln">942</span><span class="c">    <span class="s"> - </span>p2y (number) y of the second point of the curve
+</span></code><code id="L943"><span class="ln">943</span><span class="c">    <span class="s"> - </span>t (number) position on the curve (<span class="d">0</span>.<span class="d">.1</span>)
+</span></code><code id="L944"><span class="ln">944</span><span class="c">    <span class="s"> = </span>(object) point information <b>in</b> format:
+</span></code><code id="L945"><span class="ln">945</span><span class="c">     o {
+</span></code><code id="L946"><span class="ln">946</span><span class="c">     o     x: (number) x coordinate of the point
+</span></code><code id="L947"><span class="ln">947</span><span class="c">     o     y: (number) y coordinate of the point
+</span></code><code id="L948"><span class="ln">948</span><span class="c">     o     m: {
+</span></code><code id="L949"><span class="ln">949</span><span class="c">     o         x: (number) x coordinate of the left anchor
+</span></code><code id="L950"><span class="ln">950</span><span class="c">     o         y: (number) y coordinate of the left anchor
+</span></code><code id="L951"><span class="ln">951</span><span class="c">     o     }
+</span></code><code id="L952"><span class="ln">952</span><span class="c">     o     n: {
+</span></code><code id="L953"><span class="ln">953</span><span class="c">     o         x: (number) x coordinate of the right anchor
+</span></code><code id="L954"><span class="ln">954</span><span class="c">     o         y: (number) y coordinate of the right anchor
+</span></code><code id="L955"><span class="ln">955</span><span class="c">     o     }
+</span></code><code id="L956"><span class="ln">956</span><span class="c">     o     start: {
+</span></code><code id="L957"><span class="ln">957</span><span class="c">     o         x: (number) x coordinate of the start of the curve
+</span></code><code id="L958"><span class="ln">958</span><span class="c">     o         y: (number) y coordinate of the start of the curve
+</span></code><code id="L959"><span class="ln">959</span><span class="c">     o     }
+</span></code><code id="L960"><span class="ln">960</span><span class="c">     o     end: {
+</span></code><code id="L961"><span class="ln">961</span><span class="c">     o         x: (number) x coordinate of the end of the curve
+</span></code><code id="L962"><span class="ln">962</span><span class="c">     o         y: (number) y coordinate of the end of the curve
+</span></code><code id="L963"><span class="ln">963</span><span class="c">     o     }
+</span></code><code id="L964"><span class="ln">964</span><span class="c">     o     alpha: (number) angle of the curve derivative at the point
+</span></code><code id="L965"><span class="ln">965</span><span class="c">     o }
+</span></code><code id="L966"><span class="ln">966</span><span class="c">    \*/</span>
+</code><code id="L967"><span class="ln">967</span>    R.findDotsAtSegment<span class="s"> = </span><b>function</b> (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) {
+</code><code id="L968"><span class="ln">968</span>        <b>var</b> t1<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>t,
+</code><code id="L969"><span class="ln">969</span>            x<span class="s"> = </span>pow(t1, <span class="d">3</span>)<span class="s"> * </span>p1x<span class="s"> + </span>pow(t1, <span class="d">2</span>)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>c1x<span class="s"> + </span>t1<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> * </span>c2x<span class="s"> + </span>pow(t, <span class="d">3</span>)<span class="s"> * </span>p2x,
+</code><code id="L970"><span class="ln">970</span>            y<span class="s"> = </span>pow(t1, <span class="d">3</span>)<span class="s"> * </span>p1y<span class="s"> + </span>pow(t1, <span class="d">2</span>)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>c1y<span class="s"> + </span>t1<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> * </span>c2y<span class="s"> + </span>pow(t, <span class="d">3</span>)<span class="s"> * </span>p2y,
+</code><code id="L971"><span class="ln">971</span>            mx<span class="s"> = </span>p1x<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>t<span class="s"> * </span>(c1x<span class="s"> - </span>p1x)<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>(c2x<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c1x<span class="s"> + </span>p1x),
+</code><code id="L972"><span class="ln">972</span>            my<span class="s"> = </span>p1y<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>t<span class="s"> * </span>(c1y<span class="s"> - </span>p1y)<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>(c2y<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c1y<span class="s"> + </span>p1y),
+</code><code id="L973"><span class="ln">973</span>            nx<span class="s"> = </span>c1x<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>t<span class="s"> * </span>(c2x<span class="s"> - </span>c1x)<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>(p2x<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c2x<span class="s"> + </span>c1x),
+</code><code id="L974"><span class="ln">974</span>            ny<span class="s"> = </span>c1y<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>t<span class="s"> * </span>(c2y<span class="s"> - </span>c1y)<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>(p2y<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c2y<span class="s"> + </span>c1y),
+</code><code id="L975"><span class="ln">975</span>            ax<span class="s"> = </span>(<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span>p1x<span class="s"> + </span>t<span class="s"> * </span>c1x,
+</code><code id="L976"><span class="ln">976</span>            ay<span class="s"> = </span>(<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span>p1y<span class="s"> + </span>t<span class="s"> * </span>c1y,
+</code><code id="L977"><span class="ln">977</span>            cx<span class="s"> = </span>(<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span>c2x<span class="s"> + </span>t<span class="s"> * </span>p2x,
+</code><code id="L978"><span class="ln">978</span>            cy<span class="s"> = </span>(<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span>c2y<span class="s"> + </span>t<span class="s"> * </span>p2y,
+</code><code id="L979"><span class="ln">979</span>            alpha<span class="s"> = </span>(<span class="d">90</span><span class="s"> - </span>math.atan2(mx<span class="s"> - </span>nx, my<span class="s"> - </span>ny)<span class="s"> * </span><span class="d">180</span><span class="s"> / </span>PI);
+</code><code id="L980"><span class="ln">980</span>        (mx > nx<span class="s"> || </span>my &lt; ny)<span class="s"> &amp;&amp; </span>(alpha += <span class="d">180</span>);
+</code><code id="L981"><span class="ln">981</span>        <b>return</b> {x: x, y: y, m: {x: mx, y: my}, n: {x: nx, y: ny}, start: {x: ax, y: ay}, end: {x: cx, y: cy}, alpha: alpha};
+</code><code id="L982"><span class="ln">982</span>    };
+</code><code id="L983"><span class="ln">983</span>    <b>var</b> pathDimensions<span class="s"> = </span>cacher(<b>function</b> (path) {
+</code><code id="L984"><span class="ln">984</span>        <b>if</b> (!path) {
+</code><code id="L985"><span class="ln">985</span>            <b>return</b> {x: <span class="d">0</span>, y: <span class="d">0</span>, width: <span class="d">0</span>, height: <span class="d">0</span>};
+</code><code id="L986"><span class="ln">986</span>        }
+</code><code id="L987"><span class="ln">987</span>        path<span class="s"> = </span>path2curve(path);
+</code><code id="L988"><span class="ln">988</span>        <b>var</b> x<span class="s"> = </span><span class="d">0</span>, 
+</code><code id="L989"><span class="ln">989</span>            y<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L990"><span class="ln">990</span>            X<span class="s"> = </span>[],
+</code><code id="L991"><span class="ln">991</span>            Y<span class="s"> = </span>[],
+</code><code id="L992"><span class="ln">992</span>            p;
+</code><code id="L993"><span class="ln">993</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>path.length; i &lt; ii; i++) {
+</code><code id="L994"><span class="ln">994</span>            p<span class="s"> = </span>path[i];
+</code><code id="L995"><span class="ln">995</span>            <b>if</b> (p[<span class="d">0</span>]<span class="s"> == </span><i>"M"</i>) {
+</code><code id="L996"><span class="ln">996</span>                x<span class="s"> = </span>p[<span class="d">1</span>];
+</code><code id="L997"><span class="ln">997</span>                y<span class="s"> = </span>p[<span class="d">2</span>];
+</code><code id="L998"><span class="ln">998</span>                X.push(x);
+</code><code id="L999"><span class="ln">999</span>                Y.push(y);
+</code><code id="L1000"><span class="ln">1000</span>            } <b>else</b> {
+</code><code id="L1001"><span class="ln">1001</span>                <b>var</b> dim<span class="s"> = </span>curveDim(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>]);
+</code><code id="L1002"><span class="ln">1002</span>                X<span class="s"> = </span>X[concat](dim.min.x, dim.max.x);
+</code><code id="L1003"><span class="ln">1003</span>                Y<span class="s"> = </span>Y[concat](dim.min.y, dim.max.y);
+</code><code id="L1004"><span class="ln">1004</span>                x<span class="s"> = </span>p[<span class="d">5</span>];
+</code><code id="L1005"><span class="ln">1005</span>                y<span class="s"> = </span>p[<span class="d">6</span>];
+</code><code id="L1006"><span class="ln">1006</span>            }
+</code><code id="L1007"><span class="ln">1007</span>        }
+</code><code id="L1008"><span class="ln">1008</span>        <b>var</b> xmin<span class="s"> = </span>mmin[apply](<span class="d">0</span>, X),
+</code><code id="L1009"><span class="ln">1009</span>            ymin<span class="s"> = </span>mmin[apply](<span class="d">0</span>, Y);
+</code><code id="L1010"><span class="ln">1010</span>        <b>return</b> {
+</code><code id="L1011"><span class="ln">1011</span>            x: xmin,
+</code><code id="L1012"><span class="ln">1012</span>            y: ymin,
+</code><code id="L1013"><span class="ln">1013</span>            width: mmax[apply](<span class="d">0</span>, X)<span class="s"> - </span>xmin,
+</code><code id="L1014"><span class="ln">1014</span>            height: mmax[apply](<span class="d">0</span>, Y)<span class="s"> - </span>ymin
+</code><code id="L1015"><span class="ln">1015</span>        };
+</code><code id="L1016"><span class="ln">1016</span>    }),
+</code><code id="L1017"><span class="ln">1017</span>        pathClone<span class="s"> = </span><b>function</b> (pathArray) {
+</code><code id="L1018"><span class="ln">1018</span>            <b>var</b> res<span class="s"> = </span>[];
+</code><code id="L1019"><span class="ln">1019</span>            <b>if</b> (!R.is(pathArray, array)<span class="s"> || </span>!R.is(pathArray<span class="s"> &amp;&amp; </span>pathArray[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
+</code><code id="L1020"><span class="ln">1020</span>                pathArray<span class="s"> = </span>R.parsePathString(pathArray);
+</code><code id="L1021"><span class="ln">1021</span>            }
+</code><code id="L1022"><span class="ln">1022</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>pathArray.length; i &lt; ii; i++) {
+</code><code id="L1023"><span class="ln">1023</span>                res[i]<span class="s"> = </span>[];
+</code><code id="L1024"><span class="ln">1024</span>                <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>pathArray[i].length; j &lt; jj; j++) {
+</code><code id="L1025"><span class="ln">1025</span>                    res[i][j]<span class="s"> = </span>pathArray[i][j];
+</code><code id="L1026"><span class="ln">1026</span>                }
+</code><code id="L1027"><span class="ln">1027</span>            }
+</code><code id="L1028"><span class="ln">1028</span>            res.toString<span class="s"> = </span>R._path2string;
+</code><code id="L1029"><span class="ln">1029</span>            <b>return</b> res;
+</code><code id="L1030"><span class="ln">1030</span>        },
+</code><code id="L1031"><span class="ln">1031</span>        pathToRelative<span class="s"> = </span>cacher(<b>function</b> (pathArray) {
+</code><code id="L1032"><span class="ln">1032</span>            <b>if</b> (!R.is(pathArray, array)<span class="s"> || </span>!R.is(pathArray<span class="s"> &amp;&amp; </span>pathArray[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
+</code><code id="L1033"><span class="ln">1033</span>                pathArray<span class="s"> = </span>R.parsePathString(pathArray);
+</code><code id="L1034"><span class="ln">1034</span>            }
+</code><code id="L1035"><span class="ln">1035</span>            <b>var</b> res<span class="s"> = </span>[],
+</code><code id="L1036"><span class="ln">1036</span>                x<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1037"><span class="ln">1037</span>                y<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1038"><span class="ln">1038</span>                mx<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1039"><span class="ln">1039</span>                my<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1040"><span class="ln">1040</span>                start<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L1041"><span class="ln">1041</span>            <b>if</b> (pathArray[<span class="d">0</span>][<span class="d">0</span>]<span class="s"> == </span><i>"M"</i>) {
+</code><code id="L1042"><span class="ln">1042</span>                x<span class="s"> = </span>pathArray[<span class="d">0</span>][<span class="d">1</span>];
+</code><code id="L1043"><span class="ln">1043</span>                y<span class="s"> = </span>pathArray[<span class="d">0</span>][<span class="d">2</span>];
+</code><code id="L1044"><span class="ln">1044</span>                mx<span class="s"> = </span>x;
+</code><code id="L1045"><span class="ln">1045</span>                my<span class="s"> = </span>y;
+</code><code id="L1046"><span class="ln">1046</span>                start++;
+</code><code id="L1047"><span class="ln">1047</span>                res.push([<i>"M"</i>, x, y]);
+</code><code id="L1048"><span class="ln">1048</span>            }
+</code><code id="L1049"><span class="ln">1049</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span>start, ii<span class="s"> = </span>pathArray.length; i &lt; ii; i++) {
+</code><code id="L1050"><span class="ln">1050</span>                <b>var</b> r<span class="s"> = </span>res[i]<span class="s"> = </span>[],
+</code><code id="L1051"><span class="ln">1051</span>                    pa<span class="s"> = </span>pathArray[i];
+</code><code id="L1052"><span class="ln">1052</span>                <b>if</b> (pa[<span class="d">0</span>] != lowerCase.call(pa[<span class="d">0</span>])) {
+</code><code id="L1053"><span class="ln">1053</span>                    r[<span class="d">0</span>]<span class="s"> = </span>lowerCase.call(pa[<span class="d">0</span>]);
+</code><code id="L1054"><span class="ln">1054</span>                    <b>switch</b> (r[<span class="d">0</span>]) {
+</code><code id="L1055"><span class="ln">1055</span>                        <b>case</b> <i>"a"</i>:
+</code><code id="L1056"><span class="ln">1056</span>                            r[<span class="d">1</span>]<span class="s"> = </span>pa[<span class="d">1</span>];
+</code><code id="L1057"><span class="ln">1057</span>                            r[<span class="d">2</span>]<span class="s"> = </span>pa[<span class="d">2</span>];
+</code><code id="L1058"><span class="ln">1058</span>                            r[<span class="d">3</span>]<span class="s"> = </span>pa[<span class="d">3</span>];
+</code><code id="L1059"><span class="ln">1059</span>                            r[<span class="d">4</span>]<span class="s"> = </span>pa[<span class="d">4</span>];
+</code><code id="L1060"><span class="ln">1060</span>                            r[<span class="d">5</span>]<span class="s"> = </span>pa[<span class="d">5</span>];
+</code><code id="L1061"><span class="ln">1061</span>                            r[<span class="d">6</span>]<span class="s"> = </span>+(pa[<span class="d">6</span>]<span class="s"> - </span>x).toFixed(<span class="d">3</span>);
+</code><code id="L1062"><span class="ln">1062</span>                            r[<span class="d">7</span>]<span class="s"> = </span>+(pa[<span class="d">7</span>]<span class="s"> - </span>y).toFixed(<span class="d">3</span>);
+</code><code id="L1063"><span class="ln">1063</span>                            <b>break</b>;
+</code><code id="L1064"><span class="ln">1064</span>                        <b>case</b> <i>"v"</i>:
+</code><code id="L1065"><span class="ln">1065</span>                            r[<span class="d">1</span>]<span class="s"> = </span>+(pa[<span class="d">1</span>]<span class="s"> - </span>y).toFixed(<span class="d">3</span>);
+</code><code id="L1066"><span class="ln">1066</span>                            <b>break</b>;
+</code><code id="L1067"><span class="ln">1067</span>                        <b>case</b> <i>"m"</i>:
+</code><code id="L1068"><span class="ln">1068</span>                            mx<span class="s"> = </span>pa[<span class="d">1</span>];
+</code><code id="L1069"><span class="ln">1069</span>                            my<span class="s"> = </span>pa[<span class="d">2</span>];
+</code><code id="L1070"><span class="ln">1070</span>                        <b>default</b>:
+</code><code id="L1071"><span class="ln">1071</span>                            <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>pa.length; j &lt; jj; j++) {
+</code><code id="L1072"><span class="ln">1072</span>                                r[j]<span class="s"> = </span>+(pa[j]<span class="s"> - </span>((j<span class="s"> % </span><span class="d">2</span>) ? x : y)).toFixed(<span class="d">3</span>);
+</code><code id="L1073"><span class="ln">1073</span>                            }
+</code><code id="L1074"><span class="ln">1074</span>                    }
+</code><code id="L1075"><span class="ln">1075</span>                } <b>else</b> {
+</code><code id="L1076"><span class="ln">1076</span>                    r<span class="s"> = </span>res[i]<span class="s"> = </span>[];
+</code><code id="L1077"><span class="ln">1077</span>                    <b>if</b> (pa[<span class="d">0</span>]<span class="s"> == </span><i>"m"</i>) {
+</code><code id="L1078"><span class="ln">1078</span>                        mx<span class="s"> = </span>pa[<span class="d">1</span>]<span class="s"> + </span>x;
+</code><code id="L1079"><span class="ln">1079</span>                        my<span class="s"> = </span>pa[<span class="d">2</span>]<span class="s"> + </span>y;
+</code><code id="L1080"><span class="ln">1080</span>                    }
+</code><code id="L1081"><span class="ln">1081</span>                    <b>for</b> (<b>var</b> k<span class="s"> = </span><span class="d">0</span>, kk<span class="s"> = </span>pa.length; k &lt; kk; k++) {
+</code><code id="L1082"><span class="ln">1082</span>                        res[i][k]<span class="s"> = </span>pa[k];
+</code><code id="L1083"><span class="ln">1083</span>                    }
+</code><code id="L1084"><span class="ln">1084</span>                }
+</code><code id="L1085"><span class="ln">1085</span>                <b>var</b> len<span class="s"> = </span>res[i].length;
+</code><code id="L1086"><span class="ln">1086</span>                <b>switch</b> (res[i][<span class="d">0</span>]) {
+</code><code id="L1087"><span class="ln">1087</span>                    <b>case</b> <i>"z"</i>:
+</code><code id="L1088"><span class="ln">1088</span>                        x<span class="s"> = </span>mx;
+</code><code id="L1089"><span class="ln">1089</span>                        y<span class="s"> = </span>my;
+</code><code id="L1090"><span class="ln">1090</span>                        <b>break</b>;
+</code><code id="L1091"><span class="ln">1091</span>                    <b>case</b> <i>"h"</i>:
+</code><code id="L1092"><span class="ln">1092</span>                        x += +res[i][len<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L1093"><span class="ln">1093</span>                        <b>break</b>;
+</code><code id="L1094"><span class="ln">1094</span>                    <b>case</b> <i>"v"</i>:
+</code><code id="L1095"><span class="ln">1095</span>                        y += +res[i][len<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L1096"><span class="ln">1096</span>                        <b>break</b>;
+</code><code id="L1097"><span class="ln">1097</span>                    <b>default</b>:
+</code><code id="L1098"><span class="ln">1098</span>                        x += +res[i][len<span class="s"> - </span><span class="d">2</span>];
+</code><code id="L1099"><span class="ln">1099</span>                        y += +res[i][len<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L1100"><span class="ln">1100</span>                }
+</code><code id="L1101"><span class="ln">1101</span>            }
+</code><code id="L1102"><span class="ln">1102</span>            res.toString<span class="s"> = </span>R._path2string;
+</code><code id="L1103"><span class="ln">1103</span>            <b>return</b> res;
+</code><code id="L1104"><span class="ln">1104</span>        }, <span class="d">0</span>, pathClone),
+</code><code id="L1105"><span class="ln">1105</span>        pathToAbsolute<span class="s"> = </span>cacher(<b>function</b> (pathArray) {
+</code><code id="L1106"><span class="ln">1106</span>            <b>if</b> (!R.is(pathArray, array)<span class="s"> || </span>!R.is(pathArray<span class="s"> &amp;&amp; </span>pathArray[<span class="d">0</span>], array)) { <span class="c">// rough assumption</span>
+</code><code id="L1107"><span class="ln">1107</span>                pathArray<span class="s"> = </span>R.parsePathString(pathArray);
+</code><code id="L1108"><span class="ln">1108</span>            }
+</code><code id="L1109"><span class="ln">1109</span>            <b>var</b> res<span class="s"> = </span>[],
+</code><code id="L1110"><span class="ln">1110</span>                x<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1111"><span class="ln">1111</span>                y<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1112"><span class="ln">1112</span>                mx<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1113"><span class="ln">1113</span>                my<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1114"><span class="ln">1114</span>                start<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L1115"><span class="ln">1115</span>            <b>if</b> (pathArray[<span class="d">0</span>][<span class="d">0</span>]<span class="s"> == </span><i>"M"</i>) {
+</code><code id="L1116"><span class="ln">1116</span>                x<span class="s"> = </span>+pathArray[<span class="d">0</span>][<span class="d">1</span>];
+</code><code id="L1117"><span class="ln">1117</span>                y<span class="s"> = </span>+pathArray[<span class="d">0</span>][<span class="d">2</span>];
+</code><code id="L1118"><span class="ln">1118</span>                mx<span class="s"> = </span>x;
+</code><code id="L1119"><span class="ln">1119</span>                my<span class="s"> = </span>y;
+</code><code id="L1120"><span class="ln">1120</span>                start++;
+</code><code id="L1121"><span class="ln">1121</span>                res[<span class="d">0</span>]<span class="s"> = </span>[<i>"M"</i>, x, y];
+</code><code id="L1122"><span class="ln">1122</span>            }
+</code><code id="L1123"><span class="ln">1123</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span>start, ii<span class="s"> = </span>pathArray.length; i &lt; ii; i++) {
+</code><code id="L1124"><span class="ln">1124</span>                <b>var</b> r<span class="s"> = </span>res[i]<span class="s"> = </span>[],
+</code><code id="L1125"><span class="ln">1125</span>                    pa<span class="s"> = </span>pathArray[i];
+</code><code id="L1126"><span class="ln">1126</span>                <b>if</b> (pa[<span class="d">0</span>] != upperCase.call(pa[<span class="d">0</span>])) {
+</code><code id="L1127"><span class="ln">1127</span>                    r[<span class="d">0</span>]<span class="s"> = </span>upperCase.call(pa[<span class="d">0</span>]);
+</code><code id="L1128"><span class="ln">1128</span>                    <b>switch</b> (r[<span class="d">0</span>]) {
+</code><code id="L1129"><span class="ln">1129</span>                        <b>case</b> <i>"A"</i>:
+</code><code id="L1130"><span class="ln">1130</span>                            r[<span class="d">1</span>]<span class="s"> = </span>pa[<span class="d">1</span>];
+</code><code id="L1131"><span class="ln">1131</span>                            r[<span class="d">2</span>]<span class="s"> = </span>pa[<span class="d">2</span>];
+</code><code id="L1132"><span class="ln">1132</span>                            r[<span class="d">3</span>]<span class="s"> = </span>pa[<span class="d">3</span>];
+</code><code id="L1133"><span class="ln">1133</span>                            r[<span class="d">4</span>]<span class="s"> = </span>pa[<span class="d">4</span>];
+</code><code id="L1134"><span class="ln">1134</span>                            r[<span class="d">5</span>]<span class="s"> = </span>pa[<span class="d">5</span>];
+</code><code id="L1135"><span class="ln">1135</span>                            r[<span class="d">6</span>]<span class="s"> = </span>+(pa[<span class="d">6</span>]<span class="s"> + </span>x);
+</code><code id="L1136"><span class="ln">1136</span>                            r[<span class="d">7</span>]<span class="s"> = </span>+(pa[<span class="d">7</span>]<span class="s"> + </span>y);
+</code><code id="L1137"><span class="ln">1137</span>                            <b>break</b>;
+</code><code id="L1138"><span class="ln">1138</span>                        <b>case</b> <i>"V"</i>:
+</code><code id="L1139"><span class="ln">1139</span>                            r[<span class="d">1</span>]<span class="s"> = </span>+pa[<span class="d">1</span>]<span class="s"> + </span>y;
+</code><code id="L1140"><span class="ln">1140</span>                            <b>break</b>;
+</code><code id="L1141"><span class="ln">1141</span>                        <b>case</b> <i>"H"</i>:
+</code><code id="L1142"><span class="ln">1142</span>                            r[<span class="d">1</span>]<span class="s"> = </span>+pa[<span class="d">1</span>]<span class="s"> + </span>x;
+</code><code id="L1143"><span class="ln">1143</span>                            <b>break</b>;
+</code><code id="L1144"><span class="ln">1144</span>                        <b>case</b> <i>"M"</i>:
+</code><code id="L1145"><span class="ln">1145</span>                            mx<span class="s"> = </span>+pa[<span class="d">1</span>]<span class="s"> + </span>x;
+</code><code id="L1146"><span class="ln">1146</span>                            my<span class="s"> = </span>+pa[<span class="d">2</span>]<span class="s"> + </span>y;
+</code><code id="L1147"><span class="ln">1147</span>                        <b>default</b>:
+</code><code id="L1148"><span class="ln">1148</span>                            <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>pa.length; j &lt; jj; j++) {
+</code><code id="L1149"><span class="ln">1149</span>                                r[j]<span class="s"> = </span>+pa[j]<span class="s"> + </span>((j<span class="s"> % </span><span class="d">2</span>) ? x : y);
+</code><code id="L1150"><span class="ln">1150</span>                            }
+</code><code id="L1151"><span class="ln">1151</span>                    }
+</code><code id="L1152"><span class="ln">1152</span>                } <b>else</b> {
+</code><code id="L1153"><span class="ln">1153</span>                    <b>for</b> (<b>var</b> k<span class="s"> = </span><span class="d">0</span>, kk<span class="s"> = </span>pa.length; k &lt; kk; k++) {
+</code><code id="L1154"><span class="ln">1154</span>                        res[i][k]<span class="s"> = </span>pa[k];
+</code><code id="L1155"><span class="ln">1155</span>                    }
+</code><code id="L1156"><span class="ln">1156</span>                }
+</code><code id="L1157"><span class="ln">1157</span>                <b>switch</b> (r[<span class="d">0</span>]) {
+</code><code id="L1158"><span class="ln">1158</span>                    <b>case</b> <i>"Z"</i>:
+</code><code id="L1159"><span class="ln">1159</span>                        x<span class="s"> = </span>mx;
+</code><code id="L1160"><span class="ln">1160</span>                        y<span class="s"> = </span>my;
+</code><code id="L1161"><span class="ln">1161</span>                        <b>break</b>;
+</code><code id="L1162"><span class="ln">1162</span>                    <b>case</b> <i>"H"</i>:
+</code><code id="L1163"><span class="ln">1163</span>                        x<span class="s"> = </span>r[<span class="d">1</span>];
+</code><code id="L1164"><span class="ln">1164</span>                        <b>break</b>;
+</code><code id="L1165"><span class="ln">1165</span>                    <b>case</b> <i>"V"</i>:
+</code><code id="L1166"><span class="ln">1166</span>                        y<span class="s"> = </span>r[<span class="d">1</span>];
+</code><code id="L1167"><span class="ln">1167</span>                        <b>break</b>;
+</code><code id="L1168"><span class="ln">1168</span>                    <b>case</b> <i>"M"</i>:
+</code><code id="L1169"><span class="ln">1169</span>                        mx<span class="s"> = </span>res[i][res[i].length<span class="s"> - </span><span class="d">2</span>];
+</code><code id="L1170"><span class="ln">1170</span>                        my<span class="s"> = </span>res[i][res[i].length<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L1171"><span class="ln">1171</span>                    <b>default</b>:
+</code><code id="L1172"><span class="ln">1172</span>                        x<span class="s"> = </span>res[i][res[i].length<span class="s"> - </span><span class="d">2</span>];
+</code><code id="L1173"><span class="ln">1173</span>                        y<span class="s"> = </span>res[i][res[i].length<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L1174"><span class="ln">1174</span>                }
+</code><code id="L1175"><span class="ln">1175</span>            }
+</code><code id="L1176"><span class="ln">1176</span>            res.toString<span class="s"> = </span>R._path2string;
+</code><code id="L1177"><span class="ln">1177</span>            <b>return</b> res;
+</code><code id="L1178"><span class="ln">1178</span>        }, <b>null</b>, pathClone),
+</code><code id="L1179"><span class="ln">1179</span>        l2c<span class="s"> = </span><b>function</b> (x1, y1, x2, y2) {
+</code><code id="L1180"><span class="ln">1180</span>            <b>return</b> [x1, y1, x2, y2, x2, y2];
+</code><code id="L1181"><span class="ln">1181</span>        },
+</code><code id="L1182"><span class="ln">1182</span>        q2c<span class="s"> = </span><b>function</b> (x1, y1, ax, ay, x2, y2) {
+</code><code id="L1183"><span class="ln">1183</span>            <b>var</b> _13<span class="s"> = </span><span class="d">1</span><span class="s"> / </span><span class="d">3</span>,
+</code><code id="L1184"><span class="ln">1184</span>                _23<span class="s"> = </span><span class="d">2</span><span class="s"> / </span><span class="d">3</span>;
+</code><code id="L1185"><span class="ln">1185</span>            <b>return</b> [
+</code><code id="L1186"><span class="ln">1186</span>                    _13<span class="s"> * </span>x1<span class="s"> + </span>_23<span class="s"> * </span>ax,
+</code><code id="L1187"><span class="ln">1187</span>                    _13<span class="s"> * </span>y1<span class="s"> + </span>_23<span class="s"> * </span>ay,
+</code><code id="L1188"><span class="ln">1188</span>                    _13<span class="s"> * </span>x2<span class="s"> + </span>_23<span class="s"> * </span>ax,
+</code><code id="L1189"><span class="ln">1189</span>                    _13<span class="s"> * </span>y2<span class="s"> + </span>_23<span class="s"> * </span>ay,
+</code><code id="L1190"><span class="ln">1190</span>                    x2,
+</code><code id="L1191"><span class="ln">1191</span>                    y2
+</code><code id="L1192"><span class="ln">1192</span>                ];
+</code><code id="L1193"><span class="ln">1193</span>        },
+</code><code id="L1194"><span class="ln">1194</span>        a2c<span class="s"> = </span><b>function</b> (x1, y1, rx, ry, angle, large_arc_flag, sweep_flag, x2, y2, recursive) {
+</code><code id="L1195"><span class="ln">1195</span>            <span class="c">// <b>for</b> more information of where <b>this</b> math came from visit:</span>
+</code><code id="L1196"><span class="ln">1196</span>            <span class="c">// http://www.w3.org/TR/SVG11/implnote.html#ArcImplementationNotes</span>
+</code><code id="L1197"><span class="ln">1197</span>            <b>var</b> _120<span class="s"> = </span>PI<span class="s"> * </span><span class="d">120</span><span class="s"> / </span><span class="d">180</span>,
+</code><code id="L1198"><span class="ln">1198</span>                rad<span class="s"> = </span>PI<span class="s"> / </span><span class="d">180</span><span class="s"> * </span>(+angle<span class="s"> || </span><span class="d">0</span>),
+</code><code id="L1199"><span class="ln">1199</span>                res<span class="s"> = </span>[],
+</code><code id="L1200"><span class="ln">1200</span>                xy,
+</code><code id="L1201"><span class="ln">1201</span>                rotate<span class="s"> = </span>cacher(<b>function</b> (x, y, rad) {
+</code><code id="L1202"><span class="ln">1202</span>                    <b>var</b> X<span class="s"> = </span>x<span class="s"> * </span>math.cos(rad)<span class="s"> - </span>y<span class="s"> * </span>math.sin(rad),
+</code><code id="L1203"><span class="ln">1203</span>                        Y<span class="s"> = </span>x<span class="s"> * </span>math.sin(rad)<span class="s"> + </span>y<span class="s"> * </span>math.cos(rad);
+</code><code id="L1204"><span class="ln">1204</span>                    <b>return</b> {x: X, y: Y};
+</code><code id="L1205"><span class="ln">1205</span>                });
+</code><code id="L1206"><span class="ln">1206</span>            <b>if</b> (!recursive) {
+</code><code id="L1207"><span class="ln">1207</span>                xy<span class="s"> = </span>rotate(x1, y1, -rad);
+</code><code id="L1208"><span class="ln">1208</span>                x1<span class="s"> = </span>xy.x;
+</code><code id="L1209"><span class="ln">1209</span>                y1<span class="s"> = </span>xy.y;
+</code><code id="L1210"><span class="ln">1210</span>                xy<span class="s"> = </span>rotate(x2, y2, -rad);
+</code><code id="L1211"><span class="ln">1211</span>                x2<span class="s"> = </span>xy.x;
+</code><code id="L1212"><span class="ln">1212</span>                y2<span class="s"> = </span>xy.y;
+</code><code id="L1213"><span class="ln">1213</span>                <b>var</b> cos<span class="s"> = </span>math.cos(PI<span class="s"> / </span><span class="d">180</span><span class="s"> * </span>angle),
+</code><code id="L1214"><span class="ln">1214</span>                    sin<span class="s"> = </span>math.sin(PI<span class="s"> / </span><span class="d">180</span><span class="s"> * </span>angle),
+</code><code id="L1215"><span class="ln">1215</span>                    x<span class="s"> = </span>(x1<span class="s"> - </span>x2)<span class="s"> / </span><span class="d">2</span>,
+</code><code id="L1216"><span class="ln">1216</span>                    y<span class="s"> = </span>(y1<span class="s"> - </span>y2)<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L1217"><span class="ln">1217</span>                <b>var</b> h<span class="s"> = </span>(x<span class="s"> * </span>x)<span class="s"> / </span>(rx<span class="s"> * </span>rx)<span class="s"> + </span>(y<span class="s"> * </span>y)<span class="s"> / </span>(ry<span class="s"> * </span>ry);
+</code><code id="L1218"><span class="ln">1218</span>                <b>if</b> (h > <span class="d">1</span>) {
+</code><code id="L1219"><span class="ln">1219</span>                    h<span class="s"> = </span>math.sqrt(h);
+</code><code id="L1220"><span class="ln">1220</span>                    rx<span class="s"> = </span>h<span class="s"> * </span>rx;
+</code><code id="L1221"><span class="ln">1221</span>                    ry<span class="s"> = </span>h<span class="s"> * </span>ry;
+</code><code id="L1222"><span class="ln">1222</span>                }
+</code><code id="L1223"><span class="ln">1223</span>                <b>var</b> rx2<span class="s"> = </span>rx<span class="s"> * </span>rx,
+</code><code id="L1224"><span class="ln">1224</span>                    ry2<span class="s"> = </span>ry<span class="s"> * </span>ry,
+</code><code id="L1225"><span class="ln">1225</span>                    k<span class="s"> = </span>(large_arc_flag<span class="s"> == </span>sweep_flag ? -<span class="d">1</span> : <span class="d">1</span>) *
+</code><code id="L1226"><span class="ln">1226</span>                        math.sqrt(abs((rx2<span class="s"> * </span>ry2<span class="s"> - </span>rx2<span class="s"> * </span>y<span class="s"> * </span>y<span class="s"> - </span>ry2<span class="s"> * </span>x<span class="s"> * </span>x)<span class="s"> / </span>(rx2<span class="s"> * </span>y<span class="s"> * </span>y<span class="s"> + </span>ry2<span class="s"> * </span>x<span class="s"> * </span>x))),
+</code><code id="L1227"><span class="ln">1227</span>                    cx<span class="s"> = </span>k<span class="s"> * </span>rx<span class="s"> * </span>y<span class="s"> / </span>ry<span class="s"> + </span>(x1<span class="s"> + </span>x2)<span class="s"> / </span><span class="d">2</span>,
+</code><code id="L1228"><span class="ln">1228</span>                    cy<span class="s"> = </span>k<span class="s"> * </span>-ry<span class="s"> * </span>x<span class="s"> / </span>rx<span class="s"> + </span>(y1<span class="s"> + </span>y2)<span class="s"> / </span><span class="d">2</span>,
+</code><code id="L1229"><span class="ln">1229</span>                    f1<span class="s"> = </span>math.asin(((y1<span class="s"> - </span>cy)<span class="s"> / </span>ry).toFixed(<span class="d">9</span>)),
+</code><code id="L1230"><span class="ln">1230</span>                    f2<span class="s"> = </span>math.asin(((y2<span class="s"> - </span>cy)<span class="s"> / </span>ry).toFixed(<span class="d">9</span>));
+</code><code id="L1231"><span class="ln">1231</span>
+</code><code id="L1232"><span class="ln">1232</span>                f1<span class="s"> = </span>x1 &lt; cx ? PI<span class="s"> - </span>f1 : f1;
+</code><code id="L1233"><span class="ln">1233</span>                f2<span class="s"> = </span>x2 &lt; cx ? PI<span class="s"> - </span>f2 : f2;
+</code><code id="L1234"><span class="ln">1234</span>                f1 &lt; <span class="d">0</span><span class="s"> &amp;&amp; </span>(f1<span class="s"> = </span>PI<span class="s"> * </span><span class="d">2</span><span class="s"> + </span>f1);
+</code><code id="L1235"><span class="ln">1235</span>                f2 &lt; <span class="d">0</span><span class="s"> &amp;&amp; </span>(f2<span class="s"> = </span>PI<span class="s"> * </span><span class="d">2</span><span class="s"> + </span>f2);
+</code><code id="L1236"><span class="ln">1236</span>                <b>if</b> (sweep_flag<span class="s"> &amp;&amp; </span>f1 > f2) {
+</code><code id="L1237"><span class="ln">1237</span>                    f1<span class="s"> = </span>f1<span class="s"> - </span>PI<span class="s"> * </span><span class="d">2</span>;
+</code><code id="L1238"><span class="ln">1238</span>                }
+</code><code id="L1239"><span class="ln">1239</span>                <b>if</b> (!sweep_flag<span class="s"> &amp;&amp; </span>f2 > f1) {
+</code><code id="L1240"><span class="ln">1240</span>                    f2<span class="s"> = </span>f2<span class="s"> - </span>PI<span class="s"> * </span><span class="d">2</span>;
+</code><code id="L1241"><span class="ln">1241</span>                }
+</code><code id="L1242"><span class="ln">1242</span>            } <b>else</b> {
+</code><code id="L1243"><span class="ln">1243</span>                f1<span class="s"> = </span>recursive[<span class="d">0</span>];
+</code><code id="L1244"><span class="ln">1244</span>                f2<span class="s"> = </span>recursive[<span class="d">1</span>];
+</code><code id="L1245"><span class="ln">1245</span>                cx<span class="s"> = </span>recursive[<span class="d">2</span>];
+</code><code id="L1246"><span class="ln">1246</span>                cy<span class="s"> = </span>recursive[<span class="d">3</span>];
+</code><code id="L1247"><span class="ln">1247</span>            }
+</code><code id="L1248"><span class="ln">1248</span>            <b>var</b> df<span class="s"> = </span>f2<span class="s"> - </span>f1;
+</code><code id="L1249"><span class="ln">1249</span>            <b>if</b> (abs(df) > _120) {
+</code><code id="L1250"><span class="ln">1250</span>                <b>var</b> f2old<span class="s"> = </span>f2,
+</code><code id="L1251"><span class="ln">1251</span>                    x2old<span class="s"> = </span>x2,
+</code><code id="L1252"><span class="ln">1252</span>                    y2old<span class="s"> = </span>y2;
+</code><code id="L1253"><span class="ln">1253</span>                f2<span class="s"> = </span>f1<span class="s"> + </span>_120<span class="s"> * </span>(sweep_flag<span class="s"> &amp;&amp; </span>f2 > f1 ? <span class="d">1</span> : -<span class="d">1</span>);
+</code><code id="L1254"><span class="ln">1254</span>                x2<span class="s"> = </span>cx<span class="s"> + </span>rx<span class="s"> * </span>math.cos(f2);
+</code><code id="L1255"><span class="ln">1255</span>                y2<span class="s"> = </span>cy<span class="s"> + </span>ry<span class="s"> * </span>math.sin(f2);
+</code><code id="L1256"><span class="ln">1256</span>                res<span class="s"> = </span>a2c(x2, y2, rx, ry, angle, <span class="d">0</span>, sweep_flag, x2old, y2old, [f2, f2old, cx, cy]);
+</code><code id="L1257"><span class="ln">1257</span>            }
+</code><code id="L1258"><span class="ln">1258</span>            df<span class="s"> = </span>f2<span class="s"> - </span>f1;
+</code><code id="L1259"><span class="ln">1259</span>            <b>var</b> c1<span class="s"> = </span>math.cos(f1),
+</code><code id="L1260"><span class="ln">1260</span>                s1<span class="s"> = </span>math.sin(f1),
+</code><code id="L1261"><span class="ln">1261</span>                c2<span class="s"> = </span>math.cos(f2),
+</code><code id="L1262"><span class="ln">1262</span>                s2<span class="s"> = </span>math.sin(f2),
+</code><code id="L1263"><span class="ln">1263</span>                t<span class="s"> = </span>math.tan(df<span class="s"> / </span><span class="d">4</span>),
+</code><code id="L1264"><span class="ln">1264</span>                hx<span class="s"> = </span><span class="d">4</span><span class="s"> / </span><span class="d">3</span><span class="s"> * </span>rx<span class="s"> * </span>t,
+</code><code id="L1265"><span class="ln">1265</span>                hy<span class="s"> = </span><span class="d">4</span><span class="s"> / </span><span class="d">3</span><span class="s"> * </span>ry<span class="s"> * </span>t,
+</code><code id="L1266"><span class="ln">1266</span>                m1<span class="s"> = </span>[x1, y1],
+</code><code id="L1267"><span class="ln">1267</span>                m2<span class="s"> = </span>[x1<span class="s"> + </span>hx<span class="s"> * </span>s1, y1<span class="s"> - </span>hy<span class="s"> * </span>c1],
+</code><code id="L1268"><span class="ln">1268</span>                m3<span class="s"> = </span>[x2<span class="s"> + </span>hx<span class="s"> * </span>s2, y2<span class="s"> - </span>hy<span class="s"> * </span>c2],
+</code><code id="L1269"><span class="ln">1269</span>                m4<span class="s"> = </span>[x2, y2];
+</code><code id="L1270"><span class="ln">1270</span>            m2[<span class="d">0</span>]<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>m1[<span class="d">0</span>]<span class="s"> - </span>m2[<span class="d">0</span>];
+</code><code id="L1271"><span class="ln">1271</span>            m2[<span class="d">1</span>]<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>m1[<span class="d">1</span>]<span class="s"> - </span>m2[<span class="d">1</span>];
+</code><code id="L1272"><span class="ln">1272</span>            <b>if</b> (recursive) {
+</code><code id="L1273"><span class="ln">1273</span>                <b>return</b> [m2, m3, m4][concat](res);
+</code><code id="L1274"><span class="ln">1274</span>            } <b>else</b> {
+</code><code id="L1275"><span class="ln">1275</span>                res<span class="s"> = </span>[m2, m3, m4][concat](res).join().split(<i>","</i>);
+</code><code id="L1276"><span class="ln">1276</span>                <b>var</b> newres<span class="s"> = </span>[];
+</code><code id="L1277"><span class="ln">1277</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>res.length; i &lt; ii; i++) {
+</code><code id="L1278"><span class="ln">1278</span>                    newres[i]<span class="s"> = </span>i<span class="s"> % </span><span class="d">2</span> ? rotate(res[i<span class="s"> - </span><span class="d">1</span>], res[i], rad).y : rotate(res[i], res[i<span class="s"> + </span><span class="d">1</span>], rad).x;
+</code><code id="L1279"><span class="ln">1279</span>                }
+</code><code id="L1280"><span class="ln">1280</span>                <b>return</b> newres;
+</code><code id="L1281"><span class="ln">1281</span>            }
+</code><code id="L1282"><span class="ln">1282</span>        },
+</code><code id="L1283"><span class="ln">1283</span>        findDotAtSegment<span class="s"> = </span><b>function</b> (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) {
+</code><code id="L1284"><span class="ln">1284</span>            <b>var</b> t1<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>t;
+</code><code id="L1285"><span class="ln">1285</span>            <b>return</b> {
+</code><code id="L1286"><span class="ln">1286</span>                x: pow(t1, <span class="d">3</span>)<span class="s"> * </span>p1x<span class="s"> + </span>pow(t1, <span class="d">2</span>)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>c1x<span class="s"> + </span>t1<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> * </span>c2x<span class="s"> + </span>pow(t, <span class="d">3</span>)<span class="s"> * </span>p2x,
+</code><code id="L1287"><span class="ln">1287</span>                y: pow(t1, <span class="d">3</span>)<span class="s"> * </span>p1y<span class="s"> + </span>pow(t1, <span class="d">2</span>)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>c1y<span class="s"> + </span>t1<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> * </span>c2y<span class="s"> + </span>pow(t, <span class="d">3</span>)<span class="s"> * </span>p2y
+</code><code id="L1288"><span class="ln">1288</span>            };
+</code><code id="L1289"><span class="ln">1289</span>        },
+</code><code id="L1290"><span class="ln">1290</span>        curveDim<span class="s"> = </span>cacher(<b>function</b> (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y) {
+</code><code id="L1291"><span class="ln">1291</span>            <b>var</b> a<span class="s"> = </span>(c2x<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c1x<span class="s"> + </span>p1x)<span class="s"> - </span>(p2x<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c2x<span class="s"> + </span>c1x),
+</code><code id="L1292"><span class="ln">1292</span>                b<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>(c1x<span class="s"> - </span>p1x)<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>(c2x<span class="s"> - </span>c1x),
+</code><code id="L1293"><span class="ln">1293</span>                c<span class="s"> = </span>p1x<span class="s"> - </span>c1x,
+</code><code id="L1294"><span class="ln">1294</span>                t1<span class="s"> = </span>(-b<span class="s"> + </span>math.sqrt(b<span class="s"> * </span>b<span class="s"> - </span><span class="d">4</span><span class="s"> * </span>a<span class="s"> * </span>c))<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>a,
+</code><code id="L1295"><span class="ln">1295</span>                t2<span class="s"> = </span>(-b<span class="s"> - </span>math.sqrt(b<span class="s"> * </span>b<span class="s"> - </span><span class="d">4</span><span class="s"> * </span>a<span class="s"> * </span>c))<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>a,
+</code><code id="L1296"><span class="ln">1296</span>                y<span class="s"> = </span>[p1y, p2y],
+</code><code id="L1297"><span class="ln">1297</span>                x<span class="s"> = </span>[p1x, p2x],
+</code><code id="L1298"><span class="ln">1298</span>                dot;
+</code><code id="L1299"><span class="ln">1299</span>            abs(t1) > <i>"<span class="d">1e12</span>"</i><span class="s"> &amp;&amp; </span>(t1<span class="s"> = </span><span class="d">.5</span>);
+</code><code id="L1300"><span class="ln">1300</span>            abs(t2) > <i>"<span class="d">1e12</span>"</i><span class="s"> &amp;&amp; </span>(t2<span class="s"> = </span><span class="d">.5</span>);
+</code><code id="L1301"><span class="ln">1301</span>            <b>if</b> (t1 > <span class="d">0</span><span class="s"> &amp;&amp; </span>t1 &lt; <span class="d">1</span>) {
+</code><code id="L1302"><span class="ln">1302</span>                dot<span class="s"> = </span>findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t1);
+</code><code id="L1303"><span class="ln">1303</span>                x.push(dot.x);
+</code><code id="L1304"><span class="ln">1304</span>                y.push(dot.y);
+</code><code id="L1305"><span class="ln">1305</span>            }
+</code><code id="L1306"><span class="ln">1306</span>            <b>if</b> (t2 > <span class="d">0</span><span class="s"> &amp;&amp; </span>t2 &lt; <span class="d">1</span>) {
+</code><code id="L1307"><span class="ln">1307</span>                dot<span class="s"> = </span>findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t2);
+</code><code id="L1308"><span class="ln">1308</span>                x.push(dot.x);
+</code><code id="L1309"><span class="ln">1309</span>                y.push(dot.y);
+</code><code id="L1310"><span class="ln">1310</span>            }
+</code><code id="L1311"><span class="ln">1311</span>            a<span class="s"> = </span>(c2y<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c1y<span class="s"> + </span>p1y)<span class="s"> - </span>(p2y<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>c2y<span class="s"> + </span>c1y);
+</code><code id="L1312"><span class="ln">1312</span>            b<span class="s"> = </span><span class="d">2</span><span class="s"> * </span>(c1y<span class="s"> - </span>p1y)<span class="s"> - </span><span class="d">2</span><span class="s"> * </span>(c2y<span class="s"> - </span>c1y);
+</code><code id="L1313"><span class="ln">1313</span>            c<span class="s"> = </span>p1y<span class="s"> - </span>c1y;
+</code><code id="L1314"><span class="ln">1314</span>            t1<span class="s"> = </span>(-b<span class="s"> + </span>math.sqrt(b<span class="s"> * </span>b<span class="s"> - </span><span class="d">4</span><span class="s"> * </span>a<span class="s"> * </span>c))<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>a;
+</code><code id="L1315"><span class="ln">1315</span>            t2<span class="s"> = </span>(-b<span class="s"> - </span>math.sqrt(b<span class="s"> * </span>b<span class="s"> - </span><span class="d">4</span><span class="s"> * </span>a<span class="s"> * </span>c))<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>a;
+</code><code id="L1316"><span class="ln">1316</span>            abs(t1) > <i>"<span class="d">1e12</span>"</i><span class="s"> &amp;&amp; </span>(t1<span class="s"> = </span><span class="d">.5</span>);
+</code><code id="L1317"><span class="ln">1317</span>            abs(t2) > <i>"<span class="d">1e12</span>"</i><span class="s"> &amp;&amp; </span>(t2<span class="s"> = </span><span class="d">.5</span>);
+</code><code id="L1318"><span class="ln">1318</span>            <b>if</b> (t1 > <span class="d">0</span><span class="s"> &amp;&amp; </span>t1 &lt; <span class="d">1</span>) {
+</code><code id="L1319"><span class="ln">1319</span>                dot<span class="s"> = </span>findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t1);
+</code><code id="L1320"><span class="ln">1320</span>                x.push(dot.x);
+</code><code id="L1321"><span class="ln">1321</span>                y.push(dot.y);
+</code><code id="L1322"><span class="ln">1322</span>            }
+</code><code id="L1323"><span class="ln">1323</span>            <b>if</b> (t2 > <span class="d">0</span><span class="s"> &amp;&amp; </span>t2 &lt; <span class="d">1</span>) {
+</code><code id="L1324"><span class="ln">1324</span>                dot<span class="s"> = </span>findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t2);
+</code><code id="L1325"><span class="ln">1325</span>                x.push(dot.x);
+</code><code id="L1326"><span class="ln">1326</span>                y.push(dot.y);
+</code><code id="L1327"><span class="ln">1327</span>            }
+</code><code id="L1328"><span class="ln">1328</span>            <b>return</b> {
+</code><code id="L1329"><span class="ln">1329</span>                min: {x: mmin[apply](<span class="d">0</span>, x), y: mmin[apply](<span class="d">0</span>, y)},
+</code><code id="L1330"><span class="ln">1330</span>                max: {x: mmax[apply](<span class="d">0</span>, x), y: mmax[apply](<span class="d">0</span>, y)}
+</code><code id="L1331"><span class="ln">1331</span>            };
+</code><code id="L1332"><span class="ln">1332</span>        }),
+</code><code id="L1333"><span class="ln">1333</span>        path2curve<span class="s"> = </span>cacher(<b>function</b> (path, path2) {
+</code><code id="L1334"><span class="ln">1334</span>            <b>var</b> p<span class="s"> = </span>pathToAbsolute(path),
+</code><code id="L1335"><span class="ln">1335</span>                p2<span class="s"> = </span>path2<span class="s"> &amp;&amp; </span>pathToAbsolute(path2),
+</code><code id="L1336"><span class="ln">1336</span>                attrs<span class="s"> = </span>{x: <span class="d">0</span>, y: <span class="d">0</span>, bx: <span class="d">0</span>, by: <span class="d">0</span>, X: <span class="d">0</span>, Y: <span class="d">0</span>, qx: <b>null</b>, qy: <b>null</b>},
+</code><code id="L1337"><span class="ln">1337</span>                attrs2<span class="s"> = </span>{x: <span class="d">0</span>, y: <span class="d">0</span>, bx: <span class="d">0</span>, by: <span class="d">0</span>, X: <span class="d">0</span>, Y: <span class="d">0</span>, qx: <b>null</b>, qy: <b>null</b>},
+</code><code id="L1338"><span class="ln">1338</span>                processPath<span class="s"> = </span><b>function</b> (path, d) {
+</code><code id="L1339"><span class="ln">1339</span>                    <b>var</b> nx, ny;
+</code><code id="L1340"><span class="ln">1340</span>                    <b>if</b> (!path) {
+</code><code id="L1341"><span class="ln">1341</span>                        <b>return</b> [<i>"C"</i>, d.x, d.y, d.x, d.y, d.x, d.y];
+</code><code id="L1342"><span class="ln">1342</span>                    }
+</code><code id="L1343"><span class="ln">1343</span>                    !(path[<span class="d">0</span>] <b>in</b> {T:<span class="d">1</span>, Q:<span class="d">1</span>})<span class="s"> &amp;&amp; </span>(d.qx<span class="s"> = </span>d.qy<span class="s"> = </span><b>null</b>);
+</code><code id="L1344"><span class="ln">1344</span>                    <b>switch</b> (path[<span class="d">0</span>]) {
+</code><code id="L1345"><span class="ln">1345</span>                        <b>case</b> <i>"M"</i>:
+</code><code id="L1346"><span class="ln">1346</span>                            d.X<span class="s"> = </span>path[<span class="d">1</span>];
+</code><code id="L1347"><span class="ln">1347</span>                            d.Y<span class="s"> = </span>path[<span class="d">2</span>];
+</code><code id="L1348"><span class="ln">1348</span>                            <b>break</b>;
+</code><code id="L1349"><span class="ln">1349</span>                        <b>case</b> <i>"A"</i>:
+</code><code id="L1350"><span class="ln">1350</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](a2c[apply](<span class="d">0</span>, [d.x, d.y][concat](path.slice(<span class="d">1</span>))));
+</code><code id="L1351"><span class="ln">1351</span>                            <b>break</b>;
+</code><code id="L1352"><span class="ln">1352</span>                        <b>case</b> <i>"S"</i>:
+</code><code id="L1353"><span class="ln">1353</span>                            nx<span class="s"> = </span>d.x<span class="s"> + </span>(d.x<span class="s"> - </span>(d.bx<span class="s"> || </span>d.x));
+</code><code id="L1354"><span class="ln">1354</span>                            ny<span class="s"> = </span>d.y<span class="s"> + </span>(d.y<span class="s"> - </span>(d.by<span class="s"> || </span>d.y));
+</code><code id="L1355"><span class="ln">1355</span>                            path<span class="s"> = </span>[<i>"C"</i>, nx, ny][concat](path.slice(<span class="d">1</span>));
+</code><code id="L1356"><span class="ln">1356</span>                            <b>break</b>;
+</code><code id="L1357"><span class="ln">1357</span>                        <b>case</b> <i>"T"</i>:
+</code><code id="L1358"><span class="ln">1358</span>                            d.qx<span class="s"> = </span>d.x<span class="s"> + </span>(d.x<span class="s"> - </span>(d.qx<span class="s"> || </span>d.x));
+</code><code id="L1359"><span class="ln">1359</span>                            d.qy<span class="s"> = </span>d.y<span class="s"> + </span>(d.y<span class="s"> - </span>(d.qy<span class="s"> || </span>d.y));
+</code><code id="L1360"><span class="ln">1360</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](q2c(d.x, d.y, d.qx, d.qy, path[<span class="d">1</span>], path[<span class="d">2</span>]));
+</code><code id="L1361"><span class="ln">1361</span>                            <b>break</b>;
+</code><code id="L1362"><span class="ln">1362</span>                        <b>case</b> <i>"Q"</i>:
+</code><code id="L1363"><span class="ln">1363</span>                            d.qx<span class="s"> = </span>path[<span class="d">1</span>];
+</code><code id="L1364"><span class="ln">1364</span>                            d.qy<span class="s"> = </span>path[<span class="d">2</span>];
+</code><code id="L1365"><span class="ln">1365</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](q2c(d.x, d.y, path[<span class="d">1</span>], path[<span class="d">2</span>], path[<span class="d">3</span>], path[<span class="d">4</span>]));
+</code><code id="L1366"><span class="ln">1366</span>                            <b>break</b>;
+</code><code id="L1367"><span class="ln">1367</span>                        <b>case</b> <i>"L"</i>:
+</code><code id="L1368"><span class="ln">1368</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](l2c(d.x, d.y, path[<span class="d">1</span>], path[<span class="d">2</span>]));
+</code><code id="L1369"><span class="ln">1369</span>                            <b>break</b>;
+</code><code id="L1370"><span class="ln">1370</span>                        <b>case</b> <i>"H"</i>:
+</code><code id="L1371"><span class="ln">1371</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](l2c(d.x, d.y, path[<span class="d">1</span>], d.y));
+</code><code id="L1372"><span class="ln">1372</span>                            <b>break</b>;
+</code><code id="L1373"><span class="ln">1373</span>                        <b>case</b> <i>"V"</i>:
+</code><code id="L1374"><span class="ln">1374</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](l2c(d.x, d.y, d.x, path[<span class="d">1</span>]));
+</code><code id="L1375"><span class="ln">1375</span>                            <b>break</b>;
+</code><code id="L1376"><span class="ln">1376</span>                        <b>case</b> <i>"Z"</i>:
+</code><code id="L1377"><span class="ln">1377</span>                            path<span class="s"> = </span>[<i>"C"</i>][concat](l2c(d.x, d.y, d.X, d.Y));
+</code><code id="L1378"><span class="ln">1378</span>                            <b>break</b>;
+</code><code id="L1379"><span class="ln">1379</span>                    }
+</code><code id="L1380"><span class="ln">1380</span>                    <b>return</b> path;
+</code><code id="L1381"><span class="ln">1381</span>                },
+</code><code id="L1382"><span class="ln">1382</span>                fixArc<span class="s"> = </span><b>function</b> (pp, i) {
+</code><code id="L1383"><span class="ln">1383</span>                    <b>if</b> (pp[i].length > <span class="d">7</span>) {
+</code><code id="L1384"><span class="ln">1384</span>                        pp[i].shift();
+</code><code id="L1385"><span class="ln">1385</span>                        <b>var</b> pi<span class="s"> = </span>pp[i];
+</code><code id="L1386"><span class="ln">1386</span>                        <b>while</b> (pi.length) {
+</code><code id="L1387"><span class="ln">1387</span>                            pp.splice(i++, <span class="d">0</span>, [<i>"C"</i>][concat](pi.splice(<span class="d">0</span>, <span class="d">6</span>)));
+</code><code id="L1388"><span class="ln">1388</span>                        }
+</code><code id="L1389"><span class="ln">1389</span>                        pp.splice(i, <span class="d">1</span>);
+</code><code id="L1390"><span class="ln">1390</span>                        ii<span class="s"> = </span>mmax(p.length, p2<span class="s"> &amp;&amp; </span>p2.length<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L1391"><span class="ln">1391</span>                    }
+</code><code id="L1392"><span class="ln">1392</span>                },
+</code><code id="L1393"><span class="ln">1393</span>                fixM<span class="s"> = </span><b>function</b> (path1, path2, a1, a2, i) {
+</code><code id="L1394"><span class="ln">1394</span>                    <b>if</b> (path1<span class="s"> &amp;&amp; </span>path2<span class="s"> &amp;&amp; </span>path1[i][<span class="d">0</span>]<span class="s"> == </span><i>"M"</i><span class="s"> &amp;&amp; </span>path2[i][<span class="d">0</span>] != <i>"M"</i>) {
+</code><code id="L1395"><span class="ln">1395</span>                        path2.splice(i, <span class="d">0</span>, [<i>"M"</i>, a2.x, a2.y]);
+</code><code id="L1396"><span class="ln">1396</span>                        a1.bx<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L1397"><span class="ln">1397</span>                        a1.by<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L1398"><span class="ln">1398</span>                        a1.x<span class="s"> = </span>path1[i][<span class="d">1</span>];
+</code><code id="L1399"><span class="ln">1399</span>                        a1.y<span class="s"> = </span>path1[i][<span class="d">2</span>];
+</code><code id="L1400"><span class="ln">1400</span>                        ii<span class="s"> = </span>mmax(p.length, p2<span class="s"> &amp;&amp; </span>p2.length<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L1401"><span class="ln">1401</span>                    }
+</code><code id="L1402"><span class="ln">1402</span>                };
+</code><code id="L1403"><span class="ln">1403</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>mmax(p.length, p2<span class="s"> &amp;&amp; </span>p2.length<span class="s"> || </span><span class="d">0</span>); i &lt; ii; i++) {
+</code><code id="L1404"><span class="ln">1404</span>                p[i]<span class="s"> = </span>processPath(p[i], attrs);
+</code><code id="L1405"><span class="ln">1405</span>                fixArc(p, i);
+</code><code id="L1406"><span class="ln">1406</span>                p2<span class="s"> &amp;&amp; </span>(p2[i]<span class="s"> = </span>processPath(p2[i], attrs2));
+</code><code id="L1407"><span class="ln">1407</span>                p2<span class="s"> &amp;&amp; </span>fixArc(p2, i);
+</code><code id="L1408"><span class="ln">1408</span>                fixM(p, p2, attrs, attrs2, i);
+</code><code id="L1409"><span class="ln">1409</span>                fixM(p2, p, attrs2, attrs, i);
+</code><code id="L1410"><span class="ln">1410</span>                <b>var</b> seg<span class="s"> = </span>p[i],
+</code><code id="L1411"><span class="ln">1411</span>                    seg2<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>p2[i],
+</code><code id="L1412"><span class="ln">1412</span>                    seglen<span class="s"> = </span>seg.length,
+</code><code id="L1413"><span class="ln">1413</span>                    seg2len<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>seg2.length;
+</code><code id="L1414"><span class="ln">1414</span>                attrs.x<span class="s"> = </span>seg[seglen<span class="s"> - </span><span class="d">2</span>];
+</code><code id="L1415"><span class="ln">1415</span>                attrs.y<span class="s"> = </span>seg[seglen<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L1416"><span class="ln">1416</span>                attrs.bx<span class="s"> = </span>toFloat(seg[seglen<span class="s"> - </span><span class="d">4</span>])<span class="s"> || </span>attrs.x;
+</code><code id="L1417"><span class="ln">1417</span>                attrs.by<span class="s"> = </span>toFloat(seg[seglen<span class="s"> - </span><span class="d">3</span>])<span class="s"> || </span>attrs.y;
+</code><code id="L1418"><span class="ln">1418</span>                attrs2.bx<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>(toFloat(seg2[seg2len<span class="s"> - </span><span class="d">4</span>])<span class="s"> || </span>attrs2.x);
+</code><code id="L1419"><span class="ln">1419</span>                attrs2.by<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>(toFloat(seg2[seg2len<span class="s"> - </span><span class="d">3</span>])<span class="s"> || </span>attrs2.y);
+</code><code id="L1420"><span class="ln">1420</span>                attrs2.x<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>seg2[seg2len<span class="s"> - </span><span class="d">2</span>];
+</code><code id="L1421"><span class="ln">1421</span>                attrs2.y<span class="s"> = </span>p2<span class="s"> &amp;&amp; </span>seg2[seg2len<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L1422"><span class="ln">1422</span>            }
+</code><code id="L1423"><span class="ln">1423</span>            <b>return</b> p2 ? [p, p2] : p;
+</code><code id="L1424"><span class="ln">1424</span>        }, <b>null</b>, pathClone),
+</code><code id="L1425"><span class="ln">1425</span>        parseDots<span class="s"> = </span>cacher(<b>function</b> (gradient) {
+</code><code id="L1426"><span class="ln">1426</span>            <b>var</b> dots<span class="s"> = </span>[];
+</code><code id="L1427"><span class="ln">1427</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>gradient.length; i &lt; ii; i++) {
+</code><code id="L1428"><span class="ln">1428</span>                <b>var</b> dot<span class="s"> = </span>{},
+</code><code id="L1429"><span class="ln">1429</span>                    par<span class="s"> = </span>gradient[i].match(/^([^:]*):?([\d\.]*)/);
+</code><code id="L1430"><span class="ln">1430</span>                dot.color<span class="s"> = </span>R.getRGB(par[<span class="d">1</span>]);
+</code><code id="L1431"><span class="ln">1431</span>                <b>if</b> (dot.color.error) {
+</code><code id="L1432"><span class="ln">1432</span>                    <b>return</b> <b>null</b>;
+</code><code id="L1433"><span class="ln">1433</span>                }
+</code><code id="L1434"><span class="ln">1434</span>                dot.color<span class="s"> = </span>dot.color.hex;
+</code><code id="L1435"><span class="ln">1435</span>                par[<span class="d">2</span>]<span class="s"> &amp;&amp; </span>(dot.offset<span class="s"> = </span>par[<span class="d">2</span>]<span class="s"> + </span><i>"%"</i>);
+</code><code id="L1436"><span class="ln">1436</span>                dots.push(dot);
+</code><code id="L1437"><span class="ln">1437</span>            }
+</code><code id="L1438"><span class="ln">1438</span>            <b>for</b> (i<span class="s"> = </span><span class="d">1</span>, ii<span class="s"> = </span>dots.length<span class="s"> - </span><span class="d">1</span>; i &lt; ii; i++) {
+</code><code id="L1439"><span class="ln">1439</span>                <b>if</b> (!dots[i].offset) {
+</code><code id="L1440"><span class="ln">1440</span>                    <b>var</b> start<span class="s"> = </span>toFloat(dots[i<span class="s"> - </span><span class="d">1</span>].offset<span class="s"> || </span><span class="d">0</span>),
+</code><code id="L1441"><span class="ln">1441</span>                        end<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L1442"><span class="ln">1442</span>                    <b>for</b> (<b>var</b> j<span class="s"> = </span>i<span class="s"> + </span><span class="d">1</span>; j &lt; ii; j++) {
+</code><code id="L1443"><span class="ln">1443</span>                        <b>if</b> (dots[j].offset) {
+</code><code id="L1444"><span class="ln">1444</span>                            end<span class="s"> = </span>dots[j].offset;
+</code><code id="L1445"><span class="ln">1445</span>                            <b>break</b>;
+</code><code id="L1446"><span class="ln">1446</span>                        }
+</code><code id="L1447"><span class="ln">1447</span>                    }
+</code><code id="L1448"><span class="ln">1448</span>                    <b>if</b> (!end) {
+</code><code id="L1449"><span class="ln">1449</span>                        end<span class="s"> = </span><span class="d">100</span>;
+</code><code id="L1450"><span class="ln">1450</span>                        j<span class="s"> = </span>ii;
+</code><code id="L1451"><span class="ln">1451</span>                    }
+</code><code id="L1452"><span class="ln">1452</span>                    end<span class="s"> = </span>toFloat(end);
+</code><code id="L1453"><span class="ln">1453</span>                    <b>var</b> d<span class="s"> = </span>(end<span class="s"> - </span>start)<span class="s"> / </span>(j<span class="s"> - </span>i<span class="s"> + </span><span class="d">1</span>);
+</code><code id="L1454"><span class="ln">1454</span>                    <b>for</b> (; i &lt; j; i++) {
+</code><code id="L1455"><span class="ln">1455</span>                        start += d;
+</code><code id="L1456"><span class="ln">1456</span>                        dots[i].offset<span class="s"> = </span>start<span class="s"> + </span><i>"%"</i>;
+</code><code id="L1457"><span class="ln">1457</span>                    }
+</code><code id="L1458"><span class="ln">1458</span>                }
+</code><code id="L1459"><span class="ln">1459</span>            }
+</code><code id="L1460"><span class="ln">1460</span>            <b>return</b> dots;
+</code><code id="L1461"><span class="ln">1461</span>        }),
+</code><code id="L1462"><span class="ln">1462</span>        getContainer<span class="s"> = </span><b>function</b> (x, y, w, h) {
+</code><code id="L1463"><span class="ln">1463</span>            <b>var</b> container;
+</code><code id="L1464"><span class="ln">1464</span>            container<span class="s"> = </span>h<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>!R.is(x, <i>"object"</i>) ? g.doc.getElementById(x) : x;
+</code><code id="L1465"><span class="ln">1465</span>            <b>if</b> (container<span class="s"> == </span><b>null</b>) {
+</code><code id="L1466"><span class="ln">1466</span>                <b>return</b>;
+</code><code id="L1467"><span class="ln">1467</span>            }
+</code><code id="L1468"><span class="ln">1468</span>            <b>if</b> (container.tagName) {
+</code><code id="L1469"><span class="ln">1469</span>                <b>if</b> (y<span class="s"> == </span><b>null</b>) {
+</code><code id="L1470"><span class="ln">1470</span>                    <b>return</b> {
+</code><code id="L1471"><span class="ln">1471</span>                        container: container,
+</code><code id="L1472"><span class="ln">1472</span>                        width: container.style.pixelWidth<span class="s"> || </span>container.offsetWidth,
+</code><code id="L1473"><span class="ln">1473</span>                        height: container.style.pixelHeight<span class="s"> || </span>container.offsetHeight
+</code><code id="L1474"><span class="ln">1474</span>                    };
+</code><code id="L1475"><span class="ln">1475</span>                } <b>else</b> {
+</code><code id="L1476"><span class="ln">1476</span>                    <b>return</b> {container: container, width: y, height: w};
+</code><code id="L1477"><span class="ln">1477</span>                }
+</code><code id="L1478"><span class="ln">1478</span>            }
+</code><code id="L1479"><span class="ln">1479</span>            <b>return</b> {container: <span class="d">1</span>, x: x, y: y, width: w, height: h};
+</code><code id="L1480"><span class="ln">1480</span>        },
+</code><code id="L1481"><span class="ln">1481</span>        plugins<span class="s"> = </span><b>function</b> (con, add) {
+</code><code id="L1482"><span class="ln">1482</span>            <b>var</b> that<span class="s"> = </span><b>this</b>;
+</code><code id="L1483"><span class="ln">1483</span>            <b>for</b> (<b>var</b> prop <b>in</b> add) {
+</code><code id="L1484"><span class="ln">1484</span>                <b>if</b> (add[has](prop)<span class="s"> &amp;&amp; </span>!(prop <b>in</b> con)) {
+</code><code id="L1485"><span class="ln">1485</span>                    <b>switch</b> (<b>typeof</b> add[prop]) {
+</code><code id="L1486"><span class="ln">1486</span>                        <b>case</b> <i>"<b>function</b>"</i>:
+</code><code id="L1487"><span class="ln">1487</span>                            (<b>function</b> (f) {
+</code><code id="L1488"><span class="ln">1488</span>                                con[prop]<span class="s"> = </span>con<span class="s"> === </span>that ? f : <b>function</b> () { <b>return</b> f[apply](that, arguments); };
+</code><code id="L1489"><span class="ln">1489</span>                            })(add[prop]);
+</code><code id="L1490"><span class="ln">1490</span>                        <b>break</b>;
+</code><code id="L1491"><span class="ln">1491</span>                        <b>case</b> <i>"object"</i>:
+</code><code id="L1492"><span class="ln">1492</span>                            con[prop]<span class="s"> = </span>con[prop]<span class="s"> || </span>{};
+</code><code id="L1493"><span class="ln">1493</span>                            plugins.call(<b>this</b>, con[prop], add[prop]);
+</code><code id="L1494"><span class="ln">1494</span>                        <b>break</b>;
+</code><code id="L1495"><span class="ln">1495</span>                        <b>default</b>:
+</code><code id="L1496"><span class="ln">1496</span>                            con[prop]<span class="s"> = </span>add[prop];
+</code><code id="L1497"><span class="ln">1497</span>                        <b>break</b>;
+</code><code id="L1498"><span class="ln">1498</span>                    }
+</code><code id="L1499"><span class="ln">1499</span>                }
+</code><code id="L1500"><span class="ln">1500</span>            }
+</code><code id="L1501"><span class="ln">1501</span>        },
+</code><code id="L1502"><span class="ln">1502</span>        tear<span class="s"> = </span><b>function</b> (el, paper) {
+</code><code id="L1503"><span class="ln">1503</span>            el<span class="s"> == </span>paper.top<span class="s"> &amp;&amp; </span>(paper.top<span class="s"> = </span>el.prev);
+</code><code id="L1504"><span class="ln">1504</span>            el<span class="s"> == </span>paper.bottom<span class="s"> &amp;&amp; </span>(paper.bottom<span class="s"> = </span>el.next);
+</code><code id="L1505"><span class="ln">1505</span>            el.next<span class="s"> &amp;&amp; </span>(el.next.prev<span class="s"> = </span>el.prev);
+</code><code id="L1506"><span class="ln">1506</span>            el.prev<span class="s"> &amp;&amp; </span>(el.prev.next<span class="s"> = </span>el.next);
+</code><code id="L1507"><span class="ln">1507</span>        },
+</code><code id="L1508"><span class="ln">1508</span>        tofront<span class="s"> = </span><b>function</b> (el, paper) {
+</code><code id="L1509"><span class="ln">1509</span>            <b>if</b> (paper.top<span class="s"> === </span>el) {
+</code><code id="L1510"><span class="ln">1510</span>                <b>return</b>;
+</code><code id="L1511"><span class="ln">1511</span>            }
+</code><code id="L1512"><span class="ln">1512</span>            tear(el, paper);
+</code><code id="L1513"><span class="ln">1513</span>            el.next<span class="s"> = </span><b>null</b>;
+</code><code id="L1514"><span class="ln">1514</span>            el.prev<span class="s"> = </span>paper.top;
+</code><code id="L1515"><span class="ln">1515</span>            paper.top.next<span class="s"> = </span>el;
+</code><code id="L1516"><span class="ln">1516</span>            paper.top<span class="s"> = </span>el;
+</code><code id="L1517"><span class="ln">1517</span>        },
+</code><code id="L1518"><span class="ln">1518</span>        toback<span class="s"> = </span><b>function</b> (el, paper) {
+</code><code id="L1519"><span class="ln">1519</span>            <b>if</b> (paper.bottom<span class="s"> === </span>el) {
+</code><code id="L1520"><span class="ln">1520</span>                <b>return</b>;
+</code><code id="L1521"><span class="ln">1521</span>            }
+</code><code id="L1522"><span class="ln">1522</span>            tear(el, paper);
+</code><code id="L1523"><span class="ln">1523</span>            el.next<span class="s"> = </span>paper.bottom;
+</code><code id="L1524"><span class="ln">1524</span>            el.prev<span class="s"> = </span><b>null</b>;
+</code><code id="L1525"><span class="ln">1525</span>            paper.bottom.prev<span class="s"> = </span>el;
+</code><code id="L1526"><span class="ln">1526</span>            paper.bottom<span class="s"> = </span>el;
+</code><code id="L1527"><span class="ln">1527</span>        },
+</code><code id="L1528"><span class="ln">1528</span>        insertafter<span class="s"> = </span><b>function</b> (el, el2, paper) {
+</code><code id="L1529"><span class="ln">1529</span>            tear(el, paper);
+</code><code id="L1530"><span class="ln">1530</span>            el2<span class="s"> == </span>paper.top<span class="s"> &amp;&amp; </span>(paper.top<span class="s"> = </span>el);
+</code><code id="L1531"><span class="ln">1531</span>            el2.next<span class="s"> &amp;&amp; </span>(el2.next.prev<span class="s"> = </span>el);
+</code><code id="L1532"><span class="ln">1532</span>            el.next<span class="s"> = </span>el2.next;
+</code><code id="L1533"><span class="ln">1533</span>            el.prev<span class="s"> = </span>el2;
+</code><code id="L1534"><span class="ln">1534</span>            el2.next<span class="s"> = </span>el;
+</code><code id="L1535"><span class="ln">1535</span>        },
+</code><code id="L1536"><span class="ln">1536</span>        insertbefore<span class="s"> = </span><b>function</b> (el, el2, paper) {
+</code><code id="L1537"><span class="ln">1537</span>            tear(el, paper);
+</code><code id="L1538"><span class="ln">1538</span>            el2<span class="s"> == </span>paper.bottom<span class="s"> &amp;&amp; </span>(paper.bottom<span class="s"> = </span>el);
+</code><code id="L1539"><span class="ln">1539</span>            el2.prev<span class="s"> &amp;&amp; </span>(el2.prev.next<span class="s"> = </span>el);
+</code><code id="L1540"><span class="ln">1540</span>            el.prev<span class="s"> = </span>el2.prev;
+</code><code id="L1541"><span class="ln">1541</span>            el2.prev<span class="s"> = </span>el;
+</code><code id="L1542"><span class="ln">1542</span>            el.next<span class="s"> = </span>el2;
+</code><code id="L1543"><span class="ln">1543</span>        },
+</code><code id="L1544"><span class="ln">1544</span>        removed<span class="s"> = </span><b>function</b> (methodname) {
+</code><code id="L1545"><span class="ln">1545</span>            <b>return</b> <b>function</b> () {
+</code><code id="L1546"><span class="ln">1546</span>                <b>throw</b> <b>new</b> Error(<i>"Rapha\xebl: you are calling to method \u201c"</i><span class="s"> + </span>methodname<span class="s"> + </span><i>"\u201d of removed object"</i>);
+</code><code id="L1547"><span class="ln">1547</span>            };
+</code><code id="L1548"><span class="ln">1548</span>        },
+</code><code id="L1549"><span class="ln">1549</span>        extractTransform<span class="s"> = </span><b>function</b> (el, tstr) {
+</code><code id="L1550"><span class="ln">1550</span>            <b>if</b> (tstr<span class="s"> == </span><b>null</b>) {
+</code><code id="L1551"><span class="ln">1551</span>                <b>return</b> el._.transform;
+</code><code id="L1552"><span class="ln">1552</span>            }
+</code><code id="L1553"><span class="ln">1553</span>            tstr<span class="s"> = </span>Str(tstr).replace(/\.{<span class="d">3</span>}|\u2026/g, el._.transform<span class="s"> || </span>E);
+</code><code id="L1554"><span class="ln">1554</span>            <b>var</b> tdata<span class="s"> = </span>R.parseTransformString(tstr),
+</code><code id="L1555"><span class="ln">1555</span>                deg<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1556"><span class="ln">1556</span>                dx<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1557"><span class="ln">1557</span>                dy<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L1558"><span class="ln">1558</span>                sx<span class="s"> = </span><span class="d">1</span>,
+</code><code id="L1559"><span class="ln">1559</span>                sy<span class="s"> = </span><span class="d">1</span>,
+</code><code id="L1560"><span class="ln">1560</span>                _<span class="s"> = </span>el._,
+</code><code id="L1561"><span class="ln">1561</span>                m<span class="s"> = </span><b>new</b> Matrix;
+</code><code id="L1562"><span class="ln">1562</span>            _.transform<span class="s"> = </span>tdata<span class="s"> || </span>[];
+</code><code id="L1563"><span class="ln">1563</span>            <b>if</b> (tdata) {
+</code><code id="L1564"><span class="ln">1564</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>tdata.length; i &lt; ii; i++) {
+</code><code id="L1565"><span class="ln">1565</span>                    <b>var</b> t<span class="s"> = </span>tdata[i],
+</code><code id="L1566"><span class="ln">1566</span>                        tlen<span class="s"> = </span>t.length,
+</code><code id="L1567"><span class="ln">1567</span>                        bb;
+</code><code id="L1568"><span class="ln">1568</span>                    t[<span class="d">0</span>]<span class="s"> = </span>Str(t[<span class="d">0</span>]).toLowerCase();
+</code><code id="L1569"><span class="ln">1569</span>                    <b>if</b> (t[<span class="d">0</span>]<span class="s"> == </span><i>"t"</i><span class="s"> &amp;&amp; </span>tlen<span class="s"> == </span><span class="d">3</span>) {
+</code><code id="L1570"><span class="ln">1570</span>                        m.translate(t[<span class="d">1</span>], t[<span class="d">2</span>]);
+</code><code id="L1571"><span class="ln">1571</span>                    } <b>else</b> <b>if</b> (t[<span class="d">0</span>]<span class="s"> == </span><i>"r"</i>) {
+</code><code id="L1572"><span class="ln">1572</span>                        <b>if</b> (tlen<span class="s"> == </span><span class="d">2</span>) {
+</code><code id="L1573"><span class="ln">1573</span>                            bb<span class="s"> = </span>bb<span class="s"> || </span>el.getBBox(<span class="d">1</span>);
+</code><code id="L1574"><span class="ln">1574</span>                            m.rotate(t[<span class="d">1</span>], bb.x<span class="s"> + </span>bb.width<span class="s"> / </span><span class="d">2</span>, bb.y<span class="s"> + </span>bb.height<span class="s"> / </span><span class="d">2</span>);
+</code><code id="L1575"><span class="ln">1575</span>                            deg += t[<span class="d">1</span>];
+</code><code id="L1576"><span class="ln">1576</span>                        } <b>else</b> <b>if</b> (tlen<span class="s"> == </span><span class="d">4</span>) {
+</code><code id="L1577"><span class="ln">1577</span>                            m.rotate(t[<span class="d">1</span>], t[<span class="d">2</span>], t[<span class="d">3</span>]);
+</code><code id="L1578"><span class="ln">1578</span>                            deg += t[<span class="d">1</span>];
+</code><code id="L1579"><span class="ln">1579</span>                        }
+</code><code id="L1580"><span class="ln">1580</span>                    } <b>else</b> <b>if</b> (t[<span class="d">0</span>]<span class="s"> == </span><i>"s"</i>) {
+</code><code id="L1581"><span class="ln">1581</span>                        <b>if</b> (tlen<span class="s"> == </span><span class="d">2</span><span class="s"> || </span>tlen<span class="s"> == </span><span class="d">3</span>) {
+</code><code id="L1582"><span class="ln">1582</span>                            bb<span class="s"> = </span>bb<span class="s"> || </span>el.getBBox(<span class="d">1</span>);
+</code><code id="L1583"><span class="ln">1583</span>                            m.scale(t[<span class="d">1</span>], t[tlen<span class="s"> - </span><span class="d">1</span>], bb.x<span class="s"> + </span>bb.width<span class="s"> / </span><span class="d">2</span>, bb.y<span class="s"> + </span>bb.height<span class="s"> / </span><span class="d">2</span>);
+</code><code id="L1584"><span class="ln">1584</span>                            sx *= t[<span class="d">1</span>];
+</code><code id="L1585"><span class="ln">1585</span>                            sy *= t[tlen<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L1586"><span class="ln">1586</span>                        } <b>else</b> <b>if</b> (tlen<span class="s"> == </span><span class="d">5</span>) {
+</code><code id="L1587"><span class="ln">1587</span>                            m.scale(t[<span class="d">1</span>], t[<span class="d">2</span>], t[<span class="d">3</span>], t[<span class="d">4</span>]);
+</code><code id="L1588"><span class="ln">1588</span>                            sx *= t[<span class="d">1</span>];
+</code><code id="L1589"><span class="ln">1589</span>                            sy *= t[<span class="d">2</span>];
+</code><code id="L1590"><span class="ln">1590</span>                        }
+</code><code id="L1591"><span class="ln">1591</span>                    } <b>else</b> <b>if</b> (t[<span class="d">0</span>]<span class="s"> == </span><i>"m"</i><span class="s"> &amp;&amp; </span>tlen<span class="s"> == </span><span class="d">7</span>) {
+</code><code id="L1592"><span class="ln">1592</span>                        m.add(t[<span class="d">1</span>], t[<span class="d">2</span>], t[<span class="d">3</span>], t[<span class="d">4</span>], t[<span class="d">5</span>], t[<span class="d">6</span>]);
+</code><code id="L1593"><span class="ln">1593</span>                    }
+</code><code id="L1594"><span class="ln">1594</span>                    _.dirtyT<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L1595"><span class="ln">1595</span>                    el.matrix<span class="s"> = </span>m;
+</code><code id="L1596"><span class="ln">1596</span>                }
+</code><code id="L1597"><span class="ln">1597</span>            }
+</code><code id="L1598"><span class="ln">1598</span>
+</code><code id="L1599"><span class="ln">1599</span>            el.matrix<span class="s"> = </span>m;
+</code><code id="L1600"><span class="ln">1600</span>
+</code><code id="L1601"><span class="ln">1601</span>            _.sx<span class="s"> = </span>sx;
+</code><code id="L1602"><span class="ln">1602</span>            _.sy<span class="s"> = </span>sy;
+</code><code id="L1603"><span class="ln">1603</span>            _.deg<span class="s"> = </span>deg;
+</code><code id="L1604"><span class="ln">1604</span>            _.dx<span class="s"> = </span>dx<span class="s"> = </span>m.m[<span class="d">0</span>][<span class="d">2</span>];
+</code><code id="L1605"><span class="ln">1605</span>            _.dy<span class="s"> = </span>dy<span class="s"> = </span>m.m[<span class="d">1</span>][<span class="d">2</span>];
+</code><code id="L1606"><span class="ln">1606</span>
+</code><code id="L1607"><span class="ln">1607</span>            <b>if</b> (sx<span class="s"> == </span><span class="d">1</span><span class="s"> &amp;&amp; </span>sy<span class="s"> == </span><span class="d">1</span><span class="s"> &amp;&amp; </span>!deg<span class="s"> &amp;&amp; </span>_.bbox) {
+</code><code id="L1608"><span class="ln">1608</span>                _.bbox.x += +dx;
+</code><code id="L1609"><span class="ln">1609</span>                _.bbox.y += +dy;
+</code><code id="L1610"><span class="ln">1610</span>            } <b>else</b> {
+</code><code id="L1611"><span class="ln">1611</span>                _.dirtyT<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L1612"><span class="ln">1612</span>            }
+</code><code id="L1613"><span class="ln">1613</span>        },
+</code><code id="L1614"><span class="ln">1614</span>        getEmpty<span class="s"> = </span><b>function</b> (item) {
+</code><code id="L1615"><span class="ln">1615</span>            <b>switch</b> (item[<span class="d">0</span>]) {
+</code><code id="L1616"><span class="ln">1616</span>                <b>case</b> <i>"t"</i>: <b>return</b> [<i>"t"</i>, <span class="d">0</span>, <span class="d">0</span>];
+</code><code id="L1617"><span class="ln">1617</span>                <b>case</b> <i>"m"</i>: <b>return</b> [<i>"m"</i>, <span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>];
+</code><code id="L1618"><span class="ln">1618</span>                <b>case</b> <i>"r"</i>: <b>if</b> (item.length<span class="s"> == </span><span class="d">4</span>) {
+</code><code id="L1619"><span class="ln">1619</span>                    <b>return</b> [<i>"r"</i>, <span class="d">0</span>, item[<span class="d">2</span>], item[<span class="d">3</span>]];
+</code><code id="L1620"><span class="ln">1620</span>                } <b>else</b> {
+</code><code id="L1621"><span class="ln">1621</span>                    <b>return</b> [<i>"r"</i>, <span class="d">0</span>];
+</code><code id="L1622"><span class="ln">1622</span>                }
+</code><code id="L1623"><span class="ln">1623</span>                <b>case</b> <i>"s"</i>: <b>if</b> (item.length<span class="s"> == </span><span class="d">5</span>) {
+</code><code id="L1624"><span class="ln">1624</span>                    <b>return</b> [<i>"s"</i>, <span class="d">1</span>, <span class="d">1</span>, item[<span class="d">3</span>], item[<span class="d">4</span>]];
+</code><code id="L1625"><span class="ln">1625</span>                } <b>else</b> <b>if</b> (item.length<span class="s"> == </span><span class="d">3</span>) {
+</code><code id="L1626"><span class="ln">1626</span>                    <b>return</b> [<i>"s"</i>, <span class="d">1</span>, <span class="d">1</span>];
+</code><code id="L1627"><span class="ln">1627</span>                } <b>else</b> {
+</code><code id="L1628"><span class="ln">1628</span>                    <b>return</b> [<i>"s"</i>, <span class="d">1</span>];
+</code><code id="L1629"><span class="ln">1629</span>                }
+</code><code id="L1630"><span class="ln">1630</span>            }
+</code><code id="L1631"><span class="ln">1631</span>        },
+</code><code id="L1632"><span class="ln">1632</span>        equaliseTransform<span class="s"> = </span><b>function</b> (t1, t2) {
+</code><code id="L1633"><span class="ln">1633</span>            t1<span class="s"> = </span>R.parseTransformString(t1)<span class="s"> || </span>[];
+</code><code id="L1634"><span class="ln">1634</span>            t2<span class="s"> = </span>R.parseTransformString(t2)<span class="s"> || </span>[];
+</code><code id="L1635"><span class="ln">1635</span>            <b>var</b> maxlength<span class="s"> = </span>mmax(t1.length, t2.length),
+</code><code id="L1636"><span class="ln">1636</span>                from<span class="s"> = </span>[],
+</code><code id="L1637"><span class="ln">1637</span>                to<span class="s"> = </span>[],
+</code><code id="L1638"><span class="ln">1638</span>                i<span class="s"> = </span><span class="d">0</span>, j, jj,
+</code><code id="L1639"><span class="ln">1639</span>                tt1, tt2;
+</code><code id="L1640"><span class="ln">1640</span>            <b>for</b> (; i &lt; maxlength; i++) {
+</code><code id="L1641"><span class="ln">1641</span>                tt1<span class="s"> = </span>t1[i]<span class="s"> || </span>getEmpty(t2[i]);
+</code><code id="L1642"><span class="ln">1642</span>                tt2<span class="s"> = </span>t2[i]<span class="s"> || </span>getEmpty(tt1);
+</code><code id="L1643"><span class="ln">1643</span>                <b>if</b> (    (tt1[<span class="d">0</span>] != tt2[<span class="d">0</span>]) ||
+</code><code id="L1644"><span class="ln">1644</span>                        (tt1[<span class="d">0</span>]<span class="s"> == </span><i>"r"</i><span class="s"> &amp;&amp; </span>(tt1[<span class="d">2</span>] != tt2[<span class="d">2</span>]<span class="s"> || </span>tt1[<span class="d">3</span>] != tt2[<span class="d">3</span>])) ||
+</code><code id="L1645"><span class="ln">1645</span>                        (tt1[<span class="d">0</span>]<span class="s"> == </span><i>"s"</i><span class="s"> &amp;&amp; </span>(tt1[<span class="d">3</span>] != tt2[<span class="d">3</span>]<span class="s"> || </span>tt1[<span class="d">4</span>] != tt2[<span class="d">4</span>]))
+</code><code id="L1646"><span class="ln">1646</span>                    ) {
+</code><code id="L1647"><span class="ln">1647</span>                    <b>return</b>;
+</code><code id="L1648"><span class="ln">1648</span>                }
+</code><code id="L1649"><span class="ln">1649</span>                from[i]<span class="s"> = </span>[];
+</code><code id="L1650"><span class="ln">1650</span>                to[i]<span class="s"> = </span>[];
+</code><code id="L1651"><span class="ln">1651</span>                <b>for</b> (j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>mmax(tt1.length, tt2.length); j &lt; jj; j++) {
+</code><code id="L1652"><span class="ln">1652</span>                    j <b>in</b> tt1<span class="s"> &amp;&amp; </span>(from[i][j]<span class="s"> = </span>tt1[j]);
+</code><code id="L1653"><span class="ln">1653</span>                    j <b>in</b> tt2<span class="s"> &amp;&amp; </span>(to[i][j]<span class="s"> = </span>tt2[j]);
+</code><code id="L1654"><span class="ln">1654</span>                }
+</code><code id="L1655"><span class="ln">1655</span>            }
+</code><code id="L1656"><span class="ln">1656</span>            <b>return</b> {
+</code><code id="L1657"><span class="ln">1657</span>                from: from,
+</code><code id="L1658"><span class="ln">1658</span>                to: to
+</code><code id="L1659"><span class="ln">1659</span>            };
+</code><code id="L1660"><span class="ln">1660</span>        };
+</code><code id="L1661"><span class="ln">1661</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L1662"><span class="ln">1662</span><span class="c">    <span class="s"> * </span>Raphael.pathToRelative
+</span></code><code id="L1663"><span class="ln">1663</span><span class="c">     [ method ]
+</span></code><code id="L1664"><span class="ln">1664</span><span class="c">     **
+</span></code><code id="L1665"><span class="ln">1665</span><span class="c">    <span class="s"> * </span>Utility method
+</span></code><code id="L1666"><span class="ln">1666</span><span class="c">     **
+</span></code><code id="L1667"><span class="ln">1667</span><span class="c">    <span class="s"> * </span>Converts path to relative form
+</span></code><code id="L1668"><span class="ln">1668</span><span class="c">     > Parameters
+</span></code><code id="L1669"><span class="ln">1669</span><span class="c">    <span class="s"> - </span>pathString (string|array) path string or array of segments
+</span></code><code id="L1670"><span class="ln">1670</span><span class="c">    <span class="s"> = </span>(array) array of segments.
+</span></code><code id="L1671"><span class="ln">1671</span><span class="c">    \*/</span>
+</code><code id="L1672"><span class="ln">1672</span>    R.pathToRelative<span class="s"> = </span>pathToRelative;
+</code><code id="L1673"><span class="ln">1673</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L1674"><span class="ln">1674</span><span class="c">    <span class="s"> * </span>Raphael.path2curve
+</span></code><code id="L1675"><span class="ln">1675</span><span class="c">     [ method ]
+</span></code><code id="L1676"><span class="ln">1676</span><span class="c">     **
+</span></code><code id="L1677"><span class="ln">1677</span><span class="c">    <span class="s"> * </span>Utility method
+</span></code><code id="L1678"><span class="ln">1678</span><span class="c">     **
+</span></code><code id="L1679"><span class="ln">1679</span><span class="c">    <span class="s"> * </span>Converts path to a <b>new</b> path where all segments are cubic bezier curves.
+</span></code><code id="L1680"><span class="ln">1680</span><span class="c">     > Parameters
+</span></code><code id="L1681"><span class="ln">1681</span><span class="c">    <span class="s"> - </span>pathString (string|array) path string or array of segments
+</span></code><code id="L1682"><span class="ln">1682</span><span class="c">    <span class="s"> = </span>(array) array of segments.
+</span></code><code id="L1683"><span class="ln">1683</span><span class="c">    \*/</span>
+</code><code id="L1684"><span class="ln">1684</span>    R.path2curve<span class="s"> = </span>path2curve;
+</code><code id="L1685"><span class="ln">1685</span>    <span class="c">// Matrix</span>
+</code><code id="L1686"><span class="ln">1686</span>    <span class="c">// <b>var</b> m<span class="s"> = </span>document.createElementNS(<i>"http://www.w3.org/<span class="d">2000</span>/svg"</i>, <i>"svg"</i>).createSVGMatrix();</span>
+</code><code id="L1687"><span class="ln">1687</span>    <b>function</b> Matrix(a, b, c, d, e, f) {
+</code><code id="L1688"><span class="ln">1688</span>        <b>if</b> (a != <b>null</b>) {
+</code><code id="L1689"><span class="ln">1689</span>            <b>this</b>.m<span class="s"> = </span>[[a, c, e], [b, d, f], [<span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>]];
+</code><code id="L1690"><span class="ln">1690</span>        } <b>else</b> {
+</code><code id="L1691"><span class="ln">1691</span>            <b>this</b>.m<span class="s"> = </span>[[<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>], [<span class="d">0</span>, <span class="d">1</span>, <span class="d">0</span>], [<span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>]];
+</code><code id="L1692"><span class="ln">1692</span>        }
+</code><code id="L1693"><span class="ln">1693</span>    }
+</code><code id="L1694"><span class="ln">1694</span>    <b>var</b> matrixproto<span class="s"> = </span>Matrix.prototype;
+</code><code id="L1695"><span class="ln">1695</span>    matrixproto.add<span class="s"> = </span><b>function</b> (a, b, c, d, e, f) {
+</code><code id="L1696"><span class="ln">1696</span>        <b>var</b> out<span class="s"> = </span>[[], [], []],
+</code><code id="L1697"><span class="ln">1697</span>            matrix<span class="s"> = </span>[[a, c, e], [b, d, f], [<span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>]],
+</code><code id="L1698"><span class="ln">1698</span>            x, y, z, res;
+</code><code id="L1699"><span class="ln">1699</span>
+</code><code id="L1700"><span class="ln">1700</span>        <b>for</b> (x<span class="s"> = </span><span class="d">0</span>; x &lt; <span class="d">3</span>; x++) {
+</code><code id="L1701"><span class="ln">1701</span>            <b>for</b> (y<span class="s"> = </span><span class="d">0</span>; y &lt; <span class="d">3</span>; y++) {
+</code><code id="L1702"><span class="ln">1702</span>                res<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L1703"><span class="ln">1703</span>                <b>for</b> (z<span class="s"> = </span><span class="d">0</span>; z &lt; <span class="d">3</span>; z++) {
+</code><code id="L1704"><span class="ln">1704</span>                    res += <b>this</b>.m[x][z]<span class="s"> * </span>matrix[z][y];
+</code><code id="L1705"><span class="ln">1705</span>                }
+</code><code id="L1706"><span class="ln">1706</span>                out[x][y]<span class="s"> = </span>res;
+</code><code id="L1707"><span class="ln">1707</span>            }
+</code><code id="L1708"><span class="ln">1708</span>        }
+</code><code id="L1709"><span class="ln">1709</span>        <b>this</b>.m<span class="s"> = </span>out;
+</code><code id="L1710"><span class="ln">1710</span>    };
+</code><code id="L1711"><span class="ln">1711</span>    matrixproto.invert<span class="s"> = </span><b>function</b> () {
+</code><code id="L1712"><span class="ln">1712</span>        <b>var</b> a<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">0</span>],
+</code><code id="L1713"><span class="ln">1713</span>            b<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">0</span>],
+</code><code id="L1714"><span class="ln">1714</span>            c<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">1</span>],
+</code><code id="L1715"><span class="ln">1715</span>            d<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">1</span>],
+</code><code id="L1716"><span class="ln">1716</span>            e<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">2</span>],
+</code><code id="L1717"><span class="ln">1717</span>            f<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">2</span>],
+</code><code id="L1718"><span class="ln">1718</span>            x<span class="s"> = </span>a<span class="s"> * </span>d<span class="s"> - </span>b<span class="s"> * </span>c;
+</code><code id="L1719"><span class="ln">1719</span>        <b>return</b> <b>new</b> Matrix(d<span class="s"> / </span>x, -b<span class="s"> / </span>x, -c<span class="s"> / </span>x, a<span class="s"> / </span>x, (c<span class="s"> * </span>f<span class="s"> - </span>d<span class="s"> * </span>e)<span class="s"> / </span>x, (b<span class="s"> * </span>e<span class="s"> - </span>a<span class="s"> * </span>f)<span class="s"> / </span>x);
+</code><code id="L1720"><span class="ln">1720</span>    };
+</code><code id="L1721"><span class="ln">1721</span>    matrixproto.clone<span class="s"> = </span><b>function</b> () {
+</code><code id="L1722"><span class="ln">1722</span>        <b>var</b> a<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">0</span>],
+</code><code id="L1723"><span class="ln">1723</span>            b<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">0</span>],
+</code><code id="L1724"><span class="ln">1724</span>            c<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">1</span>],
+</code><code id="L1725"><span class="ln">1725</span>            d<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">1</span>],
+</code><code id="L1726"><span class="ln">1726</span>            e<span class="s"> = </span><b>this</b>.m[<span class="d">0</span>][<span class="d">2</span>],
+</code><code id="L1727"><span class="ln">1727</span>            f<span class="s"> = </span><b>this</b>.m[<span class="d">1</span>][<span class="d">2</span>];
+</code><code id="L1728"><span class="ln">1728</span>        <b>return</b> <b>new</b> Matrix(a, b, c, d, e, f);
+</code><code id="L1729"><span class="ln">1729</span>    };
+</code><code id="L1730"><span class="ln">1730</span>    matrixproto.translate<span class="s"> = </span><b>function</b> (x, y) {
+</code><code id="L1731"><span class="ln">1731</span>        <b>this</b>.add(<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, x, y);
+</code><code id="L1732"><span class="ln">1732</span>    };
+</code><code id="L1733"><span class="ln">1733</span>    matrixproto.scale<span class="s"> = </span><b>function</b> (x, y, cx, cy) {
+</code><code id="L1734"><span class="ln">1734</span>        y<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>(y<span class="s"> = </span>x);
+</code><code id="L1735"><span class="ln">1735</span>        <b>this</b>.add(<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, cx, cy);
+</code><code id="L1736"><span class="ln">1736</span>        <b>this</b>.add(x, <span class="d">0</span>, <span class="d">0</span>, y, <span class="d">0</span>, <span class="d">0</span>);
+</code><code id="L1737"><span class="ln">1737</span>        <b>this</b>.add(<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, -cx, -cy);
+</code><code id="L1738"><span class="ln">1738</span>    };
+</code><code id="L1739"><span class="ln">1739</span>    matrixproto.rotate<span class="s"> = </span><b>function</b> (a, x, y) {
+</code><code id="L1740"><span class="ln">1740</span>        a<span class="s"> = </span>R.rad(a);
+</code><code id="L1741"><span class="ln">1741</span>        <b>var</b> cos<span class="s"> = </span>+math.cos(a).toFixed(<span class="d">9</span>),
+</code><code id="L1742"><span class="ln">1742</span>            sin<span class="s"> = </span>+math.sin(a).toFixed(<span class="d">9</span>);
+</code><code id="L1743"><span class="ln">1743</span>        <b>this</b>.add(cos, sin, -sin, cos, x, y);
+</code><code id="L1744"><span class="ln">1744</span>        <b>this</b>.add(<span class="d">1</span>, <span class="d">0</span>, <span class="d">0</span>, <span class="d">1</span>, -x, -y);
+</code><code id="L1745"><span class="ln">1745</span>    };
+</code><code id="L1746"><span class="ln">1746</span>    matrixproto.x<span class="s"> = </span><b>function</b> (x, y) {
+</code><code id="L1747"><span class="ln">1747</span>        <b>return</b> x<span class="s"> * </span><b>this</b>.m[<span class="d">0</span>][<span class="d">0</span>]<span class="s"> + </span>y<span class="s"> * </span><b>this</b>.m[<span class="d">0</span>][<span class="d">1</span>]<span class="s"> + </span><b>this</b>.m[<span class="d">0</span>][<span class="d">2</span>];
+</code><code id="L1748"><span class="ln">1748</span>    };
+</code><code id="L1749"><span class="ln">1749</span>    matrixproto.y<span class="s"> = </span><b>function</b> (x, y) {
+</code><code id="L1750"><span class="ln">1750</span>        <b>return</b> x<span class="s"> * </span><b>this</b>.m[<span class="d">1</span>][<span class="d">0</span>]<span class="s"> + </span>y<span class="s"> * </span><b>this</b>.m[<span class="d">1</span>][<span class="d">1</span>]<span class="s"> + </span><b>this</b>.m[<span class="d">1</span>][<span class="d">2</span>];
+</code><code id="L1751"><span class="ln">1751</span>    };
+</code><code id="L1752"><span class="ln">1752</span>    matrixproto.get<span class="s"> = </span><b>function</b> (i, j) {
+</code><code id="L1753"><span class="ln">1753</span>        <b>return</b> +<b>this</b>.m[i][j].toFixed(<span class="d">4</span>);
+</code><code id="L1754"><span class="ln">1754</span>    };
+</code><code id="L1755"><span class="ln">1755</span>    matrixproto.toString<span class="s"> = </span><b>function</b> () {
+</code><code id="L1756"><span class="ln">1756</span>        <b>return</b> R.svg ?
+</code><code id="L1757"><span class="ln">1757</span>            <i>"matrix("</i><span class="s"> + </span>[<b>this</b>.get(<span class="d">0</span>, <span class="d">0</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">0</span>), <b>this</b>.get(<span class="d">0</span>, <span class="d">1</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">1</span>), <b>this</b>.get(<span class="d">0</span>, <span class="d">2</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">2</span>)].join()<span class="s"> + </span><i>")"</i> :
+</code><code id="L1758"><span class="ln">1758</span>            [<b>this</b>.get(<span class="d">0</span>, <span class="d">0</span>), <b>this</b>.get(<span class="d">0</span>, <span class="d">1</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">0</span>), <b>this</b>.get(<span class="d">1</span>, <span class="d">1</span>), <span class="d">0</span>, <span class="d">0</span>].join();
+</code><code id="L1759"><span class="ln">1759</span>    };
+</code><code id="L1760"><span class="ln">1760</span>    matrixproto.toFilter<span class="s"> = </span><b>function</b> () {
+</code><code id="L1761"><span class="ln">1761</span>        <b>return</b> <i>"progid:DXImageTransform.Microsoft.Matrix(M11="</i><span class="s"> + </span><b>this</b>.get(<span class="d">0</span>, <span class="d">0</span>) +
+</code><code id="L1762"><span class="ln">1762</span>            <i>", M12="</i><span class="s"> + </span><b>this</b>.get(<span class="d">0</span>, <span class="d">1</span>)<span class="s"> + </span><i>", M21="</i><span class="s"> + </span><b>this</b>.get(<span class="d">1</span>, <span class="d">0</span>)<span class="s"> + </span><i>", M22="</i><span class="s"> + </span><b>this</b>.get(<span class="d">1</span>, <span class="d">1</span>) +
+</code><code id="L1763"><span class="ln">1763</span>            <i>", Dx="</i><span class="s"> + </span><b>this</b>.get(<span class="d">0</span>, <span class="d">2</span>)<span class="s"> + </span><i>", Dy="</i><span class="s"> + </span><b>this</b>.get(<span class="d">1</span>, <span class="d">2</span>)<span class="s"> + </span><i>", sizingmedthod='auto expand')"</i>;
+</code><code id="L1764"><span class="ln">1764</span>    };
+</code><code id="L1765"><span class="ln">1765</span>    matrixproto.offset<span class="s"> = </span><b>function</b> () {
+</code><code id="L1766"><span class="ln">1766</span>        <b>return</b> [<b>this</b>.m[<span class="d">0</span>][<span class="d">2</span>].toFixed(<span class="d">4</span>), <b>this</b>.m[<span class="d">1</span>][<span class="d">2</span>].toFixed(<span class="d">4</span>)];
+</code><code id="L1767"><span class="ln">1767</span>    };
+</code><code id="L1768"><span class="ln">1768</span>
+</code><code id="L1769"><span class="ln">1769</span>    R.Matrix<span class="s"> = </span>Matrix;
+</code><code id="L1770"><span class="ln">1770</span>
+</code><code id="L1771"><span class="ln">1771</span>    <span class="c">// SVG</span>
+</code><code id="L1772"><span class="ln">1772</span>    <b>if</b> (R.svg) {
+</code><code id="L1773"><span class="ln">1773</span>        <b>var</b> xlink<span class="s"> = </span><i>"http:<span class="c">//www.w3.org/<span class="d">1999</span>/xlink"</i>,</span>
+</code><code id="L1774"><span class="ln">1774</span>            markers<span class="s"> = </span>{
+</code><code id="L1775"><span class="ln">1775</span>                block: <i>"M5,<span class="d">0</span> <span class="d">0</span>,<span class="d">2.5</span> <span class="d">5</span>,5z"</i>,
+</code><code id="L1776"><span class="ln">1776</span>                classic: <i>"M5,<span class="d">0</span> <span class="d">0</span>,<span class="d">2.5</span> <span class="d">5</span>,<span class="d">5</span> <span class="d">3.5</span>,<span class="d">3</span> <span class="d">3.5</span>,2z"</i>,
+</code><code id="L1777"><span class="ln">1777</span>                diamond: <i>"M2<span class="d">.5</span>,<span class="d">0</span> <span class="d">5</span>,<span class="d">2.5</span> <span class="d">2.5</span>,<span class="d">5</span> <span class="d">0</span>,<span class="d">2</span>.5z"</i>,
+</code><code id="L1778"><span class="ln">1778</span>                open: <i>"M6,<span class="d">1</span> <span class="d">1</span>,<span class="d">3.5</span> <span class="d">6</span>,<span class="d">6</span>"</i>,
+</code><code id="L1779"><span class="ln">1779</span>                oval: <i>"M2<span class="d">.5</span>,0A2<span class="d">.5</span>,<span class="d">2.5</span>,<span class="d">0</span>,<span class="d">0</span>,<span class="d">1</span>,<span class="d">2.5</span>,<span class="d">5</span> <span class="d">2.5</span>,<span class="d">2.5</span>,<span class="d">0</span>,<span class="d">0</span>,<span class="d">1</span>,<span class="d">2.5</span>,0z"</i>
+</code><code id="L1780"><span class="ln">1780</span>            },
+</code><code id="L1781"><span class="ln">1781</span>            markerCounter<span class="s"> = </span>{};
+</code><code id="L1782"><span class="ln">1782</span>        R.toString<span class="s"> = </span><b>function</b> () {
+</code><code id="L1783"><span class="ln">1783</span>            <b>return</b>  <i>"Your browser supports SVG.\nYou are running Rapha\xebl "</i><span class="s"> + </span><b>this</b>.version;
+</code><code id="L1784"><span class="ln">1784</span>        };
+</code><code id="L1785"><span class="ln">1785</span>        <b>var</b> $<span class="s"> = </span><b>function</b> (el, attr) {
+</code><code id="L1786"><span class="ln">1786</span>            <b>if</b> (attr) {
+</code><code id="L1787"><span class="ln">1787</span>                <b>if</b> (<b>typeof</b> el<span class="s"> == </span><i>"string"</i>) {
+</code><code id="L1788"><span class="ln">1788</span>                    el<span class="s"> = </span>$(el);
+</code><code id="L1789"><span class="ln">1789</span>                }
+</code><code id="L1790"><span class="ln">1790</span>                <b>for</b> (<b>var</b> key <b>in</b> attr) <b>if</b> (attr[has](key)) {
+</code><code id="L1791"><span class="ln">1791</span>                    <b>if</b> (key.substring(<span class="d">0</span>, <span class="d">6</span>)<span class="s"> == </span><i>"xlink:"</i>) {
+</code><code id="L1792"><span class="ln">1792</span>                        el.setAttributeNS(xlink, key.substring(<span class="d">6</span>), Str(attr[key]));
+</code><code id="L1793"><span class="ln">1793</span>                    } <b>else</b> {
+</code><code id="L1794"><span class="ln">1794</span>                        el[setAttribute](key, Str(attr[key]));
+</code><code id="L1795"><span class="ln">1795</span>                    }
+</code><code id="L1796"><span class="ln">1796</span>                }
+</code><code id="L1797"><span class="ln">1797</span>            } <b>else</b> {
+</code><code id="L1798"><span class="ln">1798</span>                el<span class="s"> = </span>g.doc.createElementNS(<i>"http:<span class="c">//www.w3.org/<span class="d">2000</span>/svg"</i>, el);</span>
+</code><code id="L1799"><span class="ln">1799</span>                el.style<span class="s"> &amp;&amp; </span>(el.style.webkitTapHighlightColor<span class="s"> = </span><i>"rgba(<span class="d">0</span>,<span class="d">0</span>,<span class="d">0</span>,<span class="d">0</span>)"</i>);
+</code><code id="L1800"><span class="ln">1800</span>            }
+</code><code id="L1801"><span class="ln">1801</span>            <b>return</b> el;
+</code><code id="L1802"><span class="ln">1802</span>        },
+</code><code id="L1803"><span class="ln">1803</span>        thePath<span class="s"> = </span><b>function</b> (pathString, SVG) {
+</code><code id="L1804"><span class="ln">1804</span>            <b>var</b> el<span class="s"> = </span>$(<i>"path"</i>);
+</code><code id="L1805"><span class="ln">1805</span>            SVG.canvas<span class="s"> &amp;&amp; </span>SVG.canvas.appendChild(el);
+</code><code id="L1806"><span class="ln">1806</span>            <b>var</b> p<span class="s"> = </span><b>new</b> Element(el, SVG);
+</code><code id="L1807"><span class="ln">1807</span>            p.type<span class="s"> = </span><i>"path"</i>;
+</code><code id="L1808"><span class="ln">1808</span>            setFillAndStroke(p, {fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>, path: pathString});
+</code><code id="L1809"><span class="ln">1809</span>            <b>return</b> p;
+</code><code id="L1810"><span class="ln">1810</span>        },
+</code><code id="L1811"><span class="ln">1811</span>        gradients<span class="s"> = </span>{},
+</code><code id="L1812"><span class="ln">1812</span>        rgGrad<span class="s"> = </span>/^url\(#(.*)\)$/,
+</code><code id="L1813"><span class="ln">1813</span>        removeGradientFill<span class="s"> = </span><b>function</b> (node, paper) {
+</code><code id="L1814"><span class="ln">1814</span>            <b>var</b> oid<span class="s"> = </span>node.getAttribute(fillString);
+</code><code id="L1815"><span class="ln">1815</span>            oid<span class="s"> = </span>oid<span class="s"> &amp;&amp; </span>oid.match(rgGrad);
+</code><code id="L1816"><span class="ln">1816</span>            <b>if</b> (oid<span class="s"> &amp;&amp; </span>!--gradients[oid[<span class="d">1</span>]]) {
+</code><code id="L1817"><span class="ln">1817</span>                <b>delete</b> gradients[oid[<span class="d">1</span>]];
+</code><code id="L1818"><span class="ln">1818</span>                paper.defs.removeChild(g.doc.getElementById(oid[<span class="d">1</span>]));
+</code><code id="L1819"><span class="ln">1819</span>            }
+</code><code id="L1820"><span class="ln">1820</span>        },
+</code><code id="L1821"><span class="ln">1821</span>        addGradientFill<span class="s"> = </span><b>function</b> (element, gradient) {
+</code><code id="L1822"><span class="ln">1822</span>            <b>var</b> type<span class="s"> = </span><i>"linear"</i>,
+</code><code id="L1823"><span class="ln">1823</span>                id<span class="s"> = </span>element.id<span class="s"> + </span>gradient,
+</code><code id="L1824"><span class="ln">1824</span>                fx<span class="s"> = </span><span class="d">.5</span>, fy<span class="s"> = </span><span class="d">.5</span>,
+</code><code id="L1825"><span class="ln">1825</span>                o<span class="s"> = </span>element.node,
+</code><code id="L1826"><span class="ln">1826</span>                SVG<span class="s"> = </span>element.paper,
+</code><code id="L1827"><span class="ln">1827</span>                s<span class="s"> = </span>o.style,
+</code><code id="L1828"><span class="ln">1828</span>                el<span class="s"> = </span>g.doc.getElementById(id);
+</code><code id="L1829"><span class="ln">1829</span>            <b>if</b> (!el) {
+</code><code id="L1830"><span class="ln">1830</span>                gradient<span class="s"> = </span>Str(gradient).replace(radial_gradient, <b>function</b> (all, _fx, _fy) {
+</code><code id="L1831"><span class="ln">1831</span>                    type<span class="s"> = </span><i>"radial"</i>;
+</code><code id="L1832"><span class="ln">1832</span>                    <b>if</b> (_fx<span class="s"> &amp;&amp; </span>_fy) {
+</code><code id="L1833"><span class="ln">1833</span>                        fx<span class="s"> = </span>toFloat(_fx);
+</code><code id="L1834"><span class="ln">1834</span>                        fy<span class="s"> = </span>toFloat(_fy);
+</code><code id="L1835"><span class="ln">1835</span>                        <b>var</b> dir<span class="s"> = </span>((fy > <span class="d">.5</span>)<span class="s"> * </span><span class="d">2</span><span class="s"> - </span><span class="d">1</span>);
+</code><code id="L1836"><span class="ln">1836</span>                        pow(fx<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>)<span class="s"> + </span>pow(fy<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>) > <span class="d">.25</span> &amp;&amp;
+</code><code id="L1837"><span class="ln">1837</span>                            (fy<span class="s"> = </span>math.sqrt(<span class="d">.25</span><span class="s"> - </span>pow(fx<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>))<span class="s"> * </span>dir<span class="s"> + </span><span class="d">.5</span>) &amp;&amp;
+</code><code id="L1838"><span class="ln">1838</span>                            fy != <span class="d">.5</span> &amp;&amp;
+</code><code id="L1839"><span class="ln">1839</span>                            (fy<span class="s"> = </span>fy.toFixed(<span class="d">5</span>)<span class="s"> - </span><span class="d">1e-5</span><span class="s"> * </span>dir);
+</code><code id="L1840"><span class="ln">1840</span>                    }
+</code><code id="L1841"><span class="ln">1841</span>                    <b>return</b> E;
+</code><code id="L1842"><span class="ln">1842</span>                });
+</code><code id="L1843"><span class="ln">1843</span>                gradient<span class="s"> = </span>gradient.split(/\s*\-\s*/);
+</code><code id="L1844"><span class="ln">1844</span>                <b>if</b> (type<span class="s"> == </span><i>"linear"</i>) {
+</code><code id="L1845"><span class="ln">1845</span>                    <b>var</b> angle<span class="s"> = </span>gradient.shift();
+</code><code id="L1846"><span class="ln">1846</span>                    angle<span class="s"> = </span>-toFloat(angle);
+</code><code id="L1847"><span class="ln">1847</span>                    <b>if</b> (isNaN(angle)) {
+</code><code id="L1848"><span class="ln">1848</span>                        <b>return</b> <b>null</b>;
+</code><code id="L1849"><span class="ln">1849</span>                    }
+</code><code id="L1850"><span class="ln">1850</span>                    <b>var</b> vector<span class="s"> = </span>[<span class="d">0</span>, <span class="d">0</span>, math.cos(R.rad(angle)), math.sin(R.rad(angle))],
+</code><code id="L1851"><span class="ln">1851</span>                        max<span class="s"> = </span><span class="d">1</span><span class="s"> / </span>(mmax(abs(vector[<span class="d">2</span>]), abs(vector[<span class="d">3</span>]))<span class="s"> || </span><span class="d">1</span>);
+</code><code id="L1852"><span class="ln">1852</span>                    vector[<span class="d">2</span>] *= max;
+</code><code id="L1853"><span class="ln">1853</span>                    vector[<span class="d">3</span>] *= max;
+</code><code id="L1854"><span class="ln">1854</span>                    <b>if</b> (vector[<span class="d">2</span>] &lt; <span class="d">0</span>) {
+</code><code id="L1855"><span class="ln">1855</span>                        vector[<span class="d">0</span>]<span class="s"> = </span>-vector[<span class="d">2</span>];
+</code><code id="L1856"><span class="ln">1856</span>                        vector[<span class="d">2</span>]<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L1857"><span class="ln">1857</span>                    }
+</code><code id="L1858"><span class="ln">1858</span>                    <b>if</b> (vector[<span class="d">3</span>] &lt; <span class="d">0</span>) {
+</code><code id="L1859"><span class="ln">1859</span>                        vector[<span class="d">1</span>]<span class="s"> = </span>-vector[<span class="d">3</span>];
+</code><code id="L1860"><span class="ln">1860</span>                        vector[<span class="d">3</span>]<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L1861"><span class="ln">1861</span>                    }
+</code><code id="L1862"><span class="ln">1862</span>                }
+</code><code id="L1863"><span class="ln">1863</span>                <b>var</b> dots<span class="s"> = </span>parseDots(gradient);
+</code><code id="L1864"><span class="ln">1864</span>                <b>if</b> (!dots) {
+</code><code id="L1865"><span class="ln">1865</span>                    <b>return</b> <b>null</b>;
+</code><code id="L1866"><span class="ln">1866</span>                }
+</code><code id="L1867"><span class="ln">1867</span>                <b>if</b> (element.gradient) {
+</code><code id="L1868"><span class="ln">1868</span>                    SVG.defs.removeChild(element.gradient);
+</code><code id="L1869"><span class="ln">1869</span>                    <b>delete</b> element.gradient;
+</code><code id="L1870"><span class="ln">1870</span>                }
+</code><code id="L1871"><span class="ln">1871</span>
+</code><code id="L1872"><span class="ln">1872</span>                el<span class="s"> = </span>$(type<span class="s"> + </span><i>"Gradient"</i>, {id: id});
+</code><code id="L1873"><span class="ln">1873</span>                element.gradient<span class="s"> = </span>el;
+</code><code id="L1874"><span class="ln">1874</span>                $(el, type<span class="s"> == </span><i>"radial"</i> ? {
+</code><code id="L1875"><span class="ln">1875</span>                    fx: fx,
+</code><code id="L1876"><span class="ln">1876</span>                    fy: fy
+</code><code id="L1877"><span class="ln">1877</span>                } : {
+</code><code id="L1878"><span class="ln">1878</span>                    x1: vector[<span class="d">0</span>],
+</code><code id="L1879"><span class="ln">1879</span>                    y1: vector[<span class="d">1</span>],
+</code><code id="L1880"><span class="ln">1880</span>                    x2: vector[<span class="d">2</span>],
+</code><code id="L1881"><span class="ln">1881</span>                    y2: vector[<span class="d">3</span>],
+</code><code id="L1882"><span class="ln">1882</span>                    gradientTransform: element.matrix.invert()
+</code><code id="L1883"><span class="ln">1883</span>                });
+</code><code id="L1884"><span class="ln">1884</span>                SVG.defs.appendChild(el);
+</code><code id="L1885"><span class="ln">1885</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>dots.length; i &lt; ii; i++) {
+</code><code id="L1886"><span class="ln">1886</span>                    el.appendChild($(<i>"stop"</i>, {
+</code><code id="L1887"><span class="ln">1887</span>                        offset: dots[i].offset ? dots[i].offset : i ? <i>"<span class="d">100</span>%"</i> : <i>"<span class="d">0</span>%"</i>,
+</code><code id="L1888"><span class="ln">1888</span>                        <i>"stop-color"</i>: dots[i].color<span class="s"> || </span><i>"#fff"</i>
+</code><code id="L1889"><span class="ln">1889</span>                    }));
+</code><code id="L1890"><span class="ln">1890</span>                }
+</code><code id="L1891"><span class="ln">1891</span>            }
+</code><code id="L1892"><span class="ln">1892</span>            $(o, {
+</code><code id="L1893"><span class="ln">1893</span>                fill: <i>"url(#"</i><span class="s"> + </span>id<span class="s"> + </span><i>")"</i>,
+</code><code id="L1894"><span class="ln">1894</span>                opacity: <span class="d">1</span>,
+</code><code id="L1895"><span class="ln">1895</span>                <i>"fill-opacity"</i>: <span class="d">1</span>
+</code><code id="L1896"><span class="ln">1896</span>            });
+</code><code id="L1897"><span class="ln">1897</span>            s.fill<span class="s"> = </span>E;
+</code><code id="L1898"><span class="ln">1898</span>            s.opacity<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L1899"><span class="ln">1899</span>            s.fillOpacity<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L1900"><span class="ln">1900</span>            <b>return</b> <span class="d">1</span>;
+</code><code id="L1901"><span class="ln">1901</span>        },
+</code><code id="L1902"><span class="ln">1902</span>        updatePosition<span class="s"> = </span><b>function</b> (o) {
+</code><code id="L1903"><span class="ln">1903</span>            <b>var</b> bbox<span class="s"> = </span>o.getBBox(<span class="d">1</span>);
+</code><code id="L1904"><span class="ln">1904</span>            $(o.pattern, {patternTransform: o.matrix.invert()<span class="s"> + </span><i>" translate("</i><span class="s"> + </span>bbox.x<span class="s"> + </span><i>","</i><span class="s"> + </span>bbox.y<span class="s"> + </span><i>")"</i>});
+</code><code id="L1905"><span class="ln">1905</span>        },
+</code><code id="L1906"><span class="ln">1906</span>        addArrow<span class="s"> = </span><b>function</b> (o, value, isEnd) {
+</code><code id="L1907"><span class="ln">1907</span>            <b>if</b> (o.type<span class="s"> == </span><i>"path"</i>) {
+</code><code id="L1908"><span class="ln">1908</span>                <b>var</b> values<span class="s"> = </span>Str(value).toLowerCase().split(<i>"-"</i>),
+</code><code id="L1909"><span class="ln">1909</span>                    p<span class="s"> = </span>o.paper,
+</code><code id="L1910"><span class="ln">1910</span>                    se<span class="s"> = </span>isEnd ? <i>"end"</i> : <i>"start"</i>,
+</code><code id="L1911"><span class="ln">1911</span>                    node<span class="s"> = </span>o.node,
+</code><code id="L1912"><span class="ln">1912</span>                    attrs<span class="s"> = </span>o.attrs,
+</code><code id="L1913"><span class="ln">1913</span>                    stroke<span class="s"> = </span>attrs[<i>"stroke-width"</i>],
+</code><code id="L1914"><span class="ln">1914</span>                    i<span class="s"> = </span>values.length,
+</code><code id="L1915"><span class="ln">1915</span>                    type<span class="s"> = </span><i>"classic"</i>,
+</code><code id="L1916"><span class="ln">1916</span>                    from,
+</code><code id="L1917"><span class="ln">1917</span>                    to,
+</code><code id="L1918"><span class="ln">1918</span>                    dx,
+</code><code id="L1919"><span class="ln">1919</span>                    refX,
+</code><code id="L1920"><span class="ln">1920</span>                    attr,
+</code><code id="L1921"><span class="ln">1921</span>                    w<span class="s"> = </span><span class="d">3</span>,
+</code><code id="L1922"><span class="ln">1922</span>                    h<span class="s"> = </span><span class="d">3</span>,
+</code><code id="L1923"><span class="ln">1923</span>                    t<span class="s"> = </span><span class="d">5</span>;
+</code><code id="L1924"><span class="ln">1924</span>                <b>while</b> (i--) {
+</code><code id="L1925"><span class="ln">1925</span>                    <b>switch</b> (values[i]) {
+</code><code id="L1926"><span class="ln">1926</span>                        <b>case</b> <i>"block"</i>:
+</code><code id="L1927"><span class="ln">1927</span>                        <b>case</b> <i>"classic"</i>:
+</code><code id="L1928"><span class="ln">1928</span>                        <b>case</b> <i>"oval"</i>:
+</code><code id="L1929"><span class="ln">1929</span>                        <b>case</b> <i>"diamond"</i>:
+</code><code id="L1930"><span class="ln">1930</span>                        <b>case</b> <i>"open"</i>:
+</code><code id="L1931"><span class="ln">1931</span>                        <b>case</b> <i>"none"</i>:
+</code><code id="L1932"><span class="ln">1932</span>                            type<span class="s"> = </span>values[i];
+</code><code id="L1933"><span class="ln">1933</span>                            <b>break</b>;
+</code><code id="L1934"><span class="ln">1934</span>                        <b>case</b> <i>"wide"</i>: h<span class="s"> = </span><span class="d">5</span>; <b>break</b>;
+</code><code id="L1935"><span class="ln">1935</span>                        <b>case</b> <i>"narrow"</i>: h<span class="s"> = </span><span class="d">2</span>; <b>break</b>;
+</code><code id="L1936"><span class="ln">1936</span>                        <b>case</b> <i>"<b>long</b>"</i>: w<span class="s"> = </span><span class="d">5</span>; <b>break</b>;
+</code><code id="L1937"><span class="ln">1937</span>                        <b>case</b> <i>"<b>short</b>"</i>: w<span class="s"> = </span><span class="d">2</span>; <b>break</b>;
+</code><code id="L1938"><span class="ln">1938</span>                    }
+</code><code id="L1939"><span class="ln">1939</span>                }
+</code><code id="L1940"><span class="ln">1940</span>                <b>if</b> (type<span class="s"> == </span><i>"open"</i>) {
+</code><code id="L1941"><span class="ln">1941</span>                    w += <span class="d">2</span>;
+</code><code id="L1942"><span class="ln">1942</span>                    h += <span class="d">2</span>;
+</code><code id="L1943"><span class="ln">1943</span>                    t += <span class="d">2</span>;
+</code><code id="L1944"><span class="ln">1944</span>                    dx<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L1945"><span class="ln">1945</span>                    refX<span class="s"> = </span>isEnd ? <span class="d">4</span> : <span class="d">1</span>;
+</code><code id="L1946"><span class="ln">1946</span>                    attr<span class="s"> = </span>{
+</code><code id="L1947"><span class="ln">1947</span>                        fill: <i>"none"</i>,
+</code><code id="L1948"><span class="ln">1948</span>                        stroke: attrs.stroke
+</code><code id="L1949"><span class="ln">1949</span>                    };
+</code><code id="L1950"><span class="ln">1950</span>                } <b>else</b> {
+</code><code id="L1951"><span class="ln">1951</span>                    refX<span class="s"> = </span>dx<span class="s"> = </span>w<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L1952"><span class="ln">1952</span>                    attr<span class="s"> = </span>{
+</code><code id="L1953"><span class="ln">1953</span>                        fill: attrs.stroke,
+</code><code id="L1954"><span class="ln">1954</span>                        stroke: <i>"none"</i>
+</code><code id="L1955"><span class="ln">1955</span>                    };
+</code><code id="L1956"><span class="ln">1956</span>                }
+</code><code id="L1957"><span class="ln">1957</span>                <b>if</b> (o._.arrows) {
+</code><code id="L1958"><span class="ln">1958</span>                    <b>if</b> (isEnd) {
+</code><code id="L1959"><span class="ln">1959</span>                        o._.arrows.endPath<span class="s"> &amp;&amp; </span>markerCounter[o._.arrows.endPath]--;
+</code><code id="L1960"><span class="ln">1960</span>                        o._.arrows.endMarker<span class="s"> &amp;&amp; </span>markerCounter[o._.arrows.endMarker]--;
+</code><code id="L1961"><span class="ln">1961</span>                    } <b>else</b> {
+</code><code id="L1962"><span class="ln">1962</span>                        o._.arrows.startPath<span class="s"> &amp;&amp; </span>markerCounter[o._.arrows.startPath]--;
+</code><code id="L1963"><span class="ln">1963</span>                        o._.arrows.startMarker<span class="s"> &amp;&amp; </span>markerCounter[o._.arrows.startMarker]--;
+</code><code id="L1964"><span class="ln">1964</span>                    }
+</code><code id="L1965"><span class="ln">1965</span>                } <b>else</b> {
+</code><code id="L1966"><span class="ln">1966</span>                    o._.arrows<span class="s"> = </span>{};
+</code><code id="L1967"><span class="ln">1967</span>                }
+</code><code id="L1968"><span class="ln">1968</span>                <b>if</b> (type != <i>"none"</i>) {
+</code><code id="L1969"><span class="ln">1969</span>                    <b>var</b> pathId<span class="s"> = </span><i>"raphael-marker-"</i><span class="s"> + </span>type,
+</code><code id="L1970"><span class="ln">1970</span>                        markerId<span class="s"> = </span><i>"raphael-marker-"</i><span class="s"> + </span>se<span class="s"> + </span>type<span class="s"> + </span>w<span class="s"> + </span>h;
+</code><code id="L1971"><span class="ln">1971</span>                    <b>if</b> (!g.doc.getElementById(pathId)) {
+</code><code id="L1972"><span class="ln">1972</span>                        p.defs.appendChild($($(<i>"path"</i>), {
+</code><code id="L1973"><span class="ln">1973</span>                            <i>"stroke-linecap"</i>: <i>"round"</i>,
+</code><code id="L1974"><span class="ln">1974</span>                            d: markers[type],
+</code><code id="L1975"><span class="ln">1975</span>                            id: pathId
+</code><code id="L1976"><span class="ln">1976</span>                        }));
+</code><code id="L1977"><span class="ln">1977</span>                        markerCounter[pathId]<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L1978"><span class="ln">1978</span>                    } <b>else</b> {
+</code><code id="L1979"><span class="ln">1979</span>                        markerCounter[pathId]++;
+</code><code id="L1980"><span class="ln">1980</span>                    }
+</code><code id="L1981"><span class="ln">1981</span>                    <b>var</b> marker<span class="s"> = </span>g.doc.getElementById(markerId),
+</code><code id="L1982"><span class="ln">1982</span>                        use;
+</code><code id="L1983"><span class="ln">1983</span>                    <b>if</b> (!marker) {
+</code><code id="L1984"><span class="ln">1984</span>                        marker<span class="s"> = </span>$($(<i>"marker"</i>), {
+</code><code id="L1985"><span class="ln">1985</span>                            id: markerId,
+</code><code id="L1986"><span class="ln">1986</span>                            markerHeight: h,
+</code><code id="L1987"><span class="ln">1987</span>                            markerWidth: w,
+</code><code id="L1988"><span class="ln">1988</span>                            orient: <i>"auto"</i>,
+</code><code id="L1989"><span class="ln">1989</span>                            refX: refX,
+</code><code id="L1990"><span class="ln">1990</span>                            refY: h<span class="s"> / </span><span class="d">2</span>
+</code><code id="L1991"><span class="ln">1991</span>                        });
+</code><code id="L1992"><span class="ln">1992</span>                        use<span class="s"> = </span>$($(<i>"use"</i>), {
+</code><code id="L1993"><span class="ln">1993</span>                            <i>"xlink:href"</i>: <i>"#"</i><span class="s"> + </span>pathId,
+</code><code id="L1994"><span class="ln">1994</span>                            transform: (isEnd ? <i>" rotate(<span class="d">180</span> "</i><span class="s"> + </span>w<span class="s"> / </span><span class="d">2</span><span class="s"> + </span><i>" "</i><span class="s"> + </span>h<span class="s"> / </span><span class="d">2</span><span class="s"> + </span><i>") "</i> : S)<span class="s"> + </span><i>"scale("</i><span class="s"> + </span>w<span class="s"> / </span>t<span class="s"> + </span><i>","</i><span class="s"> + </span>h<span class="s"> / </span>t<span class="s"> + </span><i>")"</i>,
+</code><code id="L1995"><span class="ln">1995</span>                            <i>"stroke-width"</i>: <span class="d">1</span><span class="s"> / </span>((w<span class="s"> / </span>t<span class="s"> + </span>h<span class="s"> / </span>t)<span class="s"> / </span><span class="d">2</span>)
+</code><code id="L1996"><span class="ln">1996</span>                        });
+</code><code id="L1997"><span class="ln">1997</span>                        marker.appendChild(use);
+</code><code id="L1998"><span class="ln">1998</span>                        p.defs.appendChild(marker);
+</code><code id="L1999"><span class="ln">1999</span>                        markerCounter[markerId]<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2000"><span class="ln">2000</span>                    } <b>else</b> {
+</code><code id="L2001"><span class="ln">2001</span>                        markerCounter[markerId]++;
+</code><code id="L2002"><span class="ln">2002</span>                        use<span class="s"> = </span>marker.getElementsByTagName(<i>"use"</i>)[<span class="d">0</span>];
+</code><code id="L2003"><span class="ln">2003</span>                    }
+</code><code id="L2004"><span class="ln">2004</span>                    $(use, attr);
+</code><code id="L2005"><span class="ln">2005</span>                    <b>var</b> delta<span class="s"> = </span>dx<span class="s"> * </span>(type != <i>"diamond"</i><span class="s"> &amp;&amp; </span>type != <i>"oval"</i>);
+</code><code id="L2006"><span class="ln">2006</span>                    <b>if</b> (isEnd) {
+</code><code id="L2007"><span class="ln">2007</span>                        from<span class="s"> = </span>o._.arrows.startdx<span class="s"> * </span>stroke<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L2008"><span class="ln">2008</span>                        to<span class="s"> = </span>R.getTotalLength(attrs.path)<span class="s"> - </span>delta<span class="s"> * </span>stroke;
+</code><code id="L2009"><span class="ln">2009</span>                    } <b>else</b> {
+</code><code id="L2010"><span class="ln">2010</span>                        from<span class="s"> = </span>delta<span class="s"> * </span>stroke;
+</code><code id="L2011"><span class="ln">2011</span>                        to<span class="s"> = </span>R.getTotalLength(attrs.path)<span class="s"> - </span>(o._.arrows.enddx<span class="s"> * </span>stroke<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L2012"><span class="ln">2012</span>                    }
+</code><code id="L2013"><span class="ln">2013</span>                    attr<span class="s"> = </span>{};
+</code><code id="L2014"><span class="ln">2014</span>                    attr[<i>"marker-"</i><span class="s"> + </span>se]<span class="s"> = </span><i>"url(#"</i><span class="s"> + </span>markerId<span class="s"> + </span><i>")"</i>;
+</code><code id="L2015"><span class="ln">2015</span>                    <b>if</b> (to<span class="s"> || </span>from) {
+</code><code id="L2016"><span class="ln">2016</span>                        attr.d<span class="s"> = </span>Raphael.getSubpath(attrs.path, from, to);
+</code><code id="L2017"><span class="ln">2017</span>                    }
+</code><code id="L2018"><span class="ln">2018</span>                    $(node, attr);
+</code><code id="L2019"><span class="ln">2019</span>                    o._.arrows[se<span class="s"> + </span><i>"Path"</i>]<span class="s"> = </span>pathId;
+</code><code id="L2020"><span class="ln">2020</span>                    o._.arrows[se<span class="s"> + </span><i>"Marker"</i>]<span class="s"> = </span>markerId;
+</code><code id="L2021"><span class="ln">2021</span>                    o._.arrows[se<span class="s"> + </span><i>"dx"</i>]<span class="s"> = </span>delta;
+</code><code id="L2022"><span class="ln">2022</span>                    o._.arrows[se<span class="s"> + </span><i>"Type"</i>]<span class="s"> = </span>type;
+</code><code id="L2023"><span class="ln">2023</span>                    o._.arrows[se<span class="s"> + </span><i>"String"</i>]<span class="s"> = </span>value;
+</code><code id="L2024"><span class="ln">2024</span>                } <b>else</b> {
+</code><code id="L2025"><span class="ln">2025</span>                    <b>if</b> (isEnd) {
+</code><code id="L2026"><span class="ln">2026</span>                        from<span class="s"> = </span>o._.arrows.startdx<span class="s"> * </span>stroke<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L2027"><span class="ln">2027</span>                        to<span class="s"> = </span>R.getTotalLength(attrs.path)<span class="s"> - </span>from;
+</code><code id="L2028"><span class="ln">2028</span>                    } <b>else</b> {
+</code><code id="L2029"><span class="ln">2029</span>                        from<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L2030"><span class="ln">2030</span>                        to<span class="s"> = </span>R.getTotalLength(attrs.path)<span class="s"> - </span>(o._.arrows.enddx<span class="s"> * </span>stroke<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L2031"><span class="ln">2031</span>                    }
+</code><code id="L2032"><span class="ln">2032</span>                    o._.arrows[se<span class="s"> + </span><i>"Path"</i>]<span class="s"> &amp;&amp; </span>$(node, {d: Raphael.getSubpath(attrs.path, from, to)});
+</code><code id="L2033"><span class="ln">2033</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"Path"</i>];
+</code><code id="L2034"><span class="ln">2034</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"Marker"</i>];
+</code><code id="L2035"><span class="ln">2035</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"dx"</i>];
+</code><code id="L2036"><span class="ln">2036</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"Type"</i>];
+</code><code id="L2037"><span class="ln">2037</span>                    <b>delete</b> o._.arrows[se<span class="s"> + </span><i>"String"</i>];
+</code><code id="L2038"><span class="ln">2038</span>                }
+</code><code id="L2039"><span class="ln">2039</span>                <b>for</b> (attr <b>in</b> markerCounter) <b>if</b> (markerCounter[has](attr)<span class="s"> &amp;&amp; </span>!markerCounter[attr]) {
+</code><code id="L2040"><span class="ln">2040</span>                    <b>var</b> item<span class="s"> = </span>g.doc.getElementById(attr);
+</code><code id="L2041"><span class="ln">2041</span>                    item<span class="s"> &amp;&amp; </span>item.parentNode.removeChild(item);
+</code><code id="L2042"><span class="ln">2042</span>                }
+</code><code id="L2043"><span class="ln">2043</span>            }
+</code><code id="L2044"><span class="ln">2044</span>        },
+</code><code id="L2045"><span class="ln">2045</span>        setFillAndStroke<span class="s"> = </span><b>function</b> (o, params) {
+</code><code id="L2046"><span class="ln">2046</span>            <b>var</b> dasharray<span class="s"> = </span>{
+</code><code id="L2047"><span class="ln">2047</span>                    <i>""</i>: [<span class="d">0</span>],
+</code><code id="L2048"><span class="ln">2048</span>                    <i>"none"</i>: [<span class="d">0</span>],
+</code><code id="L2049"><span class="ln">2049</span>                    <i>"-"</i>: [<span class="d">3</span>, <span class="d">1</span>],
+</code><code id="L2050"><span class="ln">2050</span>                    <i>"."</i>: [<span class="d">1</span>, <span class="d">1</span>],
+</code><code id="L2051"><span class="ln">2051</span>                    <i>"-."</i>: [<span class="d">3</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">1</span>],
+</code><code id="L2052"><span class="ln">2052</span>                    <i>"-.."</i>: [<span class="d">3</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">1</span>, <span class="d">1</span>],
+</code><code id="L2053"><span class="ln">2053</span>                    <i>". "</i>: [<span class="d">1</span>, <span class="d">3</span>],
+</code><code id="L2054"><span class="ln">2054</span>                    <i>"- "</i>: [<span class="d">4</span>, <span class="d">3</span>],
+</code><code id="L2055"><span class="ln">2055</span>                    <i>"--"</i>: [<span class="d">8</span>, <span class="d">3</span>],
+</code><code id="L2056"><span class="ln">2056</span>                    <i>"- ."</i>: [<span class="d">4</span>, <span class="d">3</span>, <span class="d">1</span>, <span class="d">3</span>],
+</code><code id="L2057"><span class="ln">2057</span>                    <i>"--."</i>: [<span class="d">8</span>, <span class="d">3</span>, <span class="d">1</span>, <span class="d">3</span>],
+</code><code id="L2058"><span class="ln">2058</span>                    <i>"--.."</i>: [<span class="d">8</span>, <span class="d">3</span>, <span class="d">1</span>, <span class="d">3</span>, <span class="d">1</span>, <span class="d">3</span>]
+</code><code id="L2059"><span class="ln">2059</span>                },
+</code><code id="L2060"><span class="ln">2060</span>                node<span class="s"> = </span>o.node,
+</code><code id="L2061"><span class="ln">2061</span>                attrs<span class="s"> = </span>o.attrs,
+</code><code id="L2062"><span class="ln">2062</span>                addDashes<span class="s"> = </span><b>function</b> (o, value) {
+</code><code id="L2063"><span class="ln">2063</span>                    value<span class="s"> = </span>dasharray[lowerCase.call(value)];
+</code><code id="L2064"><span class="ln">2064</span>                    <b>if</b> (value) {
+</code><code id="L2065"><span class="ln">2065</span>                        <b>var</b> width<span class="s"> = </span>o.attrs[<i>"stroke-width"</i>]<span class="s"> || </span><i>"<span class="d">1</span>"</i>,
+</code><code id="L2066"><span class="ln">2066</span>                            butt<span class="s"> = </span>{round: width, square: width, butt: <span class="d">0</span>}[o.attrs[<i>"stroke-linecap"</i>]<span class="s"> || </span>params[<i>"stroke-linecap"</i>]]<span class="s"> || </span><span class="d">0</span>,
+</code><code id="L2067"><span class="ln">2067</span>                            dashes<span class="s"> = </span>[],
+</code><code id="L2068"><span class="ln">2068</span>                            i<span class="s"> = </span>value.length;
+</code><code id="L2069"><span class="ln">2069</span>                        <b>while</b> (i--) {
+</code><code id="L2070"><span class="ln">2070</span>                            dashes[i]<span class="s"> = </span>value[i]<span class="s"> * </span>width<span class="s"> + </span>((i<span class="s"> % </span><span class="d">2</span>) ? <span class="d">1</span> : -<span class="d">1</span>)<span class="s"> * </span>butt;
+</code><code id="L2071"><span class="ln">2071</span>                        }
+</code><code id="L2072"><span class="ln">2072</span>                        $(node, {<i>"stroke-dasharray"</i>: dashes.join(<i>","</i>)});
+</code><code id="L2073"><span class="ln">2073</span>                    }
+</code><code id="L2074"><span class="ln">2074</span>                };
+</code><code id="L2075"><span class="ln">2075</span>            <b>for</b> (<b>var</b> att <b>in</b> params) {
+</code><code id="L2076"><span class="ln">2076</span>                <b>if</b> (params[has](att)) {
+</code><code id="L2077"><span class="ln">2077</span>                    <b>if</b> (!availableAttrs[has](att)) {
+</code><code id="L2078"><span class="ln">2078</span>                        <b>continue</b>;
+</code><code id="L2079"><span class="ln">2079</span>                    }
+</code><code id="L2080"><span class="ln">2080</span>                    <b>var</b> value<span class="s"> = </span>params[att];
+</code><code id="L2081"><span class="ln">2081</span>                    attrs[att]<span class="s"> = </span>value;
+</code><code id="L2082"><span class="ln">2082</span>                    <b>switch</b> (att) {
+</code><code id="L2083"><span class="ln">2083</span>                        <b>case</b> <i>"blur"</i>:
+</code><code id="L2084"><span class="ln">2084</span>                            o.blur(value);
+</code><code id="L2085"><span class="ln">2085</span>                            <b>break</b>;
+</code><code id="L2086"><span class="ln">2086</span>                        <b>case</b> <i>"href"</i>:
+</code><code id="L2087"><span class="ln">2087</span>                        <b>case</b> <i>"title"</i>:
+</code><code id="L2088"><span class="ln">2088</span>                        <b>case</b> <i>"target"</i>:
+</code><code id="L2089"><span class="ln">2089</span>                            <b>var</b> pn<span class="s"> = </span>node.parentNode;
+</code><code id="L2090"><span class="ln">2090</span>                            <b>if</b> (lowerCase.call(pn.tagName) != <i>"a"</i>) {
+</code><code id="L2091"><span class="ln">2091</span>                                <b>var</b> hl<span class="s"> = </span>$(<i>"a"</i>);
+</code><code id="L2092"><span class="ln">2092</span>                                pn.insertBefore(hl, node);
+</code><code id="L2093"><span class="ln">2093</span>                                hl.appendChild(node);
+</code><code id="L2094"><span class="ln">2094</span>                                pn<span class="s"> = </span>hl;
+</code><code id="L2095"><span class="ln">2095</span>                            }
+</code><code id="L2096"><span class="ln">2096</span>                            <b>if</b> (att<span class="s"> == </span><i>"target"</i><span class="s"> &amp;&amp; </span>value<span class="s"> == </span><i>"blank"</i>) {
+</code><code id="L2097"><span class="ln">2097</span>                                pn.setAttributeNS(xlink, <i>"show"</i>, <i>"<b>new</b>"</i>);
+</code><code id="L2098"><span class="ln">2098</span>                            } <b>else</b> {
+</code><code id="L2099"><span class="ln">2099</span>                                pn.setAttributeNS(xlink, att, value);
+</code><code id="L2100"><span class="ln">2100</span>                            }
+</code><code id="L2101"><span class="ln">2101</span>                            <b>break</b>;
+</code><code id="L2102"><span class="ln">2102</span>                        <b>case</b> <i>"cursor"</i>:
+</code><code id="L2103"><span class="ln">2103</span>                            node.style.cursor<span class="s"> = </span>value;
+</code><code id="L2104"><span class="ln">2104</span>                            <b>break</b>;
+</code><code id="L2105"><span class="ln">2105</span>                        <b>case</b> <i>"transform"</i>:
+</code><code id="L2106"><span class="ln">2106</span>                            o.transform(value);
+</code><code id="L2107"><span class="ln">2107</span>                            <b>break</b>;
+</code><code id="L2108"><span class="ln">2108</span>                        <b>case</b> <i>"arrow-start"</i>:
+</code><code id="L2109"><span class="ln">2109</span>                            addArrow(o, value);
+</code><code id="L2110"><span class="ln">2110</span>                            <b>break</b>;
+</code><code id="L2111"><span class="ln">2111</span>                        <b>case</b> <i>"arrow-end"</i>:
+</code><code id="L2112"><span class="ln">2112</span>                            addArrow(o, value, <span class="d">1</span>);
+</code><code id="L2113"><span class="ln">2113</span>                            <b>break</b>;
+</code><code id="L2114"><span class="ln">2114</span>                        <b>case</b> <i>"clip-rect"</i>:
+</code><code id="L2115"><span class="ln">2115</span>                            <b>var</b> rect<span class="s"> = </span>Str(value).split(separator);
+</code><code id="L2116"><span class="ln">2116</span>                            <b>if</b> (rect.length<span class="s"> == </span><span class="d">4</span>) {
+</code><code id="L2117"><span class="ln">2117</span>                                o.clip<span class="s"> &amp;&amp; </span>o.clip.parentNode.parentNode.removeChild(o.clip.parentNode);
+</code><code id="L2118"><span class="ln">2118</span>                                <b>var</b> el<span class="s"> = </span>$(<i>"clipPath"</i>),
+</code><code id="L2119"><span class="ln">2119</span>                                    rc<span class="s"> = </span>$(<i>"rect"</i>);
+</code><code id="L2120"><span class="ln">2120</span>                                el.id<span class="s"> = </span>createUUID();
+</code><code id="L2121"><span class="ln">2121</span>                                $(rc, {
+</code><code id="L2122"><span class="ln">2122</span>                                    x: rect[<span class="d">0</span>],
+</code><code id="L2123"><span class="ln">2123</span>                                    y: rect[<span class="d">1</span>],
+</code><code id="L2124"><span class="ln">2124</span>                                    width: rect[<span class="d">2</span>],
+</code><code id="L2125"><span class="ln">2125</span>                                    height: rect[<span class="d">3</span>]
+</code><code id="L2126"><span class="ln">2126</span>                                });
+</code><code id="L2127"><span class="ln">2127</span>                                el.appendChild(rc);
+</code><code id="L2128"><span class="ln">2128</span>                                o.paper.defs.appendChild(el);
+</code><code id="L2129"><span class="ln">2129</span>                                $(node, {<i>"clip-path"</i>: <i>"url(#"</i><span class="s"> + </span>el.id<span class="s"> + </span><i>")"</i>});
+</code><code id="L2130"><span class="ln">2130</span>                                o.clip<span class="s"> = </span>rc;
+</code><code id="L2131"><span class="ln">2131</span>                            }
+</code><code id="L2132"><span class="ln">2132</span>                            <b>if</b> (!value) {
+</code><code id="L2133"><span class="ln">2133</span>                                <b>var</b> clip<span class="s"> = </span>g.doc.getElementById(node.getAttribute(<i>"clip-path"</i>).replace(/(^url\(#|\)$)/g, E));
+</code><code id="L2134"><span class="ln">2134</span>                                clip<span class="s"> &amp;&amp; </span>clip.parentNode.removeChild(clip);
+</code><code id="L2135"><span class="ln">2135</span>                                $(node, {<i>"clip-path"</i>: E});
+</code><code id="L2136"><span class="ln">2136</span>                                <b>delete</b> o.clip;
+</code><code id="L2137"><span class="ln">2137</span>                            }
+</code><code id="L2138"><span class="ln">2138</span>                        <b>break</b>;
+</code><code id="L2139"><span class="ln">2139</span>                        <b>case</b> <i>"path"</i>:
+</code><code id="L2140"><span class="ln">2140</span>                            <b>if</b> (o.type<span class="s"> == </span><i>"path"</i>) {
+</code><code id="L2141"><span class="ln">2141</span>                                $(node, {d: value ? attrs.path<span class="s"> = </span>pathToAbsolute(value) : <i>"M0,<span class="d">0</span>"</i>});
+</code><code id="L2142"><span class="ln">2142</span>                                o._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2143"><span class="ln">2143</span>                                <b>if</b> (o._.arrows) {
+</code><code id="L2144"><span class="ln">2144</span>                                    <i>"startString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.startString);
+</code><code id="L2145"><span class="ln">2145</span>                                    <i>"endString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.endString, <span class="d">1</span>);
+</code><code id="L2146"><span class="ln">2146</span>                                }
+</code><code id="L2147"><span class="ln">2147</span>                            }
+</code><code id="L2148"><span class="ln">2148</span>                            <b>break</b>;
+</code><code id="L2149"><span class="ln">2149</span>                        <b>case</b> <i>"width"</i>:
+</code><code id="L2150"><span class="ln">2150</span>                            node[setAttribute](att, value);
+</code><code id="L2151"><span class="ln">2151</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2152"><span class="ln">2152</span>                            <b>if</b> (attrs.fx) {
+</code><code id="L2153"><span class="ln">2153</span>                                att<span class="s"> = </span><i>"x"</i>;
+</code><code id="L2154"><span class="ln">2154</span>                                value<span class="s"> = </span>attrs.x;
+</code><code id="L2155"><span class="ln">2155</span>                            } <b>else</b> {
+</code><code id="L2156"><span class="ln">2156</span>                                <b>break</b>;
+</code><code id="L2157"><span class="ln">2157</span>                            }
+</code><code id="L2158"><span class="ln">2158</span>                        <b>case</b> <i>"x"</i>:
+</code><code id="L2159"><span class="ln">2159</span>                            <b>if</b> (attrs.fx) {
+</code><code id="L2160"><span class="ln">2160</span>                                value<span class="s"> = </span>-attrs.x<span class="s"> - </span>(attrs.width<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L2161"><span class="ln">2161</span>                            }
+</code><code id="L2162"><span class="ln">2162</span>                        <b>case</b> <i>"rx"</i>:
+</code><code id="L2163"><span class="ln">2163</span>                            <b>if</b> (att<span class="s"> == </span><i>"rx"</i><span class="s"> &amp;&amp; </span>o.type<span class="s"> == </span><i>"rect"</i>) {
+</code><code id="L2164"><span class="ln">2164</span>                                <b>break</b>;
+</code><code id="L2165"><span class="ln">2165</span>                            }
+</code><code id="L2166"><span class="ln">2166</span>                        <b>case</b> <i>"cx"</i>:
+</code><code id="L2167"><span class="ln">2167</span>                            node[setAttribute](att, value);
+</code><code id="L2168"><span class="ln">2168</span>                            o.pattern<span class="s"> &amp;&amp; </span>updatePosition(o);
+</code><code id="L2169"><span class="ln">2169</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2170"><span class="ln">2170</span>                            <b>break</b>;
+</code><code id="L2171"><span class="ln">2171</span>                        <b>case</b> <i>"height"</i>:
+</code><code id="L2172"><span class="ln">2172</span>                            node[setAttribute](att, value);
+</code><code id="L2173"><span class="ln">2173</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2174"><span class="ln">2174</span>                            <b>if</b> (attrs.fy) {
+</code><code id="L2175"><span class="ln">2175</span>                                att<span class="s"> = </span><i>"y"</i>;
+</code><code id="L2176"><span class="ln">2176</span>                                value<span class="s"> = </span>attrs.y;
+</code><code id="L2177"><span class="ln">2177</span>                            } <b>else</b> {
+</code><code id="L2178"><span class="ln">2178</span>                                <b>break</b>;
+</code><code id="L2179"><span class="ln">2179</span>                            }
+</code><code id="L2180"><span class="ln">2180</span>                        <b>case</b> <i>"y"</i>:
+</code><code id="L2181"><span class="ln">2181</span>                            <b>if</b> (attrs.fy) {
+</code><code id="L2182"><span class="ln">2182</span>                                value<span class="s"> = </span>-attrs.y<span class="s"> - </span>(attrs.height<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L2183"><span class="ln">2183</span>                            }
+</code><code id="L2184"><span class="ln">2184</span>                        <b>case</b> <i>"ry"</i>:
+</code><code id="L2185"><span class="ln">2185</span>                            <b>if</b> (att<span class="s"> == </span><i>"ry"</i><span class="s"> &amp;&amp; </span>o.type<span class="s"> == </span><i>"rect"</i>) {
+</code><code id="L2186"><span class="ln">2186</span>                                <b>break</b>;
+</code><code id="L2187"><span class="ln">2187</span>                            }
+</code><code id="L2188"><span class="ln">2188</span>                        <b>case</b> <i>"cy"</i>:
+</code><code id="L2189"><span class="ln">2189</span>                            node[setAttribute](att, value);
+</code><code id="L2190"><span class="ln">2190</span>                            o.pattern<span class="s"> &amp;&amp; </span>updatePosition(o);
+</code><code id="L2191"><span class="ln">2191</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2192"><span class="ln">2192</span>                            <b>break</b>;
+</code><code id="L2193"><span class="ln">2193</span>                        <b>case</b> <i>"r"</i>:
+</code><code id="L2194"><span class="ln">2194</span>                            <b>if</b> (o.type<span class="s"> == </span><i>"rect"</i>) {
+</code><code id="L2195"><span class="ln">2195</span>                                $(node, {rx: value, ry: value});
+</code><code id="L2196"><span class="ln">2196</span>                            } <b>else</b> {
+</code><code id="L2197"><span class="ln">2197</span>                                node[setAttribute](att, value);
+</code><code id="L2198"><span class="ln">2198</span>                            }
+</code><code id="L2199"><span class="ln">2199</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2200"><span class="ln">2200</span>                            <b>break</b>;
+</code><code id="L2201"><span class="ln">2201</span>                        <b>case</b> <i>"src"</i>:
+</code><code id="L2202"><span class="ln">2202</span>                            <b>if</b> (o.type<span class="s"> == </span><i>"image"</i>) {
+</code><code id="L2203"><span class="ln">2203</span>                                node.setAttributeNS(xlink, <i>"href"</i>, value);
+</code><code id="L2204"><span class="ln">2204</span>                            }
+</code><code id="L2205"><span class="ln">2205</span>                            <b>break</b>;
+</code><code id="L2206"><span class="ln">2206</span>                        <b>case</b> <i>"stroke-width"</i>:
+</code><code id="L2207"><span class="ln">2207</span>                            <b>if</b> (o._.sx != <span class="d">1</span><span class="s"> || </span>o._.sy != <span class="d">1</span>) {
+</code><code id="L2208"><span class="ln">2208</span>                                value /= mmax(abs(o._.sx), abs(o._.sy))<span class="s"> || </span><span class="d">1</span>;
+</code><code id="L2209"><span class="ln">2209</span>                            }
+</code><code id="L2210"><span class="ln">2210</span>                            <b>if</b> (o.paper._vbSize) {
+</code><code id="L2211"><span class="ln">2211</span>                                value *= o.paper._vbSize;
+</code><code id="L2212"><span class="ln">2212</span>                            }
+</code><code id="L2213"><span class="ln">2213</span>                            node[setAttribute](att, value);
+</code><code id="L2214"><span class="ln">2214</span>                            <b>if</b> (attrs[<i>"stroke-dasharray"</i>]) {
+</code><code id="L2215"><span class="ln">2215</span>                                addDashes(o, attrs[<i>"stroke-dasharray"</i>]);
+</code><code id="L2216"><span class="ln">2216</span>                            }
+</code><code id="L2217"><span class="ln">2217</span>                            <b>if</b> (o._.arrows) {
+</code><code id="L2218"><span class="ln">2218</span>                                <i>"startString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.startString);
+</code><code id="L2219"><span class="ln">2219</span>                                <i>"endString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.endString, <span class="d">1</span>);
+</code><code id="L2220"><span class="ln">2220</span>                            }
+</code><code id="L2221"><span class="ln">2221</span>                            <b>break</b>;
+</code><code id="L2222"><span class="ln">2222</span>                        <b>case</b> <i>"stroke-dasharray"</i>:
+</code><code id="L2223"><span class="ln">2223</span>                            addDashes(o, value);
+</code><code id="L2224"><span class="ln">2224</span>                            <b>break</b>;
+</code><code id="L2225"><span class="ln">2225</span>                        <b>case</b> fillString:
+</code><code id="L2226"><span class="ln">2226</span>                            <b>var</b> isURL<span class="s"> = </span>Str(value).match(ISURL);
+</code><code id="L2227"><span class="ln">2227</span>                            <b>if</b> (isURL) {
+</code><code id="L2228"><span class="ln">2228</span>                                el<span class="s"> = </span>$(<i>"pattern"</i>);
+</code><code id="L2229"><span class="ln">2229</span>                                <b>var</b> ig<span class="s"> = </span>$(<i>"image"</i>);
+</code><code id="L2230"><span class="ln">2230</span>                                el.id<span class="s"> = </span>createUUID();
+</code><code id="L2231"><span class="ln">2231</span>                                $(el, {x: <span class="d">0</span>, y: <span class="d">0</span>, patternUnits: <i>"userSpaceOnUse"</i>, height: <span class="d">1</span>, width: <span class="d">1</span>});
+</code><code id="L2232"><span class="ln">2232</span>                                $(ig, {x: <span class="d">0</span>, y: <span class="d">0</span>, <i>"xlink:href"</i>: isURL[<span class="d">1</span>]});
+</code><code id="L2233"><span class="ln">2233</span>                                el.appendChild(ig);
+</code><code id="L2234"><span class="ln">2234</span>
+</code><code id="L2235"><span class="ln">2235</span>                                (<b>function</b> (el) {
+</code><code id="L2236"><span class="ln">2236</span>                                    preload(isURL[<span class="d">1</span>], <b>function</b> () {
+</code><code id="L2237"><span class="ln">2237</span>                                        <b>var</b> w<span class="s"> = </span><b>this</b>.offsetWidth,
+</code><code id="L2238"><span class="ln">2238</span>                                            h<span class="s"> = </span><b>this</b>.offsetHeight;
+</code><code id="L2239"><span class="ln">2239</span>                                        $(el, {width: w, height: h});
+</code><code id="L2240"><span class="ln">2240</span>                                        $(ig, {width: w, height: h});
+</code><code id="L2241"><span class="ln">2241</span>                                        o.paper.safari();
+</code><code id="L2242"><span class="ln">2242</span>                                    });
+</code><code id="L2243"><span class="ln">2243</span>                                })(el);
+</code><code id="L2244"><span class="ln">2244</span>                                o.paper.defs.appendChild(el);
+</code><code id="L2245"><span class="ln">2245</span>                                node.style.fill<span class="s"> = </span><i>"url(#"</i><span class="s"> + </span>el.id<span class="s"> + </span><i>")"</i>;
+</code><code id="L2246"><span class="ln">2246</span>                                $(node, {fill: <i>"url(#"</i><span class="s"> + </span>el.id<span class="s"> + </span><i>")"</i>});
+</code><code id="L2247"><span class="ln">2247</span>                                o.pattern<span class="s"> = </span>el;
+</code><code id="L2248"><span class="ln">2248</span>                                o.pattern<span class="s"> &amp;&amp; </span>updatePosition(o);
+</code><code id="L2249"><span class="ln">2249</span>                                <b>break</b>;
+</code><code id="L2250"><span class="ln">2250</span>                            }
+</code><code id="L2251"><span class="ln">2251</span>                            <b>var</b> clr<span class="s"> = </span>R.getRGB(value);
+</code><code id="L2252"><span class="ln">2252</span>                            <b>if</b> (!clr.error) {
+</code><code id="L2253"><span class="ln">2253</span>                                <b>delete</b> params.gradient;
+</code><code id="L2254"><span class="ln">2254</span>                                <b>delete</b> attrs.gradient;
+</code><code id="L2255"><span class="ln">2255</span>                                !R.is(attrs.opacity, <i>"<b>undefined</b>"</i>) &amp;&amp;
+</code><code id="L2256"><span class="ln">2256</span>                                    R.is(params.opacity, <i>"<b>undefined</b>"</i>) &amp;&amp;
+</code><code id="L2257"><span class="ln">2257</span>                                    $(node, {opacity: attrs.opacity});
+</code><code id="L2258"><span class="ln">2258</span>                                !R.is(attrs[<i>"fill-opacity"</i>], <i>"<b>undefined</b>"</i>) &amp;&amp;
+</code><code id="L2259"><span class="ln">2259</span>                                    R.is(params[<i>"fill-opacity"</i>], <i>"<b>undefined</b>"</i>) &amp;&amp;
+</code><code id="L2260"><span class="ln">2260</span>                                    $(node, {<i>"fill-opacity"</i>: attrs[<i>"fill-opacity"</i>]});
+</code><code id="L2261"><span class="ln">2261</span>                            } <b>else</b> <b>if</b> ((o.type<span class="s"> == </span><i>"circle"</i><span class="s"> || </span>o.type<span class="s"> == </span><i>"ellipse"</i><span class="s"> || </span>Str(value).charAt() != <i>"r"</i>)<span class="s"> &amp;&amp; </span>addGradientFill(o, value)) {
+</code><code id="L2262"><span class="ln">2262</span>                                <b>if</b> (<i>"opacity"</i> <b>in</b> attrs<span class="s"> || </span><i>"fill-opacity"</i> <b>in</b> attrs) {
+</code><code id="L2263"><span class="ln">2263</span>                                    <b>var</b> gradient<span class="s"> = </span>g.doc.getElementById(node.getAttribute(fillString).replace(/^url\(#|\)$/g, E));
+</code><code id="L2264"><span class="ln">2264</span>                                    <b>if</b> (gradient) {
+</code><code id="L2265"><span class="ln">2265</span>                                        <b>var</b> stops<span class="s"> = </span>gradient.getElementsByTagName(<i>"stop"</i>);
+</code><code id="L2266"><span class="ln">2266</span>                                        $(stops[stops.length<span class="s"> - </span><span class="d">1</span>], {<i>"stop-opacity"</i>: (<i>"opacity"</i> <b>in</b> attrs ? attrs.opacity : <span class="d">1</span>)<span class="s"> * </span>(<i>"fill-opacity"</i> <b>in</b> attrs ? attrs[<i>"fill-opacity"</i>] : <span class="d">1</span>)});
+</code><code id="L2267"><span class="ln">2267</span>                                    }
+</code><code id="L2268"><span class="ln">2268</span>                                }
+</code><code id="L2269"><span class="ln">2269</span>                                attrs.gradient<span class="s"> = </span>value;
+</code><code id="L2270"><span class="ln">2270</span>                                attrs.fill<span class="s"> = </span><i>"none"</i>;
+</code><code id="L2271"><span class="ln">2271</span>                                <b>break</b>;
+</code><code id="L2272"><span class="ln">2272</span>                            }
+</code><code id="L2273"><span class="ln">2273</span>                            clr[has](<i>"opacity"</i>)<span class="s"> &amp;&amp; </span>$(node, {<i>"fill-opacity"</i>: clr.opacity > <span class="d">1</span> ? clr.opacity<span class="s"> / </span><span class="d">100</span> : clr.opacity});
+</code><code id="L2274"><span class="ln">2274</span>                        <b>case</b> <i>"stroke"</i>:
+</code><code id="L2275"><span class="ln">2275</span>                            clr<span class="s"> = </span>R.getRGB(value);
+</code><code id="L2276"><span class="ln">2276</span>                            node[setAttribute](att, clr.hex);
+</code><code id="L2277"><span class="ln">2277</span>                            att<span class="s"> == </span><i>"stroke"</i><span class="s"> &amp;&amp; </span>clr[has](<i>"opacity"</i>)<span class="s"> &amp;&amp; </span>$(node, {<i>"stroke-opacity"</i>: clr.opacity > <span class="d">1</span> ? clr.opacity<span class="s"> / </span><span class="d">100</span> : clr.opacity});
+</code><code id="L2278"><span class="ln">2278</span>                            <b>if</b> (att<span class="s"> == </span><i>"stroke"</i><span class="s"> &amp;&amp; </span>o._.arrows) {
+</code><code id="L2279"><span class="ln">2279</span>                                <i>"startString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.startString);
+</code><code id="L2280"><span class="ln">2280</span>                                <i>"endString"</i> <b>in</b> o._.arrows<span class="s"> &amp;&amp; </span>addArrow(o, o._.arrows.endString, <span class="d">1</span>);
+</code><code id="L2281"><span class="ln">2281</span>                            }
+</code><code id="L2282"><span class="ln">2282</span>                            <b>break</b>;
+</code><code id="L2283"><span class="ln">2283</span>                        <b>case</b> <i>"gradient"</i>:
+</code><code id="L2284"><span class="ln">2284</span>                            (o.type<span class="s"> == </span><i>"circle"</i><span class="s"> || </span>o.type<span class="s"> == </span><i>"ellipse"</i><span class="s"> || </span>Str(value).charAt() != <i>"r"</i>)<span class="s"> &amp;&amp; </span>addGradientFill(o, value);
+</code><code id="L2285"><span class="ln">2285</span>                            <b>break</b>;
+</code><code id="L2286"><span class="ln">2286</span>                        <b>case</b> <i>"opacity"</i>:
+</code><code id="L2287"><span class="ln">2287</span>                            <b>if</b> (attrs.gradient<span class="s"> &amp;&amp; </span>!attrs[has](<i>"stroke-opacity"</i>)) {
+</code><code id="L2288"><span class="ln">2288</span>                                $(node, {<i>"stroke-opacity"</i>: value > <span class="d">1</span> ? value<span class="s"> / </span><span class="d">100</span> : value});
+</code><code id="L2289"><span class="ln">2289</span>                            }
+</code><code id="L2290"><span class="ln">2290</span>                            <span class="c">// fall</span>
+</code><code id="L2291"><span class="ln">2291</span>                        <b>case</b> <i>"fill-opacity"</i>:
+</code><code id="L2292"><span class="ln">2292</span>                            <b>if</b> (attrs.gradient) {
+</code><code id="L2293"><span class="ln">2293</span>                                gradient<span class="s"> = </span>g.doc.getElementById(node.getAttribute(fillString).replace(/^url\(#|\)$/g, E));
+</code><code id="L2294"><span class="ln">2294</span>                                <b>if</b> (gradient) {
+</code><code id="L2295"><span class="ln">2295</span>                                    stops<span class="s"> = </span>gradient.getElementsByTagName(<i>"stop"</i>);
+</code><code id="L2296"><span class="ln">2296</span>                                    $(stops[stops.length<span class="s"> - </span><span class="d">1</span>], {<i>"stop-opacity"</i>: value});
+</code><code id="L2297"><span class="ln">2297</span>                                }
+</code><code id="L2298"><span class="ln">2298</span>                                <b>break</b>;
+</code><code id="L2299"><span class="ln">2299</span>                            }
+</code><code id="L2300"><span class="ln">2300</span>                        <b>default</b>:
+</code><code id="L2301"><span class="ln">2301</span>                            att<span class="s"> == </span><i>"font-size"</i><span class="s"> &amp;&amp; </span>(value<span class="s"> = </span>toInt(value, <span class="d">10</span>)<span class="s"> + </span><i>"px"</i>);
+</code><code id="L2302"><span class="ln">2302</span>                            <b>var</b> cssrule<span class="s"> = </span>att.replace(/(\-.)/g, <b>function</b> (w) {
+</code><code id="L2303"><span class="ln">2303</span>                                <b>return</b> upperCase.call(w.substring(<span class="d">1</span>));
+</code><code id="L2304"><span class="ln">2304</span>                            });
+</code><code id="L2305"><span class="ln">2305</span>                            node.style[cssrule]<span class="s"> = </span>value;
+</code><code id="L2306"><span class="ln">2306</span>                            o._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2307"><span class="ln">2307</span>                            node[setAttribute](att, value);
+</code><code id="L2308"><span class="ln">2308</span>                            <b>break</b>;
+</code><code id="L2309"><span class="ln">2309</span>                    }
+</code><code id="L2310"><span class="ln">2310</span>                }
+</code><code id="L2311"><span class="ln">2311</span>            }
+</code><code id="L2312"><span class="ln">2312</span>
+</code><code id="L2313"><span class="ln">2313</span>            tuneText(o, params);
+</code><code id="L2314"><span class="ln">2314</span>        },
+</code><code id="L2315"><span class="ln">2315</span>        leading<span class="s"> = </span><span class="d">1.2</span>,
+</code><code id="L2316"><span class="ln">2316</span>        tuneText<span class="s"> = </span><b>function</b> (el, params) {
+</code><code id="L2317"><span class="ln">2317</span>            <b>if</b> (el.type != <i>"text"</i><span class="s"> || </span>!(params[has](<i>"text"</i>)<span class="s"> || </span>params[has](<i>"font"</i>)<span class="s"> || </span>params[has](<i>"font-size"</i>)<span class="s"> || </span>params[has](<i>"x"</i>)<span class="s"> || </span>params[has](<i>"y"</i>))) {
+</code><code id="L2318"><span class="ln">2318</span>                <b>return</b>;
+</code><code id="L2319"><span class="ln">2319</span>            }
+</code><code id="L2320"><span class="ln">2320</span>            <b>var</b> a<span class="s"> = </span>el.attrs,
+</code><code id="L2321"><span class="ln">2321</span>                node<span class="s"> = </span>el.node,
+</code><code id="L2322"><span class="ln">2322</span>                fontSize<span class="s"> = </span>node.firstChild ? toInt(g.doc.defaultView.getComputedStyle(node.firstChild, E).getPropertyValue(<i>"font-size"</i>), <span class="d">10</span>) : <span class="d">10</span>;
+</code><code id="L2323"><span class="ln">2323</span> 
+</code><code id="L2324"><span class="ln">2324</span>            <b>if</b> (params[has](<i>"text"</i>)) {
+</code><code id="L2325"><span class="ln">2325</span>                a.text<span class="s"> = </span>params.text;
+</code><code id="L2326"><span class="ln">2326</span>                <b>while</b> (node.firstChild) {
+</code><code id="L2327"><span class="ln">2327</span>                    node.removeChild(node.firstChild);
+</code><code id="L2328"><span class="ln">2328</span>                }
+</code><code id="L2329"><span class="ln">2329</span>                <b>var</b> texts<span class="s"> = </span>Str(params.text).split(<i>"\n"</i>),
+</code><code id="L2330"><span class="ln">2330</span>                    tspans<span class="s"> = </span>[],
+</code><code id="L2331"><span class="ln">2331</span>                    tspan;
+</code><code id="L2332"><span class="ln">2332</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>texts.length; i &lt; ii; i++) <b>if</b> (texts[i]) {
+</code><code id="L2333"><span class="ln">2333</span>                    tspan<span class="s"> = </span>$(<i>"tspan"</i>);
+</code><code id="L2334"><span class="ln">2334</span>                    i<span class="s"> &amp;&amp; </span>$(tspan, {dy: fontSize<span class="s"> * </span>leading, x: a.x});
+</code><code id="L2335"><span class="ln">2335</span>                    tspan.appendChild(g.doc.createTextNode(texts[i]));
+</code><code id="L2336"><span class="ln">2336</span>                    node.appendChild(tspan);
+</code><code id="L2337"><span class="ln">2337</span>                    tspans[i]<span class="s"> = </span>tspan;
+</code><code id="L2338"><span class="ln">2338</span>                }
+</code><code id="L2339"><span class="ln">2339</span>            } <b>else</b> {
+</code><code id="L2340"><span class="ln">2340</span>                tspans<span class="s"> = </span>node.getElementsByTagName(<i>"tspan"</i>);
+</code><code id="L2341"><span class="ln">2341</span>                <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>tspans.length; i &lt; ii; i++) {
+</code><code id="L2342"><span class="ln">2342</span>                    i<span class="s"> &amp;&amp; </span>$(tspans[i], {dy: fontSize<span class="s"> * </span>leading, x: a.x});
+</code><code id="L2343"><span class="ln">2343</span>                }
+</code><code id="L2344"><span class="ln">2344</span>            }
+</code><code id="L2345"><span class="ln">2345</span>            $(node, {y: a.y});
+</code><code id="L2346"><span class="ln">2346</span>            el._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2347"><span class="ln">2347</span>            <b>var</b> bb<span class="s"> = </span>el._getBBox(),
+</code><code id="L2348"><span class="ln">2348</span>                dif<span class="s"> = </span>a.y<span class="s"> - </span>(bb.y<span class="s"> + </span>bb.height<span class="s"> / </span><span class="d">2</span>);
+</code><code id="L2349"><span class="ln">2349</span>            dif<span class="s"> &amp;&amp; </span>R.is(dif, <i>"finite"</i>)<span class="s"> &amp;&amp; </span>$(tspans[<span class="d">0</span>], {dy: a.y<span class="s"> + </span>dif});
+</code><code id="L2350"><span class="ln">2350</span>        },
+</code><code id="L2351"><span class="ln">2351</span>        Element<span class="s"> = </span><b>function</b> (node, svg) {
+</code><code id="L2352"><span class="ln">2352</span>            <b>var</b> X<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L2353"><span class="ln">2353</span>                Y<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L2354"><span class="ln">2354</span><span class="c">            <span class="c">/*\</span>
+</span></code><code id="L2355"><span class="ln">2355</span><span class="c">            <span class="s"> * </span>Element.node
+</span></code><code id="L2356"><span class="ln">2356</span><span class="c">             [ property (object) ]
+</span></code><code id="L2357"><span class="ln">2357</span><span class="c">             **
+</span></code><code id="L2358"><span class="ln">2358</span><span class="c">            <span class="s"> * </span>Gives you a reference to the DOM object, so you can assign event handlers or just mess around.
+</span></code><code id="L2359"><span class="ln">2359</span><span class="c">             > Usage
+</span></code><code id="L2360"><span class="ln">2360</span><span class="c">            <span class="s"> | </span><span class="c">// draw a circle at coordinate <span class="d">10</span>,<span class="d">10</span> <b>with</b> radius of <span class="d">10</span></span>
+</span></code><code id="L2361"><span class="ln">2361</span><span class="c">            <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.circle(<span class="d">10</span>, <span class="d">10</span>, <span class="d">10</span>);
+</span></code><code id="L2362"><span class="ln">2362</span><span class="c">            <span class="s"> | </span>c.node.onclick<span class="s"> = </span><b>function</b> () {
+</span></code><code id="L2363"><span class="ln">2363</span><span class="c">            <span class="s"> | </span>    c.attr(<i>"fill"</i>, <i>"red"</i>);
+</span></code><code id="L2364"><span class="ln">2364</span><span class="c">            <span class="s"> | </span>};
+</span></code><code id="L2365"><span class="ln">2365</span><span class="c">            \*/</span>
+</code><code id="L2366"><span class="ln">2366</span>            <b>this</b>[<span class="d">0</span>]<span class="s"> = </span><b>this</b>.node<span class="s"> = </span>node;
+</code><code id="L2367"><span class="ln">2367</span><span class="c">            <span class="c">/*\</span>
+</span></code><code id="L2368"><span class="ln">2368</span><span class="c">            <span class="s"> * </span>Element.raphael
+</span></code><code id="L2369"><span class="ln">2369</span><span class="c">             [ property (object) ]
+</span></code><code id="L2370"><span class="ln">2370</span><span class="c">             **
+</span></code><code id="L2371"><span class="ln">2371</span><span class="c">            <span class="s"> * </span>Internal reference to @Raphael object. In <b>case</b> it is not available.
+</span></code><code id="L2372"><span class="ln">2372</span><span class="c">             > Usage
+</span></code><code id="L2373"><span class="ln">2373</span><span class="c">            <span class="s"> | </span>Raphael.el.red<span class="s"> = </span><b>function</b> () {
+</span></code><code id="L2374"><span class="ln">2374</span><span class="c">            <span class="s"> | </span>    <b>var</b> hsb<span class="s"> = </span><b>this</b>.paper.raphael.rgb2hsb(<b>this</b>.attr(<i>"fill"</i>));
+</span></code><code id="L2375"><span class="ln">2375</span><span class="c">            <span class="s"> | </span>    hsb.h<span class="s"> = </span><span class="d">1</span>;
+</span></code><code id="L2376"><span class="ln">2376</span><span class="c">            <span class="s"> | </span>    <b>this</b>.attr({fill: <b>this</b>.paper.raphael.hsb2rgb(hsb).hex});
+</span></code><code id="L2377"><span class="ln">2377</span><span class="c">            <span class="s"> | </span>}
+</span></code><code id="L2378"><span class="ln">2378</span><span class="c">            \*/</span>
+</code><code id="L2379"><span class="ln">2379</span>            node.raphael<span class="s"> = </span><b>true</b>;
+</code><code id="L2380"><span class="ln">2380</span><span class="c">            <span class="c">/*\</span>
+</span></code><code id="L2381"><span class="ln">2381</span><span class="c">            <span class="s"> * </span>Element.id
+</span></code><code id="L2382"><span class="ln">2382</span><span class="c">             [ property (number) ]
+</span></code><code id="L2383"><span class="ln">2383</span><span class="c">             **
+</span></code><code id="L2384"><span class="ln">2384</span><span class="c">            <span class="s"> * </span>Unique id of the element. Especially usesful when you want to listen to events of the element, 
+</span></code><code id="L2385"><span class="ln">2385</span><span class="c">            <span class="s"> * </span>because all events are fired <b>in</b> format `&lt;module>.&lt;action>.&lt;id>`. Also useful <b>for</b> @Paper.getById method.
+</span></code><code id="L2386"><span class="ln">2386</span><span class="c">            \*/</span>
+</code><code id="L2387"><span class="ln">2387</span>            <b>this</b>.id<span class="s"> = </span>R._oid++;
+</code><code id="L2388"><span class="ln">2388</span>            node.raphaelid<span class="s"> = </span><b>this</b>.id;
+</code><code id="L2389"><span class="ln">2389</span>            <b>this</b>.matrix<span class="s"> = </span><b>new</b> Matrix;
+</code><code id="L2390"><span class="ln">2390</span>            <b>this</b>.realPath<span class="s"> = </span><b>null</b>;
+</code><code id="L2391"><span class="ln">2391</span><span class="c">            <span class="c">/*\</span>
+</span></code><code id="L2392"><span class="ln">2392</span><span class="c">            <span class="s"> * </span>Element.paper
+</span></code><code id="L2393"><span class="ln">2393</span><span class="c">             [ property (object) ]
+</span></code><code id="L2394"><span class="ln">2394</span><span class="c">             **
+</span></code><code id="L2395"><span class="ln">2395</span><span class="c">            <span class="s"> * </span>Internal reference to “paper” where object drawn. Mainly <b>for</b> use <b>in</b> plugins and element extensions.
+</span></code><code id="L2396"><span class="ln">2396</span><span class="c">             > Usage
+</span></code><code id="L2397"><span class="ln">2397</span><span class="c">            <span class="s"> | </span>Raphael.el.cross<span class="s"> = </span><b>function</b> () {
+</span></code><code id="L2398"><span class="ln">2398</span><span class="c">            <span class="s"> | </span>    <b>this</b>.attr({fill: <i>"red"</i>});
+</span></code><code id="L2399"><span class="ln">2399</span><span class="c">            <span class="s"> | </span>    <b>this</b>.paper.path(<i>"M10,10L50,50M50,10L10,<span class="d">50</span>"</i>)
+</span></code><code id="L2400"><span class="ln">2400</span><span class="c">            <span class="s"> | </span>        .attr({stroke: <i>"red"</i>});
+</span></code><code id="L2401"><span class="ln">2401</span><span class="c">            <span class="s"> | </span>}
+</span></code><code id="L2402"><span class="ln">2402</span><span class="c">            \*/</span>
+</code><code id="L2403"><span class="ln">2403</span>            <b>this</b>.paper<span class="s"> = </span>svg;
+</code><code id="L2404"><span class="ln">2404</span>            <b>this</b>.attrs<span class="s"> = </span><b>this</b>.attrs<span class="s"> || </span>{};
+</code><code id="L2405"><span class="ln">2405</span>            <b>this</b>._<span class="s"> = </span>{
+</code><code id="L2406"><span class="ln">2406</span>                transform: [],
+</code><code id="L2407"><span class="ln">2407</span>                sx: <span class="d">1</span>,
+</code><code id="L2408"><span class="ln">2408</span>                sy: <span class="d">1</span>,
+</code><code id="L2409"><span class="ln">2409</span>                deg: <span class="d">0</span>,
+</code><code id="L2410"><span class="ln">2410</span>                dx: <span class="d">0</span>,
+</code><code id="L2411"><span class="ln">2411</span>                dy: <span class="d">0</span>,
+</code><code id="L2412"><span class="ln">2412</span>                dirty: <span class="d">1</span>
+</code><code id="L2413"><span class="ln">2413</span>            };
+</code><code id="L2414"><span class="ln">2414</span>            !svg.bottom<span class="s"> &amp;&amp; </span>(svg.bottom<span class="s"> = </span><b>this</b>);
+</code><code id="L2415"><span class="ln">2415</span><span class="c">            <span class="c">/*\</span>
+</span></code><code id="L2416"><span class="ln">2416</span><span class="c">            <span class="s"> * </span>Element.prev
+</span></code><code id="L2417"><span class="ln">2417</span><span class="c">             [ property (object) ]
+</span></code><code id="L2418"><span class="ln">2418</span><span class="c">             **
+</span></code><code id="L2419"><span class="ln">2419</span><span class="c">            <span class="s"> * </span>Reference to the previous element <b>in</b> the hierarchy.
+</span></code><code id="L2420"><span class="ln">2420</span><span class="c">            \*/</span>
+</code><code id="L2421"><span class="ln">2421</span>            <b>this</b>.prev<span class="s"> = </span>svg.top;
+</code><code id="L2422"><span class="ln">2422</span>            svg.top<span class="s"> &amp;&amp; </span>(svg.top.next<span class="s"> = </span><b>this</b>);
+</code><code id="L2423"><span class="ln">2423</span>            svg.top<span class="s"> = </span><b>this</b>;
+</code><code id="L2424"><span class="ln">2424</span><span class="c">            <span class="c">/*\</span>
+</span></code><code id="L2425"><span class="ln">2425</span><span class="c">            <span class="s"> * </span>Element.next
+</span></code><code id="L2426"><span class="ln">2426</span><span class="c">             [ property (object) ]
+</span></code><code id="L2427"><span class="ln">2427</span><span class="c">             **
+</span></code><code id="L2428"><span class="ln">2428</span><span class="c">            <span class="s"> * </span>Reference to the next element <b>in</b> the hierarchy.
+</span></code><code id="L2429"><span class="ln">2429</span><span class="c">            \*/</span>
+</code><code id="L2430"><span class="ln">2430</span>            <b>this</b>.next<span class="s"> = </span><b>null</b>;
+</code><code id="L2431"><span class="ln">2431</span>        },
+</code><code id="L2432"><span class="ln">2432</span>        elproto<span class="s"> = </span>Element.prototype;
+</code><code id="L2433"><span class="ln">2433</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2434"><span class="ln">2434</span><span class="c">        <span class="s"> * </span>Element.rotate
+</span></code><code id="L2435"><span class="ln">2435</span><span class="c">         [ method ]
+</span></code><code id="L2436"><span class="ln">2436</span><span class="c">         **
+</span></code><code id="L2437"><span class="ln">2437</span><span class="c">        <span class="s"> * </span>Adds rotation by given angle around given point to the list of
+</span></code><code id="L2438"><span class="ln">2438</span><span class="c">        <span class="s"> * </span>transformations of the element.
+</span></code><code id="L2439"><span class="ln">2439</span><span class="c">         > Parameters
+</span></code><code id="L2440"><span class="ln">2440</span><span class="c">        <span class="s"> - </span>deg (number) angle <b>in</b> degrees
+</span></code><code id="L2441"><span class="ln">2441</span><span class="c">        <span class="s"> - </span>cx (number) #optional x coordinate of the centre of rotation
+</span></code><code id="L2442"><span class="ln">2442</span><span class="c">        <span class="s"> - </span>cy (number) #optional y coordinate of the centre of rotation
+</span></code><code id="L2443"><span class="ln">2443</span><span class="c">        <span class="s"> * </span>If cx<span class="s"> &amp; </span>cy aren’t specified centre of the shape is used as a point of rotation.
+</span></code><code id="L2444"><span class="ln">2444</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2445"><span class="ln">2445</span><span class="c">        \*/</span>
+</code><code id="L2446"><span class="ln">2446</span>        elproto.rotate<span class="s"> = </span><b>function</b> (deg, cx, cy) {
+</code><code id="L2447"><span class="ln">2447</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L2448"><span class="ln">2448</span>                <b>return</b> <b>this</b>;
+</code><code id="L2449"><span class="ln">2449</span>            }
+</code><code id="L2450"><span class="ln">2450</span>            deg<span class="s"> = </span>Str(deg).split(separator);
+</code><code id="L2451"><span class="ln">2451</span>            <b>if</b> (deg.length<span class="s"> - </span><span class="d">1</span>) {
+</code><code id="L2452"><span class="ln">2452</span>                cx<span class="s"> = </span>toFloat(deg[<span class="d">1</span>]);
+</code><code id="L2453"><span class="ln">2453</span>                cy<span class="s"> = </span>toFloat(deg[<span class="d">2</span>]);
+</code><code id="L2454"><span class="ln">2454</span>            }
+</code><code id="L2455"><span class="ln">2455</span>            deg<span class="s"> = </span>toFloat(deg[<span class="d">0</span>]);
+</code><code id="L2456"><span class="ln">2456</span>            (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
+</code><code id="L2457"><span class="ln">2457</span>            <b>if</b> (cx<span class="s"> == </span><b>null</b><span class="s"> || </span>cy<span class="s"> == </span><b>null</b>) {
+</code><code id="L2458"><span class="ln">2458</span>                <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
+</code><code id="L2459"><span class="ln">2459</span>                cx<span class="s"> = </span>bbox.x<span class="s"> + </span>bbox.width<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L2460"><span class="ln">2460</span>                cy<span class="s"> = </span>bbox.y<span class="s"> + </span>bbox.height<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L2461"><span class="ln">2461</span>            }
+</code><code id="L2462"><span class="ln">2462</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"r"</i>, deg, cx, cy]]));
+</code><code id="L2463"><span class="ln">2463</span>            <b>return</b> <b>this</b>;
+</code><code id="L2464"><span class="ln">2464</span>        };
+</code><code id="L2465"><span class="ln">2465</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2466"><span class="ln">2466</span><span class="c">        <span class="s"> * </span>Element.scale
+</span></code><code id="L2467"><span class="ln">2467</span><span class="c">         [ method ]
+</span></code><code id="L2468"><span class="ln">2468</span><span class="c">         **
+</span></code><code id="L2469"><span class="ln">2469</span><span class="c">        <span class="s"> * </span>Adds scale by given amount relative to given point to the list of
+</span></code><code id="L2470"><span class="ln">2470</span><span class="c">        <span class="s"> * </span>transformations of the element.
+</span></code><code id="L2471"><span class="ln">2471</span><span class="c">         > Parameters
+</span></code><code id="L2472"><span class="ln">2472</span><span class="c">        <span class="s"> - </span>sx (number) horisontal scale amount
+</span></code><code id="L2473"><span class="ln">2473</span><span class="c">        <span class="s"> - </span>sy (number) vertical scale amount
+</span></code><code id="L2474"><span class="ln">2474</span><span class="c">        <span class="s"> - </span>cx (number) #optional x coordinate of the centre of scale
+</span></code><code id="L2475"><span class="ln">2475</span><span class="c">        <span class="s"> - </span>cy (number) #optional y coordinate of the centre of scale
+</span></code><code id="L2476"><span class="ln">2476</span><span class="c">        <span class="s"> * </span>If cx<span class="s"> &amp; </span>cy aren’t specified centre of the shape is used instead.
+</span></code><code id="L2477"><span class="ln">2477</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2478"><span class="ln">2478</span><span class="c">        \*/</span>
+</code><code id="L2479"><span class="ln">2479</span>        elproto.scale<span class="s"> = </span><b>function</b> (sx, sy, cx, cy) {
+</code><code id="L2480"><span class="ln">2480</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L2481"><span class="ln">2481</span>                <b>return</b> <b>this</b>;
+</code><code id="L2482"><span class="ln">2482</span>            }
+</code><code id="L2483"><span class="ln">2483</span>            sx<span class="s"> = </span>Str(sx).split(separator);
+</code><code id="L2484"><span class="ln">2484</span>            <b>if</b> (sx.length<span class="s"> - </span><span class="d">1</span>) {
+</code><code id="L2485"><span class="ln">2485</span>                sy<span class="s"> = </span>toFloat(sx[<span class="d">1</span>]);
+</code><code id="L2486"><span class="ln">2486</span>                cx<span class="s"> = </span>toFloat(sx[<span class="d">2</span>]);
+</code><code id="L2487"><span class="ln">2487</span>                cy<span class="s"> = </span>toFloat(sx[<span class="d">3</span>]);
+</code><code id="L2488"><span class="ln">2488</span>            }
+</code><code id="L2489"><span class="ln">2489</span>            sx<span class="s"> = </span>toFloat(sx[<span class="d">0</span>]);
+</code><code id="L2490"><span class="ln">2490</span>            (sy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(sy<span class="s"> = </span>sx);
+</code><code id="L2491"><span class="ln">2491</span>            (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
+</code><code id="L2492"><span class="ln">2492</span>            <b>if</b> (cx<span class="s"> == </span><b>null</b><span class="s"> || </span>cy<span class="s"> == </span><b>null</b>) {
+</code><code id="L2493"><span class="ln">2493</span>                <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
+</code><code id="L2494"><span class="ln">2494</span>            }
+</code><code id="L2495"><span class="ln">2495</span>            cx<span class="s"> = </span>cx<span class="s"> == </span><b>null</b> ? bbox.x<span class="s"> + </span>bbox.width<span class="s"> / </span><span class="d">2</span> : cx;
+</code><code id="L2496"><span class="ln">2496</span>            cy<span class="s"> = </span>cy<span class="s"> == </span><b>null</b> ? bbox.y<span class="s"> + </span>bbox.height<span class="s"> / </span><span class="d">2</span> : cy;
+</code><code id="L2497"><span class="ln">2497</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"s"</i>, sx, sy, cx, cy]]));
+</code><code id="L2498"><span class="ln">2498</span>            <b>return</b> <b>this</b>;
+</code><code id="L2499"><span class="ln">2499</span>        };
+</code><code id="L2500"><span class="ln">2500</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2501"><span class="ln">2501</span><span class="c">        <span class="s"> * </span>Element.translate
+</span></code><code id="L2502"><span class="ln">2502</span><span class="c">         [ method ]
+</span></code><code id="L2503"><span class="ln">2503</span><span class="c">         **
+</span></code><code id="L2504"><span class="ln">2504</span><span class="c">        <span class="s"> * </span>Adds translation by given amount to the list of transformations of the element.
+</span></code><code id="L2505"><span class="ln">2505</span><span class="c">         > Parameters
+</span></code><code id="L2506"><span class="ln">2506</span><span class="c">        <span class="s"> - </span>dx (number) horisontal shift
+</span></code><code id="L2507"><span class="ln">2507</span><span class="c">        <span class="s"> - </span>dy (number) vertical shift
+</span></code><code id="L2508"><span class="ln">2508</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2509"><span class="ln">2509</span><span class="c">        \*/</span>
+</code><code id="L2510"><span class="ln">2510</span>        elproto.translate<span class="s"> = </span><b>function</b> (dx, dy) {
+</code><code id="L2511"><span class="ln">2511</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L2512"><span class="ln">2512</span>                <b>return</b> <b>this</b>;
+</code><code id="L2513"><span class="ln">2513</span>            }
+</code><code id="L2514"><span class="ln">2514</span>            dx<span class="s"> = </span>Str(dx).split(separator);
+</code><code id="L2515"><span class="ln">2515</span>            <b>if</b> (dx.length<span class="s"> - </span><span class="d">1</span>) {
+</code><code id="L2516"><span class="ln">2516</span>                dy<span class="s"> = </span>toFloat(dx[<span class="d">1</span>]);
+</code><code id="L2517"><span class="ln">2517</span>            }
+</code><code id="L2518"><span class="ln">2518</span>            dx<span class="s"> = </span>toFloat(dx[<span class="d">0</span>])<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L2519"><span class="ln">2519</span>            dy<span class="s"> = </span>+dy<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L2520"><span class="ln">2520</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"t"</i>, dx, dy]]));
+</code><code id="L2521"><span class="ln">2521</span>            <b>return</b> <b>this</b>;
+</code><code id="L2522"><span class="ln">2522</span>        };
+</code><code id="L2523"><span class="ln">2523</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2524"><span class="ln">2524</span><span class="c">        <span class="s"> * </span>Element.transform
+</span></code><code id="L2525"><span class="ln">2525</span><span class="c">         [ method ]
+</span></code><code id="L2526"><span class="ln">2526</span><span class="c">         **
+</span></code><code id="L2527"><span class="ln">2527</span><span class="c">        <span class="s"> * </span>Adds transformation to the element which is separate to other attributes,
+</span></code><code id="L2528"><span class="ln">2528</span><span class="c">        <span class="s"> * </span>i.e. translation doesn’t change `x` or `y` of the rectange. The format
+</span></code><code id="L2529"><span class="ln">2529</span><span class="c">        <span class="s"> * </span>of transformation string is similar to the path string syntax:
+</span></code><code id="L2530"><span class="ln">2530</span><span class="c">        <span class="s"> | </span><i>"t100,100r30,<span class="d">100</span>,100s2,<span class="d">2</span>,<span class="d">100</span>,100r45s1<span class="d">.5</span>"</i>
+</span></code><code id="L2531"><span class="ln">2531</span><span class="c">        <span class="s"> * </span>Each letter is a command. There are four commands: `t` is <b>for</b> translate, `r` is <b>for</b> rotate, `s` is <b>for</b>
+</span></code><code id="L2532"><span class="ln">2532</span><span class="c">        <span class="s"> * </span>scale and `m` is <b>for</b> matrix.
+</span></code><code id="L2533"><span class="ln">2533</span><span class="c">         *
+</span></code><code id="L2534"><span class="ln">2534</span><span class="c">        <span class="s"> * </span>So, the example line above could be read like “translate by <span class="d">100</span>, <span class="d">100</span>; rotate <span class="d">30</span>° around <span class="d">100</span>, <span class="d">100</span>; scale twice around <span class="d">100</span>, <span class="d">100</span>;
+</span></code><code id="L2535"><span class="ln">2535</span><span class="c">        <span class="s"> * </span>rotate <span class="d">45</span>° around centre; scale <span class="d">1.5</span> times relative to centre”. As you can see rotate and scale commands have origin
+</span></code><code id="L2536"><span class="ln">2536</span><span class="c">        <span class="s"> * </span>coordinates as optional parameters, the <b>default</b> is the centre point of the element.
+</span></code><code id="L2537"><span class="ln">2537</span><span class="c">        <span class="s"> * </span>Matrix accepts six parameters.
+</span></code><code id="L2538"><span class="ln">2538</span><span class="c">         > Usage
+</span></code><code id="L2539"><span class="ln">2539</span><span class="c">        <span class="s"> | </span><b>var</b> el<span class="s"> = </span>paper.rect(<span class="d">10</span>, <span class="d">20</span>, <span class="d">300</span>, <span class="d">200</span>);
+</span></code><code id="L2540"><span class="ln">2540</span><span class="c">        <span class="s"> | </span><span class="c">// translate <span class="d">100</span>, <span class="d">100</span>, rotate <span class="d">45</span>°, translate -<span class="d">100</span>, <span class="d">0</span></span>
+</span></code><code id="L2541"><span class="ln">2541</span><span class="c">        <span class="s"> | </span>el.transform(<i>"t100,100r45t-<span class="d">100</span>,<span class="d">0</span>"</i>);
+</span></code><code id="L2542"><span class="ln">2542</span><span class="c">        <span class="s"> | </span><span class="c">// <b>if</b> you want you can append or prepend transformations</span>
+</span></code><code id="L2543"><span class="ln">2543</span><span class="c">        <span class="s"> | </span>el.transform(<i>"...t50,<span class="d">50</span>"</i>);
+</span></code><code id="L2544"><span class="ln">2544</span><span class="c">        <span class="s"> | </span>el.transform(<i>"s2..."</i>);
+</span></code><code id="L2545"><span class="ln">2545</span><span class="c">        <span class="s"> | </span><span class="c">// or even wrap</span>
+</span></code><code id="L2546"><span class="ln">2546</span><span class="c">        <span class="s"> | </span>el.transform(<i>"t50,<span class="d">50</span>...t-<span class="d">50</span>-<span class="d">50</span>"</i>);
+</span></code><code id="L2547"><span class="ln">2547</span><span class="c">        <span class="s"> | </span><span class="c">// to reset transformation call method <b>with</b> empty string</span>
+</span></code><code id="L2548"><span class="ln">2548</span><span class="c">        <span class="s"> | </span>el.transform(<i>""</i>);
+</span></code><code id="L2549"><span class="ln">2549</span><span class="c">        <span class="s"> | </span><span class="c">// to get current value call it without parameters</span>
+</span></code><code id="L2550"><span class="ln">2550</span><span class="c">        <span class="s"> | </span>console.log(el.transform());
+</span></code><code id="L2551"><span class="ln">2551</span><span class="c">         > Parameters
+</span></code><code id="L2552"><span class="ln">2552</span><span class="c">        <span class="s"> - </span>tstr (string) #optional transformation string
+</span></code><code id="L2553"><span class="ln">2553</span><span class="c">        <span class="s"> * </span>If tstr isn’t specified
+</span></code><code id="L2554"><span class="ln">2554</span><span class="c">        <span class="s"> = </span>(string) current transformation string
+</span></code><code id="L2555"><span class="ln">2555</span><span class="c">        <span class="s"> * </span><b>else</b>
+</span></code><code id="L2556"><span class="ln">2556</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2557"><span class="ln">2557</span><span class="c">        \*/</span>
+</code><code id="L2558"><span class="ln">2558</span>        elproto.transform<span class="s"> = </span><b>function</b> (tstr) {
+</code><code id="L2559"><span class="ln">2559</span>            <b>var</b> _<span class="s"> = </span><b>this</b>._;
+</code><code id="L2560"><span class="ln">2560</span>            <b>if</b> (!tstr) {
+</code><code id="L2561"><span class="ln">2561</span>                <b>return</b> _.transform;
+</code><code id="L2562"><span class="ln">2562</span>            }
+</code><code id="L2563"><span class="ln">2563</span>            extractTransform(<b>this</b>, tstr);
+</code><code id="L2564"><span class="ln">2564</span>
+</code><code id="L2565"><span class="ln">2565</span>            <b>this</b>.clip<span class="s"> &amp;&amp; </span>$(<b>this</b>.clip, {transform: <b>this</b>.matrix.invert()});
+</code><code id="L2566"><span class="ln">2566</span>            <span class="c">// <b>this</b>.gradient<span class="s"> &amp;&amp; </span>$(<b>this</b>.gradient, {gradientTransform: <b>this</b>.matrix.invert()});</span>
+</code><code id="L2567"><span class="ln">2567</span>            <b>this</b>.pattern<span class="s"> &amp;&amp; </span>updatePosition(<b>this</b>);
+</code><code id="L2568"><span class="ln">2568</span>            <b>this</b>.node<span class="s"> &amp;&amp; </span>$(<b>this</b>.node, {transform: <b>this</b>.matrix});
+</code><code id="L2569"><span class="ln">2569</span>            
+</code><code id="L2570"><span class="ln">2570</span>            <b>if</b> (_.sx != <span class="d">1</span><span class="s"> || </span>_.sy != <span class="d">1</span>) {
+</code><code id="L2571"><span class="ln">2571</span>                <b>var</b> sw<span class="s"> = </span><b>this</b>.attrs[has](<i>"stroke-width"</i>) ? <b>this</b>.attrs[<i>"stroke-width"</i>] : <span class="d">1</span>;
+</code><code id="L2572"><span class="ln">2572</span>                <b>this</b>.attr({<i>"stroke-width"</i>: sw});
+</code><code id="L2573"><span class="ln">2573</span>            }
+</code><code id="L2574"><span class="ln">2574</span>
+</code><code id="L2575"><span class="ln">2575</span>            <b>return</b> <b>this</b>;
+</code><code id="L2576"><span class="ln">2576</span>        };
+</code><code id="L2577"><span class="ln">2577</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2578"><span class="ln">2578</span><span class="c">        <span class="s"> * </span>Element.hide
+</span></code><code id="L2579"><span class="ln">2579</span><span class="c">         [ method ]
+</span></code><code id="L2580"><span class="ln">2580</span><span class="c">         **
+</span></code><code id="L2581"><span class="ln">2581</span><span class="c">        <span class="s"> * </span>Makes element invisible. See @Element.show.
+</span></code><code id="L2582"><span class="ln">2582</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2583"><span class="ln">2583</span><span class="c">        \*/</span>
+</code><code id="L2584"><span class="ln">2584</span>        elproto.hide<span class="s"> = </span><b>function</b> () {
+</code><code id="L2585"><span class="ln">2585</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span><b>this</b>.paper.safari(<b>this</b>.node.style.display<span class="s"> = </span><i>"none"</i>);
+</code><code id="L2586"><span class="ln">2586</span>            <b>return</b> <b>this</b>;
+</code><code id="L2587"><span class="ln">2587</span>        };
+</code><code id="L2588"><span class="ln">2588</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2589"><span class="ln">2589</span><span class="c">        <span class="s"> * </span>Element.show
+</span></code><code id="L2590"><span class="ln">2590</span><span class="c">         [ method ]
+</span></code><code id="L2591"><span class="ln">2591</span><span class="c">         **
+</span></code><code id="L2592"><span class="ln">2592</span><span class="c">        <span class="s"> * </span>Makes element visible. See @Element.hide.
+</span></code><code id="L2593"><span class="ln">2593</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2594"><span class="ln">2594</span><span class="c">        \*/</span>
+</code><code id="L2595"><span class="ln">2595</span>        elproto.show<span class="s"> = </span><b>function</b> () {
+</code><code id="L2596"><span class="ln">2596</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span><b>this</b>.paper.safari(<b>this</b>.node.style.display<span class="s"> = </span><i>""</i>);
+</code><code id="L2597"><span class="ln">2597</span>            <b>return</b> <b>this</b>;
+</code><code id="L2598"><span class="ln">2598</span>        };
+</code><code id="L2599"><span class="ln">2599</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2600"><span class="ln">2600</span><span class="c">        <span class="s"> * </span>Element.remove
+</span></code><code id="L2601"><span class="ln">2601</span><span class="c">         [ method ]
+</span></code><code id="L2602"><span class="ln">2602</span><span class="c">         **
+</span></code><code id="L2603"><span class="ln">2603</span><span class="c">        <span class="s"> * </span>Removes element form the paper.
+</span></code><code id="L2604"><span class="ln">2604</span><span class="c">        \*/</span>
+</code><code id="L2605"><span class="ln">2605</span>        elproto.remove<span class="s"> = </span><b>function</b> () {
+</code><code id="L2606"><span class="ln">2606</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L2607"><span class="ln">2607</span>                <b>return</b>;
+</code><code id="L2608"><span class="ln">2608</span>            }
+</code><code id="L2609"><span class="ln">2609</span>            eve.unbind(<i>"*.*."</i><span class="s"> + </span><b>this</b>.id);
+</code><code id="L2610"><span class="ln">2610</span>            tear(<b>this</b>, <b>this</b>.paper);
+</code><code id="L2611"><span class="ln">2611</span>            <b>this</b>.node.parentNode.removeChild(<b>this</b>.node);
+</code><code id="L2612"><span class="ln">2612</span>            <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
+</code><code id="L2613"><span class="ln">2613</span>                <b>delete</b> <b>this</b>[i];
+</code><code id="L2614"><span class="ln">2614</span>            }
+</code><code id="L2615"><span class="ln">2615</span>            <b>this</b>.removed<span class="s"> = </span><b>true</b>;
+</code><code id="L2616"><span class="ln">2616</span>        };
+</code><code id="L2617"><span class="ln">2617</span>        elproto._getBBox<span class="s"> = </span><b>function</b> () {
+</code><code id="L2618"><span class="ln">2618</span>            <b>if</b> (<b>this</b>.node.style.display<span class="s"> == </span><i>"none"</i>) {
+</code><code id="L2619"><span class="ln">2619</span>                <b>this</b>.show();
+</code><code id="L2620"><span class="ln">2620</span>                <b>var</b> hide<span class="s"> = </span><b>true</b>;
+</code><code id="L2621"><span class="ln">2621</span>            }
+</code><code id="L2622"><span class="ln">2622</span>            <b>var</b> bbox<span class="s"> = </span>{};
+</code><code id="L2623"><span class="ln">2623</span>            <b>try</b> {
+</code><code id="L2624"><span class="ln">2624</span>                bbox<span class="s"> = </span><b>this</b>.node.getBBox();
+</code><code id="L2625"><span class="ln">2625</span>            } <b>catch</b>(e) {
+</code><code id="L2626"><span class="ln">2626</span>                <span class="c">// Firefox <span class="d">3.0</span>.x plays badly here</span>
+</code><code id="L2627"><span class="ln">2627</span>            } <b>finally</b> {
+</code><code id="L2628"><span class="ln">2628</span>                bbox<span class="s"> = </span>bbox<span class="s"> || </span>{};
+</code><code id="L2629"><span class="ln">2629</span>            }
+</code><code id="L2630"><span class="ln">2630</span>            hide<span class="s"> &amp;&amp; </span><b>this</b>.hide();
+</code><code id="L2631"><span class="ln">2631</span>            <b>return</b> bbox;
+</code><code id="L2632"><span class="ln">2632</span>        };
+</code><code id="L2633"><span class="ln">2633</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2634"><span class="ln">2634</span><span class="c">        <span class="s"> * </span>Element.attr
+</span></code><code id="L2635"><span class="ln">2635</span><span class="c">         [ method ]
+</span></code><code id="L2636"><span class="ln">2636</span><span class="c">         **
+</span></code><code id="L2637"><span class="ln">2637</span><span class="c">        <span class="s"> * </span>Sets the attributes of the element.
+</span></code><code id="L2638"><span class="ln">2638</span><span class="c">         > Parameters
+</span></code><code id="L2639"><span class="ln">2639</span><span class="c">        <span class="s"> - </span>attrName (string) attribute’s name
+</span></code><code id="L2640"><span class="ln">2640</span><span class="c">        <span class="s"> - </span>value (string) value
+</span></code><code id="L2641"><span class="ln">2641</span><span class="c">        <span class="s"> * </span>or
+</span></code><code id="L2642"><span class="ln">2642</span><span class="c">        <span class="s"> - </span>params (object) object of name/value pairs
+</span></code><code id="L2643"><span class="ln">2643</span><span class="c">        <span class="s"> * </span>or
+</span></code><code id="L2644"><span class="ln">2644</span><span class="c">        <span class="s"> - </span>attrName (string) attribute’s name
+</span></code><code id="L2645"><span class="ln">2645</span><span class="c">        <span class="s"> * </span>or
+</span></code><code id="L2646"><span class="ln">2646</span><span class="c">        <span class="s"> - </span>attrNames (array) <b>in</b> <b>this</b> <b>case</b> method returns array of current values <b>for</b> given attribute names
+</span></code><code id="L2647"><span class="ln">2647</span><span class="c">        <span class="s"> = </span>(object) @Element <b>if</b> attrsName<span class="s"> &amp; </span>value or params are passed <b>in</b>.
+</span></code><code id="L2648"><span class="ln">2648</span><span class="c">        <span class="s"> = </span>(...) value of the attribute <b>if</b> only attrsName is passed <b>in</b>.
+</span></code><code id="L2649"><span class="ln">2649</span><span class="c">        <span class="s"> = </span>(array) array of values of the attribute <b>if</b> attrsNames is passed <b>in</b>.
+</span></code><code id="L2650"><span class="ln">2650</span><span class="c">        <span class="s"> = </span>(object) object of attributes <b>if</b> nothing is passed <b>in</b>.
+</span></code><code id="L2651"><span class="ln">2651</span><span class="c">         > Possible parameters
+</span></code><code id="L2652"><span class="ln">2652</span><span class="c">         # &lt;p>Please refer to the &lt;a href=<i>"http:<span class="c">//www.w3.org/TR/SVG/"</i> title=<i>"The W3C Recommendation <b>for</b> the SVG language describes these properties <b>in</b> detail."</i>>SVG specification&lt;/a> <b>for</b> an explanation of these parameters.&lt;/p></span>
+</span></code><code id="L2653"><span class="ln">2653</span><span class="c">         o arrow-end (string) arrowhead on the end of the path. The format <b>for</b> string is `&lt;type>[-&lt;width>[-&lt;length>]]`. Possible types: `classic`, `block`, `open`, `oval`, `diamond`, `none`, width: `wide`, `narrow`, `midium`, length: `<b>long</b>`, `<b>short</b>`, `midium`.
+</span></code><code id="L2654"><span class="ln">2654</span><span class="c">         o clip-rect (string) comma or space separated values: x, y, width and height
+</span></code><code id="L2655"><span class="ln">2655</span><span class="c">         o cursor (string) CSS type of the cursor
+</span></code><code id="L2656"><span class="ln">2656</span><span class="c">         o cx (number)
+</span></code><code id="L2657"><span class="ln">2657</span><span class="c">         o cy (number)
+</span></code><code id="L2658"><span class="ln">2658</span><span class="c">         o fill (string) colour, gradient or image
+</span></code><code id="L2659"><span class="ln">2659</span><span class="c">         o fill-opacity (number)
+</span></code><code id="L2660"><span class="ln">2660</span><span class="c">         o font (string)
+</span></code><code id="L2661"><span class="ln">2661</span><span class="c">         o font-family (string)
+</span></code><code id="L2662"><span class="ln">2662</span><span class="c">         o font-size (number) font size <b>in</b> pixels
+</span></code><code id="L2663"><span class="ln">2663</span><span class="c">         o font-weight (string)
+</span></code><code id="L2664"><span class="ln">2664</span><span class="c">         o height (number)
+</span></code><code id="L2665"><span class="ln">2665</span><span class="c">         o href (string) URL, <b>if</b> specified element behaves as hyperlink
+</span></code><code id="L2666"><span class="ln">2666</span><span class="c">         o opacity (number)
+</span></code><code id="L2667"><span class="ln">2667</span><span class="c">         o path (string) SVG path string format
+</span></code><code id="L2668"><span class="ln">2668</span><span class="c">         o r (number)
+</span></code><code id="L2669"><span class="ln">2669</span><span class="c">         o rx (number)
+</span></code><code id="L2670"><span class="ln">2670</span><span class="c">         o ry (number)
+</span></code><code id="L2671"><span class="ln">2671</span><span class="c">         o src (string) image URL, only works <b>for</b> @Element.image element
+</span></code><code id="L2672"><span class="ln">2672</span><span class="c">         o stroke (string) stroke colour
+</span></code><code id="L2673"><span class="ln">2673</span><span class="c">         o stroke-dasharray (string) [“”, “`-`”, “`.`”, “`-.`”, “`-..`”, “`. `”, “`- `”, “`--`”, “`- .`”, “`--.`”, “`--..`”]
+</span></code><code id="L2674"><span class="ln">2674</span><span class="c">         o stroke-linecap (string) [“`butt`”, “`square`”, “`round`”]
+</span></code><code id="L2675"><span class="ln">2675</span><span class="c">         o stroke-linejoin (string) [“`bevel`”, “`round`”, “`miter`”]
+</span></code><code id="L2676"><span class="ln">2676</span><span class="c">         o stroke-miterlimit (number)
+</span></code><code id="L2677"><span class="ln">2677</span><span class="c">         o stroke-opacity (number)
+</span></code><code id="L2678"><span class="ln">2678</span><span class="c">         o stroke-width (number) stroke width <b>in</b> pixels, <b>default</b> is <i>'<span class="d">1</span>'</i>
+</span></code><code id="L2679"><span class="ln">2679</span><span class="c">         o target (string) used <b>with</b> href
+</span></code><code id="L2680"><span class="ln">2680</span><span class="c">         o text (string) contents of the text element. Use `\n` <b>for</b> multiline text
+</span></code><code id="L2681"><span class="ln">2681</span><span class="c">         o text-anchor (string) [“`start`”, “`middle`”, “`end`”], <b>default</b> is “`middle`”
+</span></code><code id="L2682"><span class="ln">2682</span><span class="c">         o title (string) will create tooltip <b>with</b> a given text
+</span></code><code id="L2683"><span class="ln">2683</span><span class="c">         o transform (string) see @Element.transform
+</span></code><code id="L2684"><span class="ln">2684</span><span class="c">         o width (number)
+</span></code><code id="L2685"><span class="ln">2685</span><span class="c">         o x (number)
+</span></code><code id="L2686"><span class="ln">2686</span><span class="c">         o y (number)
+</span></code><code id="L2687"><span class="ln">2687</span><span class="c">         > Gradients
+</span></code><code id="L2688"><span class="ln">2688</span><span class="c">        <span class="s"> * </span>Linear gradient format: “`‹angle›-‹colour›[-‹colour›[:‹offset›]]*-‹colour›`”, example: “`<span class="d">90</span>-#fff-#<span class="d">000</span>`” – <span class="d">90</span>°
+</span></code><code id="L2689"><span class="ln">2689</span><span class="c">        <span class="s"> * </span>gradient from white to black or “`<span class="d">0</span>-#fff-#f00:<span class="d">20</span>-#<span class="d">000</span>`” – <span class="d">0</span>° gradient from white via red (at <span class="d">20</span>%) to black.
+</span></code><code id="L2690"><span class="ln">2690</span><span class="c">         *
+</span></code><code id="L2691"><span class="ln">2691</span><span class="c">        <span class="s"> * </span>radial gradient: “`r[(‹fx›, ‹fy›)]‹colour›[-‹colour›[:‹offset›]]*-‹colour›`”, example: “`r#fff-#<span class="d">000</span>`” –
+</span></code><code id="L2692"><span class="ln">2692</span><span class="c">        <span class="s"> * </span>gradient from white to black or “`r(<span class="d">0.25</span>, <span class="d">0.75</span>)#fff-#<span class="d">000</span>`” – gradient from white to black <b>with</b> focus point
+</span></code><code id="L2693"><span class="ln">2693</span><span class="c">        <span class="s"> * </span>at <span class="d">0.25</span>, <span class="d">0.75</span>. Focus point coordinates are <b>in</b> <span class="d">0</span>.<span class="d">.1</span> range. Radial gradients can only be applied to circles and ellipses.
+</span></code><code id="L2694"><span class="ln">2694</span><span class="c">         > Path String
+</span></code><code id="L2695"><span class="ln">2695</span><span class="c">         # &lt;p>Please refer to &lt;a href=<i>"http:<span class="c">//www.w3.org/TR/SVG/paths.html#PathData"</i> title=<i>"Details of a path’s data attribute’s format are described <b>in</b> the SVG specification."</i>>SVG documentation regarding path string&lt;/a>. Raphaël fully supports it.&lt;/p></span>
+</span></code><code id="L2696"><span class="ln">2696</span><span class="c">         > Colour Parsing
+</span></code><code id="L2697"><span class="ln">2697</span><span class="c">         # &lt;ul>
+</span></code><code id="L2698"><span class="ln">2698</span><span class="c">         #     &lt;li>Colour name (“&lt;code>red&lt;/code>”, “&lt;code>green&lt;/code>”, “&lt;code>cornflowerblue&lt;/code>”, etc)&lt;/li>
+</span></code><code id="L2699"><span class="ln">2699</span><span class="c">         #     &lt;li>#••• — shortened HTML colour: (“&lt;code>#<span class="d">000</span>&lt;/code>”, “&lt;code>#fc0&lt;/code>”, etc)&lt;/li>
+</span></code><code id="L2700"><span class="ln">2700</span><span class="c">         #     &lt;li>#•••••• — full length HTML colour: (“&lt;code>#<span class="d">000000</span>&lt;/code>”, “&lt;code>#bd2300&lt;/code>”)&lt;/li>
+</span></code><code id="L2701"><span class="ln">2701</span><span class="c">         #     &lt;li>rgb(•••, •••, •••) — red, green and blue channels’ values: (“&lt;code>rgb(<span class="d">200</span>,&nbsp;<span class="d">100</span>,&nbsp;<span class="d">0</span>)&lt;/code>”)&lt;/li>
+</span></code><code id="L2702"><span class="ln">2702</span><span class="c">         #     &lt;li>rgb(•••%, •••%, •••%) — same as above, but <b>in</b> %: (“&lt;code>rgb(<span class="d">100</span>%,&nbsp;<span class="d">175</span>%,&nbsp;<span class="d">0</span>%)&lt;/code>”)&lt;/li>
+</span></code><code id="L2703"><span class="ln">2703</span><span class="c">         #     &lt;li>rgba(•••, •••, •••, •••) — red, green and blue channels’ values: (“&lt;code>rgba(<span class="d">200</span>,&nbsp;<span class="d">100</span>,&nbsp;<span class="d">0</span>, <span class="d">.5</span>)&lt;/code>”)&lt;/li>
+</span></code><code id="L2704"><span class="ln">2704</span><span class="c">         #     &lt;li>rgba(•••%, •••%, •••%, •••%) — same as above, but <b>in</b> %: (“&lt;code>rgba(<span class="d">100</span>%,&nbsp;<span class="d">175</span>%,&nbsp;<span class="d">0</span>%, <span class="d">50</span>%)&lt;/code>”)&lt;/li>
+</span></code><code id="L2705"><span class="ln">2705</span><span class="c">         #     &lt;li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“&lt;code>hsb(<span class="d">0.5</span>,&nbsp;<span class="d">0.25</span>,&nbsp;<span class="d">1</span>)&lt;/code>”)&lt;/li>
+</span></code><code id="L2706"><span class="ln">2706</span><span class="c">         #     &lt;li>hsb(•••%, •••%, •••%) — same as above, but <b>in</b> %&lt;/li>
+</span></code><code id="L2707"><span class="ln">2707</span><span class="c">         #     &lt;li>hsba(•••, •••, •••, •••) — same as above, but <b>with</b> opacity&lt;/li>
+</span></code><code id="L2708"><span class="ln">2708</span><span class="c">         #     &lt;li>hsl(•••, •••, •••) — almost the same as hsb, see &lt;a href=<i>"http:<span class="c">//en.wikipedia.org/wiki/HSL_and_HSV"</i> title=<i>"HSL and HSV<span class="s"> - </span>Wikipedia, the free encyclopedia"</i>>Wikipedia page&lt;/a>&lt;/li></span>
+</span></code><code id="L2709"><span class="ln">2709</span><span class="c">         #     &lt;li>hsl(•••%, •••%, •••%) — same as above, but <b>in</b> %&lt;/li>
+</span></code><code id="L2710"><span class="ln">2710</span><span class="c">         #     &lt;li>hsla(•••, •••, •••) — same as above, but <b>with</b> opacity&lt;/li>
+</span></code><code id="L2711"><span class="ln">2711</span><span class="c">         #     &lt;li>Optionally <b>for</b> hsb and hsl you could specify hue as a degree: “&lt;code>hsl(240deg,&nbsp;<span class="d">1</span>,&nbsp;<span class="d">.5</span>)&lt;/code>” or, <b>if</b> you want to go fancy, “&lt;code>hsl(<span class="d">240</span>°,&nbsp;<span class="d">1</span>,&nbsp;<span class="d">.5</span>)&lt;/code>”&lt;/li>
+</span></code><code id="L2712"><span class="ln">2712</span><span class="c">         # &lt;/ul>
+</span></code><code id="L2713"><span class="ln">2713</span><span class="c">        \*/</span>
+</code><code id="L2714"><span class="ln">2714</span>        elproto.attr<span class="s"> = </span><b>function</b> (name, value) {
+</code><code id="L2715"><span class="ln">2715</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L2716"><span class="ln">2716</span>                <b>return</b> <b>this</b>;
+</code><code id="L2717"><span class="ln">2717</span>            }
+</code><code id="L2718"><span class="ln">2718</span>            <b>if</b> (name<span class="s"> == </span><b>null</b>) {
+</code><code id="L2719"><span class="ln">2719</span>                <b>var</b> res<span class="s"> = </span>{};
+</code><code id="L2720"><span class="ln">2720</span>                <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>.attrs) <b>if</b> (<b>this</b>.attrs[has](i)) {
+</code><code id="L2721"><span class="ln">2721</span>                    res[i]<span class="s"> = </span><b>this</b>.attrs[i];
+</code><code id="L2722"><span class="ln">2722</span>                }
+</code><code id="L2723"><span class="ln">2723</span>                res.gradient<span class="s"> &amp;&amp; </span>res.fill<span class="s"> == </span><i>"none"</i><span class="s"> &amp;&amp; </span>(res.fill<span class="s"> = </span>res.gradient)<span class="s"> &amp;&amp; </span><b>delete</b> res.gradient;
+</code><code id="L2724"><span class="ln">2724</span>                res.transform<span class="s"> = </span><b>this</b>._.transform;
+</code><code id="L2725"><span class="ln">2725</span>                <b>return</b> res;
+</code><code id="L2726"><span class="ln">2726</span>            }
+</code><code id="L2727"><span class="ln">2727</span>            <b>if</b> (value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, string)) {
+</code><code id="L2728"><span class="ln">2728</span>                <b>if</b> (name<span class="s"> == </span>fillString<span class="s"> &amp;&amp; </span><b>this</b>.attrs.fill<span class="s"> == </span><i>"none"</i><span class="s"> &amp;&amp; </span><b>this</b>.attrs.gradient) {
+</code><code id="L2729"><span class="ln">2729</span>                    <b>return</b> <b>this</b>.attrs.gradient;
+</code><code id="L2730"><span class="ln">2730</span>                }
+</code><code id="L2731"><span class="ln">2731</span>                <b>if</b> (name<span class="s"> == </span><i>"transform"</i>) {
+</code><code id="L2732"><span class="ln">2732</span>                    <b>return</b> <b>this</b>._.transform;
+</code><code id="L2733"><span class="ln">2733</span>                }
+</code><code id="L2734"><span class="ln">2734</span>                <b>if</b> (name <b>in</b> <b>this</b>.attrs) {
+</code><code id="L2735"><span class="ln">2735</span>                    <b>return</b> <b>this</b>.attrs[name];
+</code><code id="L2736"><span class="ln">2736</span>                } <b>else</b> <b>if</b> (R.is(<b>this</b>.paper.customAttributes[name], <i>"<b>function</b>"</i>)) {
+</code><code id="L2737"><span class="ln">2737</span>                    <b>return</b> <b>this</b>.paper.customAttributes[name].def;
+</code><code id="L2738"><span class="ln">2738</span>                } <b>else</b> {
+</code><code id="L2739"><span class="ln">2739</span>                    <b>return</b> availableAttrs[name];
+</code><code id="L2740"><span class="ln">2740</span>                }
+</code><code id="L2741"><span class="ln">2741</span>            }
+</code><code id="L2742"><span class="ln">2742</span>            <b>if</b> (value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, array)) {
+</code><code id="L2743"><span class="ln">2743</span>                <b>var</b> values<span class="s"> = </span>{};
+</code><code id="L2744"><span class="ln">2744</span>                <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>name.length; j &lt; jj; j++) {
+</code><code id="L2745"><span class="ln">2745</span>                    values[name[j]]<span class="s"> = </span><b>this</b>.attr(name[j]);
+</code><code id="L2746"><span class="ln">2746</span>                }
+</code><code id="L2747"><span class="ln">2747</span>                <b>return</b> values;
+</code><code id="L2748"><span class="ln">2748</span>            }
+</code><code id="L2749"><span class="ln">2749</span>            <b>if</b> (value != <b>null</b>) {
+</code><code id="L2750"><span class="ln">2750</span>                <b>var</b> params<span class="s"> = </span>{};
+</code><code id="L2751"><span class="ln">2751</span>                params[name]<span class="s"> = </span>value;
+</code><code id="L2752"><span class="ln">2752</span>            } <b>else</b> <b>if</b> (name != <b>null</b><span class="s"> &amp;&amp; </span>R.is(name, <i>"object"</i>)) {
+</code><code id="L2753"><span class="ln">2753</span>                params<span class="s"> = </span>name;
+</code><code id="L2754"><span class="ln">2754</span>            }
+</code><code id="L2755"><span class="ln">2755</span>            <b>for</b> (<b>var</b> key <b>in</b> <b>this</b>.paper.customAttributes) <b>if</b> (<b>this</b>.paper.customAttributes[has](key)<span class="s"> &amp;&amp; </span>params[has](key)<span class="s"> &amp;&amp; </span>R.is(<b>this</b>.paper.customAttributes[key], <i>"<b>function</b>"</i>)) {
+</code><code id="L2756"><span class="ln">2756</span>                <b>var</b> par<span class="s"> = </span><b>this</b>.paper.customAttributes[key].apply(<b>this</b>, [][concat](params[key]));
+</code><code id="L2757"><span class="ln">2757</span>                <b>this</b>.attrs[key]<span class="s"> = </span>params[key];
+</code><code id="L2758"><span class="ln">2758</span>                <b>for</b> (<b>var</b> subkey <b>in</b> par) <b>if</b> (par[has](subkey)) {
+</code><code id="L2759"><span class="ln">2759</span>                    params[subkey]<span class="s"> = </span>par[subkey];
+</code><code id="L2760"><span class="ln">2760</span>                }
+</code><code id="L2761"><span class="ln">2761</span>            }
+</code><code id="L2762"><span class="ln">2762</span>            setFillAndStroke(<b>this</b>, params);
+</code><code id="L2763"><span class="ln">2763</span>            <b>return</b> <b>this</b>;
+</code><code id="L2764"><span class="ln">2764</span>        };
+</code><code id="L2765"><span class="ln">2765</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2766"><span class="ln">2766</span><span class="c">        <span class="s"> * </span>Element.toFront
+</span></code><code id="L2767"><span class="ln">2767</span><span class="c">         [ method ]
+</span></code><code id="L2768"><span class="ln">2768</span><span class="c">         **
+</span></code><code id="L2769"><span class="ln">2769</span><span class="c">        <span class="s"> * </span>Moves the element so it is the closest to the viewer’s eyes, on top of other elements.
+</span></code><code id="L2770"><span class="ln">2770</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2771"><span class="ln">2771</span><span class="c">        \*/</span>
+</code><code id="L2772"><span class="ln">2772</span>        elproto.toFront<span class="s"> = </span><b>function</b> () {
+</code><code id="L2773"><span class="ln">2773</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L2774"><span class="ln">2774</span>                <b>return</b> <b>this</b>;
+</code><code id="L2775"><span class="ln">2775</span>            }
+</code><code id="L2776"><span class="ln">2776</span>            <b>this</b>.node.parentNode.appendChild(<b>this</b>.node);
+</code><code id="L2777"><span class="ln">2777</span>            <b>var</b> svg<span class="s"> = </span><b>this</b>.paper;
+</code><code id="L2778"><span class="ln">2778</span>            svg.top != <b>this</b><span class="s"> &amp;&amp; </span>tofront(<b>this</b>, svg);
+</code><code id="L2779"><span class="ln">2779</span>            <b>return</b> <b>this</b>;
+</code><code id="L2780"><span class="ln">2780</span>        };
+</code><code id="L2781"><span class="ln">2781</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2782"><span class="ln">2782</span><span class="c">        <span class="s"> * </span>Element.toBack
+</span></code><code id="L2783"><span class="ln">2783</span><span class="c">         [ method ]
+</span></code><code id="L2784"><span class="ln">2784</span><span class="c">         **
+</span></code><code id="L2785"><span class="ln">2785</span><span class="c">        <span class="s"> * </span>Moves the element so it is the furthest from the viewer’s eyes, behind other elements.
+</span></code><code id="L2786"><span class="ln">2786</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2787"><span class="ln">2787</span><span class="c">        \*/</span>
+</code><code id="L2788"><span class="ln">2788</span>        elproto.toBack<span class="s"> = </span><b>function</b> () {
+</code><code id="L2789"><span class="ln">2789</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L2790"><span class="ln">2790</span>                <b>return</b> <b>this</b>;
+</code><code id="L2791"><span class="ln">2791</span>            }
+</code><code id="L2792"><span class="ln">2792</span>            <b>if</b> (<b>this</b>.node.parentNode.firstChild != <b>this</b>.node) {
+</code><code id="L2793"><span class="ln">2793</span>                <b>this</b>.node.parentNode.insertBefore(<b>this</b>.node, <b>this</b>.node.parentNode.firstChild);
+</code><code id="L2794"><span class="ln">2794</span>                toback(<b>this</b>, <b>this</b>.paper);
+</code><code id="L2795"><span class="ln">2795</span>                <b>var</b> svg<span class="s"> = </span><b>this</b>.paper;
+</code><code id="L2796"><span class="ln">2796</span>            }
+</code><code id="L2797"><span class="ln">2797</span>            <b>return</b> <b>this</b>;
+</code><code id="L2798"><span class="ln">2798</span>        };
+</code><code id="L2799"><span class="ln">2799</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2800"><span class="ln">2800</span><span class="c">        <span class="s"> * </span>Element.insertAfter
+</span></code><code id="L2801"><span class="ln">2801</span><span class="c">         [ method ]
+</span></code><code id="L2802"><span class="ln">2802</span><span class="c">         **
+</span></code><code id="L2803"><span class="ln">2803</span><span class="c">        <span class="s"> * </span>Inserts current object after the given one.
+</span></code><code id="L2804"><span class="ln">2804</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2805"><span class="ln">2805</span><span class="c">        \*/</span>
+</code><code id="L2806"><span class="ln">2806</span>        elproto.insertAfter<span class="s"> = </span><b>function</b> (element) {
+</code><code id="L2807"><span class="ln">2807</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L2808"><span class="ln">2808</span>                <b>return</b> <b>this</b>;
+</code><code id="L2809"><span class="ln">2809</span>            }
+</code><code id="L2810"><span class="ln">2810</span>            <b>var</b> node<span class="s"> = </span>element.node<span class="s"> || </span>element[element.length<span class="s"> - </span><span class="d">1</span>].node;
+</code><code id="L2811"><span class="ln">2811</span>            <b>if</b> (node.nextSibling) {
+</code><code id="L2812"><span class="ln">2812</span>                node.parentNode.insertBefore(<b>this</b>.node, node.nextSibling);
+</code><code id="L2813"><span class="ln">2813</span>            } <b>else</b> {
+</code><code id="L2814"><span class="ln">2814</span>                node.parentNode.appendChild(<b>this</b>.node);
+</code><code id="L2815"><span class="ln">2815</span>            }
+</code><code id="L2816"><span class="ln">2816</span>            insertafter(<b>this</b>, element, <b>this</b>.paper);
+</code><code id="L2817"><span class="ln">2817</span>            <b>return</b> <b>this</b>;
+</code><code id="L2818"><span class="ln">2818</span>        };
+</code><code id="L2819"><span class="ln">2819</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2820"><span class="ln">2820</span><span class="c">        <span class="s"> * </span>Element.insertBefore
+</span></code><code id="L2821"><span class="ln">2821</span><span class="c">         [ method ]
+</span></code><code id="L2822"><span class="ln">2822</span><span class="c">         **
+</span></code><code id="L2823"><span class="ln">2823</span><span class="c">        <span class="s"> * </span>Inserts current object before the given one.
+</span></code><code id="L2824"><span class="ln">2824</span><span class="c">        <span class="s"> = </span>(object) @Element
+</span></code><code id="L2825"><span class="ln">2825</span><span class="c">        \*/</span>
+</code><code id="L2826"><span class="ln">2826</span>        elproto.insertBefore<span class="s"> = </span><b>function</b> (element) {
+</code><code id="L2827"><span class="ln">2827</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L2828"><span class="ln">2828</span>                <b>return</b> <b>this</b>;
+</code><code id="L2829"><span class="ln">2829</span>            }
+</code><code id="L2830"><span class="ln">2830</span>            <b>var</b> node<span class="s"> = </span>element.node<span class="s"> || </span>element[<span class="d">0</span>].node;
+</code><code id="L2831"><span class="ln">2831</span>            node.parentNode.insertBefore(<b>this</b>.node, node);
+</code><code id="L2832"><span class="ln">2832</span>            insertbefore(<b>this</b>, element, <b>this</b>.paper);
+</code><code id="L2833"><span class="ln">2833</span>            <b>return</b> <b>this</b>;
+</code><code id="L2834"><span class="ln">2834</span>        };
+</code><code id="L2835"><span class="ln">2835</span>        elproto.blur<span class="s"> = </span><b>function</b> (size) {
+</code><code id="L2836"><span class="ln">2836</span>            <span class="c">// Experimental. No Safari support. Use it on your own risk.</span>
+</code><code id="L2837"><span class="ln">2837</span>            <b>var</b> t<span class="s"> = </span><b>this</b>;
+</code><code id="L2838"><span class="ln">2838</span>            <b>if</b> (+size !== <span class="d">0</span>) {
+</code><code id="L2839"><span class="ln">2839</span>                <b>var</b> fltr<span class="s"> = </span>$(<i>"filter"</i>),
+</code><code id="L2840"><span class="ln">2840</span>                    blur<span class="s"> = </span>$(<i>"feGaussianBlur"</i>);
+</code><code id="L2841"><span class="ln">2841</span>                t.attrs.blur<span class="s"> = </span>size;
+</code><code id="L2842"><span class="ln">2842</span>                fltr.id<span class="s"> = </span>createUUID();
+</code><code id="L2843"><span class="ln">2843</span>                $(blur, {stdDeviation: +size<span class="s"> || </span><span class="d">1.5</span>});
+</code><code id="L2844"><span class="ln">2844</span>                fltr.appendChild(blur);
+</code><code id="L2845"><span class="ln">2845</span>                t.paper.defs.appendChild(fltr);
+</code><code id="L2846"><span class="ln">2846</span>                t._blur<span class="s"> = </span>fltr;
+</code><code id="L2847"><span class="ln">2847</span>                $(t.node, {filter: <i>"url(#"</i><span class="s"> + </span>fltr.id<span class="s"> + </span><i>")"</i>});
+</code><code id="L2848"><span class="ln">2848</span>            } <b>else</b> {
+</code><code id="L2849"><span class="ln">2849</span>                <b>if</b> (t._blur) {
+</code><code id="L2850"><span class="ln">2850</span>                    t._blur.parentNode.removeChild(t._blur);
+</code><code id="L2851"><span class="ln">2851</span>                    <b>delete</b> t._blur;
+</code><code id="L2852"><span class="ln">2852</span>                    <b>delete</b> t.attrs.blur;
+</code><code id="L2853"><span class="ln">2853</span>                }
+</code><code id="L2854"><span class="ln">2854</span>                t.node.removeAttribute(<i>"filter"</i>);
+</code><code id="L2855"><span class="ln">2855</span>            }
+</code><code id="L2856"><span class="ln">2856</span>        };
+</code><code id="L2857"><span class="ln">2857</span>        <b>var</b> theCircle<span class="s"> = </span><b>function</b> (svg, x, y, r) {
+</code><code id="L2858"><span class="ln">2858</span>            <b>var</b> el<span class="s"> = </span>$(<i>"circle"</i>);
+</code><code id="L2859"><span class="ln">2859</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
+</code><code id="L2860"><span class="ln">2860</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
+</code><code id="L2861"><span class="ln">2861</span>            res.attrs<span class="s"> = </span>{cx: x, cy: y, r: r, fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>};
+</code><code id="L2862"><span class="ln">2862</span>            res.type<span class="s"> = </span><i>"circle"</i>;
+</code><code id="L2863"><span class="ln">2863</span>            $(el, res.attrs);
+</code><code id="L2864"><span class="ln">2864</span>            <b>return</b> res;
+</code><code id="L2865"><span class="ln">2865</span>        },
+</code><code id="L2866"><span class="ln">2866</span>        theRect<span class="s"> = </span><b>function</b> (svg, x, y, w, h, r) {
+</code><code id="L2867"><span class="ln">2867</span>            <b>var</b> el<span class="s"> = </span>$(<i>"rect"</i>);
+</code><code id="L2868"><span class="ln">2868</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
+</code><code id="L2869"><span class="ln">2869</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
+</code><code id="L2870"><span class="ln">2870</span>            res.attrs<span class="s"> = </span>{x: x, y: y, width: w, height: h, r: r<span class="s"> || </span><span class="d">0</span>, rx: r<span class="s"> || </span><span class="d">0</span>, ry: r<span class="s"> || </span><span class="d">0</span>, fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>};
+</code><code id="L2871"><span class="ln">2871</span>            res.type<span class="s"> = </span><i>"rect"</i>;
+</code><code id="L2872"><span class="ln">2872</span>            $(el, res.attrs);
+</code><code id="L2873"><span class="ln">2873</span>            <b>return</b> res;
+</code><code id="L2874"><span class="ln">2874</span>        },
+</code><code id="L2875"><span class="ln">2875</span>        theEllipse<span class="s"> = </span><b>function</b> (svg, x, y, rx, ry) {
+</code><code id="L2876"><span class="ln">2876</span>            <b>var</b> el<span class="s"> = </span>$(<i>"ellipse"</i>);
+</code><code id="L2877"><span class="ln">2877</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
+</code><code id="L2878"><span class="ln">2878</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
+</code><code id="L2879"><span class="ln">2879</span>            res.attrs<span class="s"> = </span>{cx: x, cy: y, rx: rx, ry: ry, fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>};
+</code><code id="L2880"><span class="ln">2880</span>            res.type<span class="s"> = </span><i>"ellipse"</i>;
+</code><code id="L2881"><span class="ln">2881</span>            $(el, res.attrs);
+</code><code id="L2882"><span class="ln">2882</span>            <b>return</b> res;
+</code><code id="L2883"><span class="ln">2883</span>        },
+</code><code id="L2884"><span class="ln">2884</span>        theImage<span class="s"> = </span><b>function</b> (svg, src, x, y, w, h) {
+</code><code id="L2885"><span class="ln">2885</span>            <b>var</b> el<span class="s"> = </span>$(<i>"image"</i>);
+</code><code id="L2886"><span class="ln">2886</span>            $(el, {x: x, y: y, width: w, height: h, preserveAspectRatio: <i>"none"</i>});
+</code><code id="L2887"><span class="ln">2887</span>            el.setAttributeNS(xlink, <i>"href"</i>, src);
+</code><code id="L2888"><span class="ln">2888</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
+</code><code id="L2889"><span class="ln">2889</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
+</code><code id="L2890"><span class="ln">2890</span>            res.attrs<span class="s"> = </span>{x: x, y: y, width: w, height: h, src: src};
+</code><code id="L2891"><span class="ln">2891</span>            res.type<span class="s"> = </span><i>"image"</i>;
+</code><code id="L2892"><span class="ln">2892</span>            <b>return</b> res;
+</code><code id="L2893"><span class="ln">2893</span>        },
+</code><code id="L2894"><span class="ln">2894</span>        theText<span class="s"> = </span><b>function</b> (svg, x, y, text) {
+</code><code id="L2895"><span class="ln">2895</span>            <b>var</b> el<span class="s"> = </span>$(<i>"text"</i>);
+</code><code id="L2896"><span class="ln">2896</span>            $(el, {x: x, y: y, <i>"text-anchor"</i>: <i>"middle"</i>});
+</code><code id="L2897"><span class="ln">2897</span>            svg.canvas<span class="s"> &amp;&amp; </span>svg.canvas.appendChild(el);
+</code><code id="L2898"><span class="ln">2898</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Element(el, svg);
+</code><code id="L2899"><span class="ln">2899</span>            res.attrs<span class="s"> = </span>{x: x, y: y, <i>"text-anchor"</i>: <i>"middle"</i>, text: text, font: availableAttrs.font, stroke: <i>"none"</i>, fill: <i>"#<span class="d">000</span>"</i>};
+</code><code id="L2900"><span class="ln">2900</span>            res.type<span class="s"> = </span><i>"text"</i>;
+</code><code id="L2901"><span class="ln">2901</span>            setFillAndStroke(res, res.attrs);
+</code><code id="L2902"><span class="ln">2902</span>            <b>return</b> res;
+</code><code id="L2903"><span class="ln">2903</span>        },
+</code><code id="L2904"><span class="ln">2904</span>        setSize<span class="s"> = </span><b>function</b> (width, height) {
+</code><code id="L2905"><span class="ln">2905</span>            <b>this</b>.width<span class="s"> = </span>width<span class="s"> || </span><b>this</b>.width;
+</code><code id="L2906"><span class="ln">2906</span>            <b>this</b>.height<span class="s"> = </span>height<span class="s"> || </span><b>this</b>.height;
+</code><code id="L2907"><span class="ln">2907</span>            <b>this</b>.canvas[setAttribute](<i>"width"</i>, <b>this</b>.width);
+</code><code id="L2908"><span class="ln">2908</span>            <b>this</b>.canvas[setAttribute](<i>"height"</i>, <b>this</b>.height);
+</code><code id="L2909"><span class="ln">2909</span>            <b>if</b> (<b>this</b>._viewBox) {
+</code><code id="L2910"><span class="ln">2910</span>                <b>this</b>.setViewBox.apply(<b>this</b>, <b>this</b>._viewBox);
+</code><code id="L2911"><span class="ln">2911</span>            }
+</code><code id="L2912"><span class="ln">2912</span>            <b>return</b> <b>this</b>;
+</code><code id="L2913"><span class="ln">2913</span>        },
+</code><code id="L2914"><span class="ln">2914</span>        create<span class="s"> = </span><b>function</b> () {
+</code><code id="L2915"><span class="ln">2915</span>            <b>var</b> con<span class="s"> = </span>getContainer[apply](<span class="d">0</span>, arguments),
+</code><code id="L2916"><span class="ln">2916</span>                container<span class="s"> = </span>con<span class="s"> &amp;&amp; </span>con.container,
+</code><code id="L2917"><span class="ln">2917</span>                x<span class="s"> = </span>con.x,
+</code><code id="L2918"><span class="ln">2918</span>                y<span class="s"> = </span>con.y,
+</code><code id="L2919"><span class="ln">2919</span>                width<span class="s"> = </span>con.width,
+</code><code id="L2920"><span class="ln">2920</span>                height<span class="s"> = </span>con.height;
+</code><code id="L2921"><span class="ln">2921</span>            <b>if</b> (!container) {
+</code><code id="L2922"><span class="ln">2922</span>                <b>throw</b> <b>new</b> Error(<i>"SVG container not found."</i>);
+</code><code id="L2923"><span class="ln">2923</span>            }
+</code><code id="L2924"><span class="ln">2924</span>            <b>var</b> cnvs<span class="s"> = </span>$(<i>"svg"</i>),
+</code><code id="L2925"><span class="ln">2925</span>                css<span class="s"> = </span><i>"overflow:hidden;"</i>;
+</code><code id="L2926"><span class="ln">2926</span>            x<span class="s"> = </span>x<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L2927"><span class="ln">2927</span>            y<span class="s"> = </span>y<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L2928"><span class="ln">2928</span>            width<span class="s"> = </span>width<span class="s"> || </span><span class="d">512</span>;
+</code><code id="L2929"><span class="ln">2929</span>            height<span class="s"> = </span>height<span class="s"> || </span><span class="d">342</span>;
+</code><code id="L2930"><span class="ln">2930</span>            $(cnvs, {
+</code><code id="L2931"><span class="ln">2931</span>                height: height,
+</code><code id="L2932"><span class="ln">2932</span>                version: <span class="d">1.1</span>,
+</code><code id="L2933"><span class="ln">2933</span>                width: width,
+</code><code id="L2934"><span class="ln">2934</span>                xmlns: <i>"http:<span class="c">//www.w3.org/<span class="d">2000</span>/svg"</i></span>
+</code><code id="L2935"><span class="ln">2935</span>            });
+</code><code id="L2936"><span class="ln">2936</span>            <b>if</b> (container<span class="s"> == </span><span class="d">1</span>) {
+</code><code id="L2937"><span class="ln">2937</span>                cnvs.style.cssText<span class="s"> = </span>css<span class="s"> + </span><i>"position:absolute;left:"</i><span class="s"> + </span>x<span class="s"> + </span><i>"px;top:"</i><span class="s"> + </span>y<span class="s"> + </span><i>"px"</i>;
+</code><code id="L2938"><span class="ln">2938</span>                g.doc.body.appendChild(cnvs);
+</code><code id="L2939"><span class="ln">2939</span>            } <b>else</b> {
+</code><code id="L2940"><span class="ln">2940</span>                cnvs.style.cssText<span class="s"> = </span>css;
+</code><code id="L2941"><span class="ln">2941</span>                <b>if</b> (container.firstChild) {
+</code><code id="L2942"><span class="ln">2942</span>                    container.insertBefore(cnvs, container.firstChild);
+</code><code id="L2943"><span class="ln">2943</span>                } <b>else</b> {
+</code><code id="L2944"><span class="ln">2944</span>                    container.appendChild(cnvs);
+</code><code id="L2945"><span class="ln">2945</span>                }
+</code><code id="L2946"><span class="ln">2946</span>            }
+</code><code id="L2947"><span class="ln">2947</span>            container<span class="s"> = </span><b>new</b> Paper;
+</code><code id="L2948"><span class="ln">2948</span>            container.width<span class="s"> = </span>width;
+</code><code id="L2949"><span class="ln">2949</span>            container.height<span class="s"> = </span>height;
+</code><code id="L2950"><span class="ln">2950</span>            container.canvas<span class="s"> = </span>cnvs;
+</code><code id="L2951"><span class="ln">2951</span>            plugins.call(container, container, R.fn);
+</code><code id="L2952"><span class="ln">2952</span>            container.clear();
+</code><code id="L2953"><span class="ln">2953</span>            <b>return</b> container;
+</code><code id="L2954"><span class="ln">2954</span>        },
+</code><code id="L2955"><span class="ln">2955</span>        setViewBox<span class="s"> = </span><b>function</b> (x, y, w, h, fit) {
+</code><code id="L2956"><span class="ln">2956</span>            eve(<i>"setViewBox"</i>, <b>this</b>, <b>this</b>._viewBox, [x, y, w, h, fit]);
+</code><code id="L2957"><span class="ln">2957</span>            <b>var</b> size<span class="s"> = </span>mmax(w<span class="s"> / </span><b>this</b>.width, h<span class="s"> / </span><b>this</b>.height),
+</code><code id="L2958"><span class="ln">2958</span>                top<span class="s"> = </span><b>this</b>.top,
+</code><code id="L2959"><span class="ln">2959</span>                aspectRatio<span class="s"> = </span>fit ? <i>"meet"</i> : <i>"xMinYMin"</i>,
+</code><code id="L2960"><span class="ln">2960</span>                vb,
+</code><code id="L2961"><span class="ln">2961</span>                sw;
+</code><code id="L2962"><span class="ln">2962</span>            <b>if</b> (x<span class="s"> == </span><b>null</b>) {
+</code><code id="L2963"><span class="ln">2963</span>                <b>if</b> (<b>this</b>._vbSize) {
+</code><code id="L2964"><span class="ln">2964</span>                    size<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2965"><span class="ln">2965</span>                }
+</code><code id="L2966"><span class="ln">2966</span>                <b>delete</b> <b>this</b>._vbSize;
+</code><code id="L2967"><span class="ln">2967</span>                vb<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span> "</i><span class="s"> + </span><b>this</b>.width<span class="s"> + </span>S<span class="s"> + </span><b>this</b>.height;
+</code><code id="L2968"><span class="ln">2968</span>            } <b>else</b> {
+</code><code id="L2969"><span class="ln">2969</span>                <b>this</b>._vbSize<span class="s"> = </span>size;
+</code><code id="L2970"><span class="ln">2970</span>                vb<span class="s"> = </span>x<span class="s"> + </span>S<span class="s"> + </span>y<span class="s"> + </span>S<span class="s"> + </span>w<span class="s"> + </span>S<span class="s"> + </span>h;
+</code><code id="L2971"><span class="ln">2971</span>            }
+</code><code id="L2972"><span class="ln">2972</span>            $(<b>this</b>.canvas, {
+</code><code id="L2973"><span class="ln">2973</span>                viewBox: vb,
+</code><code id="L2974"><span class="ln">2974</span>                preserveAspectRatio: aspectRatio
+</code><code id="L2975"><span class="ln">2975</span>            });
+</code><code id="L2976"><span class="ln">2976</span>            <b>while</b> (size<span class="s"> &amp;&amp; </span>top) {
+</code><code id="L2977"><span class="ln">2977</span>                sw<span class="s"> = </span><i>"stroke-width"</i> <b>in</b> top.attrs ? top.attrs[<i>"stroke-width"</i>] : <span class="d">1</span>;
+</code><code id="L2978"><span class="ln">2978</span>                top.attr({<i>"stroke-width"</i>: sw});
+</code><code id="L2979"><span class="ln">2979</span>                top._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2980"><span class="ln">2980</span>                top._.dirtyT<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L2981"><span class="ln">2981</span>                top<span class="s"> = </span>top.prev;
+</code><code id="L2982"><span class="ln">2982</span>            }
+</code><code id="L2983"><span class="ln">2983</span>            <b>this</b>._viewBox<span class="s"> = </span>[x, y, w, h, !!fit];
+</code><code id="L2984"><span class="ln">2984</span>            <b>return</b> <b>this</b>;
+</code><code id="L2985"><span class="ln">2985</span>        };
+</code><code id="L2986"><span class="ln">2986</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L2987"><span class="ln">2987</span><span class="c">        <span class="s"> * </span>Paper.clear
+</span></code><code id="L2988"><span class="ln">2988</span><span class="c">         [ method ]
+</span></code><code id="L2989"><span class="ln">2989</span><span class="c">         **
+</span></code><code id="L2990"><span class="ln">2990</span><span class="c">        <span class="s"> * </span>Clears the paper, i.e. removes all the elements.
+</span></code><code id="L2991"><span class="ln">2991</span><span class="c">        \*/</span>
+</code><code id="L2992"><span class="ln">2992</span>        paperproto.clear<span class="s"> = </span><b>function</b> () {
+</code><code id="L2993"><span class="ln">2993</span>            eve(<i>"clear"</i>, <b>this</b>);
+</code><code id="L2994"><span class="ln">2994</span>            <b>var</b> c<span class="s"> = </span><b>this</b>.canvas;
+</code><code id="L2995"><span class="ln">2995</span>            <b>while</b> (c.firstChild) {
+</code><code id="L2996"><span class="ln">2996</span>                c.removeChild(c.firstChild);
+</code><code id="L2997"><span class="ln">2997</span>            }
+</code><code id="L2998"><span class="ln">2998</span>            <b>this</b>.bottom<span class="s"> = </span><b>this</b>.top<span class="s"> = </span><b>null</b>;
+</code><code id="L2999"><span class="ln">2999</span>            (<b>this</b>.desc<span class="s"> = </span>$(<i>"desc"</i>)).appendChild(g.doc.createTextNode(<i>"Created <b>with</b> Rapha\xebl "</i><span class="s"> + </span>R.version));
+</code><code id="L3000"><span class="ln">3000</span>            c.appendChild(<b>this</b>.desc);
+</code><code id="L3001"><span class="ln">3001</span>            c.appendChild(<b>this</b>.defs<span class="s"> = </span>$(<i>"defs"</i>));
+</code><code id="L3002"><span class="ln">3002</span>        };
+</code><code id="L3003"><span class="ln">3003</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L3004"><span class="ln">3004</span><span class="c">        <span class="s"> * </span>Paper.remove
+</span></code><code id="L3005"><span class="ln">3005</span><span class="c">         [ method ]
+</span></code><code id="L3006"><span class="ln">3006</span><span class="c">         **
+</span></code><code id="L3007"><span class="ln">3007</span><span class="c">        <span class="s"> * </span>Removes the paper from the DOM.
+</span></code><code id="L3008"><span class="ln">3008</span><span class="c">        \*/</span>
+</code><code id="L3009"><span class="ln">3009</span>        paperproto.remove<span class="s"> = </span><b>function</b> () {
+</code><code id="L3010"><span class="ln">3010</span>            eve(<i>"remove"</i>, <b>this</b>);
+</code><code id="L3011"><span class="ln">3011</span>            <b>this</b>.canvas.parentNode<span class="s"> &amp;&amp; </span><b>this</b>.canvas.parentNode.removeChild(<b>this</b>.canvas);
+</code><code id="L3012"><span class="ln">3012</span>            <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
+</code><code id="L3013"><span class="ln">3013</span>                <b>this</b>[i]<span class="s"> = </span>removed(i);
+</code><code id="L3014"><span class="ln">3014</span>            }
+</code><code id="L3015"><span class="ln">3015</span>        };
+</code><code id="L3016"><span class="ln">3016</span>    }
+</code><code id="L3017"><span class="ln">3017</span>
+</code><code id="L3018"><span class="ln">3018</span>    <span class="c">// VML</span>
+</code><code id="L3019"><span class="ln">3019</span>    <b>if</b> (R.vml) {
+</code><code id="L3020"><span class="ln">3020</span>        <b>var</b> map<span class="s"> = </span>{M: <i>"m"</i>, L: <i>"l"</i>, C: <i>"c"</i>, Z: <i>"x"</i>, m: <i>"t"</i>, l: <i>"r"</i>, c: <i>"v"</i>, z: <i>"x"</i>},
+</code><code id="L3021"><span class="ln">3021</span>            bites<span class="s"> = </span>/([clmz]),?([^clmz]*)/gi,
+</code><code id="L3022"><span class="ln">3022</span>            blurregexp<span class="s"> = </span>/ progid:\S+Blur\([^\)]+\)/g,
+</code><code id="L3023"><span class="ln">3023</span>            val<span class="s"> = </span>/-?[^,\s-]+/g,
+</code><code id="L3024"><span class="ln">3024</span>            cssDot<span class="s"> = </span><i>"position:absolute;left:<span class="d">0</span>;top:<span class="d">0</span>;width:1px;height:1px"</i>,
+</code><code id="L3025"><span class="ln">3025</span>            zoom<span class="s"> = </span><span class="d">21600</span>,
+</code><code id="L3026"><span class="ln">3026</span>            pathTypes<span class="s"> = </span>{path: <span class="d">1</span>, rect: <span class="d">1</span>},
+</code><code id="L3027"><span class="ln">3027</span>            ovalTypes<span class="s"> = </span>{circle: <span class="d">1</span>, ellipse: <span class="d">1</span>},
+</code><code id="L3028"><span class="ln">3028</span>            path2vml<span class="s"> = </span><b>function</b> (path) {
+</code><code id="L3029"><span class="ln">3029</span>                <b>var</b> total<span class="s"> = </span> /[ahqstv]/ig,
+</code><code id="L3030"><span class="ln">3030</span>                    command<span class="s"> = </span>pathToAbsolute;
+</code><code id="L3031"><span class="ln">3031</span>                Str(path).match(total)<span class="s"> &amp;&amp; </span>(command<span class="s"> = </span>path2curve);
+</code><code id="L3032"><span class="ln">3032</span>                total<span class="s"> = </span>/[clmz]/g;
+</code><code id="L3033"><span class="ln">3033</span>                <b>if</b> (command<span class="s"> == </span>pathToAbsolute<span class="s"> &amp;&amp; </span>!Str(path).match(total)) {
+</code><code id="L3034"><span class="ln">3034</span>                    <b>var</b> res<span class="s"> = </span>Str(path).replace(bites, <b>function</b> (all, command, args) {
+</code><code id="L3035"><span class="ln">3035</span>                        <b>var</b> vals<span class="s"> = </span>[],
+</code><code id="L3036"><span class="ln">3036</span>                            isMove<span class="s"> = </span>lowerCase.call(command)<span class="s"> == </span><i>"m"</i>,
+</code><code id="L3037"><span class="ln">3037</span>                            res<span class="s"> = </span>map[command];
+</code><code id="L3038"><span class="ln">3038</span>                        args.replace(val, <b>function</b> (value) {
+</code><code id="L3039"><span class="ln">3039</span>                            <b>if</b> (isMove<span class="s"> &amp;&amp; </span>vals.length<span class="s"> == </span><span class="d">2</span>) {
+</code><code id="L3040"><span class="ln">3040</span>                                res += vals<span class="s"> + </span>map[command<span class="s"> == </span><i>"m"</i> ? <i>"l"</i> : <i>"L"</i>];
+</code><code id="L3041"><span class="ln">3041</span>                                vals<span class="s"> = </span>[];
+</code><code id="L3042"><span class="ln">3042</span>                            }
+</code><code id="L3043"><span class="ln">3043</span>                            vals.push(round(value<span class="s"> * </span>zoom));
+</code><code id="L3044"><span class="ln">3044</span>                        });
+</code><code id="L3045"><span class="ln">3045</span>                        <b>return</b> res<span class="s"> + </span>vals;
+</code><code id="L3046"><span class="ln">3046</span>                    });
+</code><code id="L3047"><span class="ln">3047</span>                    <b>return</b> res;
+</code><code id="L3048"><span class="ln">3048</span>                }
+</code><code id="L3049"><span class="ln">3049</span>                <b>var</b> pa<span class="s"> = </span>command(path), p, r;
+</code><code id="L3050"><span class="ln">3050</span>                res<span class="s"> = </span>[];
+</code><code id="L3051"><span class="ln">3051</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>pa.length; i &lt; ii; i++) {
+</code><code id="L3052"><span class="ln">3052</span>                    p<span class="s"> = </span>pa[i];
+</code><code id="L3053"><span class="ln">3053</span>                    r<span class="s"> = </span>lowerCase.call(pa[i][<span class="d">0</span>]);
+</code><code id="L3054"><span class="ln">3054</span>                    r<span class="s"> == </span><i>"z"</i><span class="s"> &amp;&amp; </span>(r<span class="s"> = </span><i>"x"</i>);
+</code><code id="L3055"><span class="ln">3055</span>                    <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>p.length; j &lt; jj; j++) {
+</code><code id="L3056"><span class="ln">3056</span>                        r += round(p[j]<span class="s"> * </span>zoom)<span class="s"> + </span>(j != jj<span class="s"> - </span><span class="d">1</span> ? <i>","</i> : E);
+</code><code id="L3057"><span class="ln">3057</span>                    }
+</code><code id="L3058"><span class="ln">3058</span>                    res.push(r);
+</code><code id="L3059"><span class="ln">3059</span>                }
+</code><code id="L3060"><span class="ln">3060</span>                <b>return</b> res.join(S);
+</code><code id="L3061"><span class="ln">3061</span>            },
+</code><code id="L3062"><span class="ln">3062</span>            compensation<span class="s"> = </span><b>function</b> (deg, dx, dy) {
+</code><code id="L3063"><span class="ln">3063</span>                <b>var</b> m<span class="s"> = </span><b>new</b> Matrix;
+</code><code id="L3064"><span class="ln">3064</span>                m.rotate(-deg, <span class="d">.5</span>, <span class="d">.5</span>);
+</code><code id="L3065"><span class="ln">3065</span>                <b>return</b> {
+</code><code id="L3066"><span class="ln">3066</span>                    dx: m.x(dx, dy),
+</code><code id="L3067"><span class="ln">3067</span>                    dy: m.y(dx, dy)
+</code><code id="L3068"><span class="ln">3068</span>                };
+</code><code id="L3069"><span class="ln">3069</span>            },
+</code><code id="L3070"><span class="ln">3070</span>            setCoords<span class="s"> = </span><b>function</b> (p) {
+</code><code id="L3071"><span class="ln">3071</span>                <b>var</b> _<span class="s"> = </span>p._,
+</code><code id="L3072"><span class="ln">3072</span>                    sx<span class="s"> = </span>_.sx,
+</code><code id="L3073"><span class="ln">3073</span>                    sy<span class="s"> = </span>_.sy,
+</code><code id="L3074"><span class="ln">3074</span>                    deg<span class="s"> = </span>_.deg,
+</code><code id="L3075"><span class="ln">3075</span>                    dx<span class="s"> = </span>_.dx,
+</code><code id="L3076"><span class="ln">3076</span>                    dy<span class="s"> = </span>_.dy,
+</code><code id="L3077"><span class="ln">3077</span>                    fillpos<span class="s"> = </span>_.fillpos,
+</code><code id="L3078"><span class="ln">3078</span>                    o<span class="s"> = </span>p.node,
+</code><code id="L3079"><span class="ln">3079</span>                    s<span class="s"> = </span>o.style,
+</code><code id="L3080"><span class="ln">3080</span>                    y<span class="s"> = </span><span class="d">1</span>,
+</code><code id="L3081"><span class="ln">3081</span>                    m<span class="s"> = </span>p.matrix,
+</code><code id="L3082"><span class="ln">3082</span>                    flip<span class="s"> = </span><i>""</i>,
+</code><code id="L3083"><span class="ln">3083</span>                    dxdy,
+</code><code id="L3084"><span class="ln">3084</span>                    kx<span class="s"> = </span>zoom<span class="s"> / </span>sx,
+</code><code id="L3085"><span class="ln">3085</span>                    ky<span class="s"> = </span>zoom<span class="s"> / </span>sy;
+</code><code id="L3086"><span class="ln">3086</span>                s.visibility<span class="s"> = </span><i>"hidden"</i>;
+</code><code id="L3087"><span class="ln">3087</span>                o.coordsize<span class="s"> = </span>abs(kx)<span class="s"> + </span>S<span class="s"> + </span>abs(ky);
+</code><code id="L3088"><span class="ln">3088</span>                s.rotation<span class="s"> = </span>deg<span class="s"> * </span>(sx<span class="s"> * </span>sy &lt; <span class="d">0</span> ? -<span class="d">1</span> : <span class="d">1</span>);
+</code><code id="L3089"><span class="ln">3089</span>                <b>if</b> (deg) {
+</code><code id="L3090"><span class="ln">3090</span>                    <b>var</b> c<span class="s"> = </span>compensation(deg, dx, dy);
+</code><code id="L3091"><span class="ln">3091</span>                    dx<span class="s"> = </span>c.dx;
+</code><code id="L3092"><span class="ln">3092</span>                    dy<span class="s"> = </span>c.dy;
+</code><code id="L3093"><span class="ln">3093</span>                }
+</code><code id="L3094"><span class="ln">3094</span>                sx &lt; <span class="d">0</span><span class="s"> &amp;&amp; </span>(flip += <i>"x"</i>);
+</code><code id="L3095"><span class="ln">3095</span>                sy &lt; <span class="d">0</span><span class="s"> &amp;&amp; </span>(flip += <i>" y"</i>)<span class="s"> &amp;&amp; </span>(y<span class="s"> = </span>-<span class="d">1</span>);
+</code><code id="L3096"><span class="ln">3096</span>                s.flip<span class="s"> = </span>flip;
+</code><code id="L3097"><span class="ln">3097</span>                o.coordorigin<span class="s"> = </span>(dx<span class="s"> * </span>-kx)<span class="s"> + </span>S<span class="s"> + </span>(dy<span class="s"> * </span>-ky);
+</code><code id="L3098"><span class="ln">3098</span>                <b>if</b> (fillpos<span class="s"> || </span>_.fillsize) {
+</code><code id="L3099"><span class="ln">3099</span>                    <b>var</b> fill<span class="s"> = </span>o.getElementsByTagName(fillString);
+</code><code id="L3100"><span class="ln">3100</span>                    fill<span class="s"> = </span>fill<span class="s"> &amp;&amp; </span>fill[<span class="d">0</span>];
+</code><code id="L3101"><span class="ln">3101</span>                    o.removeChild(fill);
+</code><code id="L3102"><span class="ln">3102</span>                    <b>if</b> (fillpos) {
+</code><code id="L3103"><span class="ln">3103</span>                        c<span class="s"> = </span>compensation(deg, m.x(fillpos[<span class="d">0</span>], fillpos[<span class="d">1</span>]), m.y(fillpos[<span class="d">0</span>], fillpos[<span class="d">1</span>]));
+</code><code id="L3104"><span class="ln">3104</span>                        fill.position<span class="s"> = </span>c.dx<span class="s"> * </span>y<span class="s"> + </span>S<span class="s"> + </span>c.dy<span class="s"> * </span>y;
+</code><code id="L3105"><span class="ln">3105</span>                    }
+</code><code id="L3106"><span class="ln">3106</span>                    <b>if</b> (_.fillsize) {
+</code><code id="L3107"><span class="ln">3107</span>                        fill.size<span class="s"> = </span>_.fillsize[<span class="d">0</span>]<span class="s"> * </span>abs(sx)<span class="s"> + </span>S<span class="s"> + </span>_.fillsize[<span class="d">1</span>]<span class="s"> * </span>abs(sy);
+</code><code id="L3108"><span class="ln">3108</span>                    }
+</code><code id="L3109"><span class="ln">3109</span>                    o.appendChild(fill);
+</code><code id="L3110"><span class="ln">3110</span>                }
+</code><code id="L3111"><span class="ln">3111</span>                s.visibility<span class="s"> = </span><i>"visible"</i>;
+</code><code id="L3112"><span class="ln">3112</span>            };
+</code><code id="L3113"><span class="ln">3113</span>        R.toString<span class="s"> = </span><b>function</b> () {
+</code><code id="L3114"><span class="ln">3114</span>            <b>return</b>  <i>"Your browser doesn\u2019t support SVG. Falling down to VML.\nYou are running Rapha\xebl "</i><span class="s"> + </span><b>this</b>.version;
+</code><code id="L3115"><span class="ln">3115</span>        };
+</code><code id="L3116"><span class="ln">3116</span>        addArrow<span class="s"> = </span><b>function</b> (o, value, isEnd) {
+</code><code id="L3117"><span class="ln">3117</span>            <b>var</b> values<span class="s"> = </span>Str(value).toLowerCase().split(<i>"-"</i>),
+</code><code id="L3118"><span class="ln">3118</span>                se<span class="s"> = </span>isEnd ? <i>"end"</i> : <i>"start"</i>,
+</code><code id="L3119"><span class="ln">3119</span>                i<span class="s"> = </span>values.length,
+</code><code id="L3120"><span class="ln">3120</span>                type<span class="s"> = </span><i>"classic"</i>,
+</code><code id="L3121"><span class="ln">3121</span>                w<span class="s"> = </span><i>"medium"</i>,
+</code><code id="L3122"><span class="ln">3122</span>                h<span class="s"> = </span><i>"medium"</i>;
+</code><code id="L3123"><span class="ln">3123</span>            <b>while</b> (i--) {
+</code><code id="L3124"><span class="ln">3124</span>                <b>switch</b> (values[i]) {
+</code><code id="L3125"><span class="ln">3125</span>                    <b>case</b> <i>"block"</i>:
+</code><code id="L3126"><span class="ln">3126</span>                    <b>case</b> <i>"classic"</i>:
+</code><code id="L3127"><span class="ln">3127</span>                    <b>case</b> <i>"oval"</i>:
+</code><code id="L3128"><span class="ln">3128</span>                    <b>case</b> <i>"diamond"</i>:
+</code><code id="L3129"><span class="ln">3129</span>                    <b>case</b> <i>"open"</i>:
+</code><code id="L3130"><span class="ln">3130</span>                    <b>case</b> <i>"none"</i>:
+</code><code id="L3131"><span class="ln">3131</span>                        type<span class="s"> = </span>values[i];
+</code><code id="L3132"><span class="ln">3132</span>                        <b>break</b>;
+</code><code id="L3133"><span class="ln">3133</span>                    <b>case</b> <i>"wide"</i>:
+</code><code id="L3134"><span class="ln">3134</span>                    <b>case</b> <i>"narrow"</i>: h<span class="s"> = </span>values[i]; <b>break</b>;
+</code><code id="L3135"><span class="ln">3135</span>                    <b>case</b> <i>"<b>long</b>"</i>:
+</code><code id="L3136"><span class="ln">3136</span>                    <b>case</b> <i>"<b>short</b>"</i>: w<span class="s"> = </span>values[i]; <b>break</b>;
+</code><code id="L3137"><span class="ln">3137</span>                }
+</code><code id="L3138"><span class="ln">3138</span>            }
+</code><code id="L3139"><span class="ln">3139</span>            <b>var</b> stroke<span class="s"> = </span>o.node.getElementsByTagName(<i>"stroke"</i>)[<span class="d">0</span>];
+</code><code id="L3140"><span class="ln">3140</span>            stroke[se<span class="s"> + </span><i>"arrow"</i>]<span class="s"> = </span>type;
+</code><code id="L3141"><span class="ln">3141</span>            stroke[se<span class="s"> + </span><i>"arrowlength"</i>]<span class="s"> = </span>w;
+</code><code id="L3142"><span class="ln">3142</span>            stroke[se<span class="s"> + </span><i>"arrowwidth"</i>]<span class="s"> = </span>h;
+</code><code id="L3143"><span class="ln">3143</span>        };
+</code><code id="L3144"><span class="ln">3144</span>        setFillAndStroke<span class="s"> = </span><b>function</b> (o, params) {
+</code><code id="L3145"><span class="ln">3145</span>            o.paper.canvas.style.display<span class="s"> = </span><i>"none"</i>;
+</code><code id="L3146"><span class="ln">3146</span>            o.attrs<span class="s"> = </span>o.attrs<span class="s"> || </span>{};
+</code><code id="L3147"><span class="ln">3147</span>            <b>var</b> node<span class="s"> = </span>o.node,
+</code><code id="L3148"><span class="ln">3148</span>                a<span class="s"> = </span>o.attrs,
+</code><code id="L3149"><span class="ln">3149</span>                s<span class="s"> = </span>node.style,
+</code><code id="L3150"><span class="ln">3150</span>                xy,
+</code><code id="L3151"><span class="ln">3151</span>                newpath<span class="s"> = </span>pathTypes[o.type]<span class="s"> &amp;&amp; </span>(params.x != a.x<span class="s"> || </span>params.y != a.y<span class="s"> || </span>params.width != a.width<span class="s"> || </span>params.height != a.height<span class="s"> || </span>params.cx != a.cx<span class="s"> || </span>params.cy != a.cy<span class="s"> || </span>params.rx != a.rx<span class="s"> || </span>params.ry != a.ry<span class="s"> || </span>params.r != a.r),
+</code><code id="L3152"><span class="ln">3152</span>                isOval<span class="s"> = </span>ovalTypes[o.type]<span class="s"> &amp;&amp; </span>(a.cx != params.cx<span class="s"> || </span>a.cy != params.cy<span class="s"> || </span>a.r != params.r<span class="s"> || </span>a.rx != params.rx<span class="s"> || </span>a.ry != params.ry),
+</code><code id="L3153"><span class="ln">3153</span>                res<span class="s"> = </span>o;
 </code><code id="L3154"><span class="ln">3154</span>
-</code><code id="L3155"><span class="ln">3155</span>            <b>for</b> (<b>var</b> par <b>in</b> params) <b>if</b> (params[has](par)) {
-</code><code id="L3156"><span class="ln">3156</span>                a[par]<span class="s"> = </span>params[par];
-</code><code id="L3157"><span class="ln">3157</span>            }
-</code><code id="L3158"><span class="ln">3158</span>            <b>if</b> (newpath) {
-</code><code id="L3159"><span class="ln">3159</span>                a.path<span class="s"> = </span>getPath[o.type](o);
-</code><code id="L3160"><span class="ln">3160</span>                o._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L3161"><span class="ln">3161</span>            }
-</code><code id="L3162"><span class="ln">3162</span>            params.href<span class="s"> &amp;&amp; </span>(node.href<span class="s"> = </span>params.href);
-</code><code id="L3163"><span class="ln">3163</span>            params.title<span class="s"> &amp;&amp; </span>(node.title<span class="s"> = </span>params.title);
-</code><code id="L3164"><span class="ln">3164</span>            params.target<span class="s"> &amp;&amp; </span>(node.target<span class="s"> = </span>params.target);
-</code><code id="L3165"><span class="ln">3165</span>            params.cursor<span class="s"> &amp;&amp; </span>(s.cursor<span class="s"> = </span>params.cursor);
-</code><code id="L3166"><span class="ln">3166</span>            <i>"blur"</i> <b>in</b> params<span class="s"> &amp;&amp; </span>o.blur(params.blur);
-</code><code id="L3167"><span class="ln">3167</span>            <i>"transform"</i> <b>in</b> params<span class="s"> &amp;&amp; </span>o.transform(params.transform);
-</code><code id="L3168"><span class="ln">3168</span>            <b>if</b> (params.path<span class="s"> &amp;&amp; </span>o.type<span class="s"> == </span><i>"path"</i><span class="s"> || </span>newpath) {
-</code><code id="L3169"><span class="ln">3169</span>                node.path<span class="s"> = </span>path2vml(a.path);
-</code><code id="L3170"><span class="ln">3170</span>            }
-</code><code id="L3171"><span class="ln">3171</span>            <b>if</b> (isOval) {
-</code><code id="L3172"><span class="ln">3172</span>                <b>var</b> cx<span class="s"> = </span>a.cx,
-</code><code id="L3173"><span class="ln">3173</span>                    cy<span class="s"> = </span>a.cy,
-</code><code id="L3174"><span class="ln">3174</span>                    rx<span class="s"> = </span>a.rx<span class="s"> || </span>a.r<span class="s"> || </span><span class="d">0</span>,
-</code><code id="L3175"><span class="ln">3175</span>                    ry<span class="s"> = </span>a.ry<span class="s"> || </span>a.r<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L3176"><span class="ln">3176</span>                node.path<span class="s"> = </span>R.format(<i>"ar{<span class="d">0</span>},{<span class="d">1</span>},{<span class="d">2</span>},{<span class="d">3</span>},{<span class="d">4</span>},{<span class="d">1</span>},{<span class="d">4</span>},{<span class="d">1</span>}x"</i>, round((cx<span class="s"> - </span>rx)<span class="s"> * </span>zoom), round((cy<span class="s"> - </span>ry)<span class="s"> * </span>zoom), round((cx<span class="s"> + </span>rx)<span class="s"> * </span>zoom), round((cy<span class="s"> + </span>ry)<span class="s"> * </span>zoom), round(cx<span class="s"> * </span>zoom));
-</code><code id="L3177"><span class="ln">3177</span>            }
-</code><code id="L3178"><span class="ln">3178</span>            <b>if</b> (<i>"clip-rect"</i> <b>in</b> params) {
-</code><code id="L3179"><span class="ln">3179</span>                <b>var</b> rect<span class="s"> = </span>Str(params[<i>"clip-rect"</i>]).split(separator);
-</code><code id="L3180"><span class="ln">3180</span>                <b>if</b> (rect.length<span class="s"> == </span><span class="d">4</span>) {
-</code><code id="L3181"><span class="ln">3181</span>                    rect[<span class="d">2</span>]<span class="s"> = </span>+rect[<span class="d">2</span>]<span class="s"> + </span>(+rect[<span class="d">0</span>]);
-</code><code id="L3182"><span class="ln">3182</span>                    rect[<span class="d">3</span>]<span class="s"> = </span>+rect[<span class="d">3</span>]<span class="s"> + </span>(+rect[<span class="d">1</span>]);
-</code><code id="L3183"><span class="ln">3183</span>                    <b>var</b> div<span class="s"> = </span>node.clipRect<span class="s"> || </span>g.doc.createElement(<i>"div"</i>),
-</code><code id="L3184"><span class="ln">3184</span>                        dstyle<span class="s"> = </span>div.style,
-</code><code id="L3185"><span class="ln">3185</span>                        group<span class="s"> = </span>node.parentNode;
-</code><code id="L3186"><span class="ln">3186</span>                    dstyle.clip<span class="s"> = </span>R.format(<i>"rect({<span class="d">1</span>}px {<span class="d">2</span>}px {<span class="d">3</span>}px {<span class="d">0</span>}px)"</i>, rect);
-</code><code id="L3187"><span class="ln">3187</span>                    <b>if</b> (!node.clipRect) {
-</code><code id="L3188"><span class="ln">3188</span>                        dstyle.position<span class="s"> = </span><i>"absolute"</i>;
-</code><code id="L3189"><span class="ln">3189</span>                        dstyle.top<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L3190"><span class="ln">3190</span>                        dstyle.left<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L3191"><span class="ln">3191</span>                        dstyle.width<span class="s"> = </span>o.paper.width<span class="s"> + </span><i>"px"</i>;
-</code><code id="L3192"><span class="ln">3192</span>                        dstyle.height<span class="s"> = </span>o.paper.height<span class="s"> + </span><i>"px"</i>;
-</code><code id="L3193"><span class="ln">3193</span>                        group.parentNode.insertBefore(div, group);
-</code><code id="L3194"><span class="ln">3194</span>                        div.appendChild(group);
-</code><code id="L3195"><span class="ln">3195</span>                        node.clipRect<span class="s"> = </span>div;
-</code><code id="L3196"><span class="ln">3196</span>                    }
-</code><code id="L3197"><span class="ln">3197</span>                }
-</code><code id="L3198"><span class="ln">3198</span>                <b>if</b> (!params[<i>"clip-rect"</i>]) {
-</code><code id="L3199"><span class="ln">3199</span>                    node.clipRect<span class="s"> &amp;&amp; </span>(node.clipRect.style.clip<span class="s"> = </span>E);
-</code><code id="L3200"><span class="ln">3200</span>                }
-</code><code id="L3201"><span class="ln">3201</span>            }
-</code><code id="L3202"><span class="ln">3202</span>            <b>if</b> (o.textpath) {
-</code><code id="L3203"><span class="ln">3203</span>                <b>var</b> textpathStyle<span class="s"> = </span>o.textpath.style;
-</code><code id="L3204"><span class="ln">3204</span>                params.font<span class="s"> &amp;&amp; </span>(textpathStyle.font<span class="s"> = </span>params.font);
-</code><code id="L3205"><span class="ln">3205</span>                params[<i>"font-family"</i>]<span class="s"> &amp;&amp; </span>(textpathStyle.fontFamily<span class="s"> = </span><i>'"'</i><span class="s"> + </span>params[<i>"font-family"</i>].split(<i>","</i>)[<span class="d">0</span>].replace(/^[<i>'"]+|['</i><i>"]+$/g, E)<span class="s"> + </span>'"</i>');
-</code><code id="L3206"><span class="ln">3206</span>                params[<i>"font-size"</i>]<span class="s"> &amp;&amp; </span>(textpathStyle.fontSize<span class="s"> = </span>params[<i>"font-size"</i>]);
-</code><code id="L3207"><span class="ln">3207</span>                params[<i>"font-weight"</i>]<span class="s"> &amp;&amp; </span>(textpathStyle.fontWeight<span class="s"> = </span>params[<i>"font-weight"</i>]);
-</code><code id="L3208"><span class="ln">3208</span>                params[<i>"font-style"</i>]<span class="s"> &amp;&amp; </span>(textpathStyle.fontStyle<span class="s"> = </span>params[<i>"font-style"</i>]);
-</code><code id="L3209"><span class="ln">3209</span>            }
-</code><code id="L3210"><span class="ln">3210</span>            <b>if</b> (<i>"arrow-start"</i> <b>in</b> params) {
-</code><code id="L3211"><span class="ln">3211</span>                addArrow(res, params[<i>"arrow-start"</i>]);
-</code><code id="L3212"><span class="ln">3212</span>            }
-</code><code id="L3213"><span class="ln">3213</span>            <b>if</b> (<i>"arrow-end"</i> <b>in</b> params) {
-</code><code id="L3214"><span class="ln">3214</span>                addArrow(res, params[<i>"arrow-end"</i>], <span class="d">1</span>);
-</code><code id="L3215"><span class="ln">3215</span>            }
-</code><code id="L3216"><span class="ln">3216</span>            <b>if</b> (params.opacity != <b>null</b><span class="s"> || </span>
-</code><code id="L3217"><span class="ln">3217</span>                params[<i>"stroke-width"</i>] != <b>null</b> ||
-</code><code id="L3218"><span class="ln">3218</span>                params.fill != <b>null</b> ||
-</code><code id="L3219"><span class="ln">3219</span>                params.src != <b>null</b> ||
-</code><code id="L3220"><span class="ln">3220</span>                params.stroke != <b>null</b> ||
-</code><code id="L3221"><span class="ln">3221</span>                params[<i>"stroke-width"</i>] != <b>null</b> ||
-</code><code id="L3222"><span class="ln">3222</span>                params[<i>"stroke-opacity"</i>] != <b>null</b> ||
-</code><code id="L3223"><span class="ln">3223</span>                params[<i>"fill-opacity"</i>] != <b>null</b> ||
-</code><code id="L3224"><span class="ln">3224</span>                params[<i>"stroke-dasharray"</i>] != <b>null</b> ||
-</code><code id="L3225"><span class="ln">3225</span>                params[<i>"stroke-miterlimit"</i>] != <b>null</b> ||
-</code><code id="L3226"><span class="ln">3226</span>                params[<i>"stroke-linejoin"</i>] != <b>null</b> ||
-</code><code id="L3227"><span class="ln">3227</span>                params[<i>"stroke-linecap"</i>] != <b>null</b>) {
-</code><code id="L3228"><span class="ln">3228</span>                <b>var</b> fill<span class="s"> = </span>node.getElementsByTagName(fillString),
-</code><code id="L3229"><span class="ln">3229</span>                    newfill<span class="s"> = </span><b>false</b>;
-</code><code id="L3230"><span class="ln">3230</span>                fill<span class="s"> = </span>fill<span class="s"> &amp;&amp; </span>fill[<span class="d">0</span>];
-</code><code id="L3231"><span class="ln">3231</span>                !fill<span class="s"> &amp;&amp; </span>(newfill<span class="s"> = </span>fill<span class="s"> = </span>createNode(fillString));
-</code><code id="L3232"><span class="ln">3232</span>                <b>if</b> (o.type<span class="s"> == </span><i>"image"</i><span class="s"> &amp;&amp; </span>params.src) {
-</code><code id="L3233"><span class="ln">3233</span>                    fill.src<span class="s"> = </span>params.src;
-</code><code id="L3234"><span class="ln">3234</span>                }
-</code><code id="L3235"><span class="ln">3235</span>                <b>if</b> (<i>"fill-opacity"</i> <b>in</b> params<span class="s"> || </span><i>"opacity"</i> <b>in</b> params) {
-</code><code id="L3236"><span class="ln">3236</span>                    <b>var</b> opacity<span class="s"> = </span>((+a[<i>"fill-opacity"</i>]<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>)<span class="s"> * </span>((+a.opacity<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>)<span class="s"> * </span>((+R.getRGB(params.fill).o<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>);
-</code><code id="L3237"><span class="ln">3237</span>                    opacity<span class="s"> = </span>mmin(mmax(opacity, <span class="d">0</span>), <span class="d">1</span>);
-</code><code id="L3238"><span class="ln">3238</span>                    fill.opacity<span class="s"> = </span>opacity;
-</code><code id="L3239"><span class="ln">3239</span>                }
-</code><code id="L3240"><span class="ln">3240</span>                params.fill<span class="s"> &amp;&amp; </span>(fill.on<span class="s"> = </span><b>true</b>);
-</code><code id="L3241"><span class="ln">3241</span>                <b>if</b> (fill.on<span class="s"> == </span><b>null</b><span class="s"> || </span>params.fill<span class="s"> == </span><i>"none"</i><span class="s"> || </span>params.fill<span class="s"> === </span><b>null</b>) {
-</code><code id="L3242"><span class="ln">3242</span>                    fill.on<span class="s"> = </span><b>false</b>;
-</code><code id="L3243"><span class="ln">3243</span>                }
-</code><code id="L3244"><span class="ln">3244</span>                <b>if</b> (fill.on<span class="s"> &amp;&amp; </span>params.fill) {
-</code><code id="L3245"><span class="ln">3245</span>                    <b>var</b> isURL<span class="s"> = </span>params.fill.match(ISURL);
-</code><code id="L3246"><span class="ln">3246</span>                    <b>if</b> (isURL) {
-</code><code id="L3247"><span class="ln">3247</span>                        fill.parentNode<span class="s"> == </span>node<span class="s"> &amp;&amp; </span>node.removeChild(fill);
-</code><code id="L3248"><span class="ln">3248</span>                        fill.rotate<span class="s"> = </span><b>true</b>;
-</code><code id="L3249"><span class="ln">3249</span>                        fill.src<span class="s"> = </span>isURL[<span class="d">1</span>];
-</code><code id="L3250"><span class="ln">3250</span>                        fill.type<span class="s"> = </span><i>"tile"</i>;
-</code><code id="L3251"><span class="ln">3251</span>                        <b>var</b> bbox<span class="s"> = </span>o.getBBox(<span class="d">1</span>);
-</code><code id="L3252"><span class="ln">3252</span>                        fill.position<span class="s"> = </span>bbox.x<span class="s"> + </span>S<span class="s"> + </span>bbox.y;
-</code><code id="L3253"><span class="ln">3253</span>                        o._.fillpos<span class="s"> = </span>[bbox.x, bbox.y];
-</code><code id="L3254"><span class="ln">3254</span>
-</code><code id="L3255"><span class="ln">3255</span>                        preload(isURL[<span class="d">1</span>], <b>function</b> () {
-</code><code id="L3256"><span class="ln">3256</span>                            o._.fillsize<span class="s"> = </span>[<b>this</b>.offsetWidth, <b>this</b>.offsetHeight];
-</code><code id="L3257"><span class="ln">3257</span>                        });
-</code><code id="L3258"><span class="ln">3258</span>                    } <b>else</b> {
-</code><code id="L3259"><span class="ln">3259</span>                        fill.color<span class="s"> = </span>R.getRGB(params.fill).hex;
-</code><code id="L3260"><span class="ln">3260</span>                        fill.src<span class="s"> = </span>E;
-</code><code id="L3261"><span class="ln">3261</span>                        fill.type<span class="s"> = </span><i>"solid"</i>;
-</code><code id="L3262"><span class="ln">3262</span>                        <b>if</b> (R.getRGB(params.fill).error<span class="s"> &amp;&amp; </span>(res.type <b>in</b> {circle: <span class="d">1</span>, ellipse: <span class="d">1</span>}<span class="s"> || </span>Str(params.fill).charAt() != <i>"r"</i>)<span class="s"> &amp;&amp; </span>addGradientFill(res, params.fill, fill)) {
-</code><code id="L3263"><span class="ln">3263</span>                            a.fill<span class="s"> = </span><i>"none"</i>;
-</code><code id="L3264"><span class="ln">3264</span>                            a.gradient<span class="s"> = </span>params.fill;
-</code><code id="L3265"><span class="ln">3265</span>                            fill.rotate<span class="s"> = </span><b>false</b>;
-</code><code id="L3266"><span class="ln">3266</span>                        }
-</code><code id="L3267"><span class="ln">3267</span>                    }
-</code><code id="L3268"><span class="ln">3268</span>                }
-</code><code id="L3269"><span class="ln">3269</span>                node.appendChild(fill);
-</code><code id="L3270"><span class="ln">3270</span>                <b>var</b> stroke<span class="s"> = </span>(node.getElementsByTagName(<i>"stroke"</i>)<span class="s"> &amp;&amp; </span>node.getElementsByTagName(<i>"stroke"</i>)[<span class="d">0</span>]),
-</code><code id="L3271"><span class="ln">3271</span>                newstroke<span class="s"> = </span><b>false</b>;
-</code><code id="L3272"><span class="ln">3272</span>                !stroke<span class="s"> &amp;&amp; </span>(newstroke<span class="s"> = </span>stroke<span class="s"> = </span>createNode(<i>"stroke"</i>));
-</code><code id="L3273"><span class="ln">3273</span>                <b>if</b> ((params.stroke<span class="s"> &amp;&amp; </span>params.stroke != <i>"none"</i>) ||
-</code><code id="L3274"><span class="ln">3274</span>                    params[<i>"stroke-width"</i>] ||
-</code><code id="L3275"><span class="ln">3275</span>                    params[<i>"stroke-opacity"</i>] != <b>null</b> ||
-</code><code id="L3276"><span class="ln">3276</span>                    params[<i>"stroke-dasharray"</i>] ||
-</code><code id="L3277"><span class="ln">3277</span>                    params[<i>"stroke-miterlimit"</i>] ||
-</code><code id="L3278"><span class="ln">3278</span>                    params[<i>"stroke-linejoin"</i>] ||
-</code><code id="L3279"><span class="ln">3279</span>                    params[<i>"stroke-linecap"</i>]) {
-</code><code id="L3280"><span class="ln">3280</span>                    stroke.on<span class="s"> = </span><b>true</b>;
-</code><code id="L3281"><span class="ln">3281</span>                }
-</code><code id="L3282"><span class="ln">3282</span>                (params.stroke<span class="s"> == </span><i>"none"</i><span class="s"> || </span>params.stroke<span class="s"> === </span><b>null</b><span class="s"> || </span>stroke.on<span class="s"> == </span><b>null</b><span class="s"> || </span>params.stroke<span class="s"> == </span><span class="d">0</span><span class="s"> || </span>params[<i>"stroke-width"</i>]<span class="s"> == </span><span class="d">0</span>)<span class="s"> &amp;&amp; </span>(stroke.on<span class="s"> = </span><b>false</b>);
-</code><code id="L3283"><span class="ln">3283</span>                <b>var</b> strokeColor<span class="s"> = </span>R.getRGB(params.stroke);
-</code><code id="L3284"><span class="ln">3284</span>                stroke.on<span class="s"> &amp;&amp; </span>params.stroke<span class="s"> &amp;&amp; </span>(stroke.color<span class="s"> = </span>strokeColor.hex);
-</code><code id="L3285"><span class="ln">3285</span>                opacity<span class="s"> = </span>((+a[<i>"stroke-opacity"</i>]<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>)<span class="s"> * </span>((+a.opacity<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>)<span class="s"> * </span>((+strokeColor.o<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>);
-</code><code id="L3286"><span class="ln">3286</span>                <b>var</b> width<span class="s"> = </span>(toFloat(params[<i>"stroke-width"</i>])<span class="s"> || </span><span class="d">1</span>)<span class="s"> * </span><span class="d">.75</span>;
-</code><code id="L3287"><span class="ln">3287</span>                opacity<span class="s"> = </span>mmin(mmax(opacity, <span class="d">0</span>), <span class="d">1</span>);
-</code><code id="L3288"><span class="ln">3288</span>                params[<i>"stroke-width"</i>]<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>(width<span class="s"> = </span>a[<i>"stroke-width"</i>]);
-</code><code id="L3289"><span class="ln">3289</span>                params[<i>"stroke-width"</i>]<span class="s"> &amp;&amp; </span>(stroke.weight<span class="s"> = </span>width);
-</code><code id="L3290"><span class="ln">3290</span>                width<span class="s"> &amp;&amp; </span>width &lt; <span class="d">1</span><span class="s"> &amp;&amp; </span>(opacity *= width)<span class="s"> &amp;&amp; </span>(stroke.weight<span class="s"> = </span><span class="d">1</span>);
-</code><code id="L3291"><span class="ln">3291</span>                stroke.opacity<span class="s"> = </span>opacity;
-</code><code id="L3292"><span class="ln">3292</span>                
-</code><code id="L3293"><span class="ln">3293</span>                params[<i>"stroke-linejoin"</i>]<span class="s"> &amp;&amp; </span>(stroke.joinstyle<span class="s"> = </span>params[<i>"stroke-linejoin"</i>]<span class="s"> || </span><i>"miter"</i>);
-</code><code id="L3294"><span class="ln">3294</span>                stroke.miterlimit<span class="s"> = </span>params[<i>"stroke-miterlimit"</i>]<span class="s"> || </span><span class="d">8</span>;
-</code><code id="L3295"><span class="ln">3295</span>                params[<i>"stroke-linecap"</i>]<span class="s"> &amp;&amp; </span>(stroke.endcap<span class="s"> = </span>params[<i>"stroke-linecap"</i>]<span class="s"> == </span><i>"butt"</i> ? <i>"flat"</i> : params[<i>"stroke-linecap"</i>]<span class="s"> == </span><i>"square"</i> ? <i>"square"</i> : <i>"round"</i>);
-</code><code id="L3296"><span class="ln">3296</span>                <b>if</b> (params[<i>"stroke-dasharray"</i>]) {
-</code><code id="L3297"><span class="ln">3297</span>                    <b>var</b> dasharray<span class="s"> = </span>{
-</code><code id="L3298"><span class="ln">3298</span>                        <i>"-"</i>: <i>"shortdash"</i>,
-</code><code id="L3299"><span class="ln">3299</span>                        <i>"."</i>: <i>"shortdot"</i>,
-</code><code id="L3300"><span class="ln">3300</span>                        <i>"-."</i>: <i>"shortdashdot"</i>,
-</code><code id="L3301"><span class="ln">3301</span>                        <i>"-.."</i>: <i>"shortdashdotdot"</i>,
-</code><code id="L3302"><span class="ln">3302</span>                        <i>". "</i>: <i>"dot"</i>,
-</code><code id="L3303"><span class="ln">3303</span>                        <i>"- "</i>: <i>"dash"</i>,
-</code><code id="L3304"><span class="ln">3304</span>                        <i>"--"</i>: <i>"longdash"</i>,
-</code><code id="L3305"><span class="ln">3305</span>                        <i>"- ."</i>: <i>"dashdot"</i>,
-</code><code id="L3306"><span class="ln">3306</span>                        <i>"--."</i>: <i>"longdashdot"</i>,
-</code><code id="L3307"><span class="ln">3307</span>                        <i>"--.."</i>: <i>"longdashdotdot"</i>
-</code><code id="L3308"><span class="ln">3308</span>                    };
-</code><code id="L3309"><span class="ln">3309</span>                    stroke.dashstyle<span class="s"> = </span>dasharray[has](params[<i>"stroke-dasharray"</i>]) ? dasharray[params[<i>"stroke-dasharray"</i>]] : E;
-</code><code id="L3310"><span class="ln">3310</span>                }
-</code><code id="L3311"><span class="ln">3311</span>                newstroke<span class="s"> &amp;&amp; </span>node.appendChild(stroke);
-</code><code id="L3312"><span class="ln">3312</span>            }
-</code><code id="L3313"><span class="ln">3313</span>            <b>if</b> (res.type<span class="s"> == </span><i>"text"</i>) {
-</code><code id="L3314"><span class="ln">3314</span>                res.paper.canvas.style.display<span class="s"> = </span>E;
-</code><code id="L3315"><span class="ln">3315</span>                <b>var</b> span<span class="s"> = </span>res.paper.span,
-</code><code id="L3316"><span class="ln">3316</span>                    m<span class="s"> = </span><span class="d">100</span>,
-</code><code id="L3317"><span class="ln">3317</span>                    fontSize<span class="s"> = </span>a.font<span class="s"> &amp;&amp; </span>a.font.match(/\d+(?:\.\d*)?(?=px)/);
-</code><code id="L3318"><span class="ln">3318</span>                s<span class="s"> = </span>span.style;
-</code><code id="L3319"><span class="ln">3319</span>                a.font<span class="s"> &amp;&amp; </span>(s.font<span class="s"> = </span>a.font);
-</code><code id="L3320"><span class="ln">3320</span>                a[<i>"font-family"</i>]<span class="s"> &amp;&amp; </span>(s.fontFamily<span class="s"> = </span>a[<i>"font-family"</i>]);
-</code><code id="L3321"><span class="ln">3321</span>                a[<i>"font-weight"</i>]<span class="s"> &amp;&amp; </span>(s.fontWeight<span class="s"> = </span>a[<i>"font-weight"</i>]);
-</code><code id="L3322"><span class="ln">3322</span>                a[<i>"font-style"</i>]<span class="s"> &amp;&amp; </span>(s.fontStyle<span class="s"> = </span>a[<i>"font-style"</i>]);
-</code><code id="L3323"><span class="ln">3323</span>                fontSize<span class="s"> = </span>toFloat(fontSize ? fontSize[<span class="d">0</span>] : a[<i>"font-size"</i>]);
-</code><code id="L3324"><span class="ln">3324</span>                s.fontSize<span class="s"> = </span>fontSize<span class="s"> * </span>m<span class="s"> + </span><i>"px"</i>;
-</code><code id="L3325"><span class="ln">3325</span>                res.textpath.string<span class="s"> &amp;&amp; </span>(span.innerHTML<span class="s"> = </span>Str(res.textpath.string).replace(/&lt;/g, <i>"&#<span class="d">60</span>;"</i>).replace(/&amp;/g, <i>"&#<span class="d">38</span>;"</i>).replace(/\n/g, <i>"&lt;br>"</i>));
-</code><code id="L3326"><span class="ln">3326</span>                <b>var</b> brect<span class="s"> = </span>span.getBoundingClientRect();
-</code><code id="L3327"><span class="ln">3327</span>                res.W<span class="s"> = </span>a.w<span class="s"> = </span>(brect.right<span class="s"> - </span>brect.left)<span class="s"> / </span>m;
-</code><code id="L3328"><span class="ln">3328</span>                res.H<span class="s"> = </span>a.h<span class="s"> = </span>(brect.bottom<span class="s"> - </span>brect.top)<span class="s"> / </span>m;
-</code><code id="L3329"><span class="ln">3329</span>                res.paper.canvas.style.display<span class="s"> = </span><i>"none"</i>;
-</code><code id="L3330"><span class="ln">3330</span>                res.X<span class="s"> = </span>a.x;
-</code><code id="L3331"><span class="ln">3331</span>                res.Y<span class="s"> = </span>a.y<span class="s"> + </span>res.H<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L3332"><span class="ln">3332</span>
-</code><code id="L3333"><span class="ln">3333</span>                (<i>"x"</i> <b>in</b> params<span class="s"> || </span><i>"y"</i> <b>in</b> params)<span class="s"> &amp;&amp; </span>(res.path.v<span class="s"> = </span>R.format(<i>"m{<span class="d">0</span>},{<span class="d">1</span>}l{<span class="d">2</span>},{<span class="d">1</span>}"</i>, round(a.x<span class="s"> * </span>zoom), round(a.y<span class="s"> * </span>zoom), round(a.x<span class="s"> * </span>zoom)<span class="s"> + </span><span class="d">1</span>));
-</code><code id="L3334"><span class="ln">3334</span>                <b>var</b> dirtyattrs<span class="s"> = </span>[<i>"x"</i>, <i>"y"</i>, <i>"text"</i>, <i>"font"</i>, <i>"font-family"</i>, <i>"font-weight"</i>, <i>"font-style"</i>, <i>"font-size"</i>];
-</code><code id="L3335"><span class="ln">3335</span>                <b>for</b> (<b>var</b> d<span class="s"> = </span><span class="d">0</span>, dd<span class="s"> = </span>dirtyattrs.length; d &lt; dd; d++) <b>if</b> (dirtyattrs[d] <b>in</b> params) {
-</code><code id="L3336"><span class="ln">3336</span>                    res._.dirty<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L3337"><span class="ln">3337</span>                    <b>break</b>;
-</code><code id="L3338"><span class="ln">3338</span>                }
-</code><code id="L3339"><span class="ln">3339</span>                
-</code><code id="L3340"><span class="ln">3340</span>                <span class="c">// text-anchor emulation</span>
-</code><code id="L3341"><span class="ln">3341</span>                <b>switch</b> (a[<i>"text-anchor"</i>]) {
-</code><code id="L3342"><span class="ln">3342</span>                    <b>case</b> <i>"start"</i>:
-</code><code id="L3343"><span class="ln">3343</span>                        res.textpath.style[<i>"v-text-align"</i>]<span class="s"> = </span><i>"left"</i>;
-</code><code id="L3344"><span class="ln">3344</span>                        res.bbx<span class="s"> = </span>res.W<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L3345"><span class="ln">3345</span>                    <b>break</b>;
-</code><code id="L3346"><span class="ln">3346</span>                    <b>case</b> <i>"end"</i>:
-</code><code id="L3347"><span class="ln">3347</span>                        res.textpath.style[<i>"v-text-align"</i>]<span class="s"> = </span><i>"right"</i>;
-</code><code id="L3348"><span class="ln">3348</span>                        res.bbx<span class="s"> = </span>-res.W<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L3349"><span class="ln">3349</span>                    <b>break</b>;
-</code><code id="L3350"><span class="ln">3350</span>                    <b>default</b>:
-</code><code id="L3351"><span class="ln">3351</span>                        res.textpath.style[<i>"v-text-align"</i>]<span class="s"> = </span><i>"center"</i>;
-</code><code id="L3352"><span class="ln">3352</span>                        res.bbx<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L3353"><span class="ln">3353</span>                    <b>break</b>;
-</code><code id="L3354"><span class="ln">3354</span>                }
-</code><code id="L3355"><span class="ln">3355</span>                res.textpath.style[<i>"v-text-kern"</i>]<span class="s"> = </span><b>true</b>;
-</code><code id="L3356"><span class="ln">3356</span>            }
-</code><code id="L3357"><span class="ln">3357</span>            res.paper.canvas.style.display<span class="s"> = </span>E;
-</code><code id="L3358"><span class="ln">3358</span>        };
-</code><code id="L3359"><span class="ln">3359</span>        addGradientFill<span class="s"> = </span><b>function</b> (o, gradient, fill) {
-</code><code id="L3360"><span class="ln">3360</span>            o.attrs<span class="s"> = </span>o.attrs<span class="s"> || </span>{};
-</code><code id="L3361"><span class="ln">3361</span>            <b>var</b> attrs<span class="s"> = </span>o.attrs,
-</code><code id="L3362"><span class="ln">3362</span>                type<span class="s"> = </span><i>"linear"</i>,
-</code><code id="L3363"><span class="ln">3363</span>                fxfy<span class="s"> = </span><i>"<span class="d">.5</span> <span class="d">.5</span>"</i>;
-</code><code id="L3364"><span class="ln">3364</span>            o.attrs.gradient<span class="s"> = </span>gradient;
-</code><code id="L3365"><span class="ln">3365</span>            gradient<span class="s"> = </span>Str(gradient).replace(radial_gradient, <b>function</b> (all, fx, fy) {
-</code><code id="L3366"><span class="ln">3366</span>                type<span class="s"> = </span><i>"radial"</i>;
-</code><code id="L3367"><span class="ln">3367</span>                <b>if</b> (fx<span class="s"> &amp;&amp; </span>fy) {
-</code><code id="L3368"><span class="ln">3368</span>                    fx<span class="s"> = </span>toFloat(fx);
-</code><code id="L3369"><span class="ln">3369</span>                    fy<span class="s"> = </span>toFloat(fy);
-</code><code id="L3370"><span class="ln">3370</span>                    pow(fx<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>)<span class="s"> + </span>pow(fy<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>) > <span class="d">.25</span><span class="s"> &amp;&amp; </span>(fy<span class="s"> = </span>math.sqrt(<span class="d">.25</span><span class="s"> - </span>pow(fx<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>))<span class="s"> * </span>((fy > <span class="d">.5</span>)<span class="s"> * </span><span class="d">2</span><span class="s"> - </span><span class="d">1</span>)<span class="s"> + </span><span class="d">.5</span>);
-</code><code id="L3371"><span class="ln">3371</span>                    fxfy<span class="s"> = </span>fx<span class="s"> + </span>S<span class="s"> + </span>fy;
-</code><code id="L3372"><span class="ln">3372</span>                }
-</code><code id="L3373"><span class="ln">3373</span>                <b>return</b> E;
-</code><code id="L3374"><span class="ln">3374</span>            });
-</code><code id="L3375"><span class="ln">3375</span>            gradient<span class="s"> = </span>gradient.split(/\s*\-\s*/);
-</code><code id="L3376"><span class="ln">3376</span>            <b>if</b> (type<span class="s"> == </span><i>"linear"</i>) {
-</code><code id="L3377"><span class="ln">3377</span>                <b>var</b> angle<span class="s"> = </span>gradient.shift();
-</code><code id="L3378"><span class="ln">3378</span>                angle<span class="s"> = </span>-toFloat(angle);
-</code><code id="L3379"><span class="ln">3379</span>                <b>if</b> (isNaN(angle)) {
-</code><code id="L3380"><span class="ln">3380</span>                    <b>return</b> <b>null</b>;
-</code><code id="L3381"><span class="ln">3381</span>                }
-</code><code id="L3382"><span class="ln">3382</span>            }
-</code><code id="L3383"><span class="ln">3383</span>            <b>var</b> dots<span class="s"> = </span>parseDots(gradient);
-</code><code id="L3384"><span class="ln">3384</span>            <b>if</b> (!dots) {
-</code><code id="L3385"><span class="ln">3385</span>                <b>return</b> <b>null</b>;
-</code><code id="L3386"><span class="ln">3386</span>            }
-</code><code id="L3387"><span class="ln">3387</span>            o<span class="s"> = </span>o.shape<span class="s"> || </span>o.node;
-</code><code id="L3388"><span class="ln">3388</span>            <b>if</b> (dots.length) {
-</code><code id="L3389"><span class="ln">3389</span>                o.removeChild(fill);
-</code><code id="L3390"><span class="ln">3390</span>                fill.on<span class="s"> = </span><b>true</b>;
-</code><code id="L3391"><span class="ln">3391</span>                fill.method<span class="s"> = </span><i>"none"</i>;
-</code><code id="L3392"><span class="ln">3392</span>                fill.color<span class="s"> = </span>dots[<span class="d">0</span>].color;
-</code><code id="L3393"><span class="ln">3393</span>                fill.color2<span class="s"> = </span>dots[dots.length<span class="s"> - </span><span class="d">1</span>].color;
-</code><code id="L3394"><span class="ln">3394</span>                <b>var</b> clrs<span class="s"> = </span>[];
-</code><code id="L3395"><span class="ln">3395</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>dots.length; i &lt; ii; i++) {
-</code><code id="L3396"><span class="ln">3396</span>                    dots[i].offset<span class="s"> &amp;&amp; </span>clrs.push(dots[i].offset<span class="s"> + </span>S<span class="s"> + </span>dots[i].color);
-</code><code id="L3397"><span class="ln">3397</span>                }
-</code><code id="L3398"><span class="ln">3398</span>                fill.colors<span class="s"> &amp;&amp; </span>(fill.colors.value<span class="s"> = </span>clrs.length ? clrs.join() : <i>"<span class="d">0</span>% "</i><span class="s"> + </span>fill.color);
-</code><code id="L3399"><span class="ln">3399</span>                <b>if</b> (type<span class="s"> == </span><i>"radial"</i>) {
-</code><code id="L3400"><span class="ln">3400</span>                    fill.type<span class="s"> = </span><i>"gradientTitle"</i>;
-</code><code id="L3401"><span class="ln">3401</span>                    fill.focus<span class="s"> = </span><i>"<span class="d">100</span>%"</i>;
-</code><code id="L3402"><span class="ln">3402</span>                    fill.focussize<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span>"</i>;
-</code><code id="L3403"><span class="ln">3403</span>                    fill.focusposition<span class="s"> = </span>fxfy;
-</code><code id="L3404"><span class="ln">3404</span>                    fill.angle<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L3405"><span class="ln">3405</span>                } <b>else</b> {
-</code><code id="L3406"><span class="ln">3406</span>                    <span class="c">// fill.rotate= <b>true</b>;</span>
-</code><code id="L3407"><span class="ln">3407</span>                    fill.type<span class="s"> = </span><i>"gradient"</i>;
-</code><code id="L3408"><span class="ln">3408</span>                    fill.angle<span class="s"> = </span>(<span class="d">270</span><span class="s"> - </span>angle)<span class="s"> % </span><span class="d">360</span>;
-</code><code id="L3409"><span class="ln">3409</span>                }
-</code><code id="L3410"><span class="ln">3410</span>                o.appendChild(fill);
-</code><code id="L3411"><span class="ln">3411</span>                <span class="c">// alert(fill.outerHTML);</span>
-</code><code id="L3412"><span class="ln">3412</span>            }
-</code><code id="L3413"><span class="ln">3413</span>            <b>return</b> <span class="d">1</span>;
-</code><code id="L3414"><span class="ln">3414</span>        };
-</code><code id="L3415"><span class="ln">3415</span>        Element<span class="s"> = </span><b>function</b> (node, vml) {
-</code><code id="L3416"><span class="ln">3416</span>            <b>this</b>[<span class="d">0</span>]<span class="s"> = </span><b>this</b>.node<span class="s"> = </span>node;
-</code><code id="L3417"><span class="ln">3417</span>            node.raphael<span class="s"> = </span><b>true</b>;
-</code><code id="L3418"><span class="ln">3418</span>            <b>this</b>.id<span class="s"> = </span>R._oid++;
-</code><code id="L3419"><span class="ln">3419</span>            node.raphaelid<span class="s"> = </span><b>this</b>.id;
-</code><code id="L3420"><span class="ln">3420</span>            <b>this</b>.X<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L3421"><span class="ln">3421</span>            <b>this</b>.Y<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L3422"><span class="ln">3422</span>            <b>this</b>.attrs<span class="s"> = </span>{};
-</code><code id="L3423"><span class="ln">3423</span>            <b>this</b>.paper<span class="s"> = </span>vml;
-</code><code id="L3424"><span class="ln">3424</span>            <b>this</b>.matrix<span class="s"> = </span><b>new</b> Matrix;
-</code><code id="L3425"><span class="ln">3425</span>            <b>this</b>._<span class="s"> = </span>{
-</code><code id="L3426"><span class="ln">3426</span>                transform: [],
-</code><code id="L3427"><span class="ln">3427</span>                sx: <span class="d">1</span>,
-</code><code id="L3428"><span class="ln">3428</span>                sy: <span class="d">1</span>,
-</code><code id="L3429"><span class="ln">3429</span>                dx: <span class="d">0</span>,
-</code><code id="L3430"><span class="ln">3430</span>                dy: <span class="d">0</span>,
-</code><code id="L3431"><span class="ln">3431</span>                deg: <span class="d">0</span>,
-</code><code id="L3432"><span class="ln">3432</span>                dirty: <span class="d">1</span>,
-</code><code id="L3433"><span class="ln">3433</span>                dirtyT: <span class="d">1</span>
-</code><code id="L3434"><span class="ln">3434</span>            };
-</code><code id="L3435"><span class="ln">3435</span>            !vml.bottom<span class="s"> &amp;&amp; </span>(vml.bottom<span class="s"> = </span><b>this</b>);
-</code><code id="L3436"><span class="ln">3436</span>            <b>this</b>.prev<span class="s"> = </span>vml.top;
-</code><code id="L3437"><span class="ln">3437</span>            vml.top<span class="s"> &amp;&amp; </span>(vml.top.next<span class="s"> = </span><b>this</b>);
-</code><code id="L3438"><span class="ln">3438</span>            vml.top<span class="s"> = </span><b>this</b>;
-</code><code id="L3439"><span class="ln">3439</span>            <b>this</b>.next<span class="s"> = </span><b>null</b>;
-</code><code id="L3440"><span class="ln">3440</span>        };
-</code><code id="L3441"><span class="ln">3441</span>        elproto<span class="s"> = </span>Element.prototype;
-</code><code id="L3442"><span class="ln">3442</span>        elproto.transform<span class="s"> = </span><b>function</b> (tstr) {
-</code><code id="L3443"><span class="ln">3443</span>            <b>if</b> (tstr<span class="s"> == </span><b>null</b>) {
-</code><code id="L3444"><span class="ln">3444</span>                <b>return</b> <b>this</b>._.transform;
-</code><code id="L3445"><span class="ln">3445</span>            }
-</code><code id="L3446"><span class="ln">3446</span>            extractTransform(<b>this</b>, tstr);
-</code><code id="L3447"><span class="ln">3447</span>            <b>var</b> matrix<span class="s"> = </span><b>this</b>.matrix.clone(),
-</code><code id="L3448"><span class="ln">3448</span>                skew<span class="s"> = </span><b>this</b>.skew;
-</code><code id="L3449"><span class="ln">3449</span>            matrix.translate(-<span class="d">.5</span>, -<span class="d">.5</span>);
-</code><code id="L3450"><span class="ln">3450</span>            <b>if</b> (<b>this</b>.type<span class="s"> == </span><i>"image"</i>) {
-</code><code id="L3451"><span class="ln">3451</span>                <b>if</b> (Str(tstr).indexOf(<i>"m"</i>)<span class="s"> + </span><span class="d">1</span>) {
-</code><code id="L3452"><span class="ln">3452</span>                    <b>this</b>.node.style.filter<span class="s"> = </span>matrix.toFilter();
-</code><code id="L3453"><span class="ln">3453</span>                    <b>var</b> bb<span class="s"> = </span><b>this</b>.getBBox(),
-</code><code id="L3454"><span class="ln">3454</span>                        bbt<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>),
-</code><code id="L3455"><span class="ln">3455</span>                        im<span class="s"> = </span>matrix.invert(),
-</code><code id="L3456"><span class="ln">3456</span>                        dx<span class="s"> = </span>im.x(bb.x, bb.y)<span class="s"> - </span>im.x(bbt.x, bbt.y),
-</code><code id="L3457"><span class="ln">3457</span>                        dy<span class="s"> = </span>im.y(bb.x, bb.y)<span class="s"> - </span>im.y(bbt.x, bbt.y);
-</code><code id="L3458"><span class="ln">3458</span>                    <span class="c">// skew.offset<span class="s"> = </span>dx<span class="s"> + </span>S<span class="s"> + </span>dy;</span>
-</code><code id="L3459"><span class="ln">3459</span>                    <span class="c">// <b>this</b>.node.getElementsByTagName(fillString)[<span class="d">0</span>].position<span class="s"> = </span>skew.offset;</span>
-</code><code id="L3460"><span class="ln">3460</span>                } <b>else</b> {
-</code><code id="L3461"><span class="ln">3461</span>                    <b>this</b>.node.style.filter<span class="s"> = </span>E;
-</code><code id="L3462"><span class="ln">3462</span>                    setCoords(<b>this</b>);
-</code><code id="L3463"><span class="ln">3463</span>                }
-</code><code id="L3464"><span class="ln">3464</span>            } <b>else</b> {
-</code><code id="L3465"><span class="ln">3465</span>                    <span class="c">// o<span class="s"> = </span><b>this</b>.node,</span>
-</code><code id="L3466"><span class="ln">3466</span>                    <span class="c">// _<span class="s"> = </span><b>this</b>._,</span>
-</code><code id="L3467"><span class="ln">3467</span>                    <span class="c">// fillpos<span class="s"> = </span>_.fillpos,</span>
-</code><code id="L3468"><span class="ln">3468</span>                    <span class="c">// deg,</span>
-</code><code id="L3469"><span class="ln">3469</span>                    <span class="c">// matrix<span class="s"> = </span><b>this</b>.matrix;</span>
-</code><code id="L3470"><span class="ln">3470</span>                    <span class="c">// fill<span class="s"> = </span>o.getElementsByTagName(fillString)[<span class="d">0</span>],</span>
-</code><code id="L3471"><span class="ln">3471</span>                    <span class="c">// angle<span class="s"> = </span>fill.angle;</span>
-</code><code id="L3472"><span class="ln">3472</span>
-</code><code id="L3473"><span class="ln">3473</span>                <b>this</b>.node.style.filter<span class="s"> = </span>E;
-</code><code id="L3474"><span class="ln">3474</span>                skew.matrix<span class="s"> = </span>matrix;
-</code><code id="L3475"><span class="ln">3475</span>                skew.offset<span class="s"> = </span>matrix.offset();
-</code><code id="L3476"><span class="ln">3476</span>                
-</code><code id="L3477"><span class="ln">3477</span>                <span class="c">// <b>if</b> (<span class="d">0</span>&amp;&amp;angle) {</span>
-</code><code id="L3478"><span class="ln">3478</span>                <span class="c">//     angle<span class="s"> = </span>R.rad(<span class="d">270</span><span class="s"> - </span>angle);</span>
-</code><code id="L3479"><span class="ln">3479</span>                <span class="c">//     <b>var</b> dx<span class="s"> = </span><span class="d">100</span><span class="s"> * </span>math.cos(angle),</span>
-</code><code id="L3480"><span class="ln">3480</span>                <span class="c">//         dy<span class="s"> = </span><span class="d">100</span><span class="s"> * </span>math.sin(angle),</span>
-</code><code id="L3481"><span class="ln">3481</span>                <span class="c">//         zx<span class="s"> = </span>matrix.x(<span class="d">0</span>, <span class="d">0</span>),</span>
-</code><code id="L3482"><span class="ln">3482</span>                <span class="c">//         zy<span class="s"> = </span>matrix.y(<span class="d">0</span>, <span class="d">0</span>),</span>
-</code><code id="L3483"><span class="ln">3483</span>                <span class="c">//         mx<span class="s"> = </span>matrix.x(dx, dy),</span>
-</code><code id="L3484"><span class="ln">3484</span>                <span class="c">//         my<span class="s"> = </span>matrix.y(dx, dy);</span>
-</code><code id="L3485"><span class="ln">3485</span>                <span class="c">//     angle<span class="s"> = </span>R.angle(zx, zy, mx, my);</span>
-</code><code id="L3486"><span class="ln">3486</span>                <span class="c">//     fill.angle<span class="s"> = </span>(<span class="d">270</span><span class="s"> - </span>angle)<span class="s"> % </span><span class="d">360</span>;</span>
-</code><code id="L3487"><span class="ln">3487</span>                <span class="c">// }</span>
-</code><code id="L3488"><span class="ln">3488</span>            }
-</code><code id="L3489"><span class="ln">3489</span>            <b>return</b> <b>this</b>;
-</code><code id="L3490"><span class="ln">3490</span>        };
-</code><code id="L3491"><span class="ln">3491</span>        elproto.rotate<span class="s"> = </span><b>function</b> (deg, cx, cy) {
-</code><code id="L3492"><span class="ln">3492</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L3493"><span class="ln">3493</span>                <b>return</b> <b>this</b>;
-</code><code id="L3494"><span class="ln">3494</span>            }
-</code><code id="L3495"><span class="ln">3495</span>            <b>if</b> (deg<span class="s"> == </span><b>null</b>) {
-</code><code id="L3496"><span class="ln">3496</span>                <b>return</b>;
-</code><code id="L3497"><span class="ln">3497</span>            }
-</code><code id="L3498"><span class="ln">3498</span>            deg<span class="s"> = </span>Str(deg).split(separator);
-</code><code id="L3499"><span class="ln">3499</span>            <b>if</b> (deg.length<span class="s"> - </span><span class="d">1</span>) {
-</code><code id="L3500"><span class="ln">3500</span>                cx<span class="s"> = </span>toFloat(deg[<span class="d">1</span>]);
-</code><code id="L3501"><span class="ln">3501</span>                cy<span class="s"> = </span>toFloat(deg[<span class="d">2</span>]);
-</code><code id="L3502"><span class="ln">3502</span>            }
-</code><code id="L3503"><span class="ln">3503</span>            deg<span class="s"> = </span>toFloat(deg[<span class="d">0</span>]);
-</code><code id="L3504"><span class="ln">3504</span>            (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
-</code><code id="L3505"><span class="ln">3505</span>            <b>if</b> (cx<span class="s"> == </span><b>null</b><span class="s"> || </span>cy<span class="s"> == </span><b>null</b>) {
-</code><code id="L3506"><span class="ln">3506</span>                <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
-</code><code id="L3507"><span class="ln">3507</span>                cx<span class="s"> = </span>bbox.x<span class="s"> + </span>bbox.width<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L3508"><span class="ln">3508</span>                cy<span class="s"> = </span>bbox.y<span class="s"> + </span>bbox.height<span class="s"> / </span><span class="d">2</span>;
-</code><code id="L3509"><span class="ln">3509</span>            }
-</code><code id="L3510"><span class="ln">3510</span>            <b>this</b>._.dirtyT<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L3511"><span class="ln">3511</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"r"</i>, deg, cx, cy]]));
-</code><code id="L3512"><span class="ln">3512</span>            <b>return</b> <b>this</b>;
-</code><code id="L3513"><span class="ln">3513</span>        };
-</code><code id="L3514"><span class="ln">3514</span>        elproto.translate<span class="s"> = </span><b>function</b> (dx, dy) {
-</code><code id="L3515"><span class="ln">3515</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L3516"><span class="ln">3516</span>                <b>return</b> <b>this</b>;
-</code><code id="L3517"><span class="ln">3517</span>            }
-</code><code id="L3518"><span class="ln">3518</span>            dx<span class="s"> = </span>Str(dx).split(separator);
-</code><code id="L3519"><span class="ln">3519</span>            <b>if</b> (dx.length<span class="s"> - </span><span class="d">1</span>) {
-</code><code id="L3520"><span class="ln">3520</span>                dy<span class="s"> = </span>toFloat(dx[<span class="d">1</span>]);
-</code><code id="L3521"><span class="ln">3521</span>            }
-</code><code id="L3522"><span class="ln">3522</span>            dx<span class="s"> = </span>toFloat(dx[<span class="d">0</span>])<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L3523"><span class="ln">3523</span>            dy<span class="s"> = </span>+dy<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L3524"><span class="ln">3524</span>            <b>if</b> (<b>this</b>._.bbox) {
-</code><code id="L3525"><span class="ln">3525</span>                <b>this</b>._.bbox.x += dx;
-</code><code id="L3526"><span class="ln">3526</span>                <b>this</b>._.bbox.y += dy;
-</code><code id="L3527"><span class="ln">3527</span>            }
-</code><code id="L3528"><span class="ln">3528</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"t"</i>, dx, dy]]));
-</code><code id="L3529"><span class="ln">3529</span>            <b>return</b> <b>this</b>;
-</code><code id="L3530"><span class="ln">3530</span>        };
-</code><code id="L3531"><span class="ln">3531</span>        elproto.scale<span class="s"> = </span><b>function</b> (sx, sy, cx, cy) {
-</code><code id="L3532"><span class="ln">3532</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L3533"><span class="ln">3533</span>                <b>return</b> <b>this</b>;
-</code><code id="L3534"><span class="ln">3534</span>            }
-</code><code id="L3535"><span class="ln">3535</span>            sx<span class="s"> = </span>Str(sx).split(separator);
-</code><code id="L3536"><span class="ln">3536</span>            <b>if</b> (sx.length<span class="s"> - </span><span class="d">1</span>) {
-</code><code id="L3537"><span class="ln">3537</span>                sy<span class="s"> = </span>toFloat(sx[<span class="d">1</span>]);
-</code><code id="L3538"><span class="ln">3538</span>                cx<span class="s"> = </span>toFloat(sx[<span class="d">2</span>]);
-</code><code id="L3539"><span class="ln">3539</span>                cy<span class="s"> = </span>toFloat(sx[<span class="d">3</span>]);
-</code><code id="L3540"><span class="ln">3540</span>                isNaN(cx)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span><b>null</b>);
-</code><code id="L3541"><span class="ln">3541</span>                isNaN(cy)<span class="s"> &amp;&amp; </span>(cy<span class="s"> = </span><b>null</b>);
-</code><code id="L3542"><span class="ln">3542</span>            }
-</code><code id="L3543"><span class="ln">3543</span>            sx<span class="s"> = </span>toFloat(sx[<span class="d">0</span>]);
-</code><code id="L3544"><span class="ln">3544</span>            (sy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(sy<span class="s"> = </span>sx);
-</code><code id="L3545"><span class="ln">3545</span>            (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
-</code><code id="L3546"><span class="ln">3546</span>            <b>if</b> (cx<span class="s"> == </span><b>null</b><span class="s"> || </span>cy<span class="s"> == </span><b>null</b>) {
-</code><code id="L3547"><span class="ln">3547</span>                <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
-</code><code id="L3548"><span class="ln">3548</span>            }
-</code><code id="L3549"><span class="ln">3549</span>            cx<span class="s"> = </span>cx<span class="s"> == </span><b>null</b> ? bbox.x<span class="s"> + </span>bbox.width<span class="s"> / </span><span class="d">2</span> : cx;
-</code><code id="L3550"><span class="ln">3550</span>            cy<span class="s"> = </span>cy<span class="s"> == </span><b>null</b> ? bbox.y<span class="s"> + </span>bbox.height<span class="s"> / </span><span class="d">2</span> : cy;
-</code><code id="L3551"><span class="ln">3551</span>            
-</code><code id="L3552"><span class="ln">3552</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"s"</i>, sx, sy, cx, cy]]));
-</code><code id="L3553"><span class="ln">3553</span>            <b>this</b>._.dirtyT<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L3554"><span class="ln">3554</span>            <b>return</b> <b>this</b>;
-</code><code id="L3555"><span class="ln">3555</span>        };
-</code><code id="L3556"><span class="ln">3556</span>        elproto.hide<span class="s"> = </span><b>function</b> () {
-</code><code id="L3557"><span class="ln">3557</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span>(<b>this</b>.node.style.display<span class="s"> = </span><i>"none"</i>);
-</code><code id="L3558"><span class="ln">3558</span>            <b>return</b> <b>this</b>;
-</code><code id="L3559"><span class="ln">3559</span>        };
-</code><code id="L3560"><span class="ln">3560</span>        elproto.show<span class="s"> = </span><b>function</b> () {
-</code><code id="L3561"><span class="ln">3561</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span>(<b>this</b>.node.style.display<span class="s"> = </span>E);
-</code><code id="L3562"><span class="ln">3562</span>            <b>return</b> <b>this</b>;
-</code><code id="L3563"><span class="ln">3563</span>        };
-</code><code id="L3564"><span class="ln">3564</span>        elproto._getBBox<span class="s"> = </span><b>function</b> () {
-</code><code id="L3565"><span class="ln">3565</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L3566"><span class="ln">3566</span>                <b>return</b> {};
-</code><code id="L3567"><span class="ln">3567</span>            }
-</code><code id="L3568"><span class="ln">3568</span>            <b>if</b> (<b>this</b>.type<span class="s"> == </span><i>"text"</i>) {
-</code><code id="L3569"><span class="ln">3569</span>                <b>return</b> {
-</code><code id="L3570"><span class="ln">3570</span>                    x: <b>this</b>.X<span class="s"> + </span>(<b>this</b>.bbx<span class="s"> || </span><span class="d">0</span>)<span class="s"> - </span><b>this</b>.W<span class="s"> / </span><span class="d">2</span>,
-</code><code id="L3571"><span class="ln">3571</span>                    y: <b>this</b>.Y<span class="s"> - </span><b>this</b>.H,
-</code><code id="L3572"><span class="ln">3572</span>                    width: <b>this</b>.W,
-</code><code id="L3573"><span class="ln">3573</span>                    height: <b>this</b>.H
-</code><code id="L3574"><span class="ln">3574</span>                };
-</code><code id="L3575"><span class="ln">3575</span>            } <b>else</b> {
-</code><code id="L3576"><span class="ln">3576</span>                <b>return</b> pathDimensions(<b>this</b>.attrs.path);
-</code><code id="L3577"><span class="ln">3577</span>            }
-</code><code id="L3578"><span class="ln">3578</span>        };
-</code><code id="L3579"><span class="ln">3579</span>        elproto.remove<span class="s"> = </span><b>function</b> () {
-</code><code id="L3580"><span class="ln">3580</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L3581"><span class="ln">3581</span>                <b>return</b>;
-</code><code id="L3582"><span class="ln">3582</span>            }
-</code><code id="L3583"><span class="ln">3583</span>            eve.unbind(<i>"*.*."</i><span class="s"> + </span><b>this</b>.id);
-</code><code id="L3584"><span class="ln">3584</span>            tear(<b>this</b>, <b>this</b>.paper);
-</code><code id="L3585"><span class="ln">3585</span>            <b>this</b>.node.parentNode.removeChild(<b>this</b>.node);
-</code><code id="L3586"><span class="ln">3586</span>            <b>this</b>.shape<span class="s"> &amp;&amp; </span><b>this</b>.shape.parentNode.removeChild(<b>this</b>.shape);
-</code><code id="L3587"><span class="ln">3587</span>            <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
-</code><code id="L3588"><span class="ln">3588</span>                <b>delete</b> <b>this</b>[i];
-</code><code id="L3589"><span class="ln">3589</span>            }
-</code><code id="L3590"><span class="ln">3590</span>            <b>this</b>.removed<span class="s"> = </span><b>true</b>;
-</code><code id="L3591"><span class="ln">3591</span>        };
-</code><code id="L3592"><span class="ln">3592</span>        elproto.attr<span class="s"> = </span><b>function</b> (name, value) {
-</code><code id="L3593"><span class="ln">3593</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L3594"><span class="ln">3594</span>                <b>return</b> <b>this</b>;
-</code><code id="L3595"><span class="ln">3595</span>            }
-</code><code id="L3596"><span class="ln">3596</span>            <b>if</b> (name<span class="s"> == </span><b>null</b>) {
-</code><code id="L3597"><span class="ln">3597</span>                <b>var</b> res<span class="s"> = </span>{};
-</code><code id="L3598"><span class="ln">3598</span>                <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>.attrs) <b>if</b> (<b>this</b>.attrs[has](i)) {
-</code><code id="L3599"><span class="ln">3599</span>                    res[i]<span class="s"> = </span><b>this</b>.attrs[i];
-</code><code id="L3600"><span class="ln">3600</span>                }
-</code><code id="L3601"><span class="ln">3601</span>                res.gradient<span class="s"> &amp;&amp; </span>res.fill<span class="s"> == </span><i>"none"</i><span class="s"> &amp;&amp; </span>(res.fill<span class="s"> = </span>res.gradient)<span class="s"> &amp;&amp; </span><b>delete</b> res.gradient;
-</code><code id="L3602"><span class="ln">3602</span>                <b>return</b> res;
-</code><code id="L3603"><span class="ln">3603</span>            }
-</code><code id="L3604"><span class="ln">3604</span>            <b>if</b> (value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, <i>"string"</i>)) {
-</code><code id="L3605"><span class="ln">3605</span>                <b>if</b> (name<span class="s"> == </span>fillString<span class="s"> &amp;&amp; </span><b>this</b>.attrs.fill<span class="s"> == </span><i>"none"</i><span class="s"> &amp;&amp; </span><b>this</b>.attrs.gradient) {
-</code><code id="L3606"><span class="ln">3606</span>                    <b>return</b> <b>this</b>.attrs.gradient;
-</code><code id="L3607"><span class="ln">3607</span>                }
-</code><code id="L3608"><span class="ln">3608</span>                <b>if</b> (name <b>in</b> <b>this</b>.attrs) {
-</code><code id="L3609"><span class="ln">3609</span>                    <b>return</b> <b>this</b>.attrs[name];
-</code><code id="L3610"><span class="ln">3610</span>                } <b>else</b> <b>if</b> (R.is(<b>this</b>.paper.customAttributes[name], <i>"<b>function</b>"</i>)) {
-</code><code id="L3611"><span class="ln">3611</span>                    <b>return</b> <b>this</b>.paper.customAttributes[name].def;
-</code><code id="L3612"><span class="ln">3612</span>                } <b>else</b> {
-</code><code id="L3613"><span class="ln">3613</span>                    <b>return</b> availableAttrs[name];
-</code><code id="L3614"><span class="ln">3614</span>                }
-</code><code id="L3615"><span class="ln">3615</span>            }
-</code><code id="L3616"><span class="ln">3616</span>            <b>if</b> (<b>this</b>.attrs<span class="s"> &amp;&amp; </span>value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, array)) {
-</code><code id="L3617"><span class="ln">3617</span>                <b>var</b> ii, values<span class="s"> = </span>{};
-</code><code id="L3618"><span class="ln">3618</span>                <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>name.length; i &lt; ii; i++) {
-</code><code id="L3619"><span class="ln">3619</span>                    values[name[i]]<span class="s"> = </span><b>this</b>.attr(name[i]);
-</code><code id="L3620"><span class="ln">3620</span>                }
-</code><code id="L3621"><span class="ln">3621</span>                <b>return</b> values;
-</code><code id="L3622"><span class="ln">3622</span>            }
-</code><code id="L3623"><span class="ln">3623</span>            <b>var</b> params;
-</code><code id="L3624"><span class="ln">3624</span>            <b>if</b> (value != <b>null</b>) {
-</code><code id="L3625"><span class="ln">3625</span>                params<span class="s"> = </span>{};
-</code><code id="L3626"><span class="ln">3626</span>                params[name]<span class="s"> = </span>value;
-</code><code id="L3627"><span class="ln">3627</span>            }
-</code><code id="L3628"><span class="ln">3628</span>            value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, <i>"object"</i>)<span class="s"> &amp;&amp; </span>(params<span class="s"> = </span>name);
-</code><code id="L3629"><span class="ln">3629</span>            <b>for</b> (<b>var</b> key <b>in</b> params) {
-</code><code id="L3630"><span class="ln">3630</span>                eve(<i>"attr."</i><span class="s"> + </span>key<span class="s"> + </span><i>"."</i><span class="s"> + </span><b>this</b>.id, <b>this</b>, params[key]);
-</code><code id="L3631"><span class="ln">3631</span>            }
-</code><code id="L3632"><span class="ln">3632</span>            <b>if</b> (params) {
-</code><code id="L3633"><span class="ln">3633</span>                <b>for</b> (key <b>in</b> <b>this</b>.paper.customAttributes) <b>if</b> (<b>this</b>.paper.customAttributes[has](key)<span class="s"> &amp;&amp; </span>params[has](key)<span class="s"> &amp;&amp; </span>R.is(<b>this</b>.paper.customAttributes[key], <i>"<b>function</b>"</i>)) {
-</code><code id="L3634"><span class="ln">3634</span>                    <b>var</b> par<span class="s"> = </span><b>this</b>.paper.customAttributes[key].apply(<b>this</b>, [][concat](params[key]));
-</code><code id="L3635"><span class="ln">3635</span>                    <b>this</b>.attrs[key]<span class="s"> = </span>params[key];
-</code><code id="L3636"><span class="ln">3636</span>                    <b>for</b> (<b>var</b> subkey <b>in</b> par) <b>if</b> (par[has](subkey)) {
-</code><code id="L3637"><span class="ln">3637</span>                        params[subkey]<span class="s"> = </span>par[subkey];
-</code><code id="L3638"><span class="ln">3638</span>                    }
-</code><code id="L3639"><span class="ln">3639</span>                }
-</code><code id="L3640"><span class="ln">3640</span>                <span class="c">// <b>this</b>.paper.canvas.style.display<span class="s"> = </span><i>"none"</i>;</span>
-</code><code id="L3641"><span class="ln">3641</span>                <b>if</b> (params.text<span class="s"> &amp;&amp; </span><b>this</b>.type<span class="s"> == </span><i>"text"</i>) {
-</code><code id="L3642"><span class="ln">3642</span>                    <b>this</b>.textpath.string<span class="s"> = </span>params.text;
-</code><code id="L3643"><span class="ln">3643</span>                }
-</code><code id="L3644"><span class="ln">3644</span>                setFillAndStroke(<b>this</b>, params);
-</code><code id="L3645"><span class="ln">3645</span>                <span class="c">// <b>this</b>.paper.canvas.style.display<span class="s"> = </span>E;</span>
-</code><code id="L3646"><span class="ln">3646</span>            }
-</code><code id="L3647"><span class="ln">3647</span>            <b>return</b> <b>this</b>;
-</code><code id="L3648"><span class="ln">3648</span>        };
-</code><code id="L3649"><span class="ln">3649</span>        elproto.toFront<span class="s"> = </span><b>function</b> () {
-</code><code id="L3650"><span class="ln">3650</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span><b>this</b>.node.parentNode.appendChild(<b>this</b>.node);
-</code><code id="L3651"><span class="ln">3651</span>            <b>this</b>.paper.top != <b>this</b><span class="s"> &amp;&amp; </span>tofront(<b>this</b>, <b>this</b>.paper);
-</code><code id="L3652"><span class="ln">3652</span>            <b>return</b> <b>this</b>;
-</code><code id="L3653"><span class="ln">3653</span>        };
-</code><code id="L3654"><span class="ln">3654</span>        elproto.toBack<span class="s"> = </span><b>function</b> () {
-</code><code id="L3655"><span class="ln">3655</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L3656"><span class="ln">3656</span>                <b>return</b> <b>this</b>;
-</code><code id="L3657"><span class="ln">3657</span>            }
-</code><code id="L3658"><span class="ln">3658</span>            <b>if</b> (<b>this</b>.node.parentNode.firstChild != <b>this</b>.node) {
-</code><code id="L3659"><span class="ln">3659</span>                <b>this</b>.node.parentNode.insertBefore(<b>this</b>.node, <b>this</b>.node.parentNode.firstChild);
-</code><code id="L3660"><span class="ln">3660</span>                toback(<b>this</b>, <b>this</b>.paper);
-</code><code id="L3661"><span class="ln">3661</span>            }
-</code><code id="L3662"><span class="ln">3662</span>            <b>return</b> <b>this</b>;
-</code><code id="L3663"><span class="ln">3663</span>        };
-</code><code id="L3664"><span class="ln">3664</span>        elproto.insertAfter<span class="s"> = </span><b>function</b> (element) {
-</code><code id="L3665"><span class="ln">3665</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L3666"><span class="ln">3666</span>                <b>return</b> <b>this</b>;
-</code><code id="L3667"><span class="ln">3667</span>            }
-</code><code id="L3668"><span class="ln">3668</span>            <b>if</b> (element.constructor<span class="s"> == </span>Set) {
-</code><code id="L3669"><span class="ln">3669</span>                element<span class="s"> = </span>element[element.length<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L3670"><span class="ln">3670</span>            }
-</code><code id="L3671"><span class="ln">3671</span>            <b>if</b> (element.node.nextSibling) {
-</code><code id="L3672"><span class="ln">3672</span>                element.node.parentNode.insertBefore(<b>this</b>.node, element.node.nextSibling);
-</code><code id="L3673"><span class="ln">3673</span>            } <b>else</b> {
-</code><code id="L3674"><span class="ln">3674</span>                element.node.parentNode.appendChild(<b>this</b>.node);
-</code><code id="L3675"><span class="ln">3675</span>            }
-</code><code id="L3676"><span class="ln">3676</span>            insertafter(<b>this</b>, element, <b>this</b>.paper);
-</code><code id="L3677"><span class="ln">3677</span>            <b>return</b> <b>this</b>;
-</code><code id="L3678"><span class="ln">3678</span>        };
-</code><code id="L3679"><span class="ln">3679</span>        elproto.insertBefore<span class="s"> = </span><b>function</b> (element) {
-</code><code id="L3680"><span class="ln">3680</span>            <b>if</b> (<b>this</b>.removed) {
-</code><code id="L3681"><span class="ln">3681</span>                <b>return</b> <b>this</b>;
-</code><code id="L3682"><span class="ln">3682</span>            }
-</code><code id="L3683"><span class="ln">3683</span>            <b>if</b> (element.constructor<span class="s"> == </span>Set) {
-</code><code id="L3684"><span class="ln">3684</span>                element<span class="s"> = </span>element[<span class="d">0</span>];
-</code><code id="L3685"><span class="ln">3685</span>            }
-</code><code id="L3686"><span class="ln">3686</span>            element.node.parentNode.insertBefore(<b>this</b>.node, element.node);
-</code><code id="L3687"><span class="ln">3687</span>            insertbefore(<b>this</b>, element, <b>this</b>.paper);
-</code><code id="L3688"><span class="ln">3688</span>            <b>return</b> <b>this</b>;
-</code><code id="L3689"><span class="ln">3689</span>        };
-</code><code id="L3690"><span class="ln">3690</span>        elproto.blur<span class="s"> = </span><b>function</b> (size) {
-</code><code id="L3691"><span class="ln">3691</span>            <b>var</b> s<span class="s"> = </span><b>this</b>.node.runtimeStyle,
-</code><code id="L3692"><span class="ln">3692</span>                f<span class="s"> = </span>s.filter;
-</code><code id="L3693"><span class="ln">3693</span>            f<span class="s"> = </span>f.replace(blurregexp, E);
-</code><code id="L3694"><span class="ln">3694</span>            <b>if</b> (+size !== <span class="d">0</span>) {
-</code><code id="L3695"><span class="ln">3695</span>                <b>this</b>.attrs.blur<span class="s"> = </span>size;
-</code><code id="L3696"><span class="ln">3696</span>                s.filter<span class="s"> = </span>f<span class="s"> + </span>S<span class="s"> + </span>ms<span class="s"> + </span><i>".Blur(pixelradius="</i><span class="s"> + </span>(+size<span class="s"> || </span><span class="d">1.5</span>)<span class="s"> + </span><i>")"</i>;
-</code><code id="L3697"><span class="ln">3697</span>                s.margin<span class="s"> = </span>R.format(<i>"-{<span class="d">0</span>}px <span class="d">0</span> <span class="d">0</span> -{<span class="d">0</span>}px"</i>, round(+size<span class="s"> || </span><span class="d">1.5</span>));
-</code><code id="L3698"><span class="ln">3698</span>            } <b>else</b> {
-</code><code id="L3699"><span class="ln">3699</span>                s.filter<span class="s"> = </span>f;
-</code><code id="L3700"><span class="ln">3700</span>                s.margin<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L3701"><span class="ln">3701</span>                <b>delete</b> <b>this</b>.attrs.blur;
-</code><code id="L3702"><span class="ln">3702</span>            }
-</code><code id="L3703"><span class="ln">3703</span>        };
-</code><code id="L3704"><span class="ln">3704</span>
-</code><code id="L3705"><span class="ln">3705</span>        thePath<span class="s"> = </span><b>function</b> (pathString, vml) {
-</code><code id="L3706"><span class="ln">3706</span>            <b>var</b> el<span class="s"> = </span>createNode(<i>"shape"</i>);
-</code><code id="L3707"><span class="ln">3707</span>            el.style.cssText<span class="s"> = </span>cssDot;
-</code><code id="L3708"><span class="ln">3708</span>            el.coordsize<span class="s"> = </span>zoom<span class="s"> + </span>S<span class="s"> + </span>zoom;
-</code><code id="L3709"><span class="ln">3709</span>            el.coordorigin<span class="s"> = </span>vml.coordorigin;
-</code><code id="L3710"><span class="ln">3710</span>            <b>var</b> p<span class="s"> = </span><b>new</b> Element(el, vml),
-</code><code id="L3711"><span class="ln">3711</span>                attr<span class="s"> = </span>{fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>};
-</code><code id="L3712"><span class="ln">3712</span>            pathString<span class="s"> &amp;&amp; </span>(attr.path<span class="s"> = </span>pathString);
-</code><code id="L3713"><span class="ln">3713</span>            p.type<span class="s"> = </span><i>"path"</i>;
-</code><code id="L3714"><span class="ln">3714</span>            p.path<span class="s"> = </span>[];
-</code><code id="L3715"><span class="ln">3715</span>            p.Path<span class="s"> = </span>E;
-</code><code id="L3716"><span class="ln">3716</span>            setFillAndStroke(p, attr);
-</code><code id="L3717"><span class="ln">3717</span>            vml.canvas.appendChild(el);
-</code><code id="L3718"><span class="ln">3718</span>            <b>var</b> skew<span class="s"> = </span>createNode(<i>"skew"</i>);
-</code><code id="L3719"><span class="ln">3719</span>            skew.on<span class="s"> = </span><b>true</b>;
-</code><code id="L3720"><span class="ln">3720</span>            el.appendChild(skew);
-</code><code id="L3721"><span class="ln">3721</span>            p.skew<span class="s"> = </span>skew;
-</code><code id="L3722"><span class="ln">3722</span>            p.transform(E);
-</code><code id="L3723"><span class="ln">3723</span>            <b>return</b> p;
-</code><code id="L3724"><span class="ln">3724</span>        };
-</code><code id="L3725"><span class="ln">3725</span>        theRect<span class="s"> = </span><b>function</b> (vml, x, y, w, h, r) {
-</code><code id="L3726"><span class="ln">3726</span>            <b>var</b> path<span class="s"> = </span>rectPath(x, y, w, h, r),
-</code><code id="L3727"><span class="ln">3727</span>                res<span class="s"> = </span>vml.path(path),
-</code><code id="L3728"><span class="ln">3728</span>                a<span class="s"> = </span>res.attrs;
-</code><code id="L3729"><span class="ln">3729</span>            res.X<span class="s"> = </span>a.x<span class="s"> = </span>x;
-</code><code id="L3730"><span class="ln">3730</span>            res.Y<span class="s"> = </span>a.y<span class="s"> = </span>y;
-</code><code id="L3731"><span class="ln">3731</span>            res.W<span class="s"> = </span>a.width<span class="s"> = </span>w;
-</code><code id="L3732"><span class="ln">3732</span>            res.H<span class="s"> = </span>a.height<span class="s"> = </span>h;
-</code><code id="L3733"><span class="ln">3733</span>            a.r<span class="s"> = </span>r;
-</code><code id="L3734"><span class="ln">3734</span>            a.path<span class="s"> = </span>path;
-</code><code id="L3735"><span class="ln">3735</span>            res.type<span class="s"> = </span><i>"rect"</i>;
-</code><code id="L3736"><span class="ln">3736</span>            <b>return</b> res;
-</code><code id="L3737"><span class="ln">3737</span>        };
-</code><code id="L3738"><span class="ln">3738</span>        theEllipse<span class="s"> = </span><b>function</b> (vml, x, y, rx, ry) {
-</code><code id="L3739"><span class="ln">3739</span>            <b>var</b> res<span class="s"> = </span>vml.path(),
-</code><code id="L3740"><span class="ln">3740</span>                a<span class="s"> = </span>res.attrs;
-</code><code id="L3741"><span class="ln">3741</span>            res.X<span class="s"> = </span>x<span class="s"> - </span>rx;
-</code><code id="L3742"><span class="ln">3742</span>            res.Y<span class="s"> = </span>y<span class="s"> - </span>ry;
-</code><code id="L3743"><span class="ln">3743</span>            res.W<span class="s"> = </span>rx<span class="s"> * </span><span class="d">2</span>;
-</code><code id="L3744"><span class="ln">3744</span>            res.H<span class="s"> = </span>ry<span class="s"> * </span><span class="d">2</span>;
-</code><code id="L3745"><span class="ln">3745</span>            res.type<span class="s"> = </span><i>"ellipse"</i>;
-</code><code id="L3746"><span class="ln">3746</span>            setFillAndStroke(res, {
-</code><code id="L3747"><span class="ln">3747</span>                cx: x,
-</code><code id="L3748"><span class="ln">3748</span>                cy: y,
-</code><code id="L3749"><span class="ln">3749</span>                rx: rx,
-</code><code id="L3750"><span class="ln">3750</span>                ry: ry
-</code><code id="L3751"><span class="ln">3751</span>            });
-</code><code id="L3752"><span class="ln">3752</span>            <b>return</b> res;
-</code><code id="L3753"><span class="ln">3753</span>        };
-</code><code id="L3754"><span class="ln">3754</span>        theCircle<span class="s"> = </span><b>function</b> (vml, x, y, r) {
-</code><code id="L3755"><span class="ln">3755</span>            <b>var</b> res<span class="s"> = </span>vml.path(),
-</code><code id="L3756"><span class="ln">3756</span>                a<span class="s"> = </span>res.attrs;
-</code><code id="L3757"><span class="ln">3757</span>            res.X<span class="s"> = </span>x<span class="s"> - </span>r;
-</code><code id="L3758"><span class="ln">3758</span>            res.Y<span class="s"> = </span>y<span class="s"> - </span>r;
-</code><code id="L3759"><span class="ln">3759</span>            res.W<span class="s"> = </span>res.H<span class="s"> = </span>r<span class="s"> * </span><span class="d">2</span>;
-</code><code id="L3760"><span class="ln">3760</span>            res.type<span class="s"> = </span><i>"circle"</i>;
-</code><code id="L3761"><span class="ln">3761</span>            setFillAndStroke(res, {
-</code><code id="L3762"><span class="ln">3762</span>                cx: x,
-</code><code id="L3763"><span class="ln">3763</span>                cy: y,
-</code><code id="L3764"><span class="ln">3764</span>                r: r
-</code><code id="L3765"><span class="ln">3765</span>            });
-</code><code id="L3766"><span class="ln">3766</span>            <b>return</b> res;
-</code><code id="L3767"><span class="ln">3767</span>        };
-</code><code id="L3768"><span class="ln">3768</span>        theImage<span class="s"> = </span><b>function</b> (vml, src, x, y, w, h) {
-</code><code id="L3769"><span class="ln">3769</span>            <b>var</b> path<span class="s"> = </span>rectPath(x, y, w, h),
-</code><code id="L3770"><span class="ln">3770</span>                res<span class="s"> = </span>vml.path(path).attr({stroke: <i>"none"</i>}),
-</code><code id="L3771"><span class="ln">3771</span>                a<span class="s"> = </span>res.attrs,
-</code><code id="L3772"><span class="ln">3772</span>                node<span class="s"> = </span>res.node,
-</code><code id="L3773"><span class="ln">3773</span>                fill<span class="s"> = </span>node.getElementsByTagName(fillString)[<span class="d">0</span>];
-</code><code id="L3774"><span class="ln">3774</span>            a.src<span class="s"> = </span>src;
-</code><code id="L3775"><span class="ln">3775</span>            res.X<span class="s"> = </span>a.x<span class="s"> = </span>x;
-</code><code id="L3776"><span class="ln">3776</span>            res.Y<span class="s"> = </span>a.y<span class="s"> = </span>y;
-</code><code id="L3777"><span class="ln">3777</span>            res.W<span class="s"> = </span>a.width<span class="s"> = </span>w;
-</code><code id="L3778"><span class="ln">3778</span>            res.H<span class="s"> = </span>a.height<span class="s"> = </span>h;
-</code><code id="L3779"><span class="ln">3779</span>            a.path<span class="s"> = </span>path;
-</code><code id="L3780"><span class="ln">3780</span>            res.type<span class="s"> = </span><i>"image"</i>;
-</code><code id="L3781"><span class="ln">3781</span>            fill.parentNode<span class="s"> == </span>node<span class="s"> &amp;&amp; </span>node.removeChild(fill);
-</code><code id="L3782"><span class="ln">3782</span>            fill.rotate<span class="s"> = </span><b>true</b>;
-</code><code id="L3783"><span class="ln">3783</span>            fill.src<span class="s"> = </span>src;
-</code><code id="L3784"><span class="ln">3784</span>            fill.type<span class="s"> = </span><i>"tile"</i>;
-</code><code id="L3785"><span class="ln">3785</span>            res._.fillpos<span class="s"> = </span>[x, y];
-</code><code id="L3786"><span class="ln">3786</span>            res._.fillsize<span class="s"> = </span>[w, h];
-</code><code id="L3787"><span class="ln">3787</span>            node.appendChild(fill);
-</code><code id="L3788"><span class="ln">3788</span>            setCoords(res);
-</code><code id="L3789"><span class="ln">3789</span>            <b>return</b> res;
-</code><code id="L3790"><span class="ln">3790</span>        };
-</code><code id="L3791"><span class="ln">3791</span>        theText<span class="s"> = </span><b>function</b> (vml, x, y, text) {
-</code><code id="L3792"><span class="ln">3792</span>            <b>var</b> el<span class="s"> = </span>createNode(<i>"shape"</i>),
-</code><code id="L3793"><span class="ln">3793</span>                path<span class="s"> = </span>createNode(<i>"path"</i>),
-</code><code id="L3794"><span class="ln">3794</span>                o<span class="s"> = </span>createNode(<i>"textpath"</i>);
-</code><code id="L3795"><span class="ln">3795</span>            x<span class="s"> = </span>x<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L3796"><span class="ln">3796</span>            y<span class="s"> = </span>y<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L3797"><span class="ln">3797</span>            text<span class="s"> = </span>text<span class="s"> || </span><i>""</i>;
-</code><code id="L3798"><span class="ln">3798</span>            path.v<span class="s"> = </span>R.format(<i>"m{<span class="d">0</span>},{<span class="d">1</span>}l{<span class="d">2</span>},{<span class="d">1</span>}"</i>, round(x<span class="s"> * </span>zoom), round(y<span class="s"> * </span>zoom), round(x<span class="s"> * </span>zoom)<span class="s"> + </span><span class="d">1</span>);
-</code><code id="L3799"><span class="ln">3799</span>            path.textpathok<span class="s"> = </span><b>true</b>;
-</code><code id="L3800"><span class="ln">3800</span>            o.string<span class="s"> = </span>Str(text);
-</code><code id="L3801"><span class="ln">3801</span>            o.on<span class="s"> = </span><b>true</b>;
-</code><code id="L3802"><span class="ln">3802</span>            el.style.cssText<span class="s"> = </span><i>"position:absolute;left:<span class="d">0</span>;top:<span class="d">0</span>;width:<span class="d">1</span>;height:<span class="d">1</span>"</i>;
-</code><code id="L3803"><span class="ln">3803</span>            el.coordsize<span class="s"> = </span>zoom<span class="s"> + </span>S<span class="s"> + </span>zoom;
-</code><code id="L3804"><span class="ln">3804</span>            el.coordorigin<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span>"</i>;
-</code><code id="L3805"><span class="ln">3805</span>            <b>var</b> p<span class="s"> = </span><b>new</b> Element(el, vml),
-</code><code id="L3806"><span class="ln">3806</span>                attr<span class="s"> = </span>{fill: <i>"#<span class="d">000</span>"</i>, stroke: <i>"none"</i>, font: availableAttrs.font, text: text};
-</code><code id="L3807"><span class="ln">3807</span>            p.shape<span class="s"> = </span>el;
-</code><code id="L3808"><span class="ln">3808</span>            p.path<span class="s"> = </span>path;
-</code><code id="L3809"><span class="ln">3809</span>            p.textpath<span class="s"> = </span>o;
-</code><code id="L3810"><span class="ln">3810</span>            p.type<span class="s"> = </span><i>"text"</i>;
-</code><code id="L3811"><span class="ln">3811</span>            p.attrs.text<span class="s"> = </span>Str(text);
-</code><code id="L3812"><span class="ln">3812</span>            p.attrs.x<span class="s"> = </span>x;
-</code><code id="L3813"><span class="ln">3813</span>            p.attrs.y<span class="s"> = </span>y;
-</code><code id="L3814"><span class="ln">3814</span>            p.attrs.w<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L3815"><span class="ln">3815</span>            p.attrs.h<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L3816"><span class="ln">3816</span>            setFillAndStroke(p, attr);
-</code><code id="L3817"><span class="ln">3817</span>            el.appendChild(o);
-</code><code id="L3818"><span class="ln">3818</span>            el.appendChild(path);
-</code><code id="L3819"><span class="ln">3819</span>            vml.canvas.appendChild(el);
-</code><code id="L3820"><span class="ln">3820</span>            <b>var</b> skew<span class="s"> = </span>createNode(<i>"skew"</i>);
-</code><code id="L3821"><span class="ln">3821</span>            skew.on<span class="s"> = </span><b>true</b>;
-</code><code id="L3822"><span class="ln">3822</span>            el.appendChild(skew);
-</code><code id="L3823"><span class="ln">3823</span>            p.skew<span class="s"> = </span>skew;
-</code><code id="L3824"><span class="ln">3824</span>            p.transform(E);
-</code><code id="L3825"><span class="ln">3825</span>            <b>return</b> p;
-</code><code id="L3826"><span class="ln">3826</span>        };
-</code><code id="L3827"><span class="ln">3827</span>        setSize<span class="s"> = </span><b>function</b> (width, height) {
-</code><code id="L3828"><span class="ln">3828</span>            <b>var</b> cs<span class="s"> = </span><b>this</b>.canvas.style;
-</code><code id="L3829"><span class="ln">3829</span>            <b>this</b>.width<span class="s"> = </span>width;
-</code><code id="L3830"><span class="ln">3830</span>            <b>this</b>.height<span class="s"> = </span>height;
-</code><code id="L3831"><span class="ln">3831</span>            width<span class="s"> == </span>+width<span class="s"> &amp;&amp; </span>(width += <i>"px"</i>);
-</code><code id="L3832"><span class="ln">3832</span>            height<span class="s"> == </span>+height<span class="s"> &amp;&amp; </span>(height += <i>"px"</i>);
-</code><code id="L3833"><span class="ln">3833</span>            cs.width<span class="s"> = </span>width;
-</code><code id="L3834"><span class="ln">3834</span>            cs.height<span class="s"> = </span>height;
-</code><code id="L3835"><span class="ln">3835</span>            cs.clip<span class="s"> = </span><i>"rect(<span class="d">0</span> "</i><span class="s"> + </span>width<span class="s"> + </span><i>" "</i><span class="s"> + </span>height<span class="s"> + </span><i>" <span class="d">0</span>)"</i>;
-</code><code id="L3836"><span class="ln">3836</span>            <b>if</b> (<b>this</b>._viewBox) {
-</code><code id="L3837"><span class="ln">3837</span>                setViewBox.apply(<b>this</b>, <b>this</b>._viewBox);
-</code><code id="L3838"><span class="ln">3838</span>            }
-</code><code id="L3839"><span class="ln">3839</span>            <b>return</b> <b>this</b>;
-</code><code id="L3840"><span class="ln">3840</span>        };
-</code><code id="L3841"><span class="ln">3841</span>        setViewBox<span class="s"> = </span><b>function</b> (x, y, w, h, fit) {
-</code><code id="L3842"><span class="ln">3842</span>            eve(<i>"setViewBox"</i>, <b>this</b>, <b>this</b>._viewBox, [x, y, w, h, fit]);
-</code><code id="L3843"><span class="ln">3843</span>            <b>var</b> width<span class="s"> = </span><b>this</b>.width,
-</code><code id="L3844"><span class="ln">3844</span>                height<span class="s"> = </span><b>this</b>.height,
-</code><code id="L3845"><span class="ln">3845</span>                size<span class="s"> = </span><span class="d">1e3</span><span class="s"> * </span>mmax(w<span class="s"> / </span>width, h<span class="s"> / </span>height),
-</code><code id="L3846"><span class="ln">3846</span>                H, W;
-</code><code id="L3847"><span class="ln">3847</span>            <b>if</b> (fit) {
-</code><code id="L3848"><span class="ln">3848</span>                H<span class="s"> = </span>height<span class="s"> / </span>h;
-</code><code id="L3849"><span class="ln">3849</span>                W<span class="s"> = </span>width<span class="s"> / </span>w;
-</code><code id="L3850"><span class="ln">3850</span>                <b>if</b> (w<span class="s"> * </span>H &lt; width) {
-</code><code id="L3851"><span class="ln">3851</span>                    x -= (width<span class="s"> - </span>w<span class="s"> * </span>H)<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>H;
-</code><code id="L3852"><span class="ln">3852</span>                }
-</code><code id="L3853"><span class="ln">3853</span>                <b>if</b> (h<span class="s"> * </span>W &lt; height) {
-</code><code id="L3854"><span class="ln">3854</span>                    y -= (height<span class="s"> - </span>h<span class="s"> * </span>W)<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>W;
-</code><code id="L3855"><span class="ln">3855</span>                }
-</code><code id="L3856"><span class="ln">3856</span>            }
-</code><code id="L3857"><span class="ln">3857</span>            <b>this</b>._viewBox<span class="s"> = </span>[x, y, w, h, !!fit];
-</code><code id="L3858"><span class="ln">3858</span>            <b>this</b>.forEach(<b>function</b> (el) {
-</code><code id="L3859"><span class="ln">3859</span>                el.transform(<i>"..."</i>);
-</code><code id="L3860"><span class="ln">3860</span>            });
-</code><code id="L3861"><span class="ln">3861</span>            <b>return</b> <b>this</b>;
-</code><code id="L3862"><span class="ln">3862</span>        };
-</code><code id="L3863"><span class="ln">3863</span>        <b>var</b> createNode,
-</code><code id="L3864"><span class="ln">3864</span>            initWin<span class="s"> = </span><b>function</b> (win) {
-</code><code id="L3865"><span class="ln">3865</span>                <b>var</b> doc<span class="s"> = </span>win.document;
-</code><code id="L3866"><span class="ln">3866</span>                doc.createStyleSheet().addRule(<i>".rvml"</i>, <i>"behavior:url(#<b>default</b>#VML)"</i>);
-</code><code id="L3867"><span class="ln">3867</span>                <b>try</b> {
-</code><code id="L3868"><span class="ln">3868</span>                    !doc.namespaces.rvml<span class="s"> &amp;&amp; </span>doc.namespaces.add(<i>"rvml"</i>, <i>"urn:schemas-microsoft-com:vml"</i>);
-</code><code id="L3869"><span class="ln">3869</span>                    createNode<span class="s"> = </span><b>function</b> (tagName) {
-</code><code id="L3870"><span class="ln">3870</span>                        <b>return</b> doc.createElement(<i>'&lt;rvml:'</i><span class="s"> + </span>tagName<span class="s"> + </span><i>' <b>class</b>="rvml">'</i>);
-</code><code id="L3871"><span class="ln">3871</span>                    };
-</code><code id="L3872"><span class="ln">3872</span>                } <b>catch</b> (e) {
-</code><code id="L3873"><span class="ln">3873</span>                    createNode<span class="s"> = </span><b>function</b> (tagName) {
-</code><code id="L3874"><span class="ln">3874</span>                        <b>return</b> doc.createElement(<i>'&lt;'</i><span class="s"> + </span>tagName<span class="s"> + </span><i>' xmlns="urn:schemas-microsoft.com:vml" <b>class</b>="rvml">'</i>);
-</code><code id="L3875"><span class="ln">3875</span>                    };
-</code><code id="L3876"><span class="ln">3876</span>                }
-</code><code id="L3877"><span class="ln">3877</span>            };
-</code><code id="L3878"><span class="ln">3878</span>        initWin(g.win);
-</code><code id="L3879"><span class="ln">3879</span>        create<span class="s"> = </span><b>function</b> () {
-</code><code id="L3880"><span class="ln">3880</span>            <b>var</b> con<span class="s"> = </span>getContainer[apply](<span class="d">0</span>, arguments),
-</code><code id="L3881"><span class="ln">3881</span>                container<span class="s"> = </span>con.container,
-</code><code id="L3882"><span class="ln">3882</span>                height<span class="s"> = </span>con.height,
-</code><code id="L3883"><span class="ln">3883</span>                s,
-</code><code id="L3884"><span class="ln">3884</span>                width<span class="s"> = </span>con.width,
-</code><code id="L3885"><span class="ln">3885</span>                x<span class="s"> = </span>con.x,
-</code><code id="L3886"><span class="ln">3886</span>                y<span class="s"> = </span>con.y;
-</code><code id="L3887"><span class="ln">3887</span>            <b>if</b> (!container) {
-</code><code id="L3888"><span class="ln">3888</span>                <b>throw</b> <b>new</b> Error(<i>"VML container not found."</i>);
-</code><code id="L3889"><span class="ln">3889</span>            }
-</code><code id="L3890"><span class="ln">3890</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Paper,
-</code><code id="L3891"><span class="ln">3891</span>                c<span class="s"> = </span>res.canvas<span class="s"> = </span>g.doc.createElement(<i>"div"</i>),
-</code><code id="L3892"><span class="ln">3892</span>                cs<span class="s"> = </span>c.style;
-</code><code id="L3893"><span class="ln">3893</span>            x<span class="s"> = </span>x<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L3894"><span class="ln">3894</span>            y<span class="s"> = </span>y<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L3895"><span class="ln">3895</span>            width<span class="s"> = </span>width<span class="s"> || </span><span class="d">512</span>;
-</code><code id="L3896"><span class="ln">3896</span>            height<span class="s"> = </span>height<span class="s"> || </span><span class="d">342</span>;
-</code><code id="L3897"><span class="ln">3897</span>            res.width<span class="s"> = </span>width;
-</code><code id="L3898"><span class="ln">3898</span>            res.height<span class="s"> = </span>height;
-</code><code id="L3899"><span class="ln">3899</span>            width<span class="s"> == </span>+width<span class="s"> &amp;&amp; </span>(width += <i>"px"</i>);
-</code><code id="L3900"><span class="ln">3900</span>            height<span class="s"> == </span>+height<span class="s"> &amp;&amp; </span>(height += <i>"px"</i>);
-</code><code id="L3901"><span class="ln">3901</span>            res.coordsize<span class="s"> = </span>zoom<span class="s"> * </span><span class="d">1e3</span><span class="s"> + </span>S<span class="s"> + </span>zoom<span class="s"> * </span><span class="d">1e3</span>;
-</code><code id="L3902"><span class="ln">3902</span>            res.coordorigin<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span>"</i>;
-</code><code id="L3903"><span class="ln">3903</span>            res.span<span class="s"> = </span>g.doc.createElement(<i>"span"</i>);
-</code><code id="L3904"><span class="ln">3904</span>            res.span.style.cssText<span class="s"> = </span><i>"position:absolute;left:-9999em;top:-9999em;padding:<span class="d">0</span>;margin:<span class="d">0</span>;line-height:<span class="d">1</span>;"</i>;
-</code><code id="L3905"><span class="ln">3905</span>            c.appendChild(res.span);
-</code><code id="L3906"><span class="ln">3906</span>            cs.cssText<span class="s"> = </span>R.format(<i>"top:<span class="d">0</span>;left:<span class="d">0</span>;width:{<span class="d">0</span>};height:{<span class="d">1</span>};display:inline-block;position:relative;clip:rect(<span class="d">0</span> {<span class="d">0</span>} {<span class="d">1</span>} <span class="d">0</span>);overflow:hidden"</i>, width, height);
-</code><code id="L3907"><span class="ln">3907</span>            <b>if</b> (container<span class="s"> == </span><span class="d">1</span>) {
-</code><code id="L3908"><span class="ln">3908</span>                g.doc.body.appendChild(c);
-</code><code id="L3909"><span class="ln">3909</span>                cs.left<span class="s"> = </span>x<span class="s"> + </span><i>"px"</i>;
-</code><code id="L3910"><span class="ln">3910</span>                cs.top<span class="s"> = </span>y<span class="s"> + </span><i>"px"</i>;
-</code><code id="L3911"><span class="ln">3911</span>                cs.position<span class="s"> = </span><i>"absolute"</i>;
-</code><code id="L3912"><span class="ln">3912</span>            } <b>else</b> {
-</code><code id="L3913"><span class="ln">3913</span>                <b>if</b> (container.firstChild) {
-</code><code id="L3914"><span class="ln">3914</span>                    container.insertBefore(c, container.firstChild);
-</code><code id="L3915"><span class="ln">3915</span>                } <b>else</b> {
-</code><code id="L3916"><span class="ln">3916</span>                    container.appendChild(c);
-</code><code id="L3917"><span class="ln">3917</span>                }
-</code><code id="L3918"><span class="ln">3918</span>            }
-</code><code id="L3919"><span class="ln">3919</span>            plugins.call(res, res, R.fn);
-</code><code id="L3920"><span class="ln">3920</span>            <b>return</b> res;
-</code><code id="L3921"><span class="ln">3921</span>        };
-</code><code id="L3922"><span class="ln">3922</span>        paperproto.clear<span class="s"> = </span><b>function</b> () {
-</code><code id="L3923"><span class="ln">3923</span>            eve(<i>"clear"</i>, <b>this</b>);
-</code><code id="L3924"><span class="ln">3924</span>            <b>this</b>.canvas.innerHTML<span class="s"> = </span>E;
-</code><code id="L3925"><span class="ln">3925</span>            <b>this</b>.span<span class="s"> = </span>g.doc.createElement(<i>"span"</i>);
-</code><code id="L3926"><span class="ln">3926</span>            <b>this</b>.span.style.cssText<span class="s"> = </span><i>"position:absolute;left:-9999em;top:-9999em;padding:<span class="d">0</span>;margin:<span class="d">0</span>;line-height:<span class="d">1</span>;display:inline;"</i>;
-</code><code id="L3927"><span class="ln">3927</span>            <b>this</b>.canvas.appendChild(<b>this</b>.span);
-</code><code id="L3928"><span class="ln">3928</span>            <b>this</b>.bottom<span class="s"> = </span><b>this</b>.top<span class="s"> = </span><b>null</b>;
-</code><code id="L3929"><span class="ln">3929</span>        };
-</code><code id="L3930"><span class="ln">3930</span>        paperproto.remove<span class="s"> = </span><b>function</b> () {
-</code><code id="L3931"><span class="ln">3931</span>            eve(<i>"remove"</i>, <b>this</b>);
-</code><code id="L3932"><span class="ln">3932</span>            <b>this</b>.canvas.parentNode.removeChild(<b>this</b>.canvas);
-</code><code id="L3933"><span class="ln">3933</span>            <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
-</code><code id="L3934"><span class="ln">3934</span>                <b>this</b>[i]<span class="s"> = </span>removed(i);
-</code><code id="L3935"><span class="ln">3935</span>            }
-</code><code id="L3936"><span class="ln">3936</span>            <b>return</b> <b>true</b>;
-</code><code id="L3937"><span class="ln">3937</span>        };
-</code><code id="L3938"><span class="ln">3938</span>    }
-</code><code id="L3939"><span class="ln">3939</span> 
-</code><code id="L3940"><span class="ln">3940</span>    <span class="c">// WebKit rendering bug workaround method</span>
-</code><code id="L3941"><span class="ln">3941</span>    <b>var</b> version<span class="s"> = </span>navigator.userAgent.match(/Version\/(.*?)\s/)<span class="s"> || </span>navigator.userAgent.match(/Chrome\/(\d+)/);
-</code><code id="L3942"><span class="ln">3942</span>    <b>if</b> ((navigator.vendor<span class="s"> == </span><i>"Apple Computer, Inc."</i>)<span class="s"> &amp;&amp; </span>(version<span class="s"> &amp;&amp; </span>version[<span class="d">1</span>] &lt; <span class="d">4</span><span class="s"> || </span>navigator.platform.slice(<span class="d">0</span>, <span class="d">2</span>)<span class="s"> == </span><i>"iP"</i>) ||
-</code><code id="L3943"><span class="ln">3943</span>        (navigator.vendor<span class="s"> == </span><i>"Google Inc."</i><span class="s"> &amp;&amp; </span>version<span class="s"> &amp;&amp; </span>version[<span class="d">1</span>] &lt; <span class="d">8</span>)) {
-</code><code id="L3944"><span class="ln">3944</span><span class="c">        <span class="c">/*\</span>
-</span></code><code id="L3945"><span class="ln">3945</span><span class="c">        <span class="s"> * </span>Paper.safari
-</span></code><code id="L3946"><span class="ln">3946</span><span class="c">         [ method ]
-</span></code><code id="L3947"><span class="ln">3947</span><span class="c">         **
-</span></code><code id="L3948"><span class="ln">3948</span><span class="c">        <span class="s"> * </span>Adds event handlers <b>for</b> hover <b>for</b> the element.
-</span></code><code id="L3949"><span class="ln">3949</span><span class="c">         > Parameters
-</span></code><code id="L3950"><span class="ln">3950</span><span class="c">        <span class="s"> - </span>f_in (<b>function</b>) handler <b>for</b> hover <b>in</b>
-</span></code><code id="L3951"><span class="ln">3951</span><span class="c">        <span class="s"> - </span>f_out (<b>function</b>) handler <b>for</b> hover out
-</span></code><code id="L3952"><span class="ln">3952</span><span class="c">        <span class="s"> - </span>icontext (object) #optional context <b>for</b> hover <b>in</b> handler
-</span></code><code id="L3953"><span class="ln">3953</span><span class="c">        <span class="s"> - </span>ocontext (object) #optional context <b>for</b> hover out handler
-</span></code><code id="L3954"><span class="ln">3954</span><span class="c">        <span class="s"> = </span>(object) @Element
-</span></code><code id="L3955"><span class="ln">3955</span><span class="c">        \*/</span>
-</code><code id="L3956"><span class="ln">3956</span>        paperproto.safari<span class="s"> = </span><b>function</b> () {
-</code><code id="L3957"><span class="ln">3957</span>            <b>var</b> rect<span class="s"> = </span><b>this</b>.rect(-<span class="d">99</span>, -<span class="d">99</span>, <b>this</b>.width<span class="s"> + </span><span class="d">99</span>, <b>this</b>.height<span class="s"> + </span><span class="d">99</span>).attr({stroke: <i>"none"</i>});
-</code><code id="L3958"><span class="ln">3958</span>            setTimeout(<b>function</b> () {rect.remove();});
-</code><code id="L3959"><span class="ln">3959</span>        };
-</code><code id="L3960"><span class="ln">3960</span>    } <b>else</b> {
-</code><code id="L3961"><span class="ln">3961</span>        paperproto.safari<span class="s"> = </span>fun;
-</code><code id="L3962"><span class="ln">3962</span>    }
-</code><code id="L3963"><span class="ln">3963</span> 
-</code><code id="L3964"><span class="ln">3964</span>    <span class="c">// Events</span>
-</code><code id="L3965"><span class="ln">3965</span>    <b>var</b> preventDefault<span class="s"> = </span><b>function</b> () {
-</code><code id="L3966"><span class="ln">3966</span>        <b>this</b>.returnValue<span class="s"> = </span><b>false</b>;
+</code><code id="L3155"><span class="ln">3155</span>
+</code><code id="L3156"><span class="ln">3156</span>            <b>for</b> (<b>var</b> par <b>in</b> params) <b>if</b> (params[has](par)) {
+</code><code id="L3157"><span class="ln">3157</span>                a[par]<span class="s"> = </span>params[par];
+</code><code id="L3158"><span class="ln">3158</span>            }
+</code><code id="L3159"><span class="ln">3159</span>            <b>if</b> (newpath) {
+</code><code id="L3160"><span class="ln">3160</span>                a.path<span class="s"> = </span>getPath[o.type](o);
+</code><code id="L3161"><span class="ln">3161</span>                o._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L3162"><span class="ln">3162</span>            }
+</code><code id="L3163"><span class="ln">3163</span>            params.href<span class="s"> &amp;&amp; </span>(node.href<span class="s"> = </span>params.href);
+</code><code id="L3164"><span class="ln">3164</span>            params.title<span class="s"> &amp;&amp; </span>(node.title<span class="s"> = </span>params.title);
+</code><code id="L3165"><span class="ln">3165</span>            params.target<span class="s"> &amp;&amp; </span>(node.target<span class="s"> = </span>params.target);
+</code><code id="L3166"><span class="ln">3166</span>            params.cursor<span class="s"> &amp;&amp; </span>(s.cursor<span class="s"> = </span>params.cursor);
+</code><code id="L3167"><span class="ln">3167</span>            <i>"blur"</i> <b>in</b> params<span class="s"> &amp;&amp; </span>o.blur(params.blur);
+</code><code id="L3168"><span class="ln">3168</span>            <i>"transform"</i> <b>in</b> params<span class="s"> &amp;&amp; </span>o.transform(params.transform);
+</code><code id="L3169"><span class="ln">3169</span>            <b>if</b> (params.path<span class="s"> &amp;&amp; </span>o.type<span class="s"> == </span><i>"path"</i><span class="s"> || </span>newpath) {
+</code><code id="L3170"><span class="ln">3170</span>                node.path<span class="s"> = </span>path2vml(a.path);
+</code><code id="L3171"><span class="ln">3171</span>            }
+</code><code id="L3172"><span class="ln">3172</span>            <b>if</b> (isOval) {
+</code><code id="L3173"><span class="ln">3173</span>                <b>var</b> cx<span class="s"> = </span>a.cx,
+</code><code id="L3174"><span class="ln">3174</span>                    cy<span class="s"> = </span>a.cy,
+</code><code id="L3175"><span class="ln">3175</span>                    rx<span class="s"> = </span>a.rx<span class="s"> || </span>a.r<span class="s"> || </span><span class="d">0</span>,
+</code><code id="L3176"><span class="ln">3176</span>                    ry<span class="s"> = </span>a.ry<span class="s"> || </span>a.r<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L3177"><span class="ln">3177</span>                node.path<span class="s"> = </span>R.format(<i>"ar{<span class="d">0</span>},{<span class="d">1</span>},{<span class="d">2</span>},{<span class="d">3</span>},{<span class="d">4</span>},{<span class="d">1</span>},{<span class="d">4</span>},{<span class="d">1</span>}x"</i>, round((cx<span class="s"> - </span>rx)<span class="s"> * </span>zoom), round((cy<span class="s"> - </span>ry)<span class="s"> * </span>zoom), round((cx<span class="s"> + </span>rx)<span class="s"> * </span>zoom), round((cy<span class="s"> + </span>ry)<span class="s"> * </span>zoom), round(cx<span class="s"> * </span>zoom));
+</code><code id="L3178"><span class="ln">3178</span>            }
+</code><code id="L3179"><span class="ln">3179</span>            <b>if</b> (<i>"clip-rect"</i> <b>in</b> params) {
+</code><code id="L3180"><span class="ln">3180</span>                <b>var</b> rect<span class="s"> = </span>Str(params[<i>"clip-rect"</i>]).split(separator);
+</code><code id="L3181"><span class="ln">3181</span>                <b>if</b> (rect.length<span class="s"> == </span><span class="d">4</span>) {
+</code><code id="L3182"><span class="ln">3182</span>                    rect[<span class="d">2</span>]<span class="s"> = </span>+rect[<span class="d">2</span>]<span class="s"> + </span>(+rect[<span class="d">0</span>]);
+</code><code id="L3183"><span class="ln">3183</span>                    rect[<span class="d">3</span>]<span class="s"> = </span>+rect[<span class="d">3</span>]<span class="s"> + </span>(+rect[<span class="d">1</span>]);
+</code><code id="L3184"><span class="ln">3184</span>                    <b>var</b> div<span class="s"> = </span>node.clipRect<span class="s"> || </span>g.doc.createElement(<i>"div"</i>),
+</code><code id="L3185"><span class="ln">3185</span>                        dstyle<span class="s"> = </span>div.style,
+</code><code id="L3186"><span class="ln">3186</span>                        group<span class="s"> = </span>node.parentNode;
+</code><code id="L3187"><span class="ln">3187</span>                    dstyle.clip<span class="s"> = </span>R.format(<i>"rect({<span class="d">1</span>}px {<span class="d">2</span>}px {<span class="d">3</span>}px {<span class="d">0</span>}px)"</i>, rect);
+</code><code id="L3188"><span class="ln">3188</span>                    <b>if</b> (!node.clipRect) {
+</code><code id="L3189"><span class="ln">3189</span>                        dstyle.position<span class="s"> = </span><i>"absolute"</i>;
+</code><code id="L3190"><span class="ln">3190</span>                        dstyle.top<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L3191"><span class="ln">3191</span>                        dstyle.left<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L3192"><span class="ln">3192</span>                        dstyle.width<span class="s"> = </span>o.paper.width<span class="s"> + </span><i>"px"</i>;
+</code><code id="L3193"><span class="ln">3193</span>                        dstyle.height<span class="s"> = </span>o.paper.height<span class="s"> + </span><i>"px"</i>;
+</code><code id="L3194"><span class="ln">3194</span>                        group.parentNode.insertBefore(div, group);
+</code><code id="L3195"><span class="ln">3195</span>                        div.appendChild(group);
+</code><code id="L3196"><span class="ln">3196</span>                        node.clipRect<span class="s"> = </span>div;
+</code><code id="L3197"><span class="ln">3197</span>                    }
+</code><code id="L3198"><span class="ln">3198</span>                }
+</code><code id="L3199"><span class="ln">3199</span>                <b>if</b> (!params[<i>"clip-rect"</i>]) {
+</code><code id="L3200"><span class="ln">3200</span>                    node.clipRect<span class="s"> &amp;&amp; </span>(node.clipRect.style.clip<span class="s"> = </span>E);
+</code><code id="L3201"><span class="ln">3201</span>                }
+</code><code id="L3202"><span class="ln">3202</span>            }
+</code><code id="L3203"><span class="ln">3203</span>            <b>if</b> (o.textpath) {
+</code><code id="L3204"><span class="ln">3204</span>                <b>var</b> textpathStyle<span class="s"> = </span>o.textpath.style;
+</code><code id="L3205"><span class="ln">3205</span>                params.font<span class="s"> &amp;&amp; </span>(textpathStyle.font<span class="s"> = </span>params.font);
+</code><code id="L3206"><span class="ln">3206</span>                params[<i>"font-family"</i>]<span class="s"> &amp;&amp; </span>(textpathStyle.fontFamily<span class="s"> = </span><i>'"'</i><span class="s"> + </span>params[<i>"font-family"</i>].split(<i>","</i>)[<span class="d">0</span>].replace(/^[<i>'"]+|['</i><i>"]+$/g, E)<span class="s"> + </span>'"</i>');
+</code><code id="L3207"><span class="ln">3207</span>                params[<i>"font-size"</i>]<span class="s"> &amp;&amp; </span>(textpathStyle.fontSize<span class="s"> = </span>params[<i>"font-size"</i>]);
+</code><code id="L3208"><span class="ln">3208</span>                params[<i>"font-weight"</i>]<span class="s"> &amp;&amp; </span>(textpathStyle.fontWeight<span class="s"> = </span>params[<i>"font-weight"</i>]);
+</code><code id="L3209"><span class="ln">3209</span>                params[<i>"font-style"</i>]<span class="s"> &amp;&amp; </span>(textpathStyle.fontStyle<span class="s"> = </span>params[<i>"font-style"</i>]);
+</code><code id="L3210"><span class="ln">3210</span>            }
+</code><code id="L3211"><span class="ln">3211</span>            <b>if</b> (<i>"arrow-start"</i> <b>in</b> params) {
+</code><code id="L3212"><span class="ln">3212</span>                addArrow(res, params[<i>"arrow-start"</i>]);
+</code><code id="L3213"><span class="ln">3213</span>            }
+</code><code id="L3214"><span class="ln">3214</span>            <b>if</b> (<i>"arrow-end"</i> <b>in</b> params) {
+</code><code id="L3215"><span class="ln">3215</span>                addArrow(res, params[<i>"arrow-end"</i>], <span class="d">1</span>);
+</code><code id="L3216"><span class="ln">3216</span>            }
+</code><code id="L3217"><span class="ln">3217</span>            <b>if</b> (params.opacity != <b>null</b><span class="s"> || </span>
+</code><code id="L3218"><span class="ln">3218</span>                params[<i>"stroke-width"</i>] != <b>null</b> ||
+</code><code id="L3219"><span class="ln">3219</span>                params.fill != <b>null</b> ||
+</code><code id="L3220"><span class="ln">3220</span>                params.src != <b>null</b> ||
+</code><code id="L3221"><span class="ln">3221</span>                params.stroke != <b>null</b> ||
+</code><code id="L3222"><span class="ln">3222</span>                params[<i>"stroke-width"</i>] != <b>null</b> ||
+</code><code id="L3223"><span class="ln">3223</span>                params[<i>"stroke-opacity"</i>] != <b>null</b> ||
+</code><code id="L3224"><span class="ln">3224</span>                params[<i>"fill-opacity"</i>] != <b>null</b> ||
+</code><code id="L3225"><span class="ln">3225</span>                params[<i>"stroke-dasharray"</i>] != <b>null</b> ||
+</code><code id="L3226"><span class="ln">3226</span>                params[<i>"stroke-miterlimit"</i>] != <b>null</b> ||
+</code><code id="L3227"><span class="ln">3227</span>                params[<i>"stroke-linejoin"</i>] != <b>null</b> ||
+</code><code id="L3228"><span class="ln">3228</span>                params[<i>"stroke-linecap"</i>] != <b>null</b>) {
+</code><code id="L3229"><span class="ln">3229</span>                <b>var</b> fill<span class="s"> = </span>node.getElementsByTagName(fillString),
+</code><code id="L3230"><span class="ln">3230</span>                    newfill<span class="s"> = </span><b>false</b>;
+</code><code id="L3231"><span class="ln">3231</span>                fill<span class="s"> = </span>fill<span class="s"> &amp;&amp; </span>fill[<span class="d">0</span>];
+</code><code id="L3232"><span class="ln">3232</span>                !fill<span class="s"> &amp;&amp; </span>(newfill<span class="s"> = </span>fill<span class="s"> = </span>createNode(fillString));
+</code><code id="L3233"><span class="ln">3233</span>                <b>if</b> (o.type<span class="s"> == </span><i>"image"</i><span class="s"> &amp;&amp; </span>params.src) {
+</code><code id="L3234"><span class="ln">3234</span>                    fill.src<span class="s"> = </span>params.src;
+</code><code id="L3235"><span class="ln">3235</span>                }
+</code><code id="L3236"><span class="ln">3236</span>                <b>if</b> (<i>"fill-opacity"</i> <b>in</b> params<span class="s"> || </span><i>"opacity"</i> <b>in</b> params) {
+</code><code id="L3237"><span class="ln">3237</span>                    <b>var</b> opacity<span class="s"> = </span>((+a[<i>"fill-opacity"</i>]<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>)<span class="s"> * </span>((+a.opacity<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>)<span class="s"> * </span>((+R.getRGB(params.fill).o<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>);
+</code><code id="L3238"><span class="ln">3238</span>                    opacity<span class="s"> = </span>mmin(mmax(opacity, <span class="d">0</span>), <span class="d">1</span>);
+</code><code id="L3239"><span class="ln">3239</span>                    fill.opacity<span class="s"> = </span>opacity;
+</code><code id="L3240"><span class="ln">3240</span>                }
+</code><code id="L3241"><span class="ln">3241</span>                params.fill<span class="s"> &amp;&amp; </span>(fill.on<span class="s"> = </span><b>true</b>);
+</code><code id="L3242"><span class="ln">3242</span>                <b>if</b> (fill.on<span class="s"> == </span><b>null</b><span class="s"> || </span>params.fill<span class="s"> == </span><i>"none"</i><span class="s"> || </span>params.fill<span class="s"> === </span><b>null</b>) {
+</code><code id="L3243"><span class="ln">3243</span>                    fill.on<span class="s"> = </span><b>false</b>;
+</code><code id="L3244"><span class="ln">3244</span>                }
+</code><code id="L3245"><span class="ln">3245</span>                <b>if</b> (fill.on<span class="s"> &amp;&amp; </span>params.fill) {
+</code><code id="L3246"><span class="ln">3246</span>                    <b>var</b> isURL<span class="s"> = </span>params.fill.match(ISURL);
+</code><code id="L3247"><span class="ln">3247</span>                    <b>if</b> (isURL) {
+</code><code id="L3248"><span class="ln">3248</span>                        fill.parentNode<span class="s"> == </span>node<span class="s"> &amp;&amp; </span>node.removeChild(fill);
+</code><code id="L3249"><span class="ln">3249</span>                        fill.rotate<span class="s"> = </span><b>true</b>;
+</code><code id="L3250"><span class="ln">3250</span>                        fill.src<span class="s"> = </span>isURL[<span class="d">1</span>];
+</code><code id="L3251"><span class="ln">3251</span>                        fill.type<span class="s"> = </span><i>"tile"</i>;
+</code><code id="L3252"><span class="ln">3252</span>                        <b>var</b> bbox<span class="s"> = </span>o.getBBox(<span class="d">1</span>);
+</code><code id="L3253"><span class="ln">3253</span>                        fill.position<span class="s"> = </span>bbox.x<span class="s"> + </span>S<span class="s"> + </span>bbox.y;
+</code><code id="L3254"><span class="ln">3254</span>                        o._.fillpos<span class="s"> = </span>[bbox.x, bbox.y];
+</code><code id="L3255"><span class="ln">3255</span>
+</code><code id="L3256"><span class="ln">3256</span>                        preload(isURL[<span class="d">1</span>], <b>function</b> () {
+</code><code id="L3257"><span class="ln">3257</span>                            o._.fillsize<span class="s"> = </span>[<b>this</b>.offsetWidth, <b>this</b>.offsetHeight];
+</code><code id="L3258"><span class="ln">3258</span>                        });
+</code><code id="L3259"><span class="ln">3259</span>                    } <b>else</b> {
+</code><code id="L3260"><span class="ln">3260</span>                        fill.color<span class="s"> = </span>R.getRGB(params.fill).hex;
+</code><code id="L3261"><span class="ln">3261</span>                        fill.src<span class="s"> = </span>E;
+</code><code id="L3262"><span class="ln">3262</span>                        fill.type<span class="s"> = </span><i>"solid"</i>;
+</code><code id="L3263"><span class="ln">3263</span>                        <b>if</b> (R.getRGB(params.fill).error<span class="s"> &amp;&amp; </span>(res.type <b>in</b> {circle: <span class="d">1</span>, ellipse: <span class="d">1</span>}<span class="s"> || </span>Str(params.fill).charAt() != <i>"r"</i>)<span class="s"> &amp;&amp; </span>addGradientFill(res, params.fill, fill)) {
+</code><code id="L3264"><span class="ln">3264</span>                            a.fill<span class="s"> = </span><i>"none"</i>;
+</code><code id="L3265"><span class="ln">3265</span>                            a.gradient<span class="s"> = </span>params.fill;
+</code><code id="L3266"><span class="ln">3266</span>                            fill.rotate<span class="s"> = </span><b>false</b>;
+</code><code id="L3267"><span class="ln">3267</span>                        }
+</code><code id="L3268"><span class="ln">3268</span>                    }
+</code><code id="L3269"><span class="ln">3269</span>                }
+</code><code id="L3270"><span class="ln">3270</span>                node.appendChild(fill);
+</code><code id="L3271"><span class="ln">3271</span>                <b>var</b> stroke<span class="s"> = </span>(node.getElementsByTagName(<i>"stroke"</i>)<span class="s"> &amp;&amp; </span>node.getElementsByTagName(<i>"stroke"</i>)[<span class="d">0</span>]),
+</code><code id="L3272"><span class="ln">3272</span>                newstroke<span class="s"> = </span><b>false</b>;
+</code><code id="L3273"><span class="ln">3273</span>                !stroke<span class="s"> &amp;&amp; </span>(newstroke<span class="s"> = </span>stroke<span class="s"> = </span>createNode(<i>"stroke"</i>));
+</code><code id="L3274"><span class="ln">3274</span>                <b>if</b> ((params.stroke<span class="s"> &amp;&amp; </span>params.stroke != <i>"none"</i>) ||
+</code><code id="L3275"><span class="ln">3275</span>                    params[<i>"stroke-width"</i>] ||
+</code><code id="L3276"><span class="ln">3276</span>                    params[<i>"stroke-opacity"</i>] != <b>null</b> ||
+</code><code id="L3277"><span class="ln">3277</span>                    params[<i>"stroke-dasharray"</i>] ||
+</code><code id="L3278"><span class="ln">3278</span>                    params[<i>"stroke-miterlimit"</i>] ||
+</code><code id="L3279"><span class="ln">3279</span>                    params[<i>"stroke-linejoin"</i>] ||
+</code><code id="L3280"><span class="ln">3280</span>                    params[<i>"stroke-linecap"</i>]) {
+</code><code id="L3281"><span class="ln">3281</span>                    stroke.on<span class="s"> = </span><b>true</b>;
+</code><code id="L3282"><span class="ln">3282</span>                }
+</code><code id="L3283"><span class="ln">3283</span>                (params.stroke<span class="s"> == </span><i>"none"</i><span class="s"> || </span>params.stroke<span class="s"> === </span><b>null</b><span class="s"> || </span>stroke.on<span class="s"> == </span><b>null</b><span class="s"> || </span>params.stroke<span class="s"> == </span><span class="d">0</span><span class="s"> || </span>params[<i>"stroke-width"</i>]<span class="s"> == </span><span class="d">0</span>)<span class="s"> &amp;&amp; </span>(stroke.on<span class="s"> = </span><b>false</b>);
+</code><code id="L3284"><span class="ln">3284</span>                <b>var</b> strokeColor<span class="s"> = </span>R.getRGB(params.stroke);
+</code><code id="L3285"><span class="ln">3285</span>                stroke.on<span class="s"> &amp;&amp; </span>params.stroke<span class="s"> &amp;&amp; </span>(stroke.color<span class="s"> = </span>strokeColor.hex);
+</code><code id="L3286"><span class="ln">3286</span>                opacity<span class="s"> = </span>((+a[<i>"stroke-opacity"</i>]<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>)<span class="s"> * </span>((+a.opacity<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>)<span class="s"> * </span>((+strokeColor.o<span class="s"> + </span><span class="d">1</span><span class="s"> || </span><span class="d">2</span>)<span class="s"> - </span><span class="d">1</span>);
+</code><code id="L3287"><span class="ln">3287</span>                <b>var</b> width<span class="s"> = </span>(toFloat(params[<i>"stroke-width"</i>])<span class="s"> || </span><span class="d">1</span>)<span class="s"> * </span><span class="d">.75</span>;
+</code><code id="L3288"><span class="ln">3288</span>                opacity<span class="s"> = </span>mmin(mmax(opacity, <span class="d">0</span>), <span class="d">1</span>);
+</code><code id="L3289"><span class="ln">3289</span>                params[<i>"stroke-width"</i>]<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>(width<span class="s"> = </span>a[<i>"stroke-width"</i>]);
+</code><code id="L3290"><span class="ln">3290</span>                params[<i>"stroke-width"</i>]<span class="s"> &amp;&amp; </span>(stroke.weight<span class="s"> = </span>width);
+</code><code id="L3291"><span class="ln">3291</span>                width<span class="s"> &amp;&amp; </span>width &lt; <span class="d">1</span><span class="s"> &amp;&amp; </span>(opacity *= width)<span class="s"> &amp;&amp; </span>(stroke.weight<span class="s"> = </span><span class="d">1</span>);
+</code><code id="L3292"><span class="ln">3292</span>                stroke.opacity<span class="s"> = </span>opacity;
+</code><code id="L3293"><span class="ln">3293</span>                
+</code><code id="L3294"><span class="ln">3294</span>                params[<i>"stroke-linejoin"</i>]<span class="s"> &amp;&amp; </span>(stroke.joinstyle<span class="s"> = </span>params[<i>"stroke-linejoin"</i>]<span class="s"> || </span><i>"miter"</i>);
+</code><code id="L3295"><span class="ln">3295</span>                stroke.miterlimit<span class="s"> = </span>params[<i>"stroke-miterlimit"</i>]<span class="s"> || </span><span class="d">8</span>;
+</code><code id="L3296"><span class="ln">3296</span>                params[<i>"stroke-linecap"</i>]<span class="s"> &amp;&amp; </span>(stroke.endcap<span class="s"> = </span>params[<i>"stroke-linecap"</i>]<span class="s"> == </span><i>"butt"</i> ? <i>"flat"</i> : params[<i>"stroke-linecap"</i>]<span class="s"> == </span><i>"square"</i> ? <i>"square"</i> : <i>"round"</i>);
+</code><code id="L3297"><span class="ln">3297</span>                <b>if</b> (params[<i>"stroke-dasharray"</i>]) {
+</code><code id="L3298"><span class="ln">3298</span>                    <b>var</b> dasharray<span class="s"> = </span>{
+</code><code id="L3299"><span class="ln">3299</span>                        <i>"-"</i>: <i>"shortdash"</i>,
+</code><code id="L3300"><span class="ln">3300</span>                        <i>"."</i>: <i>"shortdot"</i>,
+</code><code id="L3301"><span class="ln">3301</span>                        <i>"-."</i>: <i>"shortdashdot"</i>,
+</code><code id="L3302"><span class="ln">3302</span>                        <i>"-.."</i>: <i>"shortdashdotdot"</i>,
+</code><code id="L3303"><span class="ln">3303</span>                        <i>". "</i>: <i>"dot"</i>,
+</code><code id="L3304"><span class="ln">3304</span>                        <i>"- "</i>: <i>"dash"</i>,
+</code><code id="L3305"><span class="ln">3305</span>                        <i>"--"</i>: <i>"longdash"</i>,
+</code><code id="L3306"><span class="ln">3306</span>                        <i>"- ."</i>: <i>"dashdot"</i>,
+</code><code id="L3307"><span class="ln">3307</span>                        <i>"--."</i>: <i>"longdashdot"</i>,
+</code><code id="L3308"><span class="ln">3308</span>                        <i>"--.."</i>: <i>"longdashdotdot"</i>
+</code><code id="L3309"><span class="ln">3309</span>                    };
+</code><code id="L3310"><span class="ln">3310</span>                    stroke.dashstyle<span class="s"> = </span>dasharray[has](params[<i>"stroke-dasharray"</i>]) ? dasharray[params[<i>"stroke-dasharray"</i>]] : E;
+</code><code id="L3311"><span class="ln">3311</span>                }
+</code><code id="L3312"><span class="ln">3312</span>                newstroke<span class="s"> &amp;&amp; </span>node.appendChild(stroke);
+</code><code id="L3313"><span class="ln">3313</span>            }
+</code><code id="L3314"><span class="ln">3314</span>            <b>if</b> (res.type<span class="s"> == </span><i>"text"</i>) {
+</code><code id="L3315"><span class="ln">3315</span>                res.paper.canvas.style.display<span class="s"> = </span>E;
+</code><code id="L3316"><span class="ln">3316</span>                <b>var</b> span<span class="s"> = </span>res.paper.span,
+</code><code id="L3317"><span class="ln">3317</span>                    m<span class="s"> = </span><span class="d">100</span>,
+</code><code id="L3318"><span class="ln">3318</span>                    fontSize<span class="s"> = </span>a.font<span class="s"> &amp;&amp; </span>a.font.match(/\d+(?:\.\d*)?(?=px)/);
+</code><code id="L3319"><span class="ln">3319</span>                s<span class="s"> = </span>span.style;
+</code><code id="L3320"><span class="ln">3320</span>                a.font<span class="s"> &amp;&amp; </span>(s.font<span class="s"> = </span>a.font);
+</code><code id="L3321"><span class="ln">3321</span>                a[<i>"font-family"</i>]<span class="s"> &amp;&amp; </span>(s.fontFamily<span class="s"> = </span>a[<i>"font-family"</i>]);
+</code><code id="L3322"><span class="ln">3322</span>                a[<i>"font-weight"</i>]<span class="s"> &amp;&amp; </span>(s.fontWeight<span class="s"> = </span>a[<i>"font-weight"</i>]);
+</code><code id="L3323"><span class="ln">3323</span>                a[<i>"font-style"</i>]<span class="s"> &amp;&amp; </span>(s.fontStyle<span class="s"> = </span>a[<i>"font-style"</i>]);
+</code><code id="L3324"><span class="ln">3324</span>                fontSize<span class="s"> = </span>toFloat(fontSize ? fontSize[<span class="d">0</span>] : a[<i>"font-size"</i>]);
+</code><code id="L3325"><span class="ln">3325</span>                s.fontSize<span class="s"> = </span>fontSize<span class="s"> * </span>m<span class="s"> + </span><i>"px"</i>;
+</code><code id="L3326"><span class="ln">3326</span>                res.textpath.string<span class="s"> &amp;&amp; </span>(span.innerHTML<span class="s"> = </span>Str(res.textpath.string).replace(/&lt;/g, <i>"&#<span class="d">60</span>;"</i>).replace(/&amp;/g, <i>"&#<span class="d">38</span>;"</i>).replace(/\n/g, <i>"&lt;br>"</i>));
+</code><code id="L3327"><span class="ln">3327</span>                <b>var</b> brect<span class="s"> = </span>span.getBoundingClientRect();
+</code><code id="L3328"><span class="ln">3328</span>                res.W<span class="s"> = </span>a.w<span class="s"> = </span>(brect.right<span class="s"> - </span>brect.left)<span class="s"> / </span>m;
+</code><code id="L3329"><span class="ln">3329</span>                res.H<span class="s"> = </span>a.h<span class="s"> = </span>(brect.bottom<span class="s"> - </span>brect.top)<span class="s"> / </span>m;
+</code><code id="L3330"><span class="ln">3330</span>                res.paper.canvas.style.display<span class="s"> = </span><i>"none"</i>;
+</code><code id="L3331"><span class="ln">3331</span>                res.X<span class="s"> = </span>a.x;
+</code><code id="L3332"><span class="ln">3332</span>                res.Y<span class="s"> = </span>a.y<span class="s"> + </span>res.H<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L3333"><span class="ln">3333</span>
+</code><code id="L3334"><span class="ln">3334</span>                (<i>"x"</i> <b>in</b> params<span class="s"> || </span><i>"y"</i> <b>in</b> params)<span class="s"> &amp;&amp; </span>(res.path.v<span class="s"> = </span>R.format(<i>"m{<span class="d">0</span>},{<span class="d">1</span>}l{<span class="d">2</span>},{<span class="d">1</span>}"</i>, round(a.x<span class="s"> * </span>zoom), round(a.y<span class="s"> * </span>zoom), round(a.x<span class="s"> * </span>zoom)<span class="s"> + </span><span class="d">1</span>));
+</code><code id="L3335"><span class="ln">3335</span>                <b>var</b> dirtyattrs<span class="s"> = </span>[<i>"x"</i>, <i>"y"</i>, <i>"text"</i>, <i>"font"</i>, <i>"font-family"</i>, <i>"font-weight"</i>, <i>"font-style"</i>, <i>"font-size"</i>];
+</code><code id="L3336"><span class="ln">3336</span>                <b>for</b> (<b>var</b> d<span class="s"> = </span><span class="d">0</span>, dd<span class="s"> = </span>dirtyattrs.length; d &lt; dd; d++) <b>if</b> (dirtyattrs[d] <b>in</b> params) {
+</code><code id="L3337"><span class="ln">3337</span>                    res._.dirty<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L3338"><span class="ln">3338</span>                    <b>break</b>;
+</code><code id="L3339"><span class="ln">3339</span>                }
+</code><code id="L3340"><span class="ln">3340</span>                
+</code><code id="L3341"><span class="ln">3341</span>                <span class="c">// text-anchor emulation</span>
+</code><code id="L3342"><span class="ln">3342</span>                <b>switch</b> (a[<i>"text-anchor"</i>]) {
+</code><code id="L3343"><span class="ln">3343</span>                    <b>case</b> <i>"start"</i>:
+</code><code id="L3344"><span class="ln">3344</span>                        res.textpath.style[<i>"v-text-align"</i>]<span class="s"> = </span><i>"left"</i>;
+</code><code id="L3345"><span class="ln">3345</span>                        res.bbx<span class="s"> = </span>res.W<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L3346"><span class="ln">3346</span>                    <b>break</b>;
+</code><code id="L3347"><span class="ln">3347</span>                    <b>case</b> <i>"end"</i>:
+</code><code id="L3348"><span class="ln">3348</span>                        res.textpath.style[<i>"v-text-align"</i>]<span class="s"> = </span><i>"right"</i>;
+</code><code id="L3349"><span class="ln">3349</span>                        res.bbx<span class="s"> = </span>-res.W<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L3350"><span class="ln">3350</span>                    <b>break</b>;
+</code><code id="L3351"><span class="ln">3351</span>                    <b>default</b>:
+</code><code id="L3352"><span class="ln">3352</span>                        res.textpath.style[<i>"v-text-align"</i>]<span class="s"> = </span><i>"center"</i>;
+</code><code id="L3353"><span class="ln">3353</span>                        res.bbx<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L3354"><span class="ln">3354</span>                    <b>break</b>;
+</code><code id="L3355"><span class="ln">3355</span>                }
+</code><code id="L3356"><span class="ln">3356</span>                res.textpath.style[<i>"v-text-kern"</i>]<span class="s"> = </span><b>true</b>;
+</code><code id="L3357"><span class="ln">3357</span>            }
+</code><code id="L3358"><span class="ln">3358</span>            res.paper.canvas.style.display<span class="s"> = </span>E;
+</code><code id="L3359"><span class="ln">3359</span>        };
+</code><code id="L3360"><span class="ln">3360</span>        addGradientFill<span class="s"> = </span><b>function</b> (o, gradient, fill) {
+</code><code id="L3361"><span class="ln">3361</span>            o.attrs<span class="s"> = </span>o.attrs<span class="s"> || </span>{};
+</code><code id="L3362"><span class="ln">3362</span>            <b>var</b> attrs<span class="s"> = </span>o.attrs,
+</code><code id="L3363"><span class="ln">3363</span>                type<span class="s"> = </span><i>"linear"</i>,
+</code><code id="L3364"><span class="ln">3364</span>                fxfy<span class="s"> = </span><i>"<span class="d">.5</span> <span class="d">.5</span>"</i>;
+</code><code id="L3365"><span class="ln">3365</span>            o.attrs.gradient<span class="s"> = </span>gradient;
+</code><code id="L3366"><span class="ln">3366</span>            gradient<span class="s"> = </span>Str(gradient).replace(radial_gradient, <b>function</b> (all, fx, fy) {
+</code><code id="L3367"><span class="ln">3367</span>                type<span class="s"> = </span><i>"radial"</i>;
+</code><code id="L3368"><span class="ln">3368</span>                <b>if</b> (fx<span class="s"> &amp;&amp; </span>fy) {
+</code><code id="L3369"><span class="ln">3369</span>                    fx<span class="s"> = </span>toFloat(fx);
+</code><code id="L3370"><span class="ln">3370</span>                    fy<span class="s"> = </span>toFloat(fy);
+</code><code id="L3371"><span class="ln">3371</span>                    pow(fx<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>)<span class="s"> + </span>pow(fy<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>) > <span class="d">.25</span><span class="s"> &amp;&amp; </span>(fy<span class="s"> = </span>math.sqrt(<span class="d">.25</span><span class="s"> - </span>pow(fx<span class="s"> - </span><span class="d">.5</span>, <span class="d">2</span>))<span class="s"> * </span>((fy > <span class="d">.5</span>)<span class="s"> * </span><span class="d">2</span><span class="s"> - </span><span class="d">1</span>)<span class="s"> + </span><span class="d">.5</span>);
+</code><code id="L3372"><span class="ln">3372</span>                    fxfy<span class="s"> = </span>fx<span class="s"> + </span>S<span class="s"> + </span>fy;
+</code><code id="L3373"><span class="ln">3373</span>                }
+</code><code id="L3374"><span class="ln">3374</span>                <b>return</b> E;
+</code><code id="L3375"><span class="ln">3375</span>            });
+</code><code id="L3376"><span class="ln">3376</span>            gradient<span class="s"> = </span>gradient.split(/\s*\-\s*/);
+</code><code id="L3377"><span class="ln">3377</span>            <b>if</b> (type<span class="s"> == </span><i>"linear"</i>) {
+</code><code id="L3378"><span class="ln">3378</span>                <b>var</b> angle<span class="s"> = </span>gradient.shift();
+</code><code id="L3379"><span class="ln">3379</span>                angle<span class="s"> = </span>-toFloat(angle);
+</code><code id="L3380"><span class="ln">3380</span>                <b>if</b> (isNaN(angle)) {
+</code><code id="L3381"><span class="ln">3381</span>                    <b>return</b> <b>null</b>;
+</code><code id="L3382"><span class="ln">3382</span>                }
+</code><code id="L3383"><span class="ln">3383</span>            }
+</code><code id="L3384"><span class="ln">3384</span>            <b>var</b> dots<span class="s"> = </span>parseDots(gradient);
+</code><code id="L3385"><span class="ln">3385</span>            <b>if</b> (!dots) {
+</code><code id="L3386"><span class="ln">3386</span>                <b>return</b> <b>null</b>;
+</code><code id="L3387"><span class="ln">3387</span>            }
+</code><code id="L3388"><span class="ln">3388</span>            o<span class="s"> = </span>o.shape<span class="s"> || </span>o.node;
+</code><code id="L3389"><span class="ln">3389</span>            <b>if</b> (dots.length) {
+</code><code id="L3390"><span class="ln">3390</span>                o.removeChild(fill);
+</code><code id="L3391"><span class="ln">3391</span>                fill.on<span class="s"> = </span><b>true</b>;
+</code><code id="L3392"><span class="ln">3392</span>                fill.method<span class="s"> = </span><i>"none"</i>;
+</code><code id="L3393"><span class="ln">3393</span>                fill.color<span class="s"> = </span>dots[<span class="d">0</span>].color;
+</code><code id="L3394"><span class="ln">3394</span>                fill.color2<span class="s"> = </span>dots[dots.length<span class="s"> - </span><span class="d">1</span>].color;
+</code><code id="L3395"><span class="ln">3395</span>                <b>var</b> clrs<span class="s"> = </span>[];
+</code><code id="L3396"><span class="ln">3396</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>dots.length; i &lt; ii; i++) {
+</code><code id="L3397"><span class="ln">3397</span>                    dots[i].offset<span class="s"> &amp;&amp; </span>clrs.push(dots[i].offset<span class="s"> + </span>S<span class="s"> + </span>dots[i].color);
+</code><code id="L3398"><span class="ln">3398</span>                }
+</code><code id="L3399"><span class="ln">3399</span>                fill.colors<span class="s"> &amp;&amp; </span>(fill.colors.value<span class="s"> = </span>clrs.length ? clrs.join() : <i>"<span class="d">0</span>% "</i><span class="s"> + </span>fill.color);
+</code><code id="L3400"><span class="ln">3400</span>                <b>if</b> (type<span class="s"> == </span><i>"radial"</i>) {
+</code><code id="L3401"><span class="ln">3401</span>                    fill.type<span class="s"> = </span><i>"gradientTitle"</i>;
+</code><code id="L3402"><span class="ln">3402</span>                    fill.focus<span class="s"> = </span><i>"<span class="d">100</span>%"</i>;
+</code><code id="L3403"><span class="ln">3403</span>                    fill.focussize<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span>"</i>;
+</code><code id="L3404"><span class="ln">3404</span>                    fill.focusposition<span class="s"> = </span>fxfy;
+</code><code id="L3405"><span class="ln">3405</span>                    fill.angle<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L3406"><span class="ln">3406</span>                } <b>else</b> {
+</code><code id="L3407"><span class="ln">3407</span>                    <span class="c">// fill.rotate= <b>true</b>;</span>
+</code><code id="L3408"><span class="ln">3408</span>                    fill.type<span class="s"> = </span><i>"gradient"</i>;
+</code><code id="L3409"><span class="ln">3409</span>                    fill.angle<span class="s"> = </span>(<span class="d">270</span><span class="s"> - </span>angle)<span class="s"> % </span><span class="d">360</span>;
+</code><code id="L3410"><span class="ln">3410</span>                }
+</code><code id="L3411"><span class="ln">3411</span>                o.appendChild(fill);
+</code><code id="L3412"><span class="ln">3412</span>                <span class="c">// alert(fill.outerHTML);</span>
+</code><code id="L3413"><span class="ln">3413</span>            }
+</code><code id="L3414"><span class="ln">3414</span>            <b>return</b> <span class="d">1</span>;
+</code><code id="L3415"><span class="ln">3415</span>        };
+</code><code id="L3416"><span class="ln">3416</span>        Element<span class="s"> = </span><b>function</b> (node, vml) {
+</code><code id="L3417"><span class="ln">3417</span>            <b>this</b>[<span class="d">0</span>]<span class="s"> = </span><b>this</b>.node<span class="s"> = </span>node;
+</code><code id="L3418"><span class="ln">3418</span>            node.raphael<span class="s"> = </span><b>true</b>;
+</code><code id="L3419"><span class="ln">3419</span>            <b>this</b>.id<span class="s"> = </span>R._oid++;
+</code><code id="L3420"><span class="ln">3420</span>            node.raphaelid<span class="s"> = </span><b>this</b>.id;
+</code><code id="L3421"><span class="ln">3421</span>            <b>this</b>.X<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L3422"><span class="ln">3422</span>            <b>this</b>.Y<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L3423"><span class="ln">3423</span>            <b>this</b>.attrs<span class="s"> = </span>{};
+</code><code id="L3424"><span class="ln">3424</span>            <b>this</b>.paper<span class="s"> = </span>vml;
+</code><code id="L3425"><span class="ln">3425</span>            <b>this</b>.matrix<span class="s"> = </span><b>new</b> Matrix;
+</code><code id="L3426"><span class="ln">3426</span>            <b>this</b>._<span class="s"> = </span>{
+</code><code id="L3427"><span class="ln">3427</span>                transform: [],
+</code><code id="L3428"><span class="ln">3428</span>                sx: <span class="d">1</span>,
+</code><code id="L3429"><span class="ln">3429</span>                sy: <span class="d">1</span>,
+</code><code id="L3430"><span class="ln">3430</span>                dx: <span class="d">0</span>,
+</code><code id="L3431"><span class="ln">3431</span>                dy: <span class="d">0</span>,
+</code><code id="L3432"><span class="ln">3432</span>                deg: <span class="d">0</span>,
+</code><code id="L3433"><span class="ln">3433</span>                dirty: <span class="d">1</span>,
+</code><code id="L3434"><span class="ln">3434</span>                dirtyT: <span class="d">1</span>
+</code><code id="L3435"><span class="ln">3435</span>            };
+</code><code id="L3436"><span class="ln">3436</span>            !vml.bottom<span class="s"> &amp;&amp; </span>(vml.bottom<span class="s"> = </span><b>this</b>);
+</code><code id="L3437"><span class="ln">3437</span>            <b>this</b>.prev<span class="s"> = </span>vml.top;
+</code><code id="L3438"><span class="ln">3438</span>            vml.top<span class="s"> &amp;&amp; </span>(vml.top.next<span class="s"> = </span><b>this</b>);
+</code><code id="L3439"><span class="ln">3439</span>            vml.top<span class="s"> = </span><b>this</b>;
+</code><code id="L3440"><span class="ln">3440</span>            <b>this</b>.next<span class="s"> = </span><b>null</b>;
+</code><code id="L3441"><span class="ln">3441</span>        };
+</code><code id="L3442"><span class="ln">3442</span>        elproto<span class="s"> = </span>Element.prototype;
+</code><code id="L3443"><span class="ln">3443</span>        elproto.transform<span class="s"> = </span><b>function</b> (tstr) {
+</code><code id="L3444"><span class="ln">3444</span>            <b>if</b> (tstr<span class="s"> == </span><b>null</b>) {
+</code><code id="L3445"><span class="ln">3445</span>                <b>return</b> <b>this</b>._.transform;
+</code><code id="L3446"><span class="ln">3446</span>            }
+</code><code id="L3447"><span class="ln">3447</span>            extractTransform(<b>this</b>, tstr);
+</code><code id="L3448"><span class="ln">3448</span>            <b>var</b> matrix<span class="s"> = </span><b>this</b>.matrix.clone(),
+</code><code id="L3449"><span class="ln">3449</span>                skew<span class="s"> = </span><b>this</b>.skew;
+</code><code id="L3450"><span class="ln">3450</span>            matrix.translate(-<span class="d">.5</span>, -<span class="d">.5</span>);
+</code><code id="L3451"><span class="ln">3451</span>            <b>if</b> (<b>this</b>.type<span class="s"> == </span><i>"image"</i>) {
+</code><code id="L3452"><span class="ln">3452</span>                <b>if</b> (Str(tstr).indexOf(<i>"m"</i>)<span class="s"> + </span><span class="d">1</span>) {
+</code><code id="L3453"><span class="ln">3453</span>                    <b>this</b>.node.style.filter<span class="s"> = </span>matrix.toFilter();
+</code><code id="L3454"><span class="ln">3454</span>                    <b>var</b> bb<span class="s"> = </span><b>this</b>.getBBox(),
+</code><code id="L3455"><span class="ln">3455</span>                        bbt<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>),
+</code><code id="L3456"><span class="ln">3456</span>                        im<span class="s"> = </span>matrix.invert(),
+</code><code id="L3457"><span class="ln">3457</span>                        dx<span class="s"> = </span>im.x(bb.x, bb.y)<span class="s"> - </span>im.x(bbt.x, bbt.y),
+</code><code id="L3458"><span class="ln">3458</span>                        dy<span class="s"> = </span>im.y(bb.x, bb.y)<span class="s"> - </span>im.y(bbt.x, bbt.y);
+</code><code id="L3459"><span class="ln">3459</span>                    <span class="c">// skew.offset<span class="s"> = </span>dx<span class="s"> + </span>S<span class="s"> + </span>dy;</span>
+</code><code id="L3460"><span class="ln">3460</span>                    <span class="c">// <b>this</b>.node.getElementsByTagName(fillString)[<span class="d">0</span>].position<span class="s"> = </span>skew.offset;</span>
+</code><code id="L3461"><span class="ln">3461</span>                } <b>else</b> {
+</code><code id="L3462"><span class="ln">3462</span>                    <b>this</b>.node.style.filter<span class="s"> = </span>E;
+</code><code id="L3463"><span class="ln">3463</span>                    setCoords(<b>this</b>);
+</code><code id="L3464"><span class="ln">3464</span>                }
+</code><code id="L3465"><span class="ln">3465</span>            } <b>else</b> {
+</code><code id="L3466"><span class="ln">3466</span>                    <span class="c">// o<span class="s"> = </span><b>this</b>.node,</span>
+</code><code id="L3467"><span class="ln">3467</span>                    <span class="c">// _<span class="s"> = </span><b>this</b>._,</span>
+</code><code id="L3468"><span class="ln">3468</span>                    <span class="c">// fillpos<span class="s"> = </span>_.fillpos,</span>
+</code><code id="L3469"><span class="ln">3469</span>                    <span class="c">// deg,</span>
+</code><code id="L3470"><span class="ln">3470</span>                    <span class="c">// matrix<span class="s"> = </span><b>this</b>.matrix;</span>
+</code><code id="L3471"><span class="ln">3471</span>                    <span class="c">// fill<span class="s"> = </span>o.getElementsByTagName(fillString)[<span class="d">0</span>],</span>
+</code><code id="L3472"><span class="ln">3472</span>                    <span class="c">// angle<span class="s"> = </span>fill.angle;</span>
+</code><code id="L3473"><span class="ln">3473</span>
+</code><code id="L3474"><span class="ln">3474</span>                <b>this</b>.node.style.filter<span class="s"> = </span>E;
+</code><code id="L3475"><span class="ln">3475</span>                skew.matrix<span class="s"> = </span>matrix;
+</code><code id="L3476"><span class="ln">3476</span>                skew.offset<span class="s"> = </span>matrix.offset();
+</code><code id="L3477"><span class="ln">3477</span>                
+</code><code id="L3478"><span class="ln">3478</span>                <span class="c">// <b>if</b> (<span class="d">0</span>&amp;&amp;angle) {</span>
+</code><code id="L3479"><span class="ln">3479</span>                <span class="c">//     angle<span class="s"> = </span>R.rad(<span class="d">270</span><span class="s"> - </span>angle);</span>
+</code><code id="L3480"><span class="ln">3480</span>                <span class="c">//     <b>var</b> dx<span class="s"> = </span><span class="d">100</span><span class="s"> * </span>math.cos(angle),</span>
+</code><code id="L3481"><span class="ln">3481</span>                <span class="c">//         dy<span class="s"> = </span><span class="d">100</span><span class="s"> * </span>math.sin(angle),</span>
+</code><code id="L3482"><span class="ln">3482</span>                <span class="c">//         zx<span class="s"> = </span>matrix.x(<span class="d">0</span>, <span class="d">0</span>),</span>
+</code><code id="L3483"><span class="ln">3483</span>                <span class="c">//         zy<span class="s"> = </span>matrix.y(<span class="d">0</span>, <span class="d">0</span>),</span>
+</code><code id="L3484"><span class="ln">3484</span>                <span class="c">//         mx<span class="s"> = </span>matrix.x(dx, dy),</span>
+</code><code id="L3485"><span class="ln">3485</span>                <span class="c">//         my<span class="s"> = </span>matrix.y(dx, dy);</span>
+</code><code id="L3486"><span class="ln">3486</span>                <span class="c">//     angle<span class="s"> = </span>R.angle(zx, zy, mx, my);</span>
+</code><code id="L3487"><span class="ln">3487</span>                <span class="c">//     fill.angle<span class="s"> = </span>(<span class="d">270</span><span class="s"> - </span>angle)<span class="s"> % </span><span class="d">360</span>;</span>
+</code><code id="L3488"><span class="ln">3488</span>                <span class="c">// }</span>
+</code><code id="L3489"><span class="ln">3489</span>            }
+</code><code id="L3490"><span class="ln">3490</span>            <b>return</b> <b>this</b>;
+</code><code id="L3491"><span class="ln">3491</span>        };
+</code><code id="L3492"><span class="ln">3492</span>        elproto.rotate<span class="s"> = </span><b>function</b> (deg, cx, cy) {
+</code><code id="L3493"><span class="ln">3493</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L3494"><span class="ln">3494</span>                <b>return</b> <b>this</b>;
+</code><code id="L3495"><span class="ln">3495</span>            }
+</code><code id="L3496"><span class="ln">3496</span>            <b>if</b> (deg<span class="s"> == </span><b>null</b>) {
+</code><code id="L3497"><span class="ln">3497</span>                <b>return</b>;
+</code><code id="L3498"><span class="ln">3498</span>            }
+</code><code id="L3499"><span class="ln">3499</span>            deg<span class="s"> = </span>Str(deg).split(separator);
+</code><code id="L3500"><span class="ln">3500</span>            <b>if</b> (deg.length<span class="s"> - </span><span class="d">1</span>) {
+</code><code id="L3501"><span class="ln">3501</span>                cx<span class="s"> = </span>toFloat(deg[<span class="d">1</span>]);
+</code><code id="L3502"><span class="ln">3502</span>                cy<span class="s"> = </span>toFloat(deg[<span class="d">2</span>]);
+</code><code id="L3503"><span class="ln">3503</span>            }
+</code><code id="L3504"><span class="ln">3504</span>            deg<span class="s"> = </span>toFloat(deg[<span class="d">0</span>]);
+</code><code id="L3505"><span class="ln">3505</span>            (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
+</code><code id="L3506"><span class="ln">3506</span>            <b>if</b> (cx<span class="s"> == </span><b>null</b><span class="s"> || </span>cy<span class="s"> == </span><b>null</b>) {
+</code><code id="L3507"><span class="ln">3507</span>                <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
+</code><code id="L3508"><span class="ln">3508</span>                cx<span class="s"> = </span>bbox.x<span class="s"> + </span>bbox.width<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L3509"><span class="ln">3509</span>                cy<span class="s"> = </span>bbox.y<span class="s"> + </span>bbox.height<span class="s"> / </span><span class="d">2</span>;
+</code><code id="L3510"><span class="ln">3510</span>            }
+</code><code id="L3511"><span class="ln">3511</span>            <b>this</b>._.dirtyT<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L3512"><span class="ln">3512</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"r"</i>, deg, cx, cy]]));
+</code><code id="L3513"><span class="ln">3513</span>            <b>return</b> <b>this</b>;
+</code><code id="L3514"><span class="ln">3514</span>        };
+</code><code id="L3515"><span class="ln">3515</span>        elproto.translate<span class="s"> = </span><b>function</b> (dx, dy) {
+</code><code id="L3516"><span class="ln">3516</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L3517"><span class="ln">3517</span>                <b>return</b> <b>this</b>;
+</code><code id="L3518"><span class="ln">3518</span>            }
+</code><code id="L3519"><span class="ln">3519</span>            dx<span class="s"> = </span>Str(dx).split(separator);
+</code><code id="L3520"><span class="ln">3520</span>            <b>if</b> (dx.length<span class="s"> - </span><span class="d">1</span>) {
+</code><code id="L3521"><span class="ln">3521</span>                dy<span class="s"> = </span>toFloat(dx[<span class="d">1</span>]);
+</code><code id="L3522"><span class="ln">3522</span>            }
+</code><code id="L3523"><span class="ln">3523</span>            dx<span class="s"> = </span>toFloat(dx[<span class="d">0</span>])<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L3524"><span class="ln">3524</span>            dy<span class="s"> = </span>+dy<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L3525"><span class="ln">3525</span>            <b>if</b> (<b>this</b>._.bbox) {
+</code><code id="L3526"><span class="ln">3526</span>                <b>this</b>._.bbox.x += dx;
+</code><code id="L3527"><span class="ln">3527</span>                <b>this</b>._.bbox.y += dy;
+</code><code id="L3528"><span class="ln">3528</span>            }
+</code><code id="L3529"><span class="ln">3529</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"t"</i>, dx, dy]]));
+</code><code id="L3530"><span class="ln">3530</span>            <b>return</b> <b>this</b>;
+</code><code id="L3531"><span class="ln">3531</span>        };
+</code><code id="L3532"><span class="ln">3532</span>        elproto.scale<span class="s"> = </span><b>function</b> (sx, sy, cx, cy) {
+</code><code id="L3533"><span class="ln">3533</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L3534"><span class="ln">3534</span>                <b>return</b> <b>this</b>;
+</code><code id="L3535"><span class="ln">3535</span>            }
+</code><code id="L3536"><span class="ln">3536</span>            sx<span class="s"> = </span>Str(sx).split(separator);
+</code><code id="L3537"><span class="ln">3537</span>            <b>if</b> (sx.length<span class="s"> - </span><span class="d">1</span>) {
+</code><code id="L3538"><span class="ln">3538</span>                sy<span class="s"> = </span>toFloat(sx[<span class="d">1</span>]);
+</code><code id="L3539"><span class="ln">3539</span>                cx<span class="s"> = </span>toFloat(sx[<span class="d">2</span>]);
+</code><code id="L3540"><span class="ln">3540</span>                cy<span class="s"> = </span>toFloat(sx[<span class="d">3</span>]);
+</code><code id="L3541"><span class="ln">3541</span>                isNaN(cx)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span><b>null</b>);
+</code><code id="L3542"><span class="ln">3542</span>                isNaN(cy)<span class="s"> &amp;&amp; </span>(cy<span class="s"> = </span><b>null</b>);
+</code><code id="L3543"><span class="ln">3543</span>            }
+</code><code id="L3544"><span class="ln">3544</span>            sx<span class="s"> = </span>toFloat(sx[<span class="d">0</span>]);
+</code><code id="L3545"><span class="ln">3545</span>            (sy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(sy<span class="s"> = </span>sx);
+</code><code id="L3546"><span class="ln">3546</span>            (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
+</code><code id="L3547"><span class="ln">3547</span>            <b>if</b> (cx<span class="s"> == </span><b>null</b><span class="s"> || </span>cy<span class="s"> == </span><b>null</b>) {
+</code><code id="L3548"><span class="ln">3548</span>                <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
+</code><code id="L3549"><span class="ln">3549</span>            }
+</code><code id="L3550"><span class="ln">3550</span>            cx<span class="s"> = </span>cx<span class="s"> == </span><b>null</b> ? bbox.x<span class="s"> + </span>bbox.width<span class="s"> / </span><span class="d">2</span> : cx;
+</code><code id="L3551"><span class="ln">3551</span>            cy<span class="s"> = </span>cy<span class="s"> == </span><b>null</b> ? bbox.y<span class="s"> + </span>bbox.height<span class="s"> / </span><span class="d">2</span> : cy;
+</code><code id="L3552"><span class="ln">3552</span>            
+</code><code id="L3553"><span class="ln">3553</span>            <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"s"</i>, sx, sy, cx, cy]]));
+</code><code id="L3554"><span class="ln">3554</span>            <b>this</b>._.dirtyT<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L3555"><span class="ln">3555</span>            <b>return</b> <b>this</b>;
+</code><code id="L3556"><span class="ln">3556</span>        };
+</code><code id="L3557"><span class="ln">3557</span>        elproto.hide<span class="s"> = </span><b>function</b> () {
+</code><code id="L3558"><span class="ln">3558</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span>(<b>this</b>.node.style.display<span class="s"> = </span><i>"none"</i>);
+</code><code id="L3559"><span class="ln">3559</span>            <b>return</b> <b>this</b>;
+</code><code id="L3560"><span class="ln">3560</span>        };
+</code><code id="L3561"><span class="ln">3561</span>        elproto.show<span class="s"> = </span><b>function</b> () {
+</code><code id="L3562"><span class="ln">3562</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span>(<b>this</b>.node.style.display<span class="s"> = </span>E);
+</code><code id="L3563"><span class="ln">3563</span>            <b>return</b> <b>this</b>;
+</code><code id="L3564"><span class="ln">3564</span>        };
+</code><code id="L3565"><span class="ln">3565</span>        elproto._getBBox<span class="s"> = </span><b>function</b> () {
+</code><code id="L3566"><span class="ln">3566</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L3567"><span class="ln">3567</span>                <b>return</b> {};
+</code><code id="L3568"><span class="ln">3568</span>            }
+</code><code id="L3569"><span class="ln">3569</span>            <b>if</b> (<b>this</b>.type<span class="s"> == </span><i>"text"</i>) {
+</code><code id="L3570"><span class="ln">3570</span>                <b>return</b> {
+</code><code id="L3571"><span class="ln">3571</span>                    x: <b>this</b>.X<span class="s"> + </span>(<b>this</b>.bbx<span class="s"> || </span><span class="d">0</span>)<span class="s"> - </span><b>this</b>.W<span class="s"> / </span><span class="d">2</span>,
+</code><code id="L3572"><span class="ln">3572</span>                    y: <b>this</b>.Y<span class="s"> - </span><b>this</b>.H,
+</code><code id="L3573"><span class="ln">3573</span>                    width: <b>this</b>.W,
+</code><code id="L3574"><span class="ln">3574</span>                    height: <b>this</b>.H
+</code><code id="L3575"><span class="ln">3575</span>                };
+</code><code id="L3576"><span class="ln">3576</span>            } <b>else</b> {
+</code><code id="L3577"><span class="ln">3577</span>                <b>return</b> pathDimensions(<b>this</b>.attrs.path);
+</code><code id="L3578"><span class="ln">3578</span>            }
+</code><code id="L3579"><span class="ln">3579</span>        };
+</code><code id="L3580"><span class="ln">3580</span>        elproto.remove<span class="s"> = </span><b>function</b> () {
+</code><code id="L3581"><span class="ln">3581</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L3582"><span class="ln">3582</span>                <b>return</b>;
+</code><code id="L3583"><span class="ln">3583</span>            }
+</code><code id="L3584"><span class="ln">3584</span>            eve.unbind(<i>"*.*."</i><span class="s"> + </span><b>this</b>.id);
+</code><code id="L3585"><span class="ln">3585</span>            tear(<b>this</b>, <b>this</b>.paper);
+</code><code id="L3586"><span class="ln">3586</span>            <b>this</b>.node.parentNode.removeChild(<b>this</b>.node);
+</code><code id="L3587"><span class="ln">3587</span>            <b>this</b>.shape<span class="s"> &amp;&amp; </span><b>this</b>.shape.parentNode.removeChild(<b>this</b>.shape);
+</code><code id="L3588"><span class="ln">3588</span>            <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
+</code><code id="L3589"><span class="ln">3589</span>                <b>delete</b> <b>this</b>[i];
+</code><code id="L3590"><span class="ln">3590</span>            }
+</code><code id="L3591"><span class="ln">3591</span>            <b>this</b>.removed<span class="s"> = </span><b>true</b>;
+</code><code id="L3592"><span class="ln">3592</span>        };
+</code><code id="L3593"><span class="ln">3593</span>        elproto.attr<span class="s"> = </span><b>function</b> (name, value) {
+</code><code id="L3594"><span class="ln">3594</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L3595"><span class="ln">3595</span>                <b>return</b> <b>this</b>;
+</code><code id="L3596"><span class="ln">3596</span>            }
+</code><code id="L3597"><span class="ln">3597</span>            <b>if</b> (name<span class="s"> == </span><b>null</b>) {
+</code><code id="L3598"><span class="ln">3598</span>                <b>var</b> res<span class="s"> = </span>{};
+</code><code id="L3599"><span class="ln">3599</span>                <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>.attrs) <b>if</b> (<b>this</b>.attrs[has](i)) {
+</code><code id="L3600"><span class="ln">3600</span>                    res[i]<span class="s"> = </span><b>this</b>.attrs[i];
+</code><code id="L3601"><span class="ln">3601</span>                }
+</code><code id="L3602"><span class="ln">3602</span>                res.gradient<span class="s"> &amp;&amp; </span>res.fill<span class="s"> == </span><i>"none"</i><span class="s"> &amp;&amp; </span>(res.fill<span class="s"> = </span>res.gradient)<span class="s"> &amp;&amp; </span><b>delete</b> res.gradient;
+</code><code id="L3603"><span class="ln">3603</span>                <b>return</b> res;
+</code><code id="L3604"><span class="ln">3604</span>            }
+</code><code id="L3605"><span class="ln">3605</span>            <b>if</b> (value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, <i>"string"</i>)) {
+</code><code id="L3606"><span class="ln">3606</span>                <b>if</b> (name<span class="s"> == </span>fillString<span class="s"> &amp;&amp; </span><b>this</b>.attrs.fill<span class="s"> == </span><i>"none"</i><span class="s"> &amp;&amp; </span><b>this</b>.attrs.gradient) {
+</code><code id="L3607"><span class="ln">3607</span>                    <b>return</b> <b>this</b>.attrs.gradient;
+</code><code id="L3608"><span class="ln">3608</span>                }
+</code><code id="L3609"><span class="ln">3609</span>                <b>if</b> (name <b>in</b> <b>this</b>.attrs) {
+</code><code id="L3610"><span class="ln">3610</span>                    <b>return</b> <b>this</b>.attrs[name];
+</code><code id="L3611"><span class="ln">3611</span>                } <b>else</b> <b>if</b> (R.is(<b>this</b>.paper.customAttributes[name], <i>"<b>function</b>"</i>)) {
+</code><code id="L3612"><span class="ln">3612</span>                    <b>return</b> <b>this</b>.paper.customAttributes[name].def;
+</code><code id="L3613"><span class="ln">3613</span>                } <b>else</b> {
+</code><code id="L3614"><span class="ln">3614</span>                    <b>return</b> availableAttrs[name];
+</code><code id="L3615"><span class="ln">3615</span>                }
+</code><code id="L3616"><span class="ln">3616</span>            }
+</code><code id="L3617"><span class="ln">3617</span>            <b>if</b> (<b>this</b>.attrs<span class="s"> &amp;&amp; </span>value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, array)) {
+</code><code id="L3618"><span class="ln">3618</span>                <b>var</b> ii, values<span class="s"> = </span>{};
+</code><code id="L3619"><span class="ln">3619</span>                <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>name.length; i &lt; ii; i++) {
+</code><code id="L3620"><span class="ln">3620</span>                    values[name[i]]<span class="s"> = </span><b>this</b>.attr(name[i]);
+</code><code id="L3621"><span class="ln">3621</span>                }
+</code><code id="L3622"><span class="ln">3622</span>                <b>return</b> values;
+</code><code id="L3623"><span class="ln">3623</span>            }
+</code><code id="L3624"><span class="ln">3624</span>            <b>var</b> params;
+</code><code id="L3625"><span class="ln">3625</span>            <b>if</b> (value != <b>null</b>) {
+</code><code id="L3626"><span class="ln">3626</span>                params<span class="s"> = </span>{};
+</code><code id="L3627"><span class="ln">3627</span>                params[name]<span class="s"> = </span>value;
+</code><code id="L3628"><span class="ln">3628</span>            }
+</code><code id="L3629"><span class="ln">3629</span>            value<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>R.is(name, <i>"object"</i>)<span class="s"> &amp;&amp; </span>(params<span class="s"> = </span>name);
+</code><code id="L3630"><span class="ln">3630</span>            <b>for</b> (<b>var</b> key <b>in</b> params) {
+</code><code id="L3631"><span class="ln">3631</span>                eve(<i>"attr."</i><span class="s"> + </span>key<span class="s"> + </span><i>"."</i><span class="s"> + </span><b>this</b>.id, <b>this</b>, params[key]);
+</code><code id="L3632"><span class="ln">3632</span>            }
+</code><code id="L3633"><span class="ln">3633</span>            <b>if</b> (params) {
+</code><code id="L3634"><span class="ln">3634</span>                <b>for</b> (key <b>in</b> <b>this</b>.paper.customAttributes) <b>if</b> (<b>this</b>.paper.customAttributes[has](key)<span class="s"> &amp;&amp; </span>params[has](key)<span class="s"> &amp;&amp; </span>R.is(<b>this</b>.paper.customAttributes[key], <i>"<b>function</b>"</i>)) {
+</code><code id="L3635"><span class="ln">3635</span>                    <b>var</b> par<span class="s"> = </span><b>this</b>.paper.customAttributes[key].apply(<b>this</b>, [][concat](params[key]));
+</code><code id="L3636"><span class="ln">3636</span>                    <b>this</b>.attrs[key]<span class="s"> = </span>params[key];
+</code><code id="L3637"><span class="ln">3637</span>                    <b>for</b> (<b>var</b> subkey <b>in</b> par) <b>if</b> (par[has](subkey)) {
+</code><code id="L3638"><span class="ln">3638</span>                        params[subkey]<span class="s"> = </span>par[subkey];
+</code><code id="L3639"><span class="ln">3639</span>                    }
+</code><code id="L3640"><span class="ln">3640</span>                }
+</code><code id="L3641"><span class="ln">3641</span>                <span class="c">// <b>this</b>.paper.canvas.style.display<span class="s"> = </span><i>"none"</i>;</span>
+</code><code id="L3642"><span class="ln">3642</span>                <b>if</b> (params.text<span class="s"> &amp;&amp; </span><b>this</b>.type<span class="s"> == </span><i>"text"</i>) {
+</code><code id="L3643"><span class="ln">3643</span>                    <b>this</b>.textpath.string<span class="s"> = </span>params.text;
+</code><code id="L3644"><span class="ln">3644</span>                }
+</code><code id="L3645"><span class="ln">3645</span>                setFillAndStroke(<b>this</b>, params);
+</code><code id="L3646"><span class="ln">3646</span>                <span class="c">// <b>this</b>.paper.canvas.style.display<span class="s"> = </span>E;</span>
+</code><code id="L3647"><span class="ln">3647</span>            }
+</code><code id="L3648"><span class="ln">3648</span>            <b>return</b> <b>this</b>;
+</code><code id="L3649"><span class="ln">3649</span>        };
+</code><code id="L3650"><span class="ln">3650</span>        elproto.toFront<span class="s"> = </span><b>function</b> () {
+</code><code id="L3651"><span class="ln">3651</span>            !<b>this</b>.removed<span class="s"> &amp;&amp; </span><b>this</b>.node.parentNode.appendChild(<b>this</b>.node);
+</code><code id="L3652"><span class="ln">3652</span>            <b>this</b>.paper.top != <b>this</b><span class="s"> &amp;&amp; </span>tofront(<b>this</b>, <b>this</b>.paper);
+</code><code id="L3653"><span class="ln">3653</span>            <b>return</b> <b>this</b>;
+</code><code id="L3654"><span class="ln">3654</span>        };
+</code><code id="L3655"><span class="ln">3655</span>        elproto.toBack<span class="s"> = </span><b>function</b> () {
+</code><code id="L3656"><span class="ln">3656</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L3657"><span class="ln">3657</span>                <b>return</b> <b>this</b>;
+</code><code id="L3658"><span class="ln">3658</span>            }
+</code><code id="L3659"><span class="ln">3659</span>            <b>if</b> (<b>this</b>.node.parentNode.firstChild != <b>this</b>.node) {
+</code><code id="L3660"><span class="ln">3660</span>                <b>this</b>.node.parentNode.insertBefore(<b>this</b>.node, <b>this</b>.node.parentNode.firstChild);
+</code><code id="L3661"><span class="ln">3661</span>                toback(<b>this</b>, <b>this</b>.paper);
+</code><code id="L3662"><span class="ln">3662</span>            }
+</code><code id="L3663"><span class="ln">3663</span>            <b>return</b> <b>this</b>;
+</code><code id="L3664"><span class="ln">3664</span>        };
+</code><code id="L3665"><span class="ln">3665</span>        elproto.insertAfter<span class="s"> = </span><b>function</b> (element) {
+</code><code id="L3666"><span class="ln">3666</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L3667"><span class="ln">3667</span>                <b>return</b> <b>this</b>;
+</code><code id="L3668"><span class="ln">3668</span>            }
+</code><code id="L3669"><span class="ln">3669</span>            <b>if</b> (element.constructor<span class="s"> == </span>Set) {
+</code><code id="L3670"><span class="ln">3670</span>                element<span class="s"> = </span>element[element.length<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L3671"><span class="ln">3671</span>            }
+</code><code id="L3672"><span class="ln">3672</span>            <b>if</b> (element.node.nextSibling) {
+</code><code id="L3673"><span class="ln">3673</span>                element.node.parentNode.insertBefore(<b>this</b>.node, element.node.nextSibling);
+</code><code id="L3674"><span class="ln">3674</span>            } <b>else</b> {
+</code><code id="L3675"><span class="ln">3675</span>                element.node.parentNode.appendChild(<b>this</b>.node);
+</code><code id="L3676"><span class="ln">3676</span>            }
+</code><code id="L3677"><span class="ln">3677</span>            insertafter(<b>this</b>, element, <b>this</b>.paper);
+</code><code id="L3678"><span class="ln">3678</span>            <b>return</b> <b>this</b>;
+</code><code id="L3679"><span class="ln">3679</span>        };
+</code><code id="L3680"><span class="ln">3680</span>        elproto.insertBefore<span class="s"> = </span><b>function</b> (element) {
+</code><code id="L3681"><span class="ln">3681</span>            <b>if</b> (<b>this</b>.removed) {
+</code><code id="L3682"><span class="ln">3682</span>                <b>return</b> <b>this</b>;
+</code><code id="L3683"><span class="ln">3683</span>            }
+</code><code id="L3684"><span class="ln">3684</span>            <b>if</b> (element.constructor<span class="s"> == </span>Set) {
+</code><code id="L3685"><span class="ln">3685</span>                element<span class="s"> = </span>element[<span class="d">0</span>];
+</code><code id="L3686"><span class="ln">3686</span>            }
+</code><code id="L3687"><span class="ln">3687</span>            element.node.parentNode.insertBefore(<b>this</b>.node, element.node);
+</code><code id="L3688"><span class="ln">3688</span>            insertbefore(<b>this</b>, element, <b>this</b>.paper);
+</code><code id="L3689"><span class="ln">3689</span>            <b>return</b> <b>this</b>;
+</code><code id="L3690"><span class="ln">3690</span>        };
+</code><code id="L3691"><span class="ln">3691</span>        elproto.blur<span class="s"> = </span><b>function</b> (size) {
+</code><code id="L3692"><span class="ln">3692</span>            <b>var</b> s<span class="s"> = </span><b>this</b>.node.runtimeStyle,
+</code><code id="L3693"><span class="ln">3693</span>                f<span class="s"> = </span>s.filter;
+</code><code id="L3694"><span class="ln">3694</span>            f<span class="s"> = </span>f.replace(blurregexp, E);
+</code><code id="L3695"><span class="ln">3695</span>            <b>if</b> (+size !== <span class="d">0</span>) {
+</code><code id="L3696"><span class="ln">3696</span>                <b>this</b>.attrs.blur<span class="s"> = </span>size;
+</code><code id="L3697"><span class="ln">3697</span>                s.filter<span class="s"> = </span>f<span class="s"> + </span>S<span class="s"> + </span>ms<span class="s"> + </span><i>".Blur(pixelradius="</i><span class="s"> + </span>(+size<span class="s"> || </span><span class="d">1.5</span>)<span class="s"> + </span><i>")"</i>;
+</code><code id="L3698"><span class="ln">3698</span>                s.margin<span class="s"> = </span>R.format(<i>"-{<span class="d">0</span>}px <span class="d">0</span> <span class="d">0</span> -{<span class="d">0</span>}px"</i>, round(+size<span class="s"> || </span><span class="d">1.5</span>));
+</code><code id="L3699"><span class="ln">3699</span>            } <b>else</b> {
+</code><code id="L3700"><span class="ln">3700</span>                s.filter<span class="s"> = </span>f;
+</code><code id="L3701"><span class="ln">3701</span>                s.margin<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L3702"><span class="ln">3702</span>                <b>delete</b> <b>this</b>.attrs.blur;
+</code><code id="L3703"><span class="ln">3703</span>            }
+</code><code id="L3704"><span class="ln">3704</span>        };
+</code><code id="L3705"><span class="ln">3705</span>
+</code><code id="L3706"><span class="ln">3706</span>        thePath<span class="s"> = </span><b>function</b> (pathString, vml) {
+</code><code id="L3707"><span class="ln">3707</span>            <b>var</b> el<span class="s"> = </span>createNode(<i>"shape"</i>);
+</code><code id="L3708"><span class="ln">3708</span>            el.style.cssText<span class="s"> = </span>cssDot;
+</code><code id="L3709"><span class="ln">3709</span>            el.coordsize<span class="s"> = </span>zoom<span class="s"> + </span>S<span class="s"> + </span>zoom;
+</code><code id="L3710"><span class="ln">3710</span>            el.coordorigin<span class="s"> = </span>vml.coordorigin;
+</code><code id="L3711"><span class="ln">3711</span>            <b>var</b> p<span class="s"> = </span><b>new</b> Element(el, vml),
+</code><code id="L3712"><span class="ln">3712</span>                attr<span class="s"> = </span>{fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>};
+</code><code id="L3713"><span class="ln">3713</span>            pathString<span class="s"> &amp;&amp; </span>(attr.path<span class="s"> = </span>pathString);
+</code><code id="L3714"><span class="ln">3714</span>            p.type<span class="s"> = </span><i>"path"</i>;
+</code><code id="L3715"><span class="ln">3715</span>            p.path<span class="s"> = </span>[];
+</code><code id="L3716"><span class="ln">3716</span>            p.Path<span class="s"> = </span>E;
+</code><code id="L3717"><span class="ln">3717</span>            setFillAndStroke(p, attr);
+</code><code id="L3718"><span class="ln">3718</span>            vml.canvas.appendChild(el);
+</code><code id="L3719"><span class="ln">3719</span>            <b>var</b> skew<span class="s"> = </span>createNode(<i>"skew"</i>);
+</code><code id="L3720"><span class="ln">3720</span>            skew.on<span class="s"> = </span><b>true</b>;
+</code><code id="L3721"><span class="ln">3721</span>            el.appendChild(skew);
+</code><code id="L3722"><span class="ln">3722</span>            p.skew<span class="s"> = </span>skew;
+</code><code id="L3723"><span class="ln">3723</span>            p.transform(E);
+</code><code id="L3724"><span class="ln">3724</span>            <b>return</b> p;
+</code><code id="L3725"><span class="ln">3725</span>        };
+</code><code id="L3726"><span class="ln">3726</span>        theRect<span class="s"> = </span><b>function</b> (vml, x, y, w, h, r) {
+</code><code id="L3727"><span class="ln">3727</span>            <b>var</b> path<span class="s"> = </span>rectPath(x, y, w, h, r),
+</code><code id="L3728"><span class="ln">3728</span>                res<span class="s"> = </span>vml.path(path),
+</code><code id="L3729"><span class="ln">3729</span>                a<span class="s"> = </span>res.attrs;
+</code><code id="L3730"><span class="ln">3730</span>            res.X<span class="s"> = </span>a.x<span class="s"> = </span>x;
+</code><code id="L3731"><span class="ln">3731</span>            res.Y<span class="s"> = </span>a.y<span class="s"> = </span>y;
+</code><code id="L3732"><span class="ln">3732</span>            res.W<span class="s"> = </span>a.width<span class="s"> = </span>w;
+</code><code id="L3733"><span class="ln">3733</span>            res.H<span class="s"> = </span>a.height<span class="s"> = </span>h;
+</code><code id="L3734"><span class="ln">3734</span>            a.r<span class="s"> = </span>r;
+</code><code id="L3735"><span class="ln">3735</span>            a.path<span class="s"> = </span>path;
+</code><code id="L3736"><span class="ln">3736</span>            res.type<span class="s"> = </span><i>"rect"</i>;
+</code><code id="L3737"><span class="ln">3737</span>            <b>return</b> res;
+</code><code id="L3738"><span class="ln">3738</span>        };
+</code><code id="L3739"><span class="ln">3739</span>        theEllipse<span class="s"> = </span><b>function</b> (vml, x, y, rx, ry) {
+</code><code id="L3740"><span class="ln">3740</span>            <b>var</b> res<span class="s"> = </span>vml.path(),
+</code><code id="L3741"><span class="ln">3741</span>                a<span class="s"> = </span>res.attrs;
+</code><code id="L3742"><span class="ln">3742</span>            res.X<span class="s"> = </span>x<span class="s"> - </span>rx;
+</code><code id="L3743"><span class="ln">3743</span>            res.Y<span class="s"> = </span>y<span class="s"> - </span>ry;
+</code><code id="L3744"><span class="ln">3744</span>            res.W<span class="s"> = </span>rx<span class="s"> * </span><span class="d">2</span>;
+</code><code id="L3745"><span class="ln">3745</span>            res.H<span class="s"> = </span>ry<span class="s"> * </span><span class="d">2</span>;
+</code><code id="L3746"><span class="ln">3746</span>            res.type<span class="s"> = </span><i>"ellipse"</i>;
+</code><code id="L3747"><span class="ln">3747</span>            setFillAndStroke(res, {
+</code><code id="L3748"><span class="ln">3748</span>                cx: x,
+</code><code id="L3749"><span class="ln">3749</span>                cy: y,
+</code><code id="L3750"><span class="ln">3750</span>                rx: rx,
+</code><code id="L3751"><span class="ln">3751</span>                ry: ry
+</code><code id="L3752"><span class="ln">3752</span>            });
+</code><code id="L3753"><span class="ln">3753</span>            <b>return</b> res;
+</code><code id="L3754"><span class="ln">3754</span>        };
+</code><code id="L3755"><span class="ln">3755</span>        theCircle<span class="s"> = </span><b>function</b> (vml, x, y, r) {
+</code><code id="L3756"><span class="ln">3756</span>            <b>var</b> res<span class="s"> = </span>vml.path(),
+</code><code id="L3757"><span class="ln">3757</span>                a<span class="s"> = </span>res.attrs;
+</code><code id="L3758"><span class="ln">3758</span>            res.X<span class="s"> = </span>x<span class="s"> - </span>r;
+</code><code id="L3759"><span class="ln">3759</span>            res.Y<span class="s"> = </span>y<span class="s"> - </span>r;
+</code><code id="L3760"><span class="ln">3760</span>            res.W<span class="s"> = </span>res.H<span class="s"> = </span>r<span class="s"> * </span><span class="d">2</span>;
+</code><code id="L3761"><span class="ln">3761</span>            res.type<span class="s"> = </span><i>"circle"</i>;
+</code><code id="L3762"><span class="ln">3762</span>            setFillAndStroke(res, {
+</code><code id="L3763"><span class="ln">3763</span>                cx: x,
+</code><code id="L3764"><span class="ln">3764</span>                cy: y,
+</code><code id="L3765"><span class="ln">3765</span>                r: r
+</code><code id="L3766"><span class="ln">3766</span>            });
+</code><code id="L3767"><span class="ln">3767</span>            <b>return</b> res;
+</code><code id="L3768"><span class="ln">3768</span>        };
+</code><code id="L3769"><span class="ln">3769</span>        theImage<span class="s"> = </span><b>function</b> (vml, src, x, y, w, h) {
+</code><code id="L3770"><span class="ln">3770</span>            <b>var</b> path<span class="s"> = </span>rectPath(x, y, w, h),
+</code><code id="L3771"><span class="ln">3771</span>                res<span class="s"> = </span>vml.path(path).attr({stroke: <i>"none"</i>}),
+</code><code id="L3772"><span class="ln">3772</span>                a<span class="s"> = </span>res.attrs,
+</code><code id="L3773"><span class="ln">3773</span>                node<span class="s"> = </span>res.node,
+</code><code id="L3774"><span class="ln">3774</span>                fill<span class="s"> = </span>node.getElementsByTagName(fillString)[<span class="d">0</span>];
+</code><code id="L3775"><span class="ln">3775</span>            a.src<span class="s"> = </span>src;
+</code><code id="L3776"><span class="ln">3776</span>            res.X<span class="s"> = </span>a.x<span class="s"> = </span>x;
+</code><code id="L3777"><span class="ln">3777</span>            res.Y<span class="s"> = </span>a.y<span class="s"> = </span>y;
+</code><code id="L3778"><span class="ln">3778</span>            res.W<span class="s"> = </span>a.width<span class="s"> = </span>w;
+</code><code id="L3779"><span class="ln">3779</span>            res.H<span class="s"> = </span>a.height<span class="s"> = </span>h;
+</code><code id="L3780"><span class="ln">3780</span>            a.path<span class="s"> = </span>path;
+</code><code id="L3781"><span class="ln">3781</span>            res.type<span class="s"> = </span><i>"image"</i>;
+</code><code id="L3782"><span class="ln">3782</span>            fill.parentNode<span class="s"> == </span>node<span class="s"> &amp;&amp; </span>node.removeChild(fill);
+</code><code id="L3783"><span class="ln">3783</span>            fill.rotate<span class="s"> = </span><b>true</b>;
+</code><code id="L3784"><span class="ln">3784</span>            fill.src<span class="s"> = </span>src;
+</code><code id="L3785"><span class="ln">3785</span>            fill.type<span class="s"> = </span><i>"tile"</i>;
+</code><code id="L3786"><span class="ln">3786</span>            res._.fillpos<span class="s"> = </span>[x, y];
+</code><code id="L3787"><span class="ln">3787</span>            res._.fillsize<span class="s"> = </span>[w, h];
+</code><code id="L3788"><span class="ln">3788</span>            node.appendChild(fill);
+</code><code id="L3789"><span class="ln">3789</span>            setCoords(res);
+</code><code id="L3790"><span class="ln">3790</span>            <b>return</b> res;
+</code><code id="L3791"><span class="ln">3791</span>        };
+</code><code id="L3792"><span class="ln">3792</span>        theText<span class="s"> = </span><b>function</b> (vml, x, y, text) {
+</code><code id="L3793"><span class="ln">3793</span>            <b>var</b> el<span class="s"> = </span>createNode(<i>"shape"</i>),
+</code><code id="L3794"><span class="ln">3794</span>                path<span class="s"> = </span>createNode(<i>"path"</i>),
+</code><code id="L3795"><span class="ln">3795</span>                o<span class="s"> = </span>createNode(<i>"textpath"</i>);
+</code><code id="L3796"><span class="ln">3796</span>            x<span class="s"> = </span>x<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L3797"><span class="ln">3797</span>            y<span class="s"> = </span>y<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L3798"><span class="ln">3798</span>            text<span class="s"> = </span>text<span class="s"> || </span><i>""</i>;
+</code><code id="L3799"><span class="ln">3799</span>            path.v<span class="s"> = </span>R.format(<i>"m{<span class="d">0</span>},{<span class="d">1</span>}l{<span class="d">2</span>},{<span class="d">1</span>}"</i>, round(x<span class="s"> * </span>zoom), round(y<span class="s"> * </span>zoom), round(x<span class="s"> * </span>zoom)<span class="s"> + </span><span class="d">1</span>);
+</code><code id="L3800"><span class="ln">3800</span>            path.textpathok<span class="s"> = </span><b>true</b>;
+</code><code id="L3801"><span class="ln">3801</span>            o.string<span class="s"> = </span>Str(text);
+</code><code id="L3802"><span class="ln">3802</span>            o.on<span class="s"> = </span><b>true</b>;
+</code><code id="L3803"><span class="ln">3803</span>            el.style.cssText<span class="s"> = </span><i>"position:absolute;left:<span class="d">0</span>;top:<span class="d">0</span>;width:<span class="d">1</span>;height:<span class="d">1</span>"</i>;
+</code><code id="L3804"><span class="ln">3804</span>            el.coordsize<span class="s"> = </span>zoom<span class="s"> + </span>S<span class="s"> + </span>zoom;
+</code><code id="L3805"><span class="ln">3805</span>            el.coordorigin<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span>"</i>;
+</code><code id="L3806"><span class="ln">3806</span>            <b>var</b> p<span class="s"> = </span><b>new</b> Element(el, vml),
+</code><code id="L3807"><span class="ln">3807</span>                attr<span class="s"> = </span>{fill: <i>"#<span class="d">000</span>"</i>, stroke: <i>"none"</i>, font: availableAttrs.font, text: text};
+</code><code id="L3808"><span class="ln">3808</span>            p.shape<span class="s"> = </span>el;
+</code><code id="L3809"><span class="ln">3809</span>            p.path<span class="s"> = </span>path;
+</code><code id="L3810"><span class="ln">3810</span>            p.textpath<span class="s"> = </span>o;
+</code><code id="L3811"><span class="ln">3811</span>            p.type<span class="s"> = </span><i>"text"</i>;
+</code><code id="L3812"><span class="ln">3812</span>            p.attrs.text<span class="s"> = </span>Str(text);
+</code><code id="L3813"><span class="ln">3813</span>            p.attrs.x<span class="s"> = </span>x;
+</code><code id="L3814"><span class="ln">3814</span>            p.attrs.y<span class="s"> = </span>y;
+</code><code id="L3815"><span class="ln">3815</span>            p.attrs.w<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L3816"><span class="ln">3816</span>            p.attrs.h<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L3817"><span class="ln">3817</span>            setFillAndStroke(p, attr);
+</code><code id="L3818"><span class="ln">3818</span>            el.appendChild(o);
+</code><code id="L3819"><span class="ln">3819</span>            el.appendChild(path);
+</code><code id="L3820"><span class="ln">3820</span>            vml.canvas.appendChild(el);
+</code><code id="L3821"><span class="ln">3821</span>            <b>var</b> skew<span class="s"> = </span>createNode(<i>"skew"</i>);
+</code><code id="L3822"><span class="ln">3822</span>            skew.on<span class="s"> = </span><b>true</b>;
+</code><code id="L3823"><span class="ln">3823</span>            el.appendChild(skew);
+</code><code id="L3824"><span class="ln">3824</span>            p.skew<span class="s"> = </span>skew;
+</code><code id="L3825"><span class="ln">3825</span>            p.transform(E);
+</code><code id="L3826"><span class="ln">3826</span>            <b>return</b> p;
+</code><code id="L3827"><span class="ln">3827</span>        };
+</code><code id="L3828"><span class="ln">3828</span>        setSize<span class="s"> = </span><b>function</b> (width, height) {
+</code><code id="L3829"><span class="ln">3829</span>            <b>var</b> cs<span class="s"> = </span><b>this</b>.canvas.style;
+</code><code id="L3830"><span class="ln">3830</span>            <b>this</b>.width<span class="s"> = </span>width;
+</code><code id="L3831"><span class="ln">3831</span>            <b>this</b>.height<span class="s"> = </span>height;
+</code><code id="L3832"><span class="ln">3832</span>            width<span class="s"> == </span>+width<span class="s"> &amp;&amp; </span>(width += <i>"px"</i>);
+</code><code id="L3833"><span class="ln">3833</span>            height<span class="s"> == </span>+height<span class="s"> &amp;&amp; </span>(height += <i>"px"</i>);
+</code><code id="L3834"><span class="ln">3834</span>            cs.width<span class="s"> = </span>width;
+</code><code id="L3835"><span class="ln">3835</span>            cs.height<span class="s"> = </span>height;
+</code><code id="L3836"><span class="ln">3836</span>            cs.clip<span class="s"> = </span><i>"rect(<span class="d">0</span> "</i><span class="s"> + </span>width<span class="s"> + </span><i>" "</i><span class="s"> + </span>height<span class="s"> + </span><i>" <span class="d">0</span>)"</i>;
+</code><code id="L3837"><span class="ln">3837</span>            <b>if</b> (<b>this</b>._viewBox) {
+</code><code id="L3838"><span class="ln">3838</span>                setViewBox.apply(<b>this</b>, <b>this</b>._viewBox);
+</code><code id="L3839"><span class="ln">3839</span>            }
+</code><code id="L3840"><span class="ln">3840</span>            <b>return</b> <b>this</b>;
+</code><code id="L3841"><span class="ln">3841</span>        };
+</code><code id="L3842"><span class="ln">3842</span>        setViewBox<span class="s"> = </span><b>function</b> (x, y, w, h, fit) {
+</code><code id="L3843"><span class="ln">3843</span>            eve(<i>"setViewBox"</i>, <b>this</b>, <b>this</b>._viewBox, [x, y, w, h, fit]);
+</code><code id="L3844"><span class="ln">3844</span>            <b>var</b> width<span class="s"> = </span><b>this</b>.width,
+</code><code id="L3845"><span class="ln">3845</span>                height<span class="s"> = </span><b>this</b>.height,
+</code><code id="L3846"><span class="ln">3846</span>                size<span class="s"> = </span><span class="d">1e3</span><span class="s"> * </span>mmax(w<span class="s"> / </span>width, h<span class="s"> / </span>height),
+</code><code id="L3847"><span class="ln">3847</span>                H, W;
+</code><code id="L3848"><span class="ln">3848</span>            <b>if</b> (fit) {
+</code><code id="L3849"><span class="ln">3849</span>                H<span class="s"> = </span>height<span class="s"> / </span>h;
+</code><code id="L3850"><span class="ln">3850</span>                W<span class="s"> = </span>width<span class="s"> / </span>w;
+</code><code id="L3851"><span class="ln">3851</span>                <b>if</b> (w<span class="s"> * </span>H &lt; width) {
+</code><code id="L3852"><span class="ln">3852</span>                    x -= (width<span class="s"> - </span>w<span class="s"> * </span>H)<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>H;
+</code><code id="L3853"><span class="ln">3853</span>                }
+</code><code id="L3854"><span class="ln">3854</span>                <b>if</b> (h<span class="s"> * </span>W &lt; height) {
+</code><code id="L3855"><span class="ln">3855</span>                    y -= (height<span class="s"> - </span>h<span class="s"> * </span>W)<span class="s"> / </span><span class="d">2</span><span class="s"> / </span>W;
+</code><code id="L3856"><span class="ln">3856</span>                }
+</code><code id="L3857"><span class="ln">3857</span>            }
+</code><code id="L3858"><span class="ln">3858</span>            <b>this</b>._viewBox<span class="s"> = </span>[x, y, w, h, !!fit];
+</code><code id="L3859"><span class="ln">3859</span>            <b>this</b>.forEach(<b>function</b> (el) {
+</code><code id="L3860"><span class="ln">3860</span>                el.transform(<i>"..."</i>);
+</code><code id="L3861"><span class="ln">3861</span>            });
+</code><code id="L3862"><span class="ln">3862</span>            <b>return</b> <b>this</b>;
+</code><code id="L3863"><span class="ln">3863</span>        };
+</code><code id="L3864"><span class="ln">3864</span>        <b>var</b> createNode,
+</code><code id="L3865"><span class="ln">3865</span>            initWin<span class="s"> = </span><b>function</b> (win) {
+</code><code id="L3866"><span class="ln">3866</span>                <b>var</b> doc<span class="s"> = </span>win.document;
+</code><code id="L3867"><span class="ln">3867</span>                doc.createStyleSheet().addRule(<i>".rvml"</i>, <i>"behavior:url(#<b>default</b>#VML)"</i>);
+</code><code id="L3868"><span class="ln">3868</span>                <b>try</b> {
+</code><code id="L3869"><span class="ln">3869</span>                    !doc.namespaces.rvml<span class="s"> &amp;&amp; </span>doc.namespaces.add(<i>"rvml"</i>, <i>"urn:schemas-microsoft-com:vml"</i>);
+</code><code id="L3870"><span class="ln">3870</span>                    createNode<span class="s"> = </span><b>function</b> (tagName) {
+</code><code id="L3871"><span class="ln">3871</span>                        <b>return</b> doc.createElement(<i>'&lt;rvml:'</i><span class="s"> + </span>tagName<span class="s"> + </span><i>' <b>class</b>="rvml">'</i>);
+</code><code id="L3872"><span class="ln">3872</span>                    };
+</code><code id="L3873"><span class="ln">3873</span>                } <b>catch</b> (e) {
+</code><code id="L3874"><span class="ln">3874</span>                    createNode<span class="s"> = </span><b>function</b> (tagName) {
+</code><code id="L3875"><span class="ln">3875</span>                        <b>return</b> doc.createElement(<i>'&lt;'</i><span class="s"> + </span>tagName<span class="s"> + </span><i>' xmlns="urn:schemas-microsoft.com:vml" <b>class</b>="rvml">'</i>);
+</code><code id="L3876"><span class="ln">3876</span>                    };
+</code><code id="L3877"><span class="ln">3877</span>                }
+</code><code id="L3878"><span class="ln">3878</span>            };
+</code><code id="L3879"><span class="ln">3879</span>        initWin(g.win);
+</code><code id="L3880"><span class="ln">3880</span>        create<span class="s"> = </span><b>function</b> () {
+</code><code id="L3881"><span class="ln">3881</span>            <b>var</b> con<span class="s"> = </span>getContainer[apply](<span class="d">0</span>, arguments),
+</code><code id="L3882"><span class="ln">3882</span>                container<span class="s"> = </span>con.container,
+</code><code id="L3883"><span class="ln">3883</span>                height<span class="s"> = </span>con.height,
+</code><code id="L3884"><span class="ln">3884</span>                s,
+</code><code id="L3885"><span class="ln">3885</span>                width<span class="s"> = </span>con.width,
+</code><code id="L3886"><span class="ln">3886</span>                x<span class="s"> = </span>con.x,
+</code><code id="L3887"><span class="ln">3887</span>                y<span class="s"> = </span>con.y;
+</code><code id="L3888"><span class="ln">3888</span>            <b>if</b> (!container) {
+</code><code id="L3889"><span class="ln">3889</span>                <b>throw</b> <b>new</b> Error(<i>"VML container not found."</i>);
+</code><code id="L3890"><span class="ln">3890</span>            }
+</code><code id="L3891"><span class="ln">3891</span>            <b>var</b> res<span class="s"> = </span><b>new</b> Paper,
+</code><code id="L3892"><span class="ln">3892</span>                c<span class="s"> = </span>res.canvas<span class="s"> = </span>g.doc.createElement(<i>"div"</i>),
+</code><code id="L3893"><span class="ln">3893</span>                cs<span class="s"> = </span>c.style;
+</code><code id="L3894"><span class="ln">3894</span>            x<span class="s"> = </span>x<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L3895"><span class="ln">3895</span>            y<span class="s"> = </span>y<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L3896"><span class="ln">3896</span>            width<span class="s"> = </span>width<span class="s"> || </span><span class="d">512</span>;
+</code><code id="L3897"><span class="ln">3897</span>            height<span class="s"> = </span>height<span class="s"> || </span><span class="d">342</span>;
+</code><code id="L3898"><span class="ln">3898</span>            res.width<span class="s"> = </span>width;
+</code><code id="L3899"><span class="ln">3899</span>            res.height<span class="s"> = </span>height;
+</code><code id="L3900"><span class="ln">3900</span>            width<span class="s"> == </span>+width<span class="s"> &amp;&amp; </span>(width += <i>"px"</i>);
+</code><code id="L3901"><span class="ln">3901</span>            height<span class="s"> == </span>+height<span class="s"> &amp;&amp; </span>(height += <i>"px"</i>);
+</code><code id="L3902"><span class="ln">3902</span>            res.coordsize<span class="s"> = </span>zoom<span class="s"> * </span><span class="d">1e3</span><span class="s"> + </span>S<span class="s"> + </span>zoom<span class="s"> * </span><span class="d">1e3</span>;
+</code><code id="L3903"><span class="ln">3903</span>            res.coordorigin<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span>"</i>;
+</code><code id="L3904"><span class="ln">3904</span>            res.span<span class="s"> = </span>g.doc.createElement(<i>"span"</i>);
+</code><code id="L3905"><span class="ln">3905</span>            res.span.style.cssText<span class="s"> = </span><i>"position:absolute;left:-9999em;top:-9999em;padding:<span class="d">0</span>;margin:<span class="d">0</span>;line-height:<span class="d">1</span>;"</i>;
+</code><code id="L3906"><span class="ln">3906</span>            c.appendChild(res.span);
+</code><code id="L3907"><span class="ln">3907</span>            cs.cssText<span class="s"> = </span>R.format(<i>"top:<span class="d">0</span>;left:<span class="d">0</span>;width:{<span class="d">0</span>};height:{<span class="d">1</span>};display:inline-block;position:relative;clip:rect(<span class="d">0</span> {<span class="d">0</span>} {<span class="d">1</span>} <span class="d">0</span>);overflow:hidden"</i>, width, height);
+</code><code id="L3908"><span class="ln">3908</span>            <b>if</b> (container<span class="s"> == </span><span class="d">1</span>) {
+</code><code id="L3909"><span class="ln">3909</span>                g.doc.body.appendChild(c);
+</code><code id="L3910"><span class="ln">3910</span>                cs.left<span class="s"> = </span>x<span class="s"> + </span><i>"px"</i>;
+</code><code id="L3911"><span class="ln">3911</span>                cs.top<span class="s"> = </span>y<span class="s"> + </span><i>"px"</i>;
+</code><code id="L3912"><span class="ln">3912</span>                cs.position<span class="s"> = </span><i>"absolute"</i>;
+</code><code id="L3913"><span class="ln">3913</span>            } <b>else</b> {
+</code><code id="L3914"><span class="ln">3914</span>                <b>if</b> (container.firstChild) {
+</code><code id="L3915"><span class="ln">3915</span>                    container.insertBefore(c, container.firstChild);
+</code><code id="L3916"><span class="ln">3916</span>                } <b>else</b> {
+</code><code id="L3917"><span class="ln">3917</span>                    container.appendChild(c);
+</code><code id="L3918"><span class="ln">3918</span>                }
+</code><code id="L3919"><span class="ln">3919</span>            }
+</code><code id="L3920"><span class="ln">3920</span>            plugins.call(res, res, R.fn);
+</code><code id="L3921"><span class="ln">3921</span>            <b>return</b> res;
+</code><code id="L3922"><span class="ln">3922</span>        };
+</code><code id="L3923"><span class="ln">3923</span>        paperproto.clear<span class="s"> = </span><b>function</b> () {
+</code><code id="L3924"><span class="ln">3924</span>            eve(<i>"clear"</i>, <b>this</b>);
+</code><code id="L3925"><span class="ln">3925</span>            <b>this</b>.canvas.innerHTML<span class="s"> = </span>E;
+</code><code id="L3926"><span class="ln">3926</span>            <b>this</b>.span<span class="s"> = </span>g.doc.createElement(<i>"span"</i>);
+</code><code id="L3927"><span class="ln">3927</span>            <b>this</b>.span.style.cssText<span class="s"> = </span><i>"position:absolute;left:-9999em;top:-9999em;padding:<span class="d">0</span>;margin:<span class="d">0</span>;line-height:<span class="d">1</span>;display:inline;"</i>;
+</code><code id="L3928"><span class="ln">3928</span>            <b>this</b>.canvas.appendChild(<b>this</b>.span);
+</code><code id="L3929"><span class="ln">3929</span>            <b>this</b>.bottom<span class="s"> = </span><b>this</b>.top<span class="s"> = </span><b>null</b>;
+</code><code id="L3930"><span class="ln">3930</span>        };
+</code><code id="L3931"><span class="ln">3931</span>        paperproto.remove<span class="s"> = </span><b>function</b> () {
+</code><code id="L3932"><span class="ln">3932</span>            eve(<i>"remove"</i>, <b>this</b>);
+</code><code id="L3933"><span class="ln">3933</span>            <b>this</b>.canvas.parentNode.removeChild(<b>this</b>.canvas);
+</code><code id="L3934"><span class="ln">3934</span>            <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
+</code><code id="L3935"><span class="ln">3935</span>                <b>this</b>[i]<span class="s"> = </span>removed(i);
+</code><code id="L3936"><span class="ln">3936</span>            }
+</code><code id="L3937"><span class="ln">3937</span>            <b>return</b> <b>true</b>;
+</code><code id="L3938"><span class="ln">3938</span>        };
+</code><code id="L3939"><span class="ln">3939</span>    }
+</code><code id="L3940"><span class="ln">3940</span> 
+</code><code id="L3941"><span class="ln">3941</span>    <span class="c">// WebKit rendering bug workaround method</span>
+</code><code id="L3942"><span class="ln">3942</span>    <b>var</b> version<span class="s"> = </span>navigator.userAgent.match(/Version\/(.*?)\s/)<span class="s"> || </span>navigator.userAgent.match(/Chrome\/(\d+)/);
+</code><code id="L3943"><span class="ln">3943</span>    <b>if</b> ((navigator.vendor<span class="s"> == </span><i>"Apple Computer, Inc."</i>)<span class="s"> &amp;&amp; </span>(version<span class="s"> &amp;&amp; </span>version[<span class="d">1</span>] &lt; <span class="d">4</span><span class="s"> || </span>navigator.platform.slice(<span class="d">0</span>, <span class="d">2</span>)<span class="s"> == </span><i>"iP"</i>) ||
+</code><code id="L3944"><span class="ln">3944</span>        (navigator.vendor<span class="s"> == </span><i>"Google Inc."</i><span class="s"> &amp;&amp; </span>version<span class="s"> &amp;&amp; </span>version[<span class="d">1</span>] &lt; <span class="d">8</span>)) {
+</code><code id="L3945"><span class="ln">3945</span><span class="c">        <span class="c">/*\</span>
+</span></code><code id="L3946"><span class="ln">3946</span><span class="c">        <span class="s"> * </span>Paper.safari
+</span></code><code id="L3947"><span class="ln">3947</span><span class="c">         [ method ]
+</span></code><code id="L3948"><span class="ln">3948</span><span class="c">         **
+</span></code><code id="L3949"><span class="ln">3949</span><span class="c">        <span class="s"> * </span>There is an inconvenient rendering bug <b>in</b> Safari (WebKit):
+</span></code><code id="L3950"><span class="ln">3950</span><span class="c">        <span class="s"> * </span>sometimes the rendering should be forced.
+</span></code><code id="L3951"><span class="ln">3951</span><span class="c">        <span class="s"> * </span>This method should help <b>with</b> dealing <b>with</b> <b>this</b> bug.
+</span></code><code id="L3952"><span class="ln">3952</span><span class="c">        \*/</span>
+</code><code id="L3953"><span class="ln">3953</span>        paperproto.safari<span class="s"> = </span><b>function</b> () {
+</code><code id="L3954"><span class="ln">3954</span>            <b>var</b> rect<span class="s"> = </span><b>this</b>.rect(-<span class="d">99</span>, -<span class="d">99</span>, <b>this</b>.width<span class="s"> + </span><span class="d">99</span>, <b>this</b>.height<span class="s"> + </span><span class="d">99</span>).attr({stroke: <i>"none"</i>});
+</code><code id="L3955"><span class="ln">3955</span>            setTimeout(<b>function</b> () {rect.remove();});
+</code><code id="L3956"><span class="ln">3956</span>        };
+</code><code id="L3957"><span class="ln">3957</span>    } <b>else</b> {
+</code><code id="L3958"><span class="ln">3958</span>        paperproto.safari<span class="s"> = </span>fun;
+</code><code id="L3959"><span class="ln">3959</span>    }
+</code><code id="L3960"><span class="ln">3960</span> 
+</code><code id="L3961"><span class="ln">3961</span>    <span class="c">// Events</span>
+</code><code id="L3962"><span class="ln">3962</span>    <b>var</b> preventDefault<span class="s"> = </span><b>function</b> () {
+</code><code id="L3963"><span class="ln">3963</span>        <b>this</b>.returnValue<span class="s"> = </span><b>false</b>;
+</code><code id="L3964"><span class="ln">3964</span>    },
+</code><code id="L3965"><span class="ln">3965</span>    preventTouch<span class="s"> = </span><b>function</b> () {
+</code><code id="L3966"><span class="ln">3966</span>        <b>return</b> <b>this</b>.originalEvent.preventDefault();
 </code><code id="L3967"><span class="ln">3967</span>    },
-</code><code id="L3968"><span class="ln">3968</span>    preventTouch<span class="s"> = </span><b>function</b> () {
-</code><code id="L3969"><span class="ln">3969</span>        <b>return</b> <b>this</b>.originalEvent.preventDefault();
+</code><code id="L3968"><span class="ln">3968</span>    stopPropagation<span class="s"> = </span><b>function</b> () {
+</code><code id="L3969"><span class="ln">3969</span>        <b>this</b>.cancelBubble<span class="s"> = </span><b>true</b>;
 </code><code id="L3970"><span class="ln">3970</span>    },
-</code><code id="L3971"><span class="ln">3971</span>    stopPropagation<span class="s"> = </span><b>function</b> () {
-</code><code id="L3972"><span class="ln">3972</span>        <b>this</b>.cancelBubble<span class="s"> = </span><b>true</b>;
+</code><code id="L3971"><span class="ln">3971</span>    stopTouch<span class="s"> = </span><b>function</b> () {
+</code><code id="L3972"><span class="ln">3972</span>        <b>return</b> <b>this</b>.originalEvent.stopPropagation();
 </code><code id="L3973"><span class="ln">3973</span>    },
-</code><code id="L3974"><span class="ln">3974</span>    stopTouch<span class="s"> = </span><b>function</b> () {
-</code><code id="L3975"><span class="ln">3975</span>        <b>return</b> <b>this</b>.originalEvent.stopPropagation();
-</code><code id="L3976"><span class="ln">3976</span>    },
-</code><code id="L3977"><span class="ln">3977</span>    addEvent<span class="s"> = </span>(<b>function</b> () {
-</code><code id="L3978"><span class="ln">3978</span>        <b>if</b> (g.doc.addEventListener) {
-</code><code id="L3979"><span class="ln">3979</span>            <b>return</b> <b>function</b> (obj, type, fn, element) {
-</code><code id="L3980"><span class="ln">3980</span>                <b>var</b> realName<span class="s"> = </span>supportsTouch<span class="s"> &amp;&amp; </span>touchMap[type] ? touchMap[type] : type;
-</code><code id="L3981"><span class="ln">3981</span>                <b>var</b> f<span class="s"> = </span><b>function</b> (e) {
-</code><code id="L3982"><span class="ln">3982</span>                    <b>if</b> (supportsTouch<span class="s"> &amp;&amp; </span>touchMap[has](type)) {
-</code><code id="L3983"><span class="ln">3983</span>                        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>e.targetTouches<span class="s"> &amp;&amp; </span>e.targetTouches.length; i &lt; ii; i++) {
-</code><code id="L3984"><span class="ln">3984</span>                            <b>if</b> (e.targetTouches[i].target<span class="s"> == </span>obj) {
-</code><code id="L3985"><span class="ln">3985</span>                                <b>var</b> olde<span class="s"> = </span>e;
-</code><code id="L3986"><span class="ln">3986</span>                                e<span class="s"> = </span>e.targetTouches[i];
-</code><code id="L3987"><span class="ln">3987</span>                                e.originalEvent<span class="s"> = </span>olde;
-</code><code id="L3988"><span class="ln">3988</span>                                e.preventDefault<span class="s"> = </span>preventTouch;
-</code><code id="L3989"><span class="ln">3989</span>                                e.stopPropagation<span class="s"> = </span>stopTouch;
-</code><code id="L3990"><span class="ln">3990</span>                                <b>break</b>;
-</code><code id="L3991"><span class="ln">3991</span>                            }
-</code><code id="L3992"><span class="ln">3992</span>                        }
-</code><code id="L3993"><span class="ln">3993</span>                    }
-</code><code id="L3994"><span class="ln">3994</span>                    <b>return</b> fn.call(element, e);
-</code><code id="L3995"><span class="ln">3995</span>                };
-</code><code id="L3996"><span class="ln">3996</span>                obj.addEventListener(realName, f, <b>false</b>);
-</code><code id="L3997"><span class="ln">3997</span>                <b>return</b> <b>function</b> () {
-</code><code id="L3998"><span class="ln">3998</span>                    obj.removeEventListener(realName, f, <b>false</b>);
-</code><code id="L3999"><span class="ln">3999</span>                    <b>return</b> <b>true</b>;
-</code><code id="L4000"><span class="ln">4000</span>                };
-</code><code id="L4001"><span class="ln">4001</span>            };
-</code><code id="L4002"><span class="ln">4002</span>        } <b>else</b> <b>if</b> (g.doc.attachEvent) {
-</code><code id="L4003"><span class="ln">4003</span>            <b>return</b> <b>function</b> (obj, type, fn, element) {
-</code><code id="L4004"><span class="ln">4004</span>                <b>var</b> f<span class="s"> = </span><b>function</b> (e) {
-</code><code id="L4005"><span class="ln">4005</span>                    e<span class="s"> = </span>e<span class="s"> || </span>g.win.event;
-</code><code id="L4006"><span class="ln">4006</span>                    e.preventDefault<span class="s"> = </span>e.preventDefault<span class="s"> || </span>preventDefault;
-</code><code id="L4007"><span class="ln">4007</span>                    e.stopPropagation<span class="s"> = </span>e.stopPropagation<span class="s"> || </span>stopPropagation;
-</code><code id="L4008"><span class="ln">4008</span>                    <b>return</b> fn.call(element, e);
-</code><code id="L4009"><span class="ln">4009</span>                };
-</code><code id="L4010"><span class="ln">4010</span>                obj.attachEvent(<i>"on"</i><span class="s"> + </span>type, f);
-</code><code id="L4011"><span class="ln">4011</span>                <b>var</b> detacher<span class="s"> = </span><b>function</b> () {
-</code><code id="L4012"><span class="ln">4012</span>                    obj.detachEvent(<i>"on"</i><span class="s"> + </span>type, f);
-</code><code id="L4013"><span class="ln">4013</span>                    <b>return</b> <b>true</b>;
-</code><code id="L4014"><span class="ln">4014</span>                };
-</code><code id="L4015"><span class="ln">4015</span>                <b>return</b> detacher;
-</code><code id="L4016"><span class="ln">4016</span>            };
-</code><code id="L4017"><span class="ln">4017</span>        }
-</code><code id="L4018"><span class="ln">4018</span>    })(),
-</code><code id="L4019"><span class="ln">4019</span>    drag<span class="s"> = </span>[],
-</code><code id="L4020"><span class="ln">4020</span>    dragMove<span class="s"> = </span><b>function</b> (e) {
-</code><code id="L4021"><span class="ln">4021</span>        <b>var</b> x<span class="s"> = </span>e.clientX,
-</code><code id="L4022"><span class="ln">4022</span>            y<span class="s"> = </span>e.clientY,
-</code><code id="L4023"><span class="ln">4023</span>            scrollY<span class="s"> = </span>g.doc.documentElement.scrollTop<span class="s"> || </span>g.doc.body.scrollTop,
-</code><code id="L4024"><span class="ln">4024</span>            scrollX<span class="s"> = </span>g.doc.documentElement.scrollLeft<span class="s"> || </span>g.doc.body.scrollLeft,
-</code><code id="L4025"><span class="ln">4025</span>            dragi,
-</code><code id="L4026"><span class="ln">4026</span>            j<span class="s"> = </span>drag.length;
-</code><code id="L4027"><span class="ln">4027</span>        <b>while</b> (j--) {
-</code><code id="L4028"><span class="ln">4028</span>            dragi<span class="s"> = </span>drag[j];
-</code><code id="L4029"><span class="ln">4029</span>            <b>if</b> (supportsTouch) {
-</code><code id="L4030"><span class="ln">4030</span>                <b>var</b> i<span class="s"> = </span>e.touches.length,
-</code><code id="L4031"><span class="ln">4031</span>                    touch;
-</code><code id="L4032"><span class="ln">4032</span>                <b>while</b> (i--) {
-</code><code id="L4033"><span class="ln">4033</span>                    touch<span class="s"> = </span>e.touches[i];
-</code><code id="L4034"><span class="ln">4034</span>                    <b>if</b> (touch.identifier<span class="s"> == </span>dragi.el._drag.id) {
-</code><code id="L4035"><span class="ln">4035</span>                        x<span class="s"> = </span>touch.clientX;
-</code><code id="L4036"><span class="ln">4036</span>                        y<span class="s"> = </span>touch.clientY;
-</code><code id="L4037"><span class="ln">4037</span>                        (e.originalEvent ? e.originalEvent : e).preventDefault();
-</code><code id="L4038"><span class="ln">4038</span>                        <b>break</b>;
-</code><code id="L4039"><span class="ln">4039</span>                    }
-</code><code id="L4040"><span class="ln">4040</span>                }
-</code><code id="L4041"><span class="ln">4041</span>            } <b>else</b> {
-</code><code id="L4042"><span class="ln">4042</span>                e.preventDefault();
-</code><code id="L4043"><span class="ln">4043</span>            }
-</code><code id="L4044"><span class="ln">4044</span>            <b>var</b> node<span class="s"> = </span>dragi.el.node,
-</code><code id="L4045"><span class="ln">4045</span>                o,
-</code><code id="L4046"><span class="ln">4046</span>                next<span class="s"> = </span>node.nextSibling,
-</code><code id="L4047"><span class="ln">4047</span>                parent<span class="s"> = </span>node.parentNode,
-</code><code id="L4048"><span class="ln">4048</span>                display<span class="s"> = </span>node.style.display;
-</code><code id="L4049"><span class="ln">4049</span>            g.win.opera<span class="s"> &amp;&amp; </span>parent.removeChild(node);
-</code><code id="L4050"><span class="ln">4050</span>            node.style.display<span class="s"> = </span><i>"none"</i>;
-</code><code id="L4051"><span class="ln">4051</span>            o<span class="s"> = </span>dragi.el.paper.getElementByPoint(x, y);
-</code><code id="L4052"><span class="ln">4052</span>            node.style.display<span class="s"> = </span>display;
-</code><code id="L4053"><span class="ln">4053</span>            g.win.opera<span class="s"> &amp;&amp; </span>(next ? parent.insertBefore(node, next) : parent.appendChild(node));
-</code><code id="L4054"><span class="ln">4054</span>            o<span class="s"> &amp;&amp; </span>eve(<i>"drag.over."</i><span class="s"> + </span>dragi.el.id, dragi.el, o);
-</code><code id="L4055"><span class="ln">4055</span>            x += scrollX;
-</code><code id="L4056"><span class="ln">4056</span>            y += scrollY;
-</code><code id="L4057"><span class="ln">4057</span>            eve(<i>"drag.move."</i><span class="s"> + </span>dragi.el.id, dragi.move_scope<span class="s"> || </span>dragi.el, x<span class="s"> - </span>dragi.el._drag.x, y<span class="s"> - </span>dragi.el._drag.y, x, y, e);
-</code><code id="L4058"><span class="ln">4058</span>        }
-</code><code id="L4059"><span class="ln">4059</span>    },
-</code><code id="L4060"><span class="ln">4060</span>    dragUp<span class="s"> = </span><b>function</b> (e) {
-</code><code id="L4061"><span class="ln">4061</span>        R.unmousemove(dragMove).unmouseup(dragUp);
-</code><code id="L4062"><span class="ln">4062</span>        <b>var</b> i<span class="s"> = </span>drag.length,
-</code><code id="L4063"><span class="ln">4063</span>            dragi;
-</code><code id="L4064"><span class="ln">4064</span>        <b>while</b> (i--) {
-</code><code id="L4065"><span class="ln">4065</span>            dragi<span class="s"> = </span>drag[i];
-</code><code id="L4066"><span class="ln">4066</span>            dragi.el._drag<span class="s"> = </span>{};
-</code><code id="L4067"><span class="ln">4067</span>            eve(<i>"drag.end."</i><span class="s"> + </span>dragi.el.id, dragi.end_scope<span class="s"> || </span>dragi.start_scope<span class="s"> || </span>dragi.move_scope<span class="s"> || </span>dragi.el, e);
-</code><code id="L4068"><span class="ln">4068</span>        }
-</code><code id="L4069"><span class="ln">4069</span>        drag<span class="s"> = </span>[];
-</code><code id="L4070"><span class="ln">4070</span>    };
-</code><code id="L4071"><span class="ln">4071</span>    <b>for</b> (<b>var</b> i<span class="s"> = </span>events.length; i--;) {
-</code><code id="L4072"><span class="ln">4072</span>        (<b>function</b> (eventName) {
-</code><code id="L4073"><span class="ln">4073</span>            R[eventName]<span class="s"> = </span>Element.prototype[eventName]<span class="s"> = </span><b>function</b> (fn, scope) {
-</code><code id="L4074"><span class="ln">4074</span>                <b>if</b> (R.is(fn, <i>"<b>function</b>"</i>)) {
-</code><code id="L4075"><span class="ln">4075</span>                    <b>this</b>.events<span class="s"> = </span><b>this</b>.events<span class="s"> || </span>[];
-</code><code id="L4076"><span class="ln">4076</span>                    <b>this</b>.events.push({name: eventName, f: fn, unbind: addEvent(<b>this</b>.shape<span class="s"> || </span><b>this</b>.node<span class="s"> || </span>g.doc, eventName, fn, scope<span class="s"> || </span><b>this</b>)});
-</code><code id="L4077"><span class="ln">4077</span>                }
-</code><code id="L4078"><span class="ln">4078</span>                <b>return</b> <b>this</b>;
-</code><code id="L4079"><span class="ln">4079</span>            };
-</code><code id="L4080"><span class="ln">4080</span>            R[<i>"un"</i><span class="s"> + </span>eventName]<span class="s"> = </span>Element.prototype[<i>"un"</i><span class="s"> + </span>eventName]<span class="s"> = </span><b>function</b> (fn) {
-</code><code id="L4081"><span class="ln">4081</span>                <b>var</b> events<span class="s"> = </span><b>this</b>.events,
-</code><code id="L4082"><span class="ln">4082</span>                    l<span class="s"> = </span>events.length;
-</code><code id="L4083"><span class="ln">4083</span>                <b>while</b> (l--) <b>if</b> (events[l].name<span class="s"> == </span>eventName<span class="s"> &amp;&amp; </span>events[l].f<span class="s"> == </span>fn) {
-</code><code id="L4084"><span class="ln">4084</span>                    events[l].unbind();
-</code><code id="L4085"><span class="ln">4085</span>                    events.splice(l, <span class="d">1</span>);
-</code><code id="L4086"><span class="ln">4086</span>                    !events.length<span class="s"> &amp;&amp; </span><b>delete</b> <b>this</b>.events;
-</code><code id="L4087"><span class="ln">4087</span>                    <b>return</b> <b>this</b>;
-</code><code id="L4088"><span class="ln">4088</span>                }
-</code><code id="L4089"><span class="ln">4089</span>                <b>return</b> <b>this</b>;
-</code><code id="L4090"><span class="ln">4090</span>            };
-</code><code id="L4091"><span class="ln">4091</span>        })(events[i]);
-</code><code id="L4092"><span class="ln">4092</span>    }
-</code><code id="L4093"><span class="ln">4093</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4094"><span class="ln">4094</span><span class="c">    <span class="s"> * </span>Element.hover
-</span></code><code id="L4095"><span class="ln">4095</span><span class="c">     [ method ]
-</span></code><code id="L4096"><span class="ln">4096</span><span class="c">     **
-</span></code><code id="L4097"><span class="ln">4097</span><span class="c">    <span class="s"> * </span>Adds event handlers <b>for</b> hover <b>for</b> the element.
-</span></code><code id="L4098"><span class="ln">4098</span><span class="c">     > Parameters
-</span></code><code id="L4099"><span class="ln">4099</span><span class="c">    <span class="s"> - </span>f_in (<b>function</b>) handler <b>for</b> hover <b>in</b>
-</span></code><code id="L4100"><span class="ln">4100</span><span class="c">    <span class="s"> - </span>f_out (<b>function</b>) handler <b>for</b> hover out
-</span></code><code id="L4101"><span class="ln">4101</span><span class="c">    <span class="s"> - </span>icontext (object) #optional context <b>for</b> hover <b>in</b> handler
-</span></code><code id="L4102"><span class="ln">4102</span><span class="c">    <span class="s"> - </span>ocontext (object) #optional context <b>for</b> hover out handler
-</span></code><code id="L4103"><span class="ln">4103</span><span class="c">    <span class="s"> = </span>(object) @Element
-</span></code><code id="L4104"><span class="ln">4104</span><span class="c">    \*/</span>
-</code><code id="L4105"><span class="ln">4105</span>    elproto.hover<span class="s"> = </span><b>function</b> (f_in, f_out, scope_in, scope_out) {
-</code><code id="L4106"><span class="ln">4106</span>        <b>return</b> <b>this</b>.mouseover(f_in, scope_in).mouseout(f_out, scope_out<span class="s"> || </span>scope_in);
-</code><code id="L4107"><span class="ln">4107</span>    };
-</code><code id="L4108"><span class="ln">4108</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4109"><span class="ln">4109</span><span class="c">    <span class="s"> * </span>Element.unhover
-</span></code><code id="L4110"><span class="ln">4110</span><span class="c">     [ method ]
-</span></code><code id="L4111"><span class="ln">4111</span><span class="c">     **
-</span></code><code id="L4112"><span class="ln">4112</span><span class="c">    <span class="s"> * </span>Removes event handlers <b>for</b> hover <b>for</b> the element.
-</span></code><code id="L4113"><span class="ln">4113</span><span class="c">     > Parameters
-</span></code><code id="L4114"><span class="ln">4114</span><span class="c">    <span class="s"> - </span>f_in (<b>function</b>) handler <b>for</b> hover <b>in</b>
-</span></code><code id="L4115"><span class="ln">4115</span><span class="c">    <span class="s"> - </span>f_out (<b>function</b>) handler <b>for</b> hover out
-</span></code><code id="L4116"><span class="ln">4116</span><span class="c">    <span class="s"> = </span>(object) @Element
-</span></code><code id="L4117"><span class="ln">4117</span><span class="c">    \*/</span>
-</code><code id="L4118"><span class="ln">4118</span>    elproto.unhover<span class="s"> = </span><b>function</b> (f_in, f_out) {
-</code><code id="L4119"><span class="ln">4119</span>        <b>return</b> <b>this</b>.unmouseover(f_in).unmouseout(f_out);
-</code><code id="L4120"><span class="ln">4120</span>    };
-</code><code id="L4121"><span class="ln">4121</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4122"><span class="ln">4122</span><span class="c">    <span class="s"> * </span>Element.drag
-</span></code><code id="L4123"><span class="ln">4123</span><span class="c">     [ method ]
-</span></code><code id="L4124"><span class="ln">4124</span><span class="c">     **
-</span></code><code id="L4125"><span class="ln">4125</span><span class="c">    <span class="s"> * </span>Adds event handlers <b>for</b> drag of the element.
-</span></code><code id="L4126"><span class="ln">4126</span><span class="c">     > Parameters
-</span></code><code id="L4127"><span class="ln">4127</span><span class="c">    <span class="s"> - </span>onmove (<b>function</b>) handler <b>for</b> moving
-</span></code><code id="L4128"><span class="ln">4128</span><span class="c">    <span class="s"> - </span>onstart (<b>function</b>) handler <b>for</b> drag start
-</span></code><code id="L4129"><span class="ln">4129</span><span class="c">    <span class="s"> - </span>onend (<b>function</b>) handler <b>for</b> drag end
-</span></code><code id="L4130"><span class="ln">4130</span><span class="c">    <span class="s"> - </span>mcontext (object) #optional context <b>for</b> moving handler
-</span></code><code id="L4131"><span class="ln">4131</span><span class="c">    <span class="s"> - </span>scontext (object) #optional context <b>for</b> drag start handler
-</span></code><code id="L4132"><span class="ln">4132</span><span class="c">    <span class="s"> - </span>econtext (object) #optional context <b>for</b> drag end handler
-</span></code><code id="L4133"><span class="ln">4133</span><span class="c">    <span class="s"> * </span>Additionaly following `drag` events will be triggered: `drag.start.&lt;id>` on start, 
-</span></code><code id="L4134"><span class="ln">4134</span><span class="c">    <span class="s"> * </span>`drag.end.&lt;id>` on end and `drag.move.&lt;id>` on every move. When element will be dragged over another element 
-</span></code><code id="L4135"><span class="ln">4135</span><span class="c">    <span class="s"> * </span>`drag.over.&lt;id>` will be fired as well.
-</span></code><code id="L4136"><span class="ln">4136</span><span class="c">     *
-</span></code><code id="L4137"><span class="ln">4137</span><span class="c">    <span class="s"> * </span>Start event and start handler will be called <b>in</b> specified context or <b>in</b> context of the element <b>with</b> following parameters:
-</span></code><code id="L4138"><span class="ln">4138</span><span class="c">     o x (number) x position of the mouse
-</span></code><code id="L4139"><span class="ln">4139</span><span class="c">     o y (number) y position of the mouse
-</span></code><code id="L4140"><span class="ln">4140</span><span class="c">     o event (object) DOM event object
-</span></code><code id="L4141"><span class="ln">4141</span><span class="c">    <span class="s"> * </span>Move event and move handler will be called <b>in</b> specified context or <b>in</b> context of the element <b>with</b> following parameters:
-</span></code><code id="L4142"><span class="ln">4142</span><span class="c">     o dx (number) shift by x from the start point
-</span></code><code id="L4143"><span class="ln">4143</span><span class="c">     o dy (number) shift by y from the start point
-</span></code><code id="L4144"><span class="ln">4144</span><span class="c">     o x (number) x position of the mouse
-</span></code><code id="L4145"><span class="ln">4145</span><span class="c">     o y (number) y position of the mouse
-</span></code><code id="L4146"><span class="ln">4146</span><span class="c">     o event (object) DOM event object
-</span></code><code id="L4147"><span class="ln">4147</span><span class="c">    <span class="s"> * </span>End event and end handler will be called <b>in</b> specified context or <b>in</b> context of the element <b>with</b> following parameters:
-</span></code><code id="L4148"><span class="ln">4148</span><span class="c">     o event (object) DOM event object
-</span></code><code id="L4149"><span class="ln">4149</span><span class="c">    <span class="s"> = </span>(object) @Element
-</span></code><code id="L4150"><span class="ln">4150</span><span class="c">    \*/</span>
-</code><code id="L4151"><span class="ln">4151</span>    elproto.drag<span class="s"> = </span><b>function</b> (onmove, onstart, onend, move_scope, start_scope, end_scope) {
-</code><code id="L4152"><span class="ln">4152</span>        <b>function</b> start(e) {
-</code><code id="L4153"><span class="ln">4153</span>            (e.originalEvent<span class="s"> || </span>e).preventDefault();
-</code><code id="L4154"><span class="ln">4154</span>            <b>var</b> scrollY<span class="s"> = </span>g.doc.documentElement.scrollTop<span class="s"> || </span>g.doc.body.scrollTop,
-</code><code id="L4155"><span class="ln">4155</span>                scrollX<span class="s"> = </span>g.doc.documentElement.scrollLeft<span class="s"> || </span>g.doc.body.scrollLeft;
-</code><code id="L4156"><span class="ln">4156</span>            <b>this</b>._drag.x<span class="s"> = </span>e.clientX<span class="s"> + </span>scrollX;
-</code><code id="L4157"><span class="ln">4157</span>            <b>this</b>._drag.y<span class="s"> = </span>e.clientY<span class="s"> + </span>scrollY;
-</code><code id="L4158"><span class="ln">4158</span>            <b>this</b>._drag.id<span class="s"> = </span>e.identifier;
-</code><code id="L4159"><span class="ln">4159</span>            !drag.length<span class="s"> &amp;&amp; </span>R.mousemove(dragMove).mouseup(dragUp);
-</code><code id="L4160"><span class="ln">4160</span>            drag.push({el: <b>this</b>, move_scope: move_scope, start_scope: start_scope, end_scope: end_scope});
-</code><code id="L4161"><span class="ln">4161</span>            onstart<span class="s"> &amp;&amp; </span>eve.on(<i>"drag.start."</i><span class="s"> + </span><b>this</b>.id, onstart);
-</code><code id="L4162"><span class="ln">4162</span>            onmove<span class="s"> &amp;&amp; </span>eve.on(<i>"drag.move."</i><span class="s"> + </span><b>this</b>.id, onmove);
-</code><code id="L4163"><span class="ln">4163</span>            onend<span class="s"> &amp;&amp; </span>eve.on(<i>"drag.end."</i><span class="s"> + </span><b>this</b>.id, onend);
-</code><code id="L4164"><span class="ln">4164</span>            eve(<i>"drag.start."</i><span class="s"> + </span><b>this</b>.id, start_scope<span class="s"> || </span>move_scope<span class="s"> || </span><b>this</b>, e.clientX<span class="s"> + </span>scrollX, e.clientY<span class="s"> + </span>scrollY, e);
-</code><code id="L4165"><span class="ln">4165</span>        }
-</code><code id="L4166"><span class="ln">4166</span>        <b>this</b>._drag<span class="s"> = </span>{};
-</code><code id="L4167"><span class="ln">4167</span>        <b>this</b>.mousedown(start);
-</code><code id="L4168"><span class="ln">4168</span>        <b>return</b> <b>this</b>;
-</code><code id="L4169"><span class="ln">4169</span>    };
-</code><code id="L4170"><span class="ln">4170</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4171"><span class="ln">4171</span><span class="c">    <span class="s"> * </span>Element.onDragOver
-</span></code><code id="L4172"><span class="ln">4172</span><span class="c">     [ method ]
-</span></code><code id="L4173"><span class="ln">4173</span><span class="c">     **
-</span></code><code id="L4174"><span class="ln">4174</span><span class="c">    <span class="s"> * </span>Shortcut <b>for</b> assigning event handler <b>for</b> `drag.over.&lt;id>` event, where id is id of the element (see @Element.id).
-</span></code><code id="L4175"><span class="ln">4175</span><span class="c">     > Parameters
-</span></code><code id="L4176"><span class="ln">4176</span><span class="c">    <span class="s"> - </span>f (<b>function</b>) handler <b>for</b> event
-</span></code><code id="L4177"><span class="ln">4177</span><span class="c">    \*/</span>
-</code><code id="L4178"><span class="ln">4178</span>    elproto.onDragOver<span class="s"> = </span><b>function</b> (f) {
-</code><code id="L4179"><span class="ln">4179</span>        f ? eve.on(<i>"drag.over."</i><span class="s"> + </span><b>this</b>.id, f) : eve.unbind(<i>"drag.over."</i><span class="s"> + </span><b>this</b>.id);
-</code><code id="L4180"><span class="ln">4180</span>    };
-</code><code id="L4181"><span class="ln">4181</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4182"><span class="ln">4182</span><span class="c">    <span class="s"> * </span>Element.undrag
-</span></code><code id="L4183"><span class="ln">4183</span><span class="c">     [ method ]
-</span></code><code id="L4184"><span class="ln">4184</span><span class="c">     **
-</span></code><code id="L4185"><span class="ln">4185</span><span class="c">    <span class="s"> * </span>Removes all drag event handlers from given element.
-</span></code><code id="L4186"><span class="ln">4186</span><span class="c">    \*/</span>
-</code><code id="L4187"><span class="ln">4187</span>    elproto.undrag<span class="s"> = </span><b>function</b> () {
-</code><code id="L4188"><span class="ln">4188</span>        <b>var</b> i<span class="s"> = </span>drag.length;
-</code><code id="L4189"><span class="ln">4189</span>        <b>while</b> (i--) <b>if</b> (drag[i].el<span class="s"> == </span><b>this</b>) {
-</code><code id="L4190"><span class="ln">4190</span>            R.unmousedown(drag[i].start);
-</code><code id="L4191"><span class="ln">4191</span>            drag.splice(i++, <span class="d">1</span>);
-</code><code id="L4192"><span class="ln">4192</span>            eve.unbind(<i>"drag.*."</i><span class="s"> + </span><b>this</b>.id);
-</code><code id="L4193"><span class="ln">4193</span>        }
-</code><code id="L4194"><span class="ln">4194</span>        !drag.length<span class="s"> &amp;&amp; </span>R.unmousemove(dragMove).unmouseup(dragUp);
-</code><code id="L4195"><span class="ln">4195</span>    };
-</code><code id="L4196"><span class="ln">4196</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4197"><span class="ln">4197</span><span class="c">    <span class="s"> * </span>Paper.circle
-</span></code><code id="L4198"><span class="ln">4198</span><span class="c">     [ method ]
-</span></code><code id="L4199"><span class="ln">4199</span><span class="c">     **
-</span></code><code id="L4200"><span class="ln">4200</span><span class="c">    <span class="s"> * </span>Draws a circle.
-</span></code><code id="L4201"><span class="ln">4201</span><span class="c">     **
-</span></code><code id="L4202"><span class="ln">4202</span><span class="c">     > Parameters
-</span></code><code id="L4203"><span class="ln">4203</span><span class="c">     **
-</span></code><code id="L4204"><span class="ln">4204</span><span class="c">    <span class="s"> - </span>x (number) x coordinate of the centre
-</span></code><code id="L4205"><span class="ln">4205</span><span class="c">    <span class="s"> - </span>y (number) y coordinate of the centre
-</span></code><code id="L4206"><span class="ln">4206</span><span class="c">    <span class="s"> - </span>r (number) radius
-</span></code><code id="L4207"><span class="ln">4207</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “circle”
-</span></code><code id="L4208"><span class="ln">4208</span><span class="c">     **
-</span></code><code id="L4209"><span class="ln">4209</span><span class="c">     > Usage
-</span></code><code id="L4210"><span class="ln">4210</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">40</span>);
-</span></code><code id="L4211"><span class="ln">4211</span><span class="c">    \*/</span>
-</code><code id="L4212"><span class="ln">4212</span>    paperproto.circle<span class="s"> = </span><b>function</b> (x, y, r) {
-</code><code id="L4213"><span class="ln">4213</span>        <b>return</b> theCircle(<b>this</b>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, r<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L4214"><span class="ln">4214</span>    };
-</code><code id="L4215"><span class="ln">4215</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4216"><span class="ln">4216</span><span class="c">    <span class="s"> * </span>Paper.rect
-</span></code><code id="L4217"><span class="ln">4217</span><span class="c">     [ method ]
-</span></code><code id="L4218"><span class="ln">4218</span><span class="c">     *
-</span></code><code id="L4219"><span class="ln">4219</span><span class="c">    <span class="s"> * </span>Draws a rectangle.
-</span></code><code id="L4220"><span class="ln">4220</span><span class="c">     **
-</span></code><code id="L4221"><span class="ln">4221</span><span class="c">     > Parameters
-</span></code><code id="L4222"><span class="ln">4222</span><span class="c">     **
-</span></code><code id="L4223"><span class="ln">4223</span><span class="c">    <span class="s"> - </span>x (number) x coordinate of the top left corner
-</span></code><code id="L4224"><span class="ln">4224</span><span class="c">    <span class="s"> - </span>y (number) y coordinate of the top left corner
-</span></code><code id="L4225"><span class="ln">4225</span><span class="c">    <span class="s"> - </span>width (number) width
-</span></code><code id="L4226"><span class="ln">4226</span><span class="c">    <span class="s"> - </span>height (number) height
-</span></code><code id="L4227"><span class="ln">4227</span><span class="c">    <span class="s"> - </span>r (number) @optional radius <b>for</b> rounded corners, <b>default</b> is <span class="d">0</span>
-</span></code><code id="L4228"><span class="ln">4228</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “rect”
-</span></code><code id="L4229"><span class="ln">4229</span><span class="c">     **
-</span></code><code id="L4230"><span class="ln">4230</span><span class="c">     > Usage
-</span></code><code id="L4231"><span class="ln">4231</span><span class="c">    <span class="s"> | </span><span class="c">// regular rectangle</span>
-</span></code><code id="L4232"><span class="ln">4232</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.rect(<span class="d">10</span>, <span class="d">10</span>, <span class="d">50</span>, <span class="d">50</span>);
-</span></code><code id="L4233"><span class="ln">4233</span><span class="c">    <span class="s"> | </span><span class="c">// rectangle <b>with</b> rounded corners</span>
-</span></code><code id="L4234"><span class="ln">4234</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.rect(<span class="d">40</span>, <span class="d">40</span>, <span class="d">50</span>, <span class="d">50</span>, <span class="d">10</span>);
-</span></code><code id="L4235"><span class="ln">4235</span><span class="c">    \*/</span>
-</code><code id="L4236"><span class="ln">4236</span>    paperproto.rect<span class="s"> = </span><b>function</b> (x, y, w, h, r) {
-</code><code id="L4237"><span class="ln">4237</span>        <b>return</b> theRect(<b>this</b>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, w<span class="s"> || </span><span class="d">0</span>, h<span class="s"> || </span><span class="d">0</span>, r<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L4238"><span class="ln">4238</span>    };
-</code><code id="L4239"><span class="ln">4239</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4240"><span class="ln">4240</span><span class="c">    <span class="s"> * </span>Paper.ellipse
-</span></code><code id="L4241"><span class="ln">4241</span><span class="c">     [ method ]
-</span></code><code id="L4242"><span class="ln">4242</span><span class="c">     **
-</span></code><code id="L4243"><span class="ln">4243</span><span class="c">    <span class="s"> * </span>Draws an ellipse.
-</span></code><code id="L4244"><span class="ln">4244</span><span class="c">     **
-</span></code><code id="L4245"><span class="ln">4245</span><span class="c">     > Parameters
-</span></code><code id="L4246"><span class="ln">4246</span><span class="c">     **
-</span></code><code id="L4247"><span class="ln">4247</span><span class="c">    <span class="s"> - </span>x (number) x coordinate of the centre
-</span></code><code id="L4248"><span class="ln">4248</span><span class="c">    <span class="s"> - </span>y (number) y coordinate of the centre
-</span></code><code id="L4249"><span class="ln">4249</span><span class="c">    <span class="s"> - </span>rx (number) horisontal radius
-</span></code><code id="L4250"><span class="ln">4250</span><span class="c">    <span class="s"> - </span>ry (number) vertical radius
-</span></code><code id="L4251"><span class="ln">4251</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “ellipse”
-</span></code><code id="L4252"><span class="ln">4252</span><span class="c">     **
-</span></code><code id="L4253"><span class="ln">4253</span><span class="c">     > Usage
-</span></code><code id="L4254"><span class="ln">4254</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.ellipse(<span class="d">50</span>, <span class="d">50</span>, <span class="d">40</span>, <span class="d">20</span>);
-</span></code><code id="L4255"><span class="ln">4255</span><span class="c">    \*/</span>
-</code><code id="L4256"><span class="ln">4256</span>    paperproto.ellipse<span class="s"> = </span><b>function</b> (x, y, rx, ry) {
-</code><code id="L4257"><span class="ln">4257</span>        <b>return</b> theEllipse(<b>this</b>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, rx<span class="s"> || </span><span class="d">0</span>, ry<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L4258"><span class="ln">4258</span>    };
-</code><code id="L4259"><span class="ln">4259</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4260"><span class="ln">4260</span><span class="c">    <span class="s"> * </span>Paper.path
-</span></code><code id="L4261"><span class="ln">4261</span><span class="c">     [ method ]
-</span></code><code id="L4262"><span class="ln">4262</span><span class="c">     **
-</span></code><code id="L4263"><span class="ln">4263</span><span class="c">    <span class="s"> * </span>Creates a path element by given path data string.
-</span></code><code id="L4264"><span class="ln">4264</span><span class="c">     **
-</span></code><code id="L4265"><span class="ln">4265</span><span class="c">     > Parameters
-</span></code><code id="L4266"><span class="ln">4266</span><span class="c">     **
-</span></code><code id="L4267"><span class="ln">4267</span><span class="c">    <span class="s"> - </span>pathString (string) path data <b>in</b> SVG path string format.
-</span></code><code id="L4268"><span class="ln">4268</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “ellipse”
-</span></code><code id="L4269"><span class="ln">4269</span><span class="c">     # Details of a path<i>'s data attribute'</i>s format are described <b>in</b> the &lt;a href=<i>"http:<span class="c">//www.w3.org/TR/SVG/paths.html#PathData"</i>>SVG specification&lt;/a>.</span>
-</span></code><code id="L4270"><span class="ln">4270</span><span class="c">     **
-</span></code><code id="L4271"><span class="ln">4271</span><span class="c">     > Usage
-</span></code><code id="L4272"><span class="ln">4272</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.path(<i>"M10 10L90 <span class="d">90</span>"</i>);
-</span></code><code id="L4273"><span class="ln">4273</span><span class="c">    <span class="s"> | </span><span class="c">// draw a diagonal line:</span>
-</span></code><code id="L4274"><span class="ln">4274</span><span class="c">    <span class="s"> | </span><span class="c">// move to <span class="d">10</span>,<span class="d">10</span>, line to <span class="d">90</span>,<span class="d">90</span></span>
-</span></code><code id="L4275"><span class="ln">4275</span><span class="c">    \*/</span>
-</code><code id="L4276"><span class="ln">4276</span>    paperproto.path<span class="s"> = </span><b>function</b> (pathString) {
-</code><code id="L4277"><span class="ln">4277</span>        pathString<span class="s"> &amp;&amp; </span>!R.is(pathString, string)<span class="s"> &amp;&amp; </span>!R.is(pathString[<span class="d">0</span>], array)<span class="s"> &amp;&amp; </span>(pathString += E);
-</code><code id="L4278"><span class="ln">4278</span>        <b>return</b> thePath(R.format[apply](R, arguments), <b>this</b>);
-</code><code id="L4279"><span class="ln">4279</span>    };
-</code><code id="L4280"><span class="ln">4280</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4281"><span class="ln">4281</span><span class="c">    <span class="s"> * </span>Paper.image
-</span></code><code id="L4282"><span class="ln">4282</span><span class="c">     [ method ]
-</span></code><code id="L4283"><span class="ln">4283</span><span class="c">     **
-</span></code><code id="L4284"><span class="ln">4284</span><span class="c">    <span class="s"> * </span>Embeds an image into the surface.
-</span></code><code id="L4285"><span class="ln">4285</span><span class="c">     **
-</span></code><code id="L4286"><span class="ln">4286</span><span class="c">     > Parameters
-</span></code><code id="L4287"><span class="ln">4287</span><span class="c">     **
-</span></code><code id="L4288"><span class="ln">4288</span><span class="c">    <span class="s"> - </span>src (string) URI of the source image
-</span></code><code id="L4289"><span class="ln">4289</span><span class="c">    <span class="s"> - </span>x (number) x coordinate position
-</span></code><code id="L4290"><span class="ln">4290</span><span class="c">    <span class="s"> - </span>y (number) y coordinate position
-</span></code><code id="L4291"><span class="ln">4291</span><span class="c">    <span class="s"> - </span>width (number) width of the image
-</span></code><code id="L4292"><span class="ln">4292</span><span class="c">    <span class="s"> - </span>height (number) height of the image
-</span></code><code id="L4293"><span class="ln">4293</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “image”
-</span></code><code id="L4294"><span class="ln">4294</span><span class="c">     **
-</span></code><code id="L4295"><span class="ln">4295</span><span class="c">     > Usage
-</span></code><code id="L4296"><span class="ln">4296</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.image(<i>"apple.png"</i>, <span class="d">10</span>, <span class="d">10</span>, <span class="d">80</span>, <span class="d">80</span>);
-</span></code><code id="L4297"><span class="ln">4297</span><span class="c">    \*/</span>
-</code><code id="L4298"><span class="ln">4298</span>    paperproto.image<span class="s"> = </span><b>function</b> (src, x, y, w, h) {
-</code><code id="L4299"><span class="ln">4299</span>        <b>return</b> theImage(<b>this</b>, src<span class="s"> || </span><i>"about:blank"</i>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, w<span class="s"> || </span><span class="d">0</span>, h<span class="s"> || </span><span class="d">0</span>);
-</code><code id="L4300"><span class="ln">4300</span>    };
-</code><code id="L4301"><span class="ln">4301</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4302"><span class="ln">4302</span><span class="c">    <span class="s"> * </span>Paper.text
-</span></code><code id="L4303"><span class="ln">4303</span><span class="c">     [ method ]
-</span></code><code id="L4304"><span class="ln">4304</span><span class="c">     **
-</span></code><code id="L4305"><span class="ln">4305</span><span class="c">    <span class="s"> * </span>Draws a text string. If you need line breaks, put “\n” <b>in</b> the string.
-</span></code><code id="L4306"><span class="ln">4306</span><span class="c">     **
-</span></code><code id="L4307"><span class="ln">4307</span><span class="c">     > Parameters
-</span></code><code id="L4308"><span class="ln">4308</span><span class="c">     **
-</span></code><code id="L4309"><span class="ln">4309</span><span class="c">    <span class="s"> - </span>x (number) x coordinate position
-</span></code><code id="L4310"><span class="ln">4310</span><span class="c">    <span class="s"> - </span>y (number) y coordinate position
-</span></code><code id="L4311"><span class="ln">4311</span><span class="c">    <span class="s"> - </span>text (string) The text string to draw
-</span></code><code id="L4312"><span class="ln">4312</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “text”
-</span></code><code id="L4313"><span class="ln">4313</span><span class="c">     **
-</span></code><code id="L4314"><span class="ln">4314</span><span class="c">     > Usage
-</span></code><code id="L4315"><span class="ln">4315</span><span class="c">    <span class="s"> | </span><b>var</b> t<span class="s"> = </span>paper.text(<span class="d">50</span>, <span class="d">50</span>, <i>"Raphaël\nkicks\nbutt!"</i>);
-</span></code><code id="L4316"><span class="ln">4316</span><span class="c">    \*/</span>
-</code><code id="L4317"><span class="ln">4317</span>    paperproto.text<span class="s"> = </span><b>function</b> (x, y, text) {
-</code><code id="L4318"><span class="ln">4318</span>        <b>return</b> theText(<b>this</b>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, Str(text));
-</code><code id="L4319"><span class="ln">4319</span>    };
-</code><code id="L4320"><span class="ln">4320</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4321"><span class="ln">4321</span><span class="c">    <span class="s"> * </span>Paper.set
-</span></code><code id="L4322"><span class="ln">4322</span><span class="c">     [ method ]
-</span></code><code id="L4323"><span class="ln">4323</span><span class="c">     **
-</span></code><code id="L4324"><span class="ln">4324</span><span class="c">    <span class="s"> * </span>Creates array-like object to keep and operate couple of elements at once.
-</span></code><code id="L4325"><span class="ln">4325</span><span class="c">    <span class="s"> * </span>Warning: it doesn’t create any elements <b>for</b> itself <b>in</b> the page.
-</span></code><code id="L4326"><span class="ln">4326</span><span class="c">    <span class="s"> = </span>(object) array-like object that represents set of elements
-</span></code><code id="L4327"><span class="ln">4327</span><span class="c">     **
-</span></code><code id="L4328"><span class="ln">4328</span><span class="c">     > Usage
-</span></code><code id="L4329"><span class="ln">4329</span><span class="c">    <span class="s"> | </span><b>var</b> st<span class="s"> = </span>paper.set();
-</span></code><code id="L4330"><span class="ln">4330</span><span class="c">    <span class="s"> | </span>st.push(
-</span></code><code id="L4331"><span class="ln">4331</span><span class="c">    <span class="s"> | </span>    paper.circle(<span class="d">10</span>, <span class="d">10</span>, <span class="d">5</span>),
-</span></code><code id="L4332"><span class="ln">4332</span><span class="c">    <span class="s"> | </span>    paper.circle(<span class="d">30</span>, <span class="d">10</span>, <span class="d">5</span>)
-</span></code><code id="L4333"><span class="ln">4333</span><span class="c">    <span class="s"> | </span>);
-</span></code><code id="L4334"><span class="ln">4334</span><span class="c">    <span class="s"> | </span>st.attr({fill: <i>"red"</i>});
-</span></code><code id="L4335"><span class="ln">4335</span><span class="c">    \*/</span>
-</code><code id="L4336"><span class="ln">4336</span>    paperproto.set<span class="s"> = </span><b>function</b> (itemsArray) {
-</code><code id="L4337"><span class="ln">4337</span>        arguments.length > <span class="d">1</span><span class="s"> &amp;&amp; </span>(itemsArray<span class="s"> = </span>Array.prototype.splice.call(arguments, <span class="d">0</span>, arguments.length));
-</code><code id="L4338"><span class="ln">4338</span>        <b>return</b> <b>new</b> Set(itemsArray);
-</code><code id="L4339"><span class="ln">4339</span>    };
-</code><code id="L4340"><span class="ln">4340</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4341"><span class="ln">4341</span><span class="c">    <span class="s"> * </span>Paper.setSize
-</span></code><code id="L4342"><span class="ln">4342</span><span class="c">     [ method ]
+</code><code id="L3974"><span class="ln">3974</span>    addEvent<span class="s"> = </span>(<b>function</b> () {
+</code><code id="L3975"><span class="ln">3975</span>        <b>if</b> (g.doc.addEventListener) {
+</code><code id="L3976"><span class="ln">3976</span>            <b>return</b> <b>function</b> (obj, type, fn, element) {
+</code><code id="L3977"><span class="ln">3977</span>                <b>var</b> realName<span class="s"> = </span>supportsTouch<span class="s"> &amp;&amp; </span>touchMap[type] ? touchMap[type] : type;
+</code><code id="L3978"><span class="ln">3978</span>                <b>var</b> f<span class="s"> = </span><b>function</b> (e) {
+</code><code id="L3979"><span class="ln">3979</span>                    <b>if</b> (supportsTouch<span class="s"> &amp;&amp; </span>touchMap[has](type)) {
+</code><code id="L3980"><span class="ln">3980</span>                        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>e.targetTouches<span class="s"> &amp;&amp; </span>e.targetTouches.length; i &lt; ii; i++) {
+</code><code id="L3981"><span class="ln">3981</span>                            <b>if</b> (e.targetTouches[i].target<span class="s"> == </span>obj) {
+</code><code id="L3982"><span class="ln">3982</span>                                <b>var</b> olde<span class="s"> = </span>e;
+</code><code id="L3983"><span class="ln">3983</span>                                e<span class="s"> = </span>e.targetTouches[i];
+</code><code id="L3984"><span class="ln">3984</span>                                e.originalEvent<span class="s"> = </span>olde;
+</code><code id="L3985"><span class="ln">3985</span>                                e.preventDefault<span class="s"> = </span>preventTouch;
+</code><code id="L3986"><span class="ln">3986</span>                                e.stopPropagation<span class="s"> = </span>stopTouch;
+</code><code id="L3987"><span class="ln">3987</span>                                <b>break</b>;
+</code><code id="L3988"><span class="ln">3988</span>                            }
+</code><code id="L3989"><span class="ln">3989</span>                        }
+</code><code id="L3990"><span class="ln">3990</span>                    }
+</code><code id="L3991"><span class="ln">3991</span>                    <b>return</b> fn.call(element, e);
+</code><code id="L3992"><span class="ln">3992</span>                };
+</code><code id="L3993"><span class="ln">3993</span>                obj.addEventListener(realName, f, <b>false</b>);
+</code><code id="L3994"><span class="ln">3994</span>                <b>return</b> <b>function</b> () {
+</code><code id="L3995"><span class="ln">3995</span>                    obj.removeEventListener(realName, f, <b>false</b>);
+</code><code id="L3996"><span class="ln">3996</span>                    <b>return</b> <b>true</b>;
+</code><code id="L3997"><span class="ln">3997</span>                };
+</code><code id="L3998"><span class="ln">3998</span>            };
+</code><code id="L3999"><span class="ln">3999</span>        } <b>else</b> <b>if</b> (g.doc.attachEvent) {
+</code><code id="L4000"><span class="ln">4000</span>            <b>return</b> <b>function</b> (obj, type, fn, element) {
+</code><code id="L4001"><span class="ln">4001</span>                <b>var</b> f<span class="s"> = </span><b>function</b> (e) {
+</code><code id="L4002"><span class="ln">4002</span>                    e<span class="s"> = </span>e<span class="s"> || </span>g.win.event;
+</code><code id="L4003"><span class="ln">4003</span>                    e.preventDefault<span class="s"> = </span>e.preventDefault<span class="s"> || </span>preventDefault;
+</code><code id="L4004"><span class="ln">4004</span>                    e.stopPropagation<span class="s"> = </span>e.stopPropagation<span class="s"> || </span>stopPropagation;
+</code><code id="L4005"><span class="ln">4005</span>                    <b>return</b> fn.call(element, e);
+</code><code id="L4006"><span class="ln">4006</span>                };
+</code><code id="L4007"><span class="ln">4007</span>                obj.attachEvent(<i>"on"</i><span class="s"> + </span>type, f);
+</code><code id="L4008"><span class="ln">4008</span>                <b>var</b> detacher<span class="s"> = </span><b>function</b> () {
+</code><code id="L4009"><span class="ln">4009</span>                    obj.detachEvent(<i>"on"</i><span class="s"> + </span>type, f);
+</code><code id="L4010"><span class="ln">4010</span>                    <b>return</b> <b>true</b>;
+</code><code id="L4011"><span class="ln">4011</span>                };
+</code><code id="L4012"><span class="ln">4012</span>                <b>return</b> detacher;
+</code><code id="L4013"><span class="ln">4013</span>            };
+</code><code id="L4014"><span class="ln">4014</span>        }
+</code><code id="L4015"><span class="ln">4015</span>    })(),
+</code><code id="L4016"><span class="ln">4016</span>    drag<span class="s"> = </span>[],
+</code><code id="L4017"><span class="ln">4017</span>    dragMove<span class="s"> = </span><b>function</b> (e) {
+</code><code id="L4018"><span class="ln">4018</span>        <b>var</b> x<span class="s"> = </span>e.clientX,
+</code><code id="L4019"><span class="ln">4019</span>            y<span class="s"> = </span>e.clientY,
+</code><code id="L4020"><span class="ln">4020</span>            scrollY<span class="s"> = </span>g.doc.documentElement.scrollTop<span class="s"> || </span>g.doc.body.scrollTop,
+</code><code id="L4021"><span class="ln">4021</span>            scrollX<span class="s"> = </span>g.doc.documentElement.scrollLeft<span class="s"> || </span>g.doc.body.scrollLeft,
+</code><code id="L4022"><span class="ln">4022</span>            dragi,
+</code><code id="L4023"><span class="ln">4023</span>            j<span class="s"> = </span>drag.length;
+</code><code id="L4024"><span class="ln">4024</span>        <b>while</b> (j--) {
+</code><code id="L4025"><span class="ln">4025</span>            dragi<span class="s"> = </span>drag[j];
+</code><code id="L4026"><span class="ln">4026</span>            <b>if</b> (supportsTouch) {
+</code><code id="L4027"><span class="ln">4027</span>                <b>var</b> i<span class="s"> = </span>e.touches.length,
+</code><code id="L4028"><span class="ln">4028</span>                    touch;
+</code><code id="L4029"><span class="ln">4029</span>                <b>while</b> (i--) {
+</code><code id="L4030"><span class="ln">4030</span>                    touch<span class="s"> = </span>e.touches[i];
+</code><code id="L4031"><span class="ln">4031</span>                    <b>if</b> (touch.identifier<span class="s"> == </span>dragi.el._drag.id) {
+</code><code id="L4032"><span class="ln">4032</span>                        x<span class="s"> = </span>touch.clientX;
+</code><code id="L4033"><span class="ln">4033</span>                        y<span class="s"> = </span>touch.clientY;
+</code><code id="L4034"><span class="ln">4034</span>                        (e.originalEvent ? e.originalEvent : e).preventDefault();
+</code><code id="L4035"><span class="ln">4035</span>                        <b>break</b>;
+</code><code id="L4036"><span class="ln">4036</span>                    }
+</code><code id="L4037"><span class="ln">4037</span>                }
+</code><code id="L4038"><span class="ln">4038</span>            } <b>else</b> {
+</code><code id="L4039"><span class="ln">4039</span>                e.preventDefault();
+</code><code id="L4040"><span class="ln">4040</span>            }
+</code><code id="L4041"><span class="ln">4041</span>            <b>var</b> node<span class="s"> = </span>dragi.el.node,
+</code><code id="L4042"><span class="ln">4042</span>                o,
+</code><code id="L4043"><span class="ln">4043</span>                next<span class="s"> = </span>node.nextSibling,
+</code><code id="L4044"><span class="ln">4044</span>                parent<span class="s"> = </span>node.parentNode,
+</code><code id="L4045"><span class="ln">4045</span>                display<span class="s"> = </span>node.style.display;
+</code><code id="L4046"><span class="ln">4046</span>            g.win.opera<span class="s"> &amp;&amp; </span>parent.removeChild(node);
+</code><code id="L4047"><span class="ln">4047</span>            node.style.display<span class="s"> = </span><i>"none"</i>;
+</code><code id="L4048"><span class="ln">4048</span>            o<span class="s"> = </span>dragi.el.paper.getElementByPoint(x, y);
+</code><code id="L4049"><span class="ln">4049</span>            node.style.display<span class="s"> = </span>display;
+</code><code id="L4050"><span class="ln">4050</span>            g.win.opera<span class="s"> &amp;&amp; </span>(next ? parent.insertBefore(node, next) : parent.appendChild(node));
+</code><code id="L4051"><span class="ln">4051</span>            o<span class="s"> &amp;&amp; </span>eve(<i>"drag.over."</i><span class="s"> + </span>dragi.el.id, dragi.el, o);
+</code><code id="L4052"><span class="ln">4052</span>            x += scrollX;
+</code><code id="L4053"><span class="ln">4053</span>            y += scrollY;
+</code><code id="L4054"><span class="ln">4054</span>            eve(<i>"drag.move."</i><span class="s"> + </span>dragi.el.id, dragi.move_scope<span class="s"> || </span>dragi.el, x<span class="s"> - </span>dragi.el._drag.x, y<span class="s"> - </span>dragi.el._drag.y, x, y, e);
+</code><code id="L4055"><span class="ln">4055</span>        }
+</code><code id="L4056"><span class="ln">4056</span>    },
+</code><code id="L4057"><span class="ln">4057</span>    dragUp<span class="s"> = </span><b>function</b> (e) {
+</code><code id="L4058"><span class="ln">4058</span>        R.unmousemove(dragMove).unmouseup(dragUp);
+</code><code id="L4059"><span class="ln">4059</span>        <b>var</b> i<span class="s"> = </span>drag.length,
+</code><code id="L4060"><span class="ln">4060</span>            dragi;
+</code><code id="L4061"><span class="ln">4061</span>        <b>while</b> (i--) {
+</code><code id="L4062"><span class="ln">4062</span>            dragi<span class="s"> = </span>drag[i];
+</code><code id="L4063"><span class="ln">4063</span>            dragi.el._drag<span class="s"> = </span>{};
+</code><code id="L4064"><span class="ln">4064</span>            eve(<i>"drag.end."</i><span class="s"> + </span>dragi.el.id, dragi.end_scope<span class="s"> || </span>dragi.start_scope<span class="s"> || </span>dragi.move_scope<span class="s"> || </span>dragi.el, e);
+</code><code id="L4065"><span class="ln">4065</span>        }
+</code><code id="L4066"><span class="ln">4066</span>        drag<span class="s"> = </span>[];
+</code><code id="L4067"><span class="ln">4067</span>    };
+</code><code id="L4068"><span class="ln">4068</span>    <b>for</b> (<b>var</b> i<span class="s"> = </span>events.length; i--;) {
+</code><code id="L4069"><span class="ln">4069</span>        (<b>function</b> (eventName) {
+</code><code id="L4070"><span class="ln">4070</span>            R[eventName]<span class="s"> = </span>Element.prototype[eventName]<span class="s"> = </span><b>function</b> (fn, scope) {
+</code><code id="L4071"><span class="ln">4071</span>                <b>if</b> (R.is(fn, <i>"<b>function</b>"</i>)) {
+</code><code id="L4072"><span class="ln">4072</span>                    <b>this</b>.events<span class="s"> = </span><b>this</b>.events<span class="s"> || </span>[];
+</code><code id="L4073"><span class="ln">4073</span>                    <b>this</b>.events.push({name: eventName, f: fn, unbind: addEvent(<b>this</b>.shape<span class="s"> || </span><b>this</b>.node<span class="s"> || </span>g.doc, eventName, fn, scope<span class="s"> || </span><b>this</b>)});
+</code><code id="L4074"><span class="ln">4074</span>                }
+</code><code id="L4075"><span class="ln">4075</span>                <b>return</b> <b>this</b>;
+</code><code id="L4076"><span class="ln">4076</span>            };
+</code><code id="L4077"><span class="ln">4077</span>            R[<i>"un"</i><span class="s"> + </span>eventName]<span class="s"> = </span>Element.prototype[<i>"un"</i><span class="s"> + </span>eventName]<span class="s"> = </span><b>function</b> (fn) {
+</code><code id="L4078"><span class="ln">4078</span>                <b>var</b> events<span class="s"> = </span><b>this</b>.events,
+</code><code id="L4079"><span class="ln">4079</span>                    l<span class="s"> = </span>events.length;
+</code><code id="L4080"><span class="ln">4080</span>                <b>while</b> (l--) <b>if</b> (events[l].name<span class="s"> == </span>eventName<span class="s"> &amp;&amp; </span>events[l].f<span class="s"> == </span>fn) {
+</code><code id="L4081"><span class="ln">4081</span>                    events[l].unbind();
+</code><code id="L4082"><span class="ln">4082</span>                    events.splice(l, <span class="d">1</span>);
+</code><code id="L4083"><span class="ln">4083</span>                    !events.length<span class="s"> &amp;&amp; </span><b>delete</b> <b>this</b>.events;
+</code><code id="L4084"><span class="ln">4084</span>                    <b>return</b> <b>this</b>;
+</code><code id="L4085"><span class="ln">4085</span>                }
+</code><code id="L4086"><span class="ln">4086</span>                <b>return</b> <b>this</b>;
+</code><code id="L4087"><span class="ln">4087</span>            };
+</code><code id="L4088"><span class="ln">4088</span>        })(events[i]);
+</code><code id="L4089"><span class="ln">4089</span>    }
+</code><code id="L4090"><span class="ln">4090</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4091"><span class="ln">4091</span><span class="c">    <span class="s"> * </span>Element.hover
+</span></code><code id="L4092"><span class="ln">4092</span><span class="c">     [ method ]
+</span></code><code id="L4093"><span class="ln">4093</span><span class="c">     **
+</span></code><code id="L4094"><span class="ln">4094</span><span class="c">    <span class="s"> * </span>Adds event handlers <b>for</b> hover <b>for</b> the element.
+</span></code><code id="L4095"><span class="ln">4095</span><span class="c">     > Parameters
+</span></code><code id="L4096"><span class="ln">4096</span><span class="c">    <span class="s"> - </span>f_in (<b>function</b>) handler <b>for</b> hover <b>in</b>
+</span></code><code id="L4097"><span class="ln">4097</span><span class="c">    <span class="s"> - </span>f_out (<b>function</b>) handler <b>for</b> hover out
+</span></code><code id="L4098"><span class="ln">4098</span><span class="c">    <span class="s"> - </span>icontext (object) #optional context <b>for</b> hover <b>in</b> handler
+</span></code><code id="L4099"><span class="ln">4099</span><span class="c">    <span class="s"> - </span>ocontext (object) #optional context <b>for</b> hover out handler
+</span></code><code id="L4100"><span class="ln">4100</span><span class="c">    <span class="s"> = </span>(object) @Element
+</span></code><code id="L4101"><span class="ln">4101</span><span class="c">    \*/</span>
+</code><code id="L4102"><span class="ln">4102</span>    elproto.hover<span class="s"> = </span><b>function</b> (f_in, f_out, scope_in, scope_out) {
+</code><code id="L4103"><span class="ln">4103</span>        <b>return</b> <b>this</b>.mouseover(f_in, scope_in).mouseout(f_out, scope_out<span class="s"> || </span>scope_in);
+</code><code id="L4104"><span class="ln">4104</span>    };
+</code><code id="L4105"><span class="ln">4105</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4106"><span class="ln">4106</span><span class="c">    <span class="s"> * </span>Element.unhover
+</span></code><code id="L4107"><span class="ln">4107</span><span class="c">     [ method ]
+</span></code><code id="L4108"><span class="ln">4108</span><span class="c">     **
+</span></code><code id="L4109"><span class="ln">4109</span><span class="c">    <span class="s"> * </span>Removes event handlers <b>for</b> hover <b>for</b> the element.
+</span></code><code id="L4110"><span class="ln">4110</span><span class="c">     > Parameters
+</span></code><code id="L4111"><span class="ln">4111</span><span class="c">    <span class="s"> - </span>f_in (<b>function</b>) handler <b>for</b> hover <b>in</b>
+</span></code><code id="L4112"><span class="ln">4112</span><span class="c">    <span class="s"> - </span>f_out (<b>function</b>) handler <b>for</b> hover out
+</span></code><code id="L4113"><span class="ln">4113</span><span class="c">    <span class="s"> = </span>(object) @Element
+</span></code><code id="L4114"><span class="ln">4114</span><span class="c">    \*/</span>
+</code><code id="L4115"><span class="ln">4115</span>    elproto.unhover<span class="s"> = </span><b>function</b> (f_in, f_out) {
+</code><code id="L4116"><span class="ln">4116</span>        <b>return</b> <b>this</b>.unmouseover(f_in).unmouseout(f_out);
+</code><code id="L4117"><span class="ln">4117</span>    };
+</code><code id="L4118"><span class="ln">4118</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4119"><span class="ln">4119</span><span class="c">    <span class="s"> * </span>Element.drag
+</span></code><code id="L4120"><span class="ln">4120</span><span class="c">     [ method ]
+</span></code><code id="L4121"><span class="ln">4121</span><span class="c">     **
+</span></code><code id="L4122"><span class="ln">4122</span><span class="c">    <span class="s"> * </span>Adds event handlers <b>for</b> drag of the element.
+</span></code><code id="L4123"><span class="ln">4123</span><span class="c">     > Parameters
+</span></code><code id="L4124"><span class="ln">4124</span><span class="c">    <span class="s"> - </span>onmove (<b>function</b>) handler <b>for</b> moving
+</span></code><code id="L4125"><span class="ln">4125</span><span class="c">    <span class="s"> - </span>onstart (<b>function</b>) handler <b>for</b> drag start
+</span></code><code id="L4126"><span class="ln">4126</span><span class="c">    <span class="s"> - </span>onend (<b>function</b>) handler <b>for</b> drag end
+</span></code><code id="L4127"><span class="ln">4127</span><span class="c">    <span class="s"> - </span>mcontext (object) #optional context <b>for</b> moving handler
+</span></code><code id="L4128"><span class="ln">4128</span><span class="c">    <span class="s"> - </span>scontext (object) #optional context <b>for</b> drag start handler
+</span></code><code id="L4129"><span class="ln">4129</span><span class="c">    <span class="s"> - </span>econtext (object) #optional context <b>for</b> drag end handler
+</span></code><code id="L4130"><span class="ln">4130</span><span class="c">    <span class="s"> * </span>Additionaly following `drag` events will be triggered: `drag.start.&lt;id>` on start, 
+</span></code><code id="L4131"><span class="ln">4131</span><span class="c">    <span class="s"> * </span>`drag.end.&lt;id>` on end and `drag.move.&lt;id>` on every move. When element will be dragged over another element 
+</span></code><code id="L4132"><span class="ln">4132</span><span class="c">    <span class="s"> * </span>`drag.over.&lt;id>` will be fired as well.
+</span></code><code id="L4133"><span class="ln">4133</span><span class="c">     *
+</span></code><code id="L4134"><span class="ln">4134</span><span class="c">    <span class="s"> * </span>Start event and start handler will be called <b>in</b> specified context or <b>in</b> context of the element <b>with</b> following parameters:
+</span></code><code id="L4135"><span class="ln">4135</span><span class="c">     o x (number) x position of the mouse
+</span></code><code id="L4136"><span class="ln">4136</span><span class="c">     o y (number) y position of the mouse
+</span></code><code id="L4137"><span class="ln">4137</span><span class="c">     o event (object) DOM event object
+</span></code><code id="L4138"><span class="ln">4138</span><span class="c">    <span class="s"> * </span>Move event and move handler will be called <b>in</b> specified context or <b>in</b> context of the element <b>with</b> following parameters:
+</span></code><code id="L4139"><span class="ln">4139</span><span class="c">     o dx (number) shift by x from the start point
+</span></code><code id="L4140"><span class="ln">4140</span><span class="c">     o dy (number) shift by y from the start point
+</span></code><code id="L4141"><span class="ln">4141</span><span class="c">     o x (number) x position of the mouse
+</span></code><code id="L4142"><span class="ln">4142</span><span class="c">     o y (number) y position of the mouse
+</span></code><code id="L4143"><span class="ln">4143</span><span class="c">     o event (object) DOM event object
+</span></code><code id="L4144"><span class="ln">4144</span><span class="c">    <span class="s"> * </span>End event and end handler will be called <b>in</b> specified context or <b>in</b> context of the element <b>with</b> following parameters:
+</span></code><code id="L4145"><span class="ln">4145</span><span class="c">     o event (object) DOM event object
+</span></code><code id="L4146"><span class="ln">4146</span><span class="c">    <span class="s"> = </span>(object) @Element
+</span></code><code id="L4147"><span class="ln">4147</span><span class="c">    \*/</span>
+</code><code id="L4148"><span class="ln">4148</span>    elproto.drag<span class="s"> = </span><b>function</b> (onmove, onstart, onend, move_scope, start_scope, end_scope) {
+</code><code id="L4149"><span class="ln">4149</span>        <b>function</b> start(e) {
+</code><code id="L4150"><span class="ln">4150</span>            (e.originalEvent<span class="s"> || </span>e).preventDefault();
+</code><code id="L4151"><span class="ln">4151</span>            <b>var</b> scrollY<span class="s"> = </span>g.doc.documentElement.scrollTop<span class="s"> || </span>g.doc.body.scrollTop,
+</code><code id="L4152"><span class="ln">4152</span>                scrollX<span class="s"> = </span>g.doc.documentElement.scrollLeft<span class="s"> || </span>g.doc.body.scrollLeft;
+</code><code id="L4153"><span class="ln">4153</span>            <b>this</b>._drag.x<span class="s"> = </span>e.clientX<span class="s"> + </span>scrollX;
+</code><code id="L4154"><span class="ln">4154</span>            <b>this</b>._drag.y<span class="s"> = </span>e.clientY<span class="s"> + </span>scrollY;
+</code><code id="L4155"><span class="ln">4155</span>            <b>this</b>._drag.id<span class="s"> = </span>e.identifier;
+</code><code id="L4156"><span class="ln">4156</span>            !drag.length<span class="s"> &amp;&amp; </span>R.mousemove(dragMove).mouseup(dragUp);
+</code><code id="L4157"><span class="ln">4157</span>            drag.push({el: <b>this</b>, move_scope: move_scope, start_scope: start_scope, end_scope: end_scope});
+</code><code id="L4158"><span class="ln">4158</span>            onstart<span class="s"> &amp;&amp; </span>eve.on(<i>"drag.start."</i><span class="s"> + </span><b>this</b>.id, onstart);
+</code><code id="L4159"><span class="ln">4159</span>            onmove<span class="s"> &amp;&amp; </span>eve.on(<i>"drag.move."</i><span class="s"> + </span><b>this</b>.id, onmove);
+</code><code id="L4160"><span class="ln">4160</span>            onend<span class="s"> &amp;&amp; </span>eve.on(<i>"drag.end."</i><span class="s"> + </span><b>this</b>.id, onend);
+</code><code id="L4161"><span class="ln">4161</span>            eve(<i>"drag.start."</i><span class="s"> + </span><b>this</b>.id, start_scope<span class="s"> || </span>move_scope<span class="s"> || </span><b>this</b>, e.clientX<span class="s"> + </span>scrollX, e.clientY<span class="s"> + </span>scrollY, e);
+</code><code id="L4162"><span class="ln">4162</span>        }
+</code><code id="L4163"><span class="ln">4163</span>        <b>this</b>._drag<span class="s"> = </span>{};
+</code><code id="L4164"><span class="ln">4164</span>        <b>this</b>.mousedown(start);
+</code><code id="L4165"><span class="ln">4165</span>        <b>return</b> <b>this</b>;
+</code><code id="L4166"><span class="ln">4166</span>    };
+</code><code id="L4167"><span class="ln">4167</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4168"><span class="ln">4168</span><span class="c">    <span class="s"> * </span>Element.onDragOver
+</span></code><code id="L4169"><span class="ln">4169</span><span class="c">     [ method ]
+</span></code><code id="L4170"><span class="ln">4170</span><span class="c">     **
+</span></code><code id="L4171"><span class="ln">4171</span><span class="c">    <span class="s"> * </span>Shortcut <b>for</b> assigning event handler <b>for</b> `drag.over.&lt;id>` event, where id is id of the element (see @Element.id).
+</span></code><code id="L4172"><span class="ln">4172</span><span class="c">     > Parameters
+</span></code><code id="L4173"><span class="ln">4173</span><span class="c">    <span class="s"> - </span>f (<b>function</b>) handler <b>for</b> event
+</span></code><code id="L4174"><span class="ln">4174</span><span class="c">    \*/</span>
+</code><code id="L4175"><span class="ln">4175</span>    elproto.onDragOver<span class="s"> = </span><b>function</b> (f) {
+</code><code id="L4176"><span class="ln">4176</span>        f ? eve.on(<i>"drag.over."</i><span class="s"> + </span><b>this</b>.id, f) : eve.unbind(<i>"drag.over."</i><span class="s"> + </span><b>this</b>.id);
+</code><code id="L4177"><span class="ln">4177</span>    };
+</code><code id="L4178"><span class="ln">4178</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4179"><span class="ln">4179</span><span class="c">    <span class="s"> * </span>Element.undrag
+</span></code><code id="L4180"><span class="ln">4180</span><span class="c">     [ method ]
+</span></code><code id="L4181"><span class="ln">4181</span><span class="c">     **
+</span></code><code id="L4182"><span class="ln">4182</span><span class="c">    <span class="s"> * </span>Removes all drag event handlers from given element.
+</span></code><code id="L4183"><span class="ln">4183</span><span class="c">    \*/</span>
+</code><code id="L4184"><span class="ln">4184</span>    elproto.undrag<span class="s"> = </span><b>function</b> () {
+</code><code id="L4185"><span class="ln">4185</span>        <b>var</b> i<span class="s"> = </span>drag.length;
+</code><code id="L4186"><span class="ln">4186</span>        <b>while</b> (i--) <b>if</b> (drag[i].el<span class="s"> == </span><b>this</b>) {
+</code><code id="L4187"><span class="ln">4187</span>            R.unmousedown(drag[i].start);
+</code><code id="L4188"><span class="ln">4188</span>            drag.splice(i++, <span class="d">1</span>);
+</code><code id="L4189"><span class="ln">4189</span>            eve.unbind(<i>"drag.*."</i><span class="s"> + </span><b>this</b>.id);
+</code><code id="L4190"><span class="ln">4190</span>        }
+</code><code id="L4191"><span class="ln">4191</span>        !drag.length<span class="s"> &amp;&amp; </span>R.unmousemove(dragMove).unmouseup(dragUp);
+</code><code id="L4192"><span class="ln">4192</span>    };
+</code><code id="L4193"><span class="ln">4193</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4194"><span class="ln">4194</span><span class="c">    <span class="s"> * </span>Paper.circle
+</span></code><code id="L4195"><span class="ln">4195</span><span class="c">     [ method ]
+</span></code><code id="L4196"><span class="ln">4196</span><span class="c">     **
+</span></code><code id="L4197"><span class="ln">4197</span><span class="c">    <span class="s"> * </span>Draws a circle.
+</span></code><code id="L4198"><span class="ln">4198</span><span class="c">     **
+</span></code><code id="L4199"><span class="ln">4199</span><span class="c">     > Parameters
+</span></code><code id="L4200"><span class="ln">4200</span><span class="c">     **
+</span></code><code id="L4201"><span class="ln">4201</span><span class="c">    <span class="s"> - </span>x (number) x coordinate of the centre
+</span></code><code id="L4202"><span class="ln">4202</span><span class="c">    <span class="s"> - </span>y (number) y coordinate of the centre
+</span></code><code id="L4203"><span class="ln">4203</span><span class="c">    <span class="s"> - </span>r (number) radius
+</span></code><code id="L4204"><span class="ln">4204</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “circle”
+</span></code><code id="L4205"><span class="ln">4205</span><span class="c">     **
+</span></code><code id="L4206"><span class="ln">4206</span><span class="c">     > Usage
+</span></code><code id="L4207"><span class="ln">4207</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">40</span>);
+</span></code><code id="L4208"><span class="ln">4208</span><span class="c">    \*/</span>
+</code><code id="L4209"><span class="ln">4209</span>    paperproto.circle<span class="s"> = </span><b>function</b> (x, y, r) {
+</code><code id="L4210"><span class="ln">4210</span>        <b>return</b> theCircle(<b>this</b>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, r<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L4211"><span class="ln">4211</span>    };
+</code><code id="L4212"><span class="ln">4212</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4213"><span class="ln">4213</span><span class="c">    <span class="s"> * </span>Paper.rect
+</span></code><code id="L4214"><span class="ln">4214</span><span class="c">     [ method ]
+</span></code><code id="L4215"><span class="ln">4215</span><span class="c">     *
+</span></code><code id="L4216"><span class="ln">4216</span><span class="c">    <span class="s"> * </span>Draws a rectangle.
+</span></code><code id="L4217"><span class="ln">4217</span><span class="c">     **
+</span></code><code id="L4218"><span class="ln">4218</span><span class="c">     > Parameters
+</span></code><code id="L4219"><span class="ln">4219</span><span class="c">     **
+</span></code><code id="L4220"><span class="ln">4220</span><span class="c">    <span class="s"> - </span>x (number) x coordinate of the top left corner
+</span></code><code id="L4221"><span class="ln">4221</span><span class="c">    <span class="s"> - </span>y (number) y coordinate of the top left corner
+</span></code><code id="L4222"><span class="ln">4222</span><span class="c">    <span class="s"> - </span>width (number) width
+</span></code><code id="L4223"><span class="ln">4223</span><span class="c">    <span class="s"> - </span>height (number) height
+</span></code><code id="L4224"><span class="ln">4224</span><span class="c">    <span class="s"> - </span>r (number) #optional radius <b>for</b> rounded corners, <b>default</b> is <span class="d">0</span>
+</span></code><code id="L4225"><span class="ln">4225</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “rect”
+</span></code><code id="L4226"><span class="ln">4226</span><span class="c">     **
+</span></code><code id="L4227"><span class="ln">4227</span><span class="c">     > Usage
+</span></code><code id="L4228"><span class="ln">4228</span><span class="c">    <span class="s"> | </span><span class="c">// regular rectangle</span>
+</span></code><code id="L4229"><span class="ln">4229</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.rect(<span class="d">10</span>, <span class="d">10</span>, <span class="d">50</span>, <span class="d">50</span>);
+</span></code><code id="L4230"><span class="ln">4230</span><span class="c">    <span class="s"> | </span><span class="c">// rectangle <b>with</b> rounded corners</span>
+</span></code><code id="L4231"><span class="ln">4231</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.rect(<span class="d">40</span>, <span class="d">40</span>, <span class="d">50</span>, <span class="d">50</span>, <span class="d">10</span>);
+</span></code><code id="L4232"><span class="ln">4232</span><span class="c">    \*/</span>
+</code><code id="L4233"><span class="ln">4233</span>    paperproto.rect<span class="s"> = </span><b>function</b> (x, y, w, h, r) {
+</code><code id="L4234"><span class="ln">4234</span>        <b>return</b> theRect(<b>this</b>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, w<span class="s"> || </span><span class="d">0</span>, h<span class="s"> || </span><span class="d">0</span>, r<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L4235"><span class="ln">4235</span>    };
+</code><code id="L4236"><span class="ln">4236</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4237"><span class="ln">4237</span><span class="c">    <span class="s"> * </span>Paper.ellipse
+</span></code><code id="L4238"><span class="ln">4238</span><span class="c">     [ method ]
+</span></code><code id="L4239"><span class="ln">4239</span><span class="c">     **
+</span></code><code id="L4240"><span class="ln">4240</span><span class="c">    <span class="s"> * </span>Draws an ellipse.
+</span></code><code id="L4241"><span class="ln">4241</span><span class="c">     **
+</span></code><code id="L4242"><span class="ln">4242</span><span class="c">     > Parameters
+</span></code><code id="L4243"><span class="ln">4243</span><span class="c">     **
+</span></code><code id="L4244"><span class="ln">4244</span><span class="c">    <span class="s"> - </span>x (number) x coordinate of the centre
+</span></code><code id="L4245"><span class="ln">4245</span><span class="c">    <span class="s"> - </span>y (number) y coordinate of the centre
+</span></code><code id="L4246"><span class="ln">4246</span><span class="c">    <span class="s"> - </span>rx (number) horizontal radius
+</span></code><code id="L4247"><span class="ln">4247</span><span class="c">    <span class="s"> - </span>ry (number) vertical radius
+</span></code><code id="L4248"><span class="ln">4248</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “ellipse”
+</span></code><code id="L4249"><span class="ln">4249</span><span class="c">     **
+</span></code><code id="L4250"><span class="ln">4250</span><span class="c">     > Usage
+</span></code><code id="L4251"><span class="ln">4251</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.ellipse(<span class="d">50</span>, <span class="d">50</span>, <span class="d">40</span>, <span class="d">20</span>);
+</span></code><code id="L4252"><span class="ln">4252</span><span class="c">    \*/</span>
+</code><code id="L4253"><span class="ln">4253</span>    paperproto.ellipse<span class="s"> = </span><b>function</b> (x, y, rx, ry) {
+</code><code id="L4254"><span class="ln">4254</span>        <b>return</b> theEllipse(<b>this</b>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, rx<span class="s"> || </span><span class="d">0</span>, ry<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L4255"><span class="ln">4255</span>    };
+</code><code id="L4256"><span class="ln">4256</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4257"><span class="ln">4257</span><span class="c">    <span class="s"> * </span>Paper.path
+</span></code><code id="L4258"><span class="ln">4258</span><span class="c">     [ method ]
+</span></code><code id="L4259"><span class="ln">4259</span><span class="c">     **
+</span></code><code id="L4260"><span class="ln">4260</span><span class="c">    <span class="s"> * </span>Creates a path element by given path data string.
+</span></code><code id="L4261"><span class="ln">4261</span><span class="c">     **
+</span></code><code id="L4262"><span class="ln">4262</span><span class="c">     > Parameters
+</span></code><code id="L4263"><span class="ln">4263</span><span class="c">     **
+</span></code><code id="L4264"><span class="ln">4264</span><span class="c">    <span class="s"> - </span>pathString (string) path data <b>in</b> SVG path string format.
+</span></code><code id="L4265"><span class="ln">4265</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “ellipse”
+</span></code><code id="L4266"><span class="ln">4266</span><span class="c">     # Details of a path<i>'s data attribute'</i>s format are described <b>in</b> the &lt;a href=<i>"http:<span class="c">//www.w3.org/TR/SVG/paths.html#PathData"</i>>SVG specification&lt;/a>.</span>
+</span></code><code id="L4267"><span class="ln">4267</span><span class="c">     **
+</span></code><code id="L4268"><span class="ln">4268</span><span class="c">     > Usage
+</span></code><code id="L4269"><span class="ln">4269</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.path(<i>"M10 10L90 <span class="d">90</span>"</i>);
+</span></code><code id="L4270"><span class="ln">4270</span><span class="c">    <span class="s"> | </span><span class="c">// draw a diagonal line:</span>
+</span></code><code id="L4271"><span class="ln">4271</span><span class="c">    <span class="s"> | </span><span class="c">// move to <span class="d">10</span>,<span class="d">10</span>, line to <span class="d">90</span>,<span class="d">90</span></span>
+</span></code><code id="L4272"><span class="ln">4272</span><span class="c">    \*/</span>
+</code><code id="L4273"><span class="ln">4273</span>    paperproto.path<span class="s"> = </span><b>function</b> (pathString) {
+</code><code id="L4274"><span class="ln">4274</span>        pathString<span class="s"> &amp;&amp; </span>!R.is(pathString, string)<span class="s"> &amp;&amp; </span>!R.is(pathString[<span class="d">0</span>], array)<span class="s"> &amp;&amp; </span>(pathString += E);
+</code><code id="L4275"><span class="ln">4275</span>        <b>return</b> thePath(R.format[apply](R, arguments), <b>this</b>);
+</code><code id="L4276"><span class="ln">4276</span>    };
+</code><code id="L4277"><span class="ln">4277</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4278"><span class="ln">4278</span><span class="c">    <span class="s"> * </span>Paper.image
+</span></code><code id="L4279"><span class="ln">4279</span><span class="c">     [ method ]
+</span></code><code id="L4280"><span class="ln">4280</span><span class="c">     **
+</span></code><code id="L4281"><span class="ln">4281</span><span class="c">    <span class="s"> * </span>Embeds an image into the surface.
+</span></code><code id="L4282"><span class="ln">4282</span><span class="c">     **
+</span></code><code id="L4283"><span class="ln">4283</span><span class="c">     > Parameters
+</span></code><code id="L4284"><span class="ln">4284</span><span class="c">     **
+</span></code><code id="L4285"><span class="ln">4285</span><span class="c">    <span class="s"> - </span>src (string) URI of the source image
+</span></code><code id="L4286"><span class="ln">4286</span><span class="c">    <span class="s"> - </span>x (number) x coordinate position
+</span></code><code id="L4287"><span class="ln">4287</span><span class="c">    <span class="s"> - </span>y (number) y coordinate position
+</span></code><code id="L4288"><span class="ln">4288</span><span class="c">    <span class="s"> - </span>width (number) width of the image
+</span></code><code id="L4289"><span class="ln">4289</span><span class="c">    <span class="s"> - </span>height (number) height of the image
+</span></code><code id="L4290"><span class="ln">4290</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “image”
+</span></code><code id="L4291"><span class="ln">4291</span><span class="c">     **
+</span></code><code id="L4292"><span class="ln">4292</span><span class="c">     > Usage
+</span></code><code id="L4293"><span class="ln">4293</span><span class="c">    <span class="s"> | </span><b>var</b> c<span class="s"> = </span>paper.image(<i>"apple.png"</i>, <span class="d">10</span>, <span class="d">10</span>, <span class="d">80</span>, <span class="d">80</span>);
+</span></code><code id="L4294"><span class="ln">4294</span><span class="c">    \*/</span>
+</code><code id="L4295"><span class="ln">4295</span>    paperproto.image<span class="s"> = </span><b>function</b> (src, x, y, w, h) {
+</code><code id="L4296"><span class="ln">4296</span>        <b>return</b> theImage(<b>this</b>, src<span class="s"> || </span><i>"about:blank"</i>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, w<span class="s"> || </span><span class="d">0</span>, h<span class="s"> || </span><span class="d">0</span>);
+</code><code id="L4297"><span class="ln">4297</span>    };
+</code><code id="L4298"><span class="ln">4298</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4299"><span class="ln">4299</span><span class="c">    <span class="s"> * </span>Paper.text
+</span></code><code id="L4300"><span class="ln">4300</span><span class="c">     [ method ]
+</span></code><code id="L4301"><span class="ln">4301</span><span class="c">     **
+</span></code><code id="L4302"><span class="ln">4302</span><span class="c">    <span class="s"> * </span>Draws a text string. If you need line breaks, put “\n” <b>in</b> the string.
+</span></code><code id="L4303"><span class="ln">4303</span><span class="c">     **
+</span></code><code id="L4304"><span class="ln">4304</span><span class="c">     > Parameters
+</span></code><code id="L4305"><span class="ln">4305</span><span class="c">     **
+</span></code><code id="L4306"><span class="ln">4306</span><span class="c">    <span class="s"> - </span>x (number) x coordinate position
+</span></code><code id="L4307"><span class="ln">4307</span><span class="c">    <span class="s"> - </span>y (number) y coordinate position
+</span></code><code id="L4308"><span class="ln">4308</span><span class="c">    <span class="s"> - </span>text (string) The text string to draw
+</span></code><code id="L4309"><span class="ln">4309</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “text”
+</span></code><code id="L4310"><span class="ln">4310</span><span class="c">     **
+</span></code><code id="L4311"><span class="ln">4311</span><span class="c">     > Usage
+</span></code><code id="L4312"><span class="ln">4312</span><span class="c">    <span class="s"> | </span><b>var</b> t<span class="s"> = </span>paper.text(<span class="d">50</span>, <span class="d">50</span>, <i>"Raphaël\nkicks\nbutt!"</i>);
+</span></code><code id="L4313"><span class="ln">4313</span><span class="c">    \*/</span>
+</code><code id="L4314"><span class="ln">4314</span>    paperproto.text<span class="s"> = </span><b>function</b> (x, y, text) {
+</code><code id="L4315"><span class="ln">4315</span>        <b>return</b> theText(<b>this</b>, x<span class="s"> || </span><span class="d">0</span>, y<span class="s"> || </span><span class="d">0</span>, Str(text));
+</code><code id="L4316"><span class="ln">4316</span>    };
+</code><code id="L4317"><span class="ln">4317</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4318"><span class="ln">4318</span><span class="c">    <span class="s"> * </span>Paper.set
+</span></code><code id="L4319"><span class="ln">4319</span><span class="c">     [ method ]
+</span></code><code id="L4320"><span class="ln">4320</span><span class="c">     **
+</span></code><code id="L4321"><span class="ln">4321</span><span class="c">    <span class="s"> * </span>Creates array-like object to keep and operate several elements at once.
+</span></code><code id="L4322"><span class="ln">4322</span><span class="c">    <span class="s"> * </span>Warning: it doesn’t create any elements <b>for</b> itself <b>in</b> the page, it just groups existing elements.
+</span></code><code id="L4323"><span class="ln">4323</span><span class="c">    <span class="s"> * </span>Sets act as pseudo elements — all methods available to an element can be used on a set.
+</span></code><code id="L4324"><span class="ln">4324</span><span class="c">    <span class="s"> = </span>(object) array-like object that represents set of elements
+</span></code><code id="L4325"><span class="ln">4325</span><span class="c">     **
+</span></code><code id="L4326"><span class="ln">4326</span><span class="c">     > Usage
+</span></code><code id="L4327"><span class="ln">4327</span><span class="c">    <span class="s"> | </span><b>var</b> st<span class="s"> = </span>paper.set();
+</span></code><code id="L4328"><span class="ln">4328</span><span class="c">    <span class="s"> | </span>st.push(
+</span></code><code id="L4329"><span class="ln">4329</span><span class="c">    <span class="s"> | </span>    paper.circle(<span class="d">10</span>, <span class="d">10</span>, <span class="d">5</span>),
+</span></code><code id="L4330"><span class="ln">4330</span><span class="c">    <span class="s"> | </span>    paper.circle(<span class="d">30</span>, <span class="d">10</span>, <span class="d">5</span>)
+</span></code><code id="L4331"><span class="ln">4331</span><span class="c">    <span class="s"> | </span>);
+</span></code><code id="L4332"><span class="ln">4332</span><span class="c">    <span class="s"> | </span>st.attr({fill: <i>"red"</i>});
+</span></code><code id="L4333"><span class="ln">4333</span><span class="c">    \*/</span>
+</code><code id="L4334"><span class="ln">4334</span>    paperproto.set<span class="s"> = </span><b>function</b> (itemsArray) {
+</code><code id="L4335"><span class="ln">4335</span>        arguments.length > <span class="d">1</span><span class="s"> &amp;&amp; </span>(itemsArray<span class="s"> = </span>Array.prototype.splice.call(arguments, <span class="d">0</span>, arguments.length));
+</code><code id="L4336"><span class="ln">4336</span>        <b>return</b> <b>new</b> Set(itemsArray);
+</code><code id="L4337"><span class="ln">4337</span>    };
+</code><code id="L4338"><span class="ln">4338</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4339"><span class="ln">4339</span><span class="c">    <span class="s"> * </span>Paper.setSize
+</span></code><code id="L4340"><span class="ln">4340</span><span class="c">     [ method ]
+</span></code><code id="L4341"><span class="ln">4341</span><span class="c">     **
+</span></code><code id="L4342"><span class="ln">4342</span><span class="c">    <span class="s"> * </span>If you need to change dimensions of the canvas call <b>this</b> method
 </span></code><code id="L4343"><span class="ln">4343</span><span class="c">     **
-</span></code><code id="L4344"><span class="ln">4344</span><span class="c">    <span class="s"> * </span>If you need to change dimensions of the canvas call <b>this</b> method
+</span></code><code id="L4344"><span class="ln">4344</span><span class="c">     > Parameters
 </span></code><code id="L4345"><span class="ln">4345</span><span class="c">     **
-</span></code><code id="L4346"><span class="ln">4346</span><span class="c">     > Parameters
-</span></code><code id="L4347"><span class="ln">4347</span><span class="c">     **
-</span></code><code id="L4348"><span class="ln">4348</span><span class="c">    <span class="s"> - </span>width (number) <b>new</b> width of the canvas
-</span></code><code id="L4349"><span class="ln">4349</span><span class="c">    <span class="s"> - </span>height (number) <b>new</b> height of the canvas
-</span></code><code id="L4350"><span class="ln">4350</span><span class="c">     > Usage
-</span></code><code id="L4351"><span class="ln">4351</span><span class="c">    <span class="s"> | </span><b>var</b> st<span class="s"> = </span>paper.set();
-</span></code><code id="L4352"><span class="ln">4352</span><span class="c">    <span class="s"> | </span>st.push(
-</span></code><code id="L4353"><span class="ln">4353</span><span class="c">    <span class="s"> | </span>    paper.circle(<span class="d">10</span>, <span class="d">10</span>, <span class="d">5</span>),
-</span></code><code id="L4354"><span class="ln">4354</span><span class="c">    <span class="s"> | </span>    paper.circle(<span class="d">30</span>, <span class="d">10</span>, <span class="d">5</span>)
-</span></code><code id="L4355"><span class="ln">4355</span><span class="c">    <span class="s"> | </span>);
-</span></code><code id="L4356"><span class="ln">4356</span><span class="c">    <span class="s"> | </span>st.attr({fill: <i>"red"</i>});
-</span></code><code id="L4357"><span class="ln">4357</span><span class="c">    \*/</span>
-</code><code id="L4358"><span class="ln">4358</span>    paperproto.setSize<span class="s"> = </span>setSize;
-</code><code id="L4359"><span class="ln">4359</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4360"><span class="ln">4360</span><span class="c">    <span class="s"> * </span>Paper.setViewBox
-</span></code><code id="L4361"><span class="ln">4361</span><span class="c">     [ method ]
-</span></code><code id="L4362"><span class="ln">4362</span><span class="c">     **
-</span></code><code id="L4363"><span class="ln">4363</span><span class="c">    <span class="s"> * </span>Sets the view box of the paper. Practically it gives you ability to zoom and pan whole paper surface by 
-</span></code><code id="L4364"><span class="ln">4364</span><span class="c">    <span class="s"> * </span>specifying <b>new</b> boundaries.
+</span></code><code id="L4346"><span class="ln">4346</span><span class="c">    <span class="s"> - </span>width (number) <b>new</b> width of the canvas
+</span></code><code id="L4347"><span class="ln">4347</span><span class="c">    <span class="s"> - </span>height (number) <b>new</b> height of the canvas
+</span></code><code id="L4348"><span class="ln">4348</span><span class="c">     > Usage
+</span></code><code id="L4349"><span class="ln">4349</span><span class="c">    <span class="s"> | </span><b>var</b> st<span class="s"> = </span>paper.set();
+</span></code><code id="L4350"><span class="ln">4350</span><span class="c">    <span class="s"> | </span>st.push(
+</span></code><code id="L4351"><span class="ln">4351</span><span class="c">    <span class="s"> | </span>    paper.circle(<span class="d">10</span>, <span class="d">10</span>, <span class="d">5</span>),
+</span></code><code id="L4352"><span class="ln">4352</span><span class="c">    <span class="s"> | </span>    paper.circle(<span class="d">30</span>, <span class="d">10</span>, <span class="d">5</span>)
+</span></code><code id="L4353"><span class="ln">4353</span><span class="c">    <span class="s"> | </span>);
+</span></code><code id="L4354"><span class="ln">4354</span><span class="c">    <span class="s"> | </span>st.attr({fill: <i>"red"</i>});
+</span></code><code id="L4355"><span class="ln">4355</span><span class="c">    \*/</span>
+</code><code id="L4356"><span class="ln">4356</span>    paperproto.setSize<span class="s"> = </span>setSize;
+</code><code id="L4357"><span class="ln">4357</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4358"><span class="ln">4358</span><span class="c">    <span class="s"> * </span>Paper.setViewBox
+</span></code><code id="L4359"><span class="ln">4359</span><span class="c">     [ method ]
+</span></code><code id="L4360"><span class="ln">4360</span><span class="c">     **
+</span></code><code id="L4361"><span class="ln">4361</span><span class="c">    <span class="s"> * </span>Sets the view box of the paper. Practically it gives you ability to zoom and pan whole paper surface by 
+</span></code><code id="L4362"><span class="ln">4362</span><span class="c">    <span class="s"> * </span>specifying <b>new</b> boundaries.
+</span></code><code id="L4363"><span class="ln">4363</span><span class="c">     **
+</span></code><code id="L4364"><span class="ln">4364</span><span class="c">     > Parameters
 </span></code><code id="L4365"><span class="ln">4365</span><span class="c">     **
-</span></code><code id="L4366"><span class="ln">4366</span><span class="c">     > Parameters
-</span></code><code id="L4367"><span class="ln">4367</span><span class="c">     **
-</span></code><code id="L4368"><span class="ln">4368</span><span class="c">     x, y, w, h, fit
-</span></code><code id="L4369"><span class="ln">4369</span><span class="c">    <span class="s"> - </span>x (number) <b>new</b> x position, <b>default</b> is `<span class="d">0</span>`
-</span></code><code id="L4370"><span class="ln">4370</span><span class="c">    <span class="s"> - </span>y (number) <b>new</b> y position, <b>default</b> is `<span class="d">0</span>`
-</span></code><code id="L4371"><span class="ln">4371</span><span class="c">    <span class="s"> - </span>w (number) <b>new</b> width of the canvas
-</span></code><code id="L4372"><span class="ln">4372</span><span class="c">    <span class="s"> - </span>h (number) <b>new</b> height of the canvas
-</span></code><code id="L4373"><span class="ln">4373</span><span class="c">    <span class="s"> - </span>fit (<b>boolean</b>) `<b>true</b>` <b>if</b> you want graphics to fit into <b>new</b> boundary box
-</span></code><code id="L4374"><span class="ln">4374</span><span class="c">    \*/</span>
-</code><code id="L4375"><span class="ln">4375</span>    paperproto.setViewBox<span class="s"> = </span>setViewBox;
-</code><code id="L4376"><span class="ln">4376</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4377"><span class="ln">4377</span><span class="c">    <span class="s"> * </span>Paper.top
-</span></code><code id="L4378"><span class="ln">4378</span><span class="c">     [ property ]
-</span></code><code id="L4379"><span class="ln">4379</span><span class="c">     **
-</span></code><code id="L4380"><span class="ln">4380</span><span class="c">    <span class="s"> * </span>Points to the topmost element on the paper
-</span></code><code id="L4381"><span class="ln">4381</span><span class="c">    \*/</span>
-</code><code id="L4382"><span class="ln">4382</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4383"><span class="ln">4383</span><span class="c">    <span class="s"> * </span>Paper.bottom
-</span></code><code id="L4384"><span class="ln">4384</span><span class="c">     [ property ]
-</span></code><code id="L4385"><span class="ln">4385</span><span class="c">     **
-</span></code><code id="L4386"><span class="ln">4386</span><span class="c">    <span class="s"> * </span>Points to the bottom element on the paper
-</span></code><code id="L4387"><span class="ln">4387</span><span class="c">    \*/</span>
-</code><code id="L4388"><span class="ln">4388</span>    paperproto.top<span class="s"> = </span>paperproto.bottom<span class="s"> = </span><b>null</b>;
-</code><code id="L4389"><span class="ln">4389</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4390"><span class="ln">4390</span><span class="c">    <span class="s"> * </span>Paper.raphael
-</span></code><code id="L4391"><span class="ln">4391</span><span class="c">     [ property ]
-</span></code><code id="L4392"><span class="ln">4392</span><span class="c">     **
-</span></code><code id="L4393"><span class="ln">4393</span><span class="c">    <span class="s"> * </span>Points to the @Raphael object/<b>function</b>
-</span></code><code id="L4394"><span class="ln">4394</span><span class="c">    \*/</span>
-</code><code id="L4395"><span class="ln">4395</span>    paperproto.raphael<span class="s"> = </span>R;
-</code><code id="L4396"><span class="ln">4396</span>    <b>var</b> getOffset<span class="s"> = </span><b>function</b> (elem) {
-</code><code id="L4397"><span class="ln">4397</span>        <b>var</b> box<span class="s"> = </span>elem.getBoundingClientRect(),
-</code><code id="L4398"><span class="ln">4398</span>            doc<span class="s"> = </span>elem.ownerDocument,
-</code><code id="L4399"><span class="ln">4399</span>            body<span class="s"> = </span>doc.body,
-</code><code id="L4400"><span class="ln">4400</span>            docElem<span class="s"> = </span>doc.documentElement,
-</code><code id="L4401"><span class="ln">4401</span>            clientTop<span class="s"> = </span>docElem.clientTop<span class="s"> || </span>body.clientTop<span class="s"> || </span><span class="d">0</span>, clientLeft<span class="s"> = </span>docElem.clientLeft<span class="s"> || </span>body.clientLeft<span class="s"> || </span><span class="d">0</span>,
-</code><code id="L4402"><span class="ln">4402</span>            top <span class="s"> = </span>box.top <span class="s"> + </span>(g.win.pageYOffset<span class="s"> || </span>docElem.scrollTop<span class="s"> || </span>body.scrollTop )<span class="s"> - </span>clientTop,
-</code><code id="L4403"><span class="ln">4403</span>            left<span class="s"> = </span>box.left<span class="s"> + </span>(g.win.pageXOffset<span class="s"> || </span>docElem.scrollLeft<span class="s"> || </span>body.scrollLeft)<span class="s"> - </span>clientLeft;
-</code><code id="L4404"><span class="ln">4404</span>        <b>return</b> {
-</code><code id="L4405"><span class="ln">4405</span>            y: top,
-</code><code id="L4406"><span class="ln">4406</span>            x: left
-</code><code id="L4407"><span class="ln">4407</span>        };
-</code><code id="L4408"><span class="ln">4408</span>    };
-</code><code id="L4409"><span class="ln">4409</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4410"><span class="ln">4410</span><span class="c">    <span class="s"> * </span>Paper.getElementByPoint
-</span></code><code id="L4411"><span class="ln">4411</span><span class="c">     [ method ]
+</span></code><code id="L4366"><span class="ln">4366</span><span class="c">     x, y, w, h, fit
+</span></code><code id="L4367"><span class="ln">4367</span><span class="c">    <span class="s"> - </span>x (number) <b>new</b> x position, <b>default</b> is `<span class="d">0</span>`
+</span></code><code id="L4368"><span class="ln">4368</span><span class="c">    <span class="s"> - </span>y (number) <b>new</b> y position, <b>default</b> is `<span class="d">0</span>`
+</span></code><code id="L4369"><span class="ln">4369</span><span class="c">    <span class="s"> - </span>w (number) <b>new</b> width of the canvas
+</span></code><code id="L4370"><span class="ln">4370</span><span class="c">    <span class="s"> - </span>h (number) <b>new</b> height of the canvas
+</span></code><code id="L4371"><span class="ln">4371</span><span class="c">    <span class="s"> - </span>fit (<b>boolean</b>) `<b>true</b>` <b>if</b> you want graphics to fit into <b>new</b> boundary box
+</span></code><code id="L4372"><span class="ln">4372</span><span class="c">    \*/</span>
+</code><code id="L4373"><span class="ln">4373</span>    paperproto.setViewBox<span class="s"> = </span>setViewBox;
+</code><code id="L4374"><span class="ln">4374</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4375"><span class="ln">4375</span><span class="c">    <span class="s"> * </span>Paper.top
+</span></code><code id="L4376"><span class="ln">4376</span><span class="c">     [ property ]
+</span></code><code id="L4377"><span class="ln">4377</span><span class="c">     **
+</span></code><code id="L4378"><span class="ln">4378</span><span class="c">    <span class="s"> * </span>Points to the topmost element on the paper
+</span></code><code id="L4379"><span class="ln">4379</span><span class="c">    \*/</span>
+</code><code id="L4380"><span class="ln">4380</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4381"><span class="ln">4381</span><span class="c">    <span class="s"> * </span>Paper.bottom
+</span></code><code id="L4382"><span class="ln">4382</span><span class="c">     [ property ]
+</span></code><code id="L4383"><span class="ln">4383</span><span class="c">     **
+</span></code><code id="L4384"><span class="ln">4384</span><span class="c">    <span class="s"> * </span>Points to the bottom element on the paper
+</span></code><code id="L4385"><span class="ln">4385</span><span class="c">    \*/</span>
+</code><code id="L4386"><span class="ln">4386</span>    paperproto.top<span class="s"> = </span>paperproto.bottom<span class="s"> = </span><b>null</b>;
+</code><code id="L4387"><span class="ln">4387</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4388"><span class="ln">4388</span><span class="c">    <span class="s"> * </span>Paper.raphael
+</span></code><code id="L4389"><span class="ln">4389</span><span class="c">     [ property ]
+</span></code><code id="L4390"><span class="ln">4390</span><span class="c">     **
+</span></code><code id="L4391"><span class="ln">4391</span><span class="c">    <span class="s"> * </span>Points to the @Raphael object/<b>function</b>
+</span></code><code id="L4392"><span class="ln">4392</span><span class="c">    \*/</span>
+</code><code id="L4393"><span class="ln">4393</span>    paperproto.raphael<span class="s"> = </span>R;
+</code><code id="L4394"><span class="ln">4394</span>    <b>var</b> getOffset<span class="s"> = </span><b>function</b> (elem) {
+</code><code id="L4395"><span class="ln">4395</span>        <b>var</b> box<span class="s"> = </span>elem.getBoundingClientRect(),
+</code><code id="L4396"><span class="ln">4396</span>            doc<span class="s"> = </span>elem.ownerDocument,
+</code><code id="L4397"><span class="ln">4397</span>            body<span class="s"> = </span>doc.body,
+</code><code id="L4398"><span class="ln">4398</span>            docElem<span class="s"> = </span>doc.documentElement,
+</code><code id="L4399"><span class="ln">4399</span>            clientTop<span class="s"> = </span>docElem.clientTop<span class="s"> || </span>body.clientTop<span class="s"> || </span><span class="d">0</span>, clientLeft<span class="s"> = </span>docElem.clientLeft<span class="s"> || </span>body.clientLeft<span class="s"> || </span><span class="d">0</span>,
+</code><code id="L4400"><span class="ln">4400</span>            top <span class="s"> = </span>box.top <span class="s"> + </span>(g.win.pageYOffset<span class="s"> || </span>docElem.scrollTop<span class="s"> || </span>body.scrollTop )<span class="s"> - </span>clientTop,
+</code><code id="L4401"><span class="ln">4401</span>            left<span class="s"> = </span>box.left<span class="s"> + </span>(g.win.pageXOffset<span class="s"> || </span>docElem.scrollLeft<span class="s"> || </span>body.scrollLeft)<span class="s"> - </span>clientLeft;
+</code><code id="L4402"><span class="ln">4402</span>        <b>return</b> {
+</code><code id="L4403"><span class="ln">4403</span>            y: top,
+</code><code id="L4404"><span class="ln">4404</span>            x: left
+</code><code id="L4405"><span class="ln">4405</span>        };
+</code><code id="L4406"><span class="ln">4406</span>    };
+</code><code id="L4407"><span class="ln">4407</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4408"><span class="ln">4408</span><span class="c">    <span class="s"> * </span>Paper.getElementByPoint
+</span></code><code id="L4409"><span class="ln">4409</span><span class="c">     [ method ]
+</span></code><code id="L4410"><span class="ln">4410</span><span class="c">     **
+</span></code><code id="L4411"><span class="ln">4411</span><span class="c">    <span class="s"> * </span>Returns you topmost element under given point.
 </span></code><code id="L4412"><span class="ln">4412</span><span class="c">     **
-</span></code><code id="L4413"><span class="ln">4413</span><span class="c">    <span class="s"> * </span>Returns you topmost element under given point.
-</span></code><code id="L4414"><span class="ln">4414</span><span class="c">     **
-</span></code><code id="L4415"><span class="ln">4415</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object
-</span></code><code id="L4416"><span class="ln">4416</span><span class="c">     > Parameters
-</span></code><code id="L4417"><span class="ln">4417</span><span class="c">     **
-</span></code><code id="L4418"><span class="ln">4418</span><span class="c">    <span class="s"> - </span>x (number) x coordinate from the top left corner of the window
-</span></code><code id="L4419"><span class="ln">4419</span><span class="c">    <span class="s"> - </span>y (number) y coordinate from the top left corner of the window
-</span></code><code id="L4420"><span class="ln">4420</span><span class="c">     > Usage
-</span></code><code id="L4421"><span class="ln">4421</span><span class="c">    <span class="s"> | </span>paper.getElementByPoint(mouseX, mouseY).attr({stroke: <i>"#f00"</i>});
-</span></code><code id="L4422"><span class="ln">4422</span><span class="c">    \*/</span>
-</code><code id="L4423"><span class="ln">4423</span>    paperproto.getElementByPoint<span class="s"> = </span><b>function</b> (x, y) {
-</code><code id="L4424"><span class="ln">4424</span>        <b>var</b> paper<span class="s"> = </span><b>this</b>,
-</code><code id="L4425"><span class="ln">4425</span>            svg<span class="s"> = </span>paper.canvas,
-</code><code id="L4426"><span class="ln">4426</span>            target<span class="s"> = </span>g.doc.elementFromPoint(x, y);
-</code><code id="L4427"><span class="ln">4427</span>        <b>if</b> (g.win.opera<span class="s"> &amp;&amp; </span>target.tagName<span class="s"> == </span><i>"svg"</i>) {
-</code><code id="L4428"><span class="ln">4428</span>            <b>var</b> so<span class="s"> = </span>getOffset(svg),
-</code><code id="L4429"><span class="ln">4429</span>                sr<span class="s"> = </span>svg.createSVGRect();
-</code><code id="L4430"><span class="ln">4430</span>            sr.x<span class="s"> = </span>x<span class="s"> - </span>so.x;
-</code><code id="L4431"><span class="ln">4431</span>            sr.y<span class="s"> = </span>y<span class="s"> - </span>so.y;
-</code><code id="L4432"><span class="ln">4432</span>            sr.width<span class="s"> = </span>sr.height<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L4433"><span class="ln">4433</span>            <b>var</b> hits<span class="s"> = </span>svg.getIntersectionList(sr, <b>null</b>);
-</code><code id="L4434"><span class="ln">4434</span>            <b>if</b> (hits.length) {
-</code><code id="L4435"><span class="ln">4435</span>                target<span class="s"> = </span>hits[hits.length<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L4436"><span class="ln">4436</span>            }
-</code><code id="L4437"><span class="ln">4437</span>        }
-</code><code id="L4438"><span class="ln">4438</span>        <b>if</b> (!target) {
-</code><code id="L4439"><span class="ln">4439</span>            <b>return</b> <b>null</b>;
-</code><code id="L4440"><span class="ln">4440</span>        }
-</code><code id="L4441"><span class="ln">4441</span>        <b>while</b> (target.parentNode<span class="s"> &amp;&amp; </span>target != svg.parentNode<span class="s"> &amp;&amp; </span>!target.raphael) {
-</code><code id="L4442"><span class="ln">4442</span>            target<span class="s"> = </span>target.parentNode;
-</code><code id="L4443"><span class="ln">4443</span>        }
-</code><code id="L4444"><span class="ln">4444</span>        target<span class="s"> == </span>paper.canvas.parentNode<span class="s"> &amp;&amp; </span>(target<span class="s"> = </span>svg);
-</code><code id="L4445"><span class="ln">4445</span>        target<span class="s"> = </span>target<span class="s"> &amp;&amp; </span>target.raphael ? paper.getById(target.raphaelid) : <b>null</b>;
-</code><code id="L4446"><span class="ln">4446</span>        <b>return</b> target;
-</code><code id="L4447"><span class="ln">4447</span>    };
-</code><code id="L4448"><span class="ln">4448</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4449"><span class="ln">4449</span><span class="c">    <span class="s"> * </span>Paper.getById
-</span></code><code id="L4450"><span class="ln">4450</span><span class="c">     [ method ]
+</span></code><code id="L4413"><span class="ln">4413</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object
+</span></code><code id="L4414"><span class="ln">4414</span><span class="c">     > Parameters
+</span></code><code id="L4415"><span class="ln">4415</span><span class="c">     **
+</span></code><code id="L4416"><span class="ln">4416</span><span class="c">    <span class="s"> - </span>x (number) x coordinate from the top left corner of the window
+</span></code><code id="L4417"><span class="ln">4417</span><span class="c">    <span class="s"> - </span>y (number) y coordinate from the top left corner of the window
+</span></code><code id="L4418"><span class="ln">4418</span><span class="c">     > Usage
+</span></code><code id="L4419"><span class="ln">4419</span><span class="c">    <span class="s"> | </span>paper.getElementByPoint(mouseX, mouseY).attr({stroke: <i>"#f00"</i>});
+</span></code><code id="L4420"><span class="ln">4420</span><span class="c">    \*/</span>
+</code><code id="L4421"><span class="ln">4421</span>    paperproto.getElementByPoint<span class="s"> = </span><b>function</b> (x, y) {
+</code><code id="L4422"><span class="ln">4422</span>        <b>var</b> paper<span class="s"> = </span><b>this</b>,
+</code><code id="L4423"><span class="ln">4423</span>            svg<span class="s"> = </span>paper.canvas,
+</code><code id="L4424"><span class="ln">4424</span>            target<span class="s"> = </span>g.doc.elementFromPoint(x, y);
+</code><code id="L4425"><span class="ln">4425</span>        <b>if</b> (g.win.opera<span class="s"> &amp;&amp; </span>target.tagName<span class="s"> == </span><i>"svg"</i>) {
+</code><code id="L4426"><span class="ln">4426</span>            <b>var</b> so<span class="s"> = </span>getOffset(svg),
+</code><code id="L4427"><span class="ln">4427</span>                sr<span class="s"> = </span>svg.createSVGRect();
+</code><code id="L4428"><span class="ln">4428</span>            sr.x<span class="s"> = </span>x<span class="s"> - </span>so.x;
+</code><code id="L4429"><span class="ln">4429</span>            sr.y<span class="s"> = </span>y<span class="s"> - </span>so.y;
+</code><code id="L4430"><span class="ln">4430</span>            sr.width<span class="s"> = </span>sr.height<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L4431"><span class="ln">4431</span>            <b>var</b> hits<span class="s"> = </span>svg.getIntersectionList(sr, <b>null</b>);
+</code><code id="L4432"><span class="ln">4432</span>            <b>if</b> (hits.length) {
+</code><code id="L4433"><span class="ln">4433</span>                target<span class="s"> = </span>hits[hits.length<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L4434"><span class="ln">4434</span>            }
+</code><code id="L4435"><span class="ln">4435</span>        }
+</code><code id="L4436"><span class="ln">4436</span>        <b>if</b> (!target) {
+</code><code id="L4437"><span class="ln">4437</span>            <b>return</b> <b>null</b>;
+</code><code id="L4438"><span class="ln">4438</span>        }
+</code><code id="L4439"><span class="ln">4439</span>        <b>while</b> (target.parentNode<span class="s"> &amp;&amp; </span>target != svg.parentNode<span class="s"> &amp;&amp; </span>!target.raphael) {
+</code><code id="L4440"><span class="ln">4440</span>            target<span class="s"> = </span>target.parentNode;
+</code><code id="L4441"><span class="ln">4441</span>        }
+</code><code id="L4442"><span class="ln">4442</span>        target<span class="s"> == </span>paper.canvas.parentNode<span class="s"> &amp;&amp; </span>(target<span class="s"> = </span>svg);
+</code><code id="L4443"><span class="ln">4443</span>        target<span class="s"> = </span>target<span class="s"> &amp;&amp; </span>target.raphael ? paper.getById(target.raphaelid) : <b>null</b>;
+</code><code id="L4444"><span class="ln">4444</span>        <b>return</b> target;
+</code><code id="L4445"><span class="ln">4445</span>    };
+</code><code id="L4446"><span class="ln">4446</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4447"><span class="ln">4447</span><span class="c">    <span class="s"> * </span>Paper.getById
+</span></code><code id="L4448"><span class="ln">4448</span><span class="c">     [ method ]
+</span></code><code id="L4449"><span class="ln">4449</span><span class="c">     **
+</span></code><code id="L4450"><span class="ln">4450</span><span class="c">    <span class="s"> * </span>Returns you element by its internal ID.
 </span></code><code id="L4451"><span class="ln">4451</span><span class="c">     **
-</span></code><code id="L4452"><span class="ln">4452</span><span class="c">    <span class="s"> * </span>Returns you element by it’s internal ID.
+</span></code><code id="L4452"><span class="ln">4452</span><span class="c">     > Parameters
 </span></code><code id="L4453"><span class="ln">4453</span><span class="c">     **
-</span></code><code id="L4454"><span class="ln">4454</span><span class="c">     > Parameters
-</span></code><code id="L4455"><span class="ln">4455</span><span class="c">     **
-</span></code><code id="L4456"><span class="ln">4456</span><span class="c">    <span class="s"> - </span>id (number) id
-</span></code><code id="L4457"><span class="ln">4457</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object
-</span></code><code id="L4458"><span class="ln">4458</span><span class="c">    \*/</span>
-</code><code id="L4459"><span class="ln">4459</span>    paperproto.getById<span class="s"> = </span><b>function</b> (id) {
-</code><code id="L4460"><span class="ln">4460</span>        <b>var</b> bot<span class="s"> = </span><b>this</b>.bottom;
-</code><code id="L4461"><span class="ln">4461</span>        <b>while</b> (bot) {
-</code><code id="L4462"><span class="ln">4462</span>            <b>if</b> (bot.id<span class="s"> == </span>id) {
-</code><code id="L4463"><span class="ln">4463</span>                <b>return</b> bot;
-</code><code id="L4464"><span class="ln">4464</span>            }
-</code><code id="L4465"><span class="ln">4465</span>            bot<span class="s"> = </span>bot.next;
-</code><code id="L4466"><span class="ln">4466</span>        }
-</code><code id="L4467"><span class="ln">4467</span>        <b>return</b> <b>null</b>;
-</code><code id="L4468"><span class="ln">4468</span>    };
-</code><code id="L4469"><span class="ln">4469</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4470"><span class="ln">4470</span><span class="c">    <span class="s"> * </span>Paper.forEach
-</span></code><code id="L4471"><span class="ln">4471</span><span class="c">     [ method ]
-</span></code><code id="L4472"><span class="ln">4472</span><span class="c">     **
-</span></code><code id="L4473"><span class="ln">4473</span><span class="c">    <span class="s"> * </span>Executes given <b>function</b> <b>for</b> each element on the paper
-</span></code><code id="L4474"><span class="ln">4474</span><span class="c">     *
-</span></code><code id="L4475"><span class="ln">4475</span><span class="c">    <span class="s"> * </span>If <b>function</b> returns `<b>false</b>` it will stop loop running.
+</span></code><code id="L4454"><span class="ln">4454</span><span class="c">    <span class="s"> - </span>id (number) id
+</span></code><code id="L4455"><span class="ln">4455</span><span class="c">    <span class="s"> = </span>(object) Raphaël element object
+</span></code><code id="L4456"><span class="ln">4456</span><span class="c">    \*/</span>
+</code><code id="L4457"><span class="ln">4457</span>    paperproto.getById<span class="s"> = </span><b>function</b> (id) {
+</code><code id="L4458"><span class="ln">4458</span>        <b>var</b> bot<span class="s"> = </span><b>this</b>.bottom;
+</code><code id="L4459"><span class="ln">4459</span>        <b>while</b> (bot) {
+</code><code id="L4460"><span class="ln">4460</span>            <b>if</b> (bot.id<span class="s"> == </span>id) {
+</code><code id="L4461"><span class="ln">4461</span>                <b>return</b> bot;
+</code><code id="L4462"><span class="ln">4462</span>            }
+</code><code id="L4463"><span class="ln">4463</span>            bot<span class="s"> = </span>bot.next;
+</code><code id="L4464"><span class="ln">4464</span>        }
+</code><code id="L4465"><span class="ln">4465</span>        <b>return</b> <b>null</b>;
+</code><code id="L4466"><span class="ln">4466</span>    };
+</code><code id="L4467"><span class="ln">4467</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4468"><span class="ln">4468</span><span class="c">    <span class="s"> * </span>Paper.forEach
+</span></code><code id="L4469"><span class="ln">4469</span><span class="c">     [ method ]
+</span></code><code id="L4470"><span class="ln">4470</span><span class="c">     **
+</span></code><code id="L4471"><span class="ln">4471</span><span class="c">    <span class="s"> * </span>Executes given <b>function</b> <b>for</b> each element on the paper
+</span></code><code id="L4472"><span class="ln">4472</span><span class="c">     *
+</span></code><code id="L4473"><span class="ln">4473</span><span class="c">    <span class="s"> * </span>If callback <b>function</b> returns `<b>false</b>` it will stop loop running.
+</span></code><code id="L4474"><span class="ln">4474</span><span class="c">     **
+</span></code><code id="L4475"><span class="ln">4475</span><span class="c">     > Parameters
 </span></code><code id="L4476"><span class="ln">4476</span><span class="c">     **
-</span></code><code id="L4477"><span class="ln">4477</span><span class="c">     > Parameters
-</span></code><code id="L4478"><span class="ln">4478</span><span class="c">     **
-</span></code><code id="L4479"><span class="ln">4479</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) <b>function</b> to run
-</span></code><code id="L4480"><span class="ln">4480</span><span class="c">    <span class="s"> - </span>thisArg (object) context object <b>for</b> the callback
-</span></code><code id="L4481"><span class="ln">4481</span><span class="c">    <span class="s"> = </span>(object) Paper object
-</span></code><code id="L4482"><span class="ln">4482</span><span class="c">    \*/</span>
-</code><code id="L4483"><span class="ln">4483</span>    paperproto.forEach<span class="s"> = </span><b>function</b> (callback, thisArg) {
-</code><code id="L4484"><span class="ln">4484</span>        <b>var</b> bot<span class="s"> = </span><b>this</b>.bottom;
-</code><code id="L4485"><span class="ln">4485</span>        <b>while</b> (bot) {
-</code><code id="L4486"><span class="ln">4486</span>            <b>if</b> (callback.call(thisArg, bot)<span class="s"> === </span><b>false</b>) {
-</code><code id="L4487"><span class="ln">4487</span>                <b>return</b> <b>this</b>;
-</code><code id="L4488"><span class="ln">4488</span>            }
-</code><code id="L4489"><span class="ln">4489</span>            bot<span class="s"> = </span>bot.next;
-</code><code id="L4490"><span class="ln">4490</span>        }
-</code><code id="L4491"><span class="ln">4491</span>        <b>return</b> <b>this</b>;
-</code><code id="L4492"><span class="ln">4492</span>    };
-</code><code id="L4493"><span class="ln">4493</span>    <b>function</b> x_y() {
-</code><code id="L4494"><span class="ln">4494</span>        <b>return</b> <b>this</b>.x<span class="s"> + </span>S<span class="s"> + </span><b>this</b>.y;
-</code><code id="L4495"><span class="ln">4495</span>    }
-</code><code id="L4496"><span class="ln">4496</span>    <b>function</b> x_y_w_h() {
-</code><code id="L4497"><span class="ln">4497</span>        <b>return</b> <b>this</b>.x<span class="s"> + </span>S<span class="s"> + </span><b>this</b>.y<span class="s"> + </span>S<span class="s"> + </span><b>this</b>.width<span class="s"> + </span><i>"\xd7"</i><span class="s"> + </span><b>this</b>.height;
-</code><code id="L4498"><span class="ln">4498</span>    }
-</code><code id="L4499"><span class="ln">4499</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4500"><span class="ln">4500</span><span class="c">    <span class="s"> * </span>Element.getBBox
-</span></code><code id="L4501"><span class="ln">4501</span><span class="c">     [ method ]
+</span></code><code id="L4477"><span class="ln">4477</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) <b>function</b> to run
+</span></code><code id="L4478"><span class="ln">4478</span><span class="c">    <span class="s"> - </span>thisArg (object) context object <b>for</b> the callback
+</span></code><code id="L4479"><span class="ln">4479</span><span class="c">    <span class="s"> = </span>(object) Paper object
+</span></code><code id="L4480"><span class="ln">4480</span><span class="c">    \*/</span>
+</code><code id="L4481"><span class="ln">4481</span>    paperproto.forEach<span class="s"> = </span><b>function</b> (callback, thisArg) {
+</code><code id="L4482"><span class="ln">4482</span>        <b>var</b> bot<span class="s"> = </span><b>this</b>.bottom;
+</code><code id="L4483"><span class="ln">4483</span>        <b>while</b> (bot) {
+</code><code id="L4484"><span class="ln">4484</span>            <b>if</b> (callback.call(thisArg, bot)<span class="s"> === </span><b>false</b>) {
+</code><code id="L4485"><span class="ln">4485</span>                <b>return</b> <b>this</b>;
+</code><code id="L4486"><span class="ln">4486</span>            }
+</code><code id="L4487"><span class="ln">4487</span>            bot<span class="s"> = </span>bot.next;
+</code><code id="L4488"><span class="ln">4488</span>        }
+</code><code id="L4489"><span class="ln">4489</span>        <b>return</b> <b>this</b>;
+</code><code id="L4490"><span class="ln">4490</span>    };
+</code><code id="L4491"><span class="ln">4491</span>    <b>function</b> x_y() {
+</code><code id="L4492"><span class="ln">4492</span>        <b>return</b> <b>this</b>.x<span class="s"> + </span>S<span class="s"> + </span><b>this</b>.y;
+</code><code id="L4493"><span class="ln">4493</span>    }
+</code><code id="L4494"><span class="ln">4494</span>    <b>function</b> x_y_w_h() {
+</code><code id="L4495"><span class="ln">4495</span>        <b>return</b> <b>this</b>.x<span class="s"> + </span>S<span class="s"> + </span><b>this</b>.y<span class="s"> + </span>S<span class="s"> + </span><b>this</b>.width<span class="s"> + </span><i>"\xd7"</i><span class="s"> + </span><b>this</b>.height;
+</code><code id="L4496"><span class="ln">4496</span>    }
+</code><code id="L4497"><span class="ln">4497</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4498"><span class="ln">4498</span><span class="c">    <span class="s"> * </span>Element.getBBox
+</span></code><code id="L4499"><span class="ln">4499</span><span class="c">     [ method ]
+</span></code><code id="L4500"><span class="ln">4500</span><span class="c">     **
+</span></code><code id="L4501"><span class="ln">4501</span><span class="c">    <span class="s"> * </span>Return bounding box <b>for</b> a given element
 </span></code><code id="L4502"><span class="ln">4502</span><span class="c">     **
-</span></code><code id="L4503"><span class="ln">4503</span><span class="c">    <span class="s"> * </span>Return bounding box <b>for</b> a given element
+</span></code><code id="L4503"><span class="ln">4503</span><span class="c">     > Parameters
 </span></code><code id="L4504"><span class="ln">4504</span><span class="c">     **
-</span></code><code id="L4505"><span class="ln">4505</span><span class="c">     > Parameters
-</span></code><code id="L4506"><span class="ln">4506</span><span class="c">     **
-</span></code><code id="L4507"><span class="ln">4507</span><span class="c">    <span class="s"> - </span>isWithoutTransform (<b>boolean</b>) flag, `<b>true</b>` <b>if</b> you want to have bounding box before transformations. Default is `<b>false</b>`.
-</span></code><code id="L4508"><span class="ln">4508</span><span class="c">    <span class="s"> = </span>(object) Bounding box object:
-</span></code><code id="L4509"><span class="ln">4509</span><span class="c">     o {
-</span></code><code id="L4510"><span class="ln">4510</span><span class="c">     o     x: (number) top left corner x
-</span></code><code id="L4511"><span class="ln">4511</span><span class="c">     o     y: (number) top left corner y
-</span></code><code id="L4512"><span class="ln">4512</span><span class="c">     o     width: (number) width
-</span></code><code id="L4513"><span class="ln">4513</span><span class="c">     o     height: (number) height
-</span></code><code id="L4514"><span class="ln">4514</span><span class="c">     o }
-</span></code><code id="L4515"><span class="ln">4515</span><span class="c">    \*/</span>
-</code><code id="L4516"><span class="ln">4516</span>    elproto.getBBox<span class="s"> = </span><b>function</b> (isWithoutTransform) {
-</code><code id="L4517"><span class="ln">4517</span>        <b>if</b> (<b>this</b>.removed) {
-</code><code id="L4518"><span class="ln">4518</span>            <b>return</b> {};
-</code><code id="L4519"><span class="ln">4519</span>        }
-</code><code id="L4520"><span class="ln">4520</span>        <b>var</b> _<span class="s"> = </span><b>this</b>._;
-</code><code id="L4521"><span class="ln">4521</span>        <b>if</b> (isWithoutTransform) {
-</code><code id="L4522"><span class="ln">4522</span>            <b>if</b> (_.dirty<span class="s"> || </span>!_.bboxwt) {
-</code><code id="L4523"><span class="ln">4523</span>                <b>this</b>.realPath<span class="s"> = </span>getPath[<b>this</b>.type](<b>this</b>);
-</code><code id="L4524"><span class="ln">4524</span>                _.bboxwt<span class="s"> = </span>pathDimensions(<b>this</b>.realPath);
-</code><code id="L4525"><span class="ln">4525</span>                _.bboxwt.toString<span class="s"> = </span>x_y_w_h;
-</code><code id="L4526"><span class="ln">4526</span>                _.dirty<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L4527"><span class="ln">4527</span>            }
-</code><code id="L4528"><span class="ln">4528</span>            <b>return</b> _.bboxwt;
-</code><code id="L4529"><span class="ln">4529</span>        }
-</code><code id="L4530"><span class="ln">4530</span>        <b>if</b> (_.dirty<span class="s"> || </span>_.dirtyT<span class="s"> || </span>!_.bbox) {
-</code><code id="L4531"><span class="ln">4531</span>            <b>if</b> (_.dirty<span class="s"> || </span>!<b>this</b>.realPath) {
-</code><code id="L4532"><span class="ln">4532</span>                _.bboxwt<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L4533"><span class="ln">4533</span>                <b>this</b>.realPath<span class="s"> = </span>getPath[<b>this</b>.type](<b>this</b>);
-</code><code id="L4534"><span class="ln">4534</span>            }
-</code><code id="L4535"><span class="ln">4535</span>            _.bbox<span class="s"> = </span>pathDimensions(mapPath(<b>this</b>.realPath, <b>this</b>.matrix));
-</code><code id="L4536"><span class="ln">4536</span>            _.bbox.toString<span class="s"> = </span>x_y_w_h;
-</code><code id="L4537"><span class="ln">4537</span>            _.dirty<span class="s"> = </span>_.dirtyT<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L4538"><span class="ln">4538</span>        }
-</code><code id="L4539"><span class="ln">4539</span>        <b>return</b> _.bbox;
-</code><code id="L4540"><span class="ln">4540</span>    };
-</code><code id="L4541"><span class="ln">4541</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4542"><span class="ln">4542</span><span class="c">    <span class="s"> * </span>Element.clone
-</span></code><code id="L4543"><span class="ln">4543</span><span class="c">     [ method ]
+</span></code><code id="L4505"><span class="ln">4505</span><span class="c">    <span class="s"> - </span>isWithoutTransform (<b>boolean</b>) flag, `<b>true</b>` <b>if</b> you want to have bounding box before transformations. Default is `<b>false</b>`.
+</span></code><code id="L4506"><span class="ln">4506</span><span class="c">    <span class="s"> = </span>(object) Bounding box object:
+</span></code><code id="L4507"><span class="ln">4507</span><span class="c">     o {
+</span></code><code id="L4508"><span class="ln">4508</span><span class="c">     o     x: (number) top left corner x
+</span></code><code id="L4509"><span class="ln">4509</span><span class="c">     o     y: (number) top left corner y
+</span></code><code id="L4510"><span class="ln">4510</span><span class="c">     o     width: (number) width
+</span></code><code id="L4511"><span class="ln">4511</span><span class="c">     o     height: (number) height
+</span></code><code id="L4512"><span class="ln">4512</span><span class="c">     o }
+</span></code><code id="L4513"><span class="ln">4513</span><span class="c">    \*/</span>
+</code><code id="L4514"><span class="ln">4514</span>    elproto.getBBox<span class="s"> = </span><b>function</b> (isWithoutTransform) {
+</code><code id="L4515"><span class="ln">4515</span>        <b>if</b> (<b>this</b>.removed) {
+</code><code id="L4516"><span class="ln">4516</span>            <b>return</b> {};
+</code><code id="L4517"><span class="ln">4517</span>        }
+</code><code id="L4518"><span class="ln">4518</span>        <b>var</b> _<span class="s"> = </span><b>this</b>._;
+</code><code id="L4519"><span class="ln">4519</span>        <b>if</b> (isWithoutTransform) {
+</code><code id="L4520"><span class="ln">4520</span>            <b>if</b> (_.dirty<span class="s"> || </span>!_.bboxwt) {
+</code><code id="L4521"><span class="ln">4521</span>                <b>this</b>.realPath<span class="s"> = </span>getPath[<b>this</b>.type](<b>this</b>);
+</code><code id="L4522"><span class="ln">4522</span>                _.bboxwt<span class="s"> = </span>pathDimensions(<b>this</b>.realPath);
+</code><code id="L4523"><span class="ln">4523</span>                _.bboxwt.toString<span class="s"> = </span>x_y_w_h;
+</code><code id="L4524"><span class="ln">4524</span>                _.dirty<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L4525"><span class="ln">4525</span>            }
+</code><code id="L4526"><span class="ln">4526</span>            <b>return</b> _.bboxwt;
+</code><code id="L4527"><span class="ln">4527</span>        }
+</code><code id="L4528"><span class="ln">4528</span>        <b>if</b> (_.dirty<span class="s"> || </span>_.dirtyT<span class="s"> || </span>!_.bbox) {
+</code><code id="L4529"><span class="ln">4529</span>            <b>if</b> (_.dirty<span class="s"> || </span>!<b>this</b>.realPath) {
+</code><code id="L4530"><span class="ln">4530</span>                _.bboxwt<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L4531"><span class="ln">4531</span>                <b>this</b>.realPath<span class="s"> = </span>getPath[<b>this</b>.type](<b>this</b>);
+</code><code id="L4532"><span class="ln">4532</span>            }
+</code><code id="L4533"><span class="ln">4533</span>            _.bbox<span class="s"> = </span>pathDimensions(mapPath(<b>this</b>.realPath, <b>this</b>.matrix));
+</code><code id="L4534"><span class="ln">4534</span>            _.bbox.toString<span class="s"> = </span>x_y_w_h;
+</code><code id="L4535"><span class="ln">4535</span>            _.dirty<span class="s"> = </span>_.dirtyT<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L4536"><span class="ln">4536</span>        }
+</code><code id="L4537"><span class="ln">4537</span>        <b>return</b> _.bbox;
+</code><code id="L4538"><span class="ln">4538</span>    };
+</code><code id="L4539"><span class="ln">4539</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4540"><span class="ln">4540</span><span class="c">    <span class="s"> * </span>Element.clone
+</span></code><code id="L4541"><span class="ln">4541</span><span class="c">     [ method ]
+</span></code><code id="L4542"><span class="ln">4542</span><span class="c">     **
+</span></code><code id="L4543"><span class="ln">4543</span><span class="c">    <span class="s"> = </span>(object) clone of a given element
 </span></code><code id="L4544"><span class="ln">4544</span><span class="c">     **
-</span></code><code id="L4545"><span class="ln">4545</span><span class="c">    <span class="s"> = </span>(object) clone of a given element
-</span></code><code id="L4546"><span class="ln">4546</span><span class="c">     **
-</span></code><code id="L4547"><span class="ln">4547</span><span class="c">    \*/</span>
-</code><code id="L4548"><span class="ln">4548</span>    elproto.clone<span class="s"> = </span><b>function</b> () {
-</code><code id="L4549"><span class="ln">4549</span>        <b>if</b> (<b>this</b>.removed) {
-</code><code id="L4550"><span class="ln">4550</span>            <b>return</b> <b>null</b>;
-</code><code id="L4551"><span class="ln">4551</span>        }
-</code><code id="L4552"><span class="ln">4552</span>        <b>var</b> attr<span class="s"> = </span><b>this</b>.attr();
-</code><code id="L4553"><span class="ln">4553</span>        <b>delete</b> attr.scale;
-</code><code id="L4554"><span class="ln">4554</span>        <b>delete</b> attr.translation;
-</code><code id="L4555"><span class="ln">4555</span>        <b>return</b> <b>this</b>.paper[<b>this</b>.type]().attr(attr);
-</code><code id="L4556"><span class="ln">4556</span>    };
-</code><code id="L4557"><span class="ln">4557</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4558"><span class="ln">4558</span><span class="c">    <span class="s"> * </span>Element.glow
-</span></code><code id="L4559"><span class="ln">4559</span><span class="c">     [ method ]
-</span></code><code id="L4560"><span class="ln">4560</span><span class="c">     **
-</span></code><code id="L4561"><span class="ln">4561</span><span class="c">    <span class="s"> * </span>Return set of elements that create glow-like effect around given element. See @Paper.set.
-</span></code><code id="L4562"><span class="ln">4562</span><span class="c">     *
-</span></code><code id="L4563"><span class="ln">4563</span><span class="c">    <span class="s"> * </span>Note: Glow is not connected to the elment. If you change element attributes it won’t adjust itself.
-</span></code><code id="L4564"><span class="ln">4564</span><span class="c">     **
-</span></code><code id="L4565"><span class="ln">4565</span><span class="c">    <span class="s"> = </span>(object) @Paper.set of elements that represents glow
-</span></code><code id="L4566"><span class="ln">4566</span><span class="c">    \*/</span>
-</code><code id="L4567"><span class="ln">4567</span>    elproto.glow<span class="s"> = </span><b>function</b> (glow) {
-</code><code id="L4568"><span class="ln">4568</span>        <b>if</b> (<b>this</b>.type<span class="s"> == </span><i>"text"</i>) {
-</code><code id="L4569"><span class="ln">4569</span>            <b>return</b> <b>null</b>;
-</code><code id="L4570"><span class="ln">4570</span>        }
-</code><code id="L4571"><span class="ln">4571</span>        glow<span class="s"> = </span>glow<span class="s"> || </span>{};
-</code><code id="L4572"><span class="ln">4572</span>        <b>var</b> s<span class="s"> = </span>{
-</code><code id="L4573"><span class="ln">4573</span>            width: glow.width<span class="s"> || </span><span class="d">10</span>,
-</code><code id="L4574"><span class="ln">4574</span>            fill: glow.fill<span class="s"> || </span><b>false</b>,
-</code><code id="L4575"><span class="ln">4575</span>            opacity: glow.opacity<span class="s"> || </span><span class="d">.5</span>,
-</code><code id="L4576"><span class="ln">4576</span>            offsetx: glow.offsetx<span class="s"> || </span><span class="d">0</span>,
-</code><code id="L4577"><span class="ln">4577</span>            offsety: glow.offsety<span class="s"> || </span><span class="d">0</span>,
-</code><code id="L4578"><span class="ln">4578</span>            color: glow.color<span class="s"> || </span><i>"#<span class="d">000</span>"</i>
-</code><code id="L4579"><span class="ln">4579</span>        },
-</code><code id="L4580"><span class="ln">4580</span>            c<span class="s"> = </span>s.width<span class="s"> / </span><span class="d">2</span>,
-</code><code id="L4581"><span class="ln">4581</span>            r<span class="s"> = </span><b>this</b>.paper,
-</code><code id="L4582"><span class="ln">4582</span>            out<span class="s"> = </span>r.set(),
-</code><code id="L4583"><span class="ln">4583</span>            path<span class="s"> = </span><b>this</b>.realPath<span class="s"> || </span>getPath[<b>this</b>.type](<b>this</b>);
-</code><code id="L4584"><span class="ln">4584</span>        path<span class="s"> = </span><b>this</b>.matrix ? mapPath(path, <b>this</b>.matrix) : path;
-</code><code id="L4585"><span class="ln">4585</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">1</span>; i &lt; c<span class="s"> + </span><span class="d">1</span>; i++) {
-</code><code id="L4586"><span class="ln">4586</span>            out.push(r.path(path).attr({stroke: s.color, fill: s.fill ? s.color : <i>"none"</i>, <i>"stroke-linejoin"</i>: <i>"round"</i>, <i>"stroke-linecap"</i>: <i>"round"</i>, <i>"stroke-width"</i>: +(s.width<span class="s"> / </span>c<span class="s"> * </span>i).toFixed(<span class="d">3</span>), opacity: +(s.opacity<span class="s"> / </span>c).toFixed(<span class="d">3</span>)}));
-</code><code id="L4587"><span class="ln">4587</span>        }
-</code><code id="L4588"><span class="ln">4588</span>        <b>return</b> out.insertBefore(<b>this</b>).translate(s.offsetx, s.offsety);
-</code><code id="L4589"><span class="ln">4589</span>    };
-</code><code id="L4590"><span class="ln">4590</span>    <b>var</b> curveslengths<span class="s"> = </span>{},
-</code><code id="L4591"><span class="ln">4591</span>    getPointAtSegmentLength<span class="s"> = </span><b>function</b> (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, length) {
-</code><code id="L4592"><span class="ln">4592</span>        <b>var</b> len<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L4593"><span class="ln">4593</span>            precision<span class="s"> = </span><span class="d">100</span>,
-</code><code id="L4594"><span class="ln">4594</span>            name<span class="s"> = </span>[p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y].join(),
-</code><code id="L4595"><span class="ln">4595</span>            cache<span class="s"> = </span>curveslengths[name],
-</code><code id="L4596"><span class="ln">4596</span>            old, dot;
-</code><code id="L4597"><span class="ln">4597</span>        !cache<span class="s"> &amp;&amp; </span>(curveslengths[name]<span class="s"> = </span>cache<span class="s"> = </span>{data: []});
-</code><code id="L4598"><span class="ln">4598</span>        cache.timer<span class="s"> &amp;&amp; </span>clearTimeout(cache.timer);
-</code><code id="L4599"><span class="ln">4599</span>        cache.timer<span class="s"> = </span>setTimeout(<b>function</b> () {<b>delete</b> curveslengths[name];}, <span class="d">2e3</span>);
-</code><code id="L4600"><span class="ln">4600</span>        <b>if</b> (length != <b>null</b><span class="s"> &amp;&amp; </span>!cache.precision) {
-</code><code id="L4601"><span class="ln">4601</span>            <b>var</b> total<span class="s"> = </span>getPointAtSegmentLength(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y);
-</code><code id="L4602"><span class="ln">4602</span>            cache.precision<span class="s"> = </span>~~total<span class="s"> * </span><span class="d">10</span>;
-</code><code id="L4603"><span class="ln">4603</span>            cache.data<span class="s"> = </span>[];
-</code><code id="L4604"><span class="ln">4604</span>        }
-</code><code id="L4605"><span class="ln">4605</span>        precision<span class="s"> = </span>cache.precision<span class="s"> || </span>precision;
-</code><code id="L4606"><span class="ln">4606</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>; i &lt; precision<span class="s"> + </span><span class="d">1</span>; i++) {
-</code><code id="L4607"><span class="ln">4607</span>            <b>if</b> (cache.data[i<span class="s"> * </span>precision]) {
-</code><code id="L4608"><span class="ln">4608</span>                dot<span class="s"> = </span>cache.data[i<span class="s"> * </span>precision];
-</code><code id="L4609"><span class="ln">4609</span>            } <b>else</b> {
-</code><code id="L4610"><span class="ln">4610</span>                dot<span class="s"> = </span>R.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, i<span class="s"> / </span>precision);
-</code><code id="L4611"><span class="ln">4611</span>                cache.data[i<span class="s"> * </span>precision]<span class="s"> = </span>dot;
-</code><code id="L4612"><span class="ln">4612</span>            }
-</code><code id="L4613"><span class="ln">4613</span>            i<span class="s"> &amp;&amp; </span>(len += pow(pow(old.x<span class="s"> - </span>dot.x, <span class="d">2</span>)<span class="s"> + </span>pow(old.y<span class="s"> - </span>dot.y, <span class="d">2</span>), <span class="d">.5</span>));
-</code><code id="L4614"><span class="ln">4614</span>            <b>if</b> (length != <b>null</b><span class="s"> &amp;&amp; </span>len >= length) {
-</code><code id="L4615"><span class="ln">4615</span>                <b>return</b> dot;
-</code><code id="L4616"><span class="ln">4616</span>            }
-</code><code id="L4617"><span class="ln">4617</span>            old<span class="s"> = </span>dot;
-</code><code id="L4618"><span class="ln">4618</span>        }
-</code><code id="L4619"><span class="ln">4619</span>        <b>if</b> (length<span class="s"> == </span><b>null</b>) {
-</code><code id="L4620"><span class="ln">4620</span>            <b>return</b> len;
-</code><code id="L4621"><span class="ln">4621</span>        }
-</code><code id="L4622"><span class="ln">4622</span>    },
-</code><code id="L4623"><span class="ln">4623</span>    getLengthFactory<span class="s"> = </span><b>function</b> (istotal, subpath) {
-</code><code id="L4624"><span class="ln">4624</span>        <b>return</b> <b>function</b> (path, length, onlystart) {
-</code><code id="L4625"><span class="ln">4625</span>            path<span class="s"> = </span>path2curve(path);
-</code><code id="L4626"><span class="ln">4626</span>            <b>var</b> x, y, p, l, sp<span class="s"> = </span><i>""</i>, subpaths<span class="s"> = </span>{}, point,
-</code><code id="L4627"><span class="ln">4627</span>                len<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L4628"><span class="ln">4628</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>path.length; i &lt; ii; i++) {
-</code><code id="L4629"><span class="ln">4629</span>                p<span class="s"> = </span>path[i];
-</code><code id="L4630"><span class="ln">4630</span>                <b>if</b> (p[<span class="d">0</span>]<span class="s"> == </span><i>"M"</i>) {
-</code><code id="L4631"><span class="ln">4631</span>                    x<span class="s"> = </span>+p[<span class="d">1</span>];
-</code><code id="L4632"><span class="ln">4632</span>                    y<span class="s"> = </span>+p[<span class="d">2</span>];
-</code><code id="L4633"><span class="ln">4633</span>                } <b>else</b> {
-</code><code id="L4634"><span class="ln">4634</span>                    l<span class="s"> = </span>getPointAtSegmentLength(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>]);
-</code><code id="L4635"><span class="ln">4635</span>                    <b>if</b> (len<span class="s"> + </span>l > length) {
-</code><code id="L4636"><span class="ln">4636</span>                        <b>if</b> (subpath<span class="s"> &amp;&amp; </span>!subpaths.start) {
-</code><code id="L4637"><span class="ln">4637</span>                            point<span class="s"> = </span>getPointAtSegmentLength(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>], length<span class="s"> - </span>len);
-</code><code id="L4638"><span class="ln">4638</span>                            sp += [<i>"C"</i><span class="s"> + </span>point.start.x, point.start.y, point.m.x, point.m.y, point.x, point.y];
-</code><code id="L4639"><span class="ln">4639</span>                            <b>if</b> (onlystart) {<b>return</b> sp;}
-</code><code id="L4640"><span class="ln">4640</span>                            subpaths.start<span class="s"> = </span>sp;
-</code><code id="L4641"><span class="ln">4641</span>                            sp<span class="s"> = </span>[<i>"M"</i><span class="s"> + </span>point.x, point.y<span class="s"> + </span><i>"C"</i><span class="s"> + </span>point.n.x, point.n.y, point.end.x, point.end.y, p[<span class="d">5</span>], p[<span class="d">6</span>]].join();
-</code><code id="L4642"><span class="ln">4642</span>                            len += l;
-</code><code id="L4643"><span class="ln">4643</span>                            x<span class="s"> = </span>+p[<span class="d">5</span>];
-</code><code id="L4644"><span class="ln">4644</span>                            y<span class="s"> = </span>+p[<span class="d">6</span>];
-</code><code id="L4645"><span class="ln">4645</span>                            <b>continue</b>;
-</code><code id="L4646"><span class="ln">4646</span>                        }
-</code><code id="L4647"><span class="ln">4647</span>                        <b>if</b> (!istotal<span class="s"> &amp;&amp; </span>!subpath) {
-</code><code id="L4648"><span class="ln">4648</span>                            point<span class="s"> = </span>getPointAtSegmentLength(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>], length<span class="s"> - </span>len);
-</code><code id="L4649"><span class="ln">4649</span>                            <b>return</b> {x: point.x, y: point.y, alpha: point.alpha};
-</code><code id="L4650"><span class="ln">4650</span>                        }
-</code><code id="L4651"><span class="ln">4651</span>                    }
-</code><code id="L4652"><span class="ln">4652</span>                    len += l;
-</code><code id="L4653"><span class="ln">4653</span>                    x<span class="s"> = </span>+p[<span class="d">5</span>];
-</code><code id="L4654"><span class="ln">4654</span>                    y<span class="s"> = </span>+p[<span class="d">6</span>];
-</code><code id="L4655"><span class="ln">4655</span>                }
-</code><code id="L4656"><span class="ln">4656</span>                sp += p.shift()<span class="s"> + </span>p;
-</code><code id="L4657"><span class="ln">4657</span>            }
-</code><code id="L4658"><span class="ln">4658</span>            subpaths.end<span class="s"> = </span>sp;
-</code><code id="L4659"><span class="ln">4659</span>            point<span class="s"> = </span>istotal ? len : subpath ? subpaths : R.findDotsAtSegment(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>], <span class="d">1</span>);
-</code><code id="L4660"><span class="ln">4660</span>            point.alpha<span class="s"> &amp;&amp; </span>(point<span class="s"> = </span>{x: point.x, y: point.y, alpha: point.alpha});
-</code><code id="L4661"><span class="ln">4661</span>            <b>return</b> point;
-</code><code id="L4662"><span class="ln">4662</span>        };
-</code><code id="L4663"><span class="ln">4663</span>    };
-</code><code id="L4664"><span class="ln">4664</span>    <b>var</b> getTotalLength<span class="s"> = </span>getLengthFactory(<span class="d">1</span>),
-</code><code id="L4665"><span class="ln">4665</span>        getPointAtLength<span class="s"> = </span>getLengthFactory(),
-</code><code id="L4666"><span class="ln">4666</span>        getSubpathsAtLength<span class="s"> = </span>getLengthFactory(<span class="d">0</span>, <span class="d">1</span>);
-</code><code id="L4667"><span class="ln">4667</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4668"><span class="ln">4668</span><span class="c">    <span class="s"> * </span>Raphael.getTotalLength
-</span></code><code id="L4669"><span class="ln">4669</span><span class="c">     [ method ]
+</span></code><code id="L4545"><span class="ln">4545</span><span class="c">    \*/</span>
+</code><code id="L4546"><span class="ln">4546</span>    elproto.clone<span class="s"> = </span><b>function</b> () {
+</code><code id="L4547"><span class="ln">4547</span>        <b>if</b> (<b>this</b>.removed) {
+</code><code id="L4548"><span class="ln">4548</span>            <b>return</b> <b>null</b>;
+</code><code id="L4549"><span class="ln">4549</span>        }
+</code><code id="L4550"><span class="ln">4550</span>        <b>var</b> attr<span class="s"> = </span><b>this</b>.attr();
+</code><code id="L4551"><span class="ln">4551</span>        <b>delete</b> attr.scale;
+</code><code id="L4552"><span class="ln">4552</span>        <b>delete</b> attr.translation;
+</code><code id="L4553"><span class="ln">4553</span>        <b>return</b> <b>this</b>.paper[<b>this</b>.type]().attr(attr);
+</code><code id="L4554"><span class="ln">4554</span>    };
+</code><code id="L4555"><span class="ln">4555</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4556"><span class="ln">4556</span><span class="c">    <span class="s"> * </span>Element.glow
+</span></code><code id="L4557"><span class="ln">4557</span><span class="c">     [ method ]
+</span></code><code id="L4558"><span class="ln">4558</span><span class="c">     **
+</span></code><code id="L4559"><span class="ln">4559</span><span class="c">    <span class="s"> * </span>Return set of elements that create glow-like effect around given element. See @Paper.set.
+</span></code><code id="L4560"><span class="ln">4560</span><span class="c">     *
+</span></code><code id="L4561"><span class="ln">4561</span><span class="c">    <span class="s"> * </span>Note: Glow is not connected to the element. If you change element attributes it won’t adjust itself.
+</span></code><code id="L4562"><span class="ln">4562</span><span class="c">     **
+</span></code><code id="L4563"><span class="ln">4563</span><span class="c">    <span class="s"> = </span>(object) @Paper.set of elements that represents glow
+</span></code><code id="L4564"><span class="ln">4564</span><span class="c">    \*/</span>
+</code><code id="L4565"><span class="ln">4565</span>    elproto.glow<span class="s"> = </span><b>function</b> (glow) {
+</code><code id="L4566"><span class="ln">4566</span>        <b>if</b> (<b>this</b>.type<span class="s"> == </span><i>"text"</i>) {
+</code><code id="L4567"><span class="ln">4567</span>            <b>return</b> <b>null</b>;
+</code><code id="L4568"><span class="ln">4568</span>        }
+</code><code id="L4569"><span class="ln">4569</span>        glow<span class="s"> = </span>glow<span class="s"> || </span>{};
+</code><code id="L4570"><span class="ln">4570</span>        <b>var</b> s<span class="s"> = </span>{
+</code><code id="L4571"><span class="ln">4571</span>            width: glow.width<span class="s"> || </span><span class="d">10</span>,
+</code><code id="L4572"><span class="ln">4572</span>            fill: glow.fill<span class="s"> || </span><b>false</b>,
+</code><code id="L4573"><span class="ln">4573</span>            opacity: glow.opacity<span class="s"> || </span><span class="d">.5</span>,
+</code><code id="L4574"><span class="ln">4574</span>            offsetx: glow.offsetx<span class="s"> || </span><span class="d">0</span>,
+</code><code id="L4575"><span class="ln">4575</span>            offsety: glow.offsety<span class="s"> || </span><span class="d">0</span>,
+</code><code id="L4576"><span class="ln">4576</span>            color: glow.color<span class="s"> || </span><i>"#<span class="d">000</span>"</i>
+</code><code id="L4577"><span class="ln">4577</span>        },
+</code><code id="L4578"><span class="ln">4578</span>            c<span class="s"> = </span>s.width<span class="s"> / </span><span class="d">2</span>,
+</code><code id="L4579"><span class="ln">4579</span>            r<span class="s"> = </span><b>this</b>.paper,
+</code><code id="L4580"><span class="ln">4580</span>            out<span class="s"> = </span>r.set(),
+</code><code id="L4581"><span class="ln">4581</span>            path<span class="s"> = </span><b>this</b>.realPath<span class="s"> || </span>getPath[<b>this</b>.type](<b>this</b>);
+</code><code id="L4582"><span class="ln">4582</span>        path<span class="s"> = </span><b>this</b>.matrix ? mapPath(path, <b>this</b>.matrix) : path;
+</code><code id="L4583"><span class="ln">4583</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">1</span>; i &lt; c<span class="s"> + </span><span class="d">1</span>; i++) {
+</code><code id="L4584"><span class="ln">4584</span>            out.push(r.path(path).attr({stroke: s.color, fill: s.fill ? s.color : <i>"none"</i>, <i>"stroke-linejoin"</i>: <i>"round"</i>, <i>"stroke-linecap"</i>: <i>"round"</i>, <i>"stroke-width"</i>: +(s.width<span class="s"> / </span>c<span class="s"> * </span>i).toFixed(<span class="d">3</span>), opacity: +(s.opacity<span class="s"> / </span>c).toFixed(<span class="d">3</span>)}));
+</code><code id="L4585"><span class="ln">4585</span>        }
+</code><code id="L4586"><span class="ln">4586</span>        <b>return</b> out.insertBefore(<b>this</b>).translate(s.offsetx, s.offsety);
+</code><code id="L4587"><span class="ln">4587</span>    };
+</code><code id="L4588"><span class="ln">4588</span>    <b>var</b> curveslengths<span class="s"> = </span>{},
+</code><code id="L4589"><span class="ln">4589</span>    getPointAtSegmentLength<span class="s"> = </span><b>function</b> (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, length) {
+</code><code id="L4590"><span class="ln">4590</span>        <b>var</b> len<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L4591"><span class="ln">4591</span>            precision<span class="s"> = </span><span class="d">100</span>,
+</code><code id="L4592"><span class="ln">4592</span>            name<span class="s"> = </span>[p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y].join(),
+</code><code id="L4593"><span class="ln">4593</span>            cache<span class="s"> = </span>curveslengths[name],
+</code><code id="L4594"><span class="ln">4594</span>            old, dot;
+</code><code id="L4595"><span class="ln">4595</span>        !cache<span class="s"> &amp;&amp; </span>(curveslengths[name]<span class="s"> = </span>cache<span class="s"> = </span>{data: []});
+</code><code id="L4596"><span class="ln">4596</span>        cache.timer<span class="s"> &amp;&amp; </span>clearTimeout(cache.timer);
+</code><code id="L4597"><span class="ln">4597</span>        cache.timer<span class="s"> = </span>setTimeout(<b>function</b> () {<b>delete</b> curveslengths[name];}, <span class="d">2e3</span>);
+</code><code id="L4598"><span class="ln">4598</span>        <b>if</b> (length != <b>null</b><span class="s"> &amp;&amp; </span>!cache.precision) {
+</code><code id="L4599"><span class="ln">4599</span>            <b>var</b> total<span class="s"> = </span>getPointAtSegmentLength(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y);
+</code><code id="L4600"><span class="ln">4600</span>            cache.precision<span class="s"> = </span>~~total<span class="s"> * </span><span class="d">10</span>;
+</code><code id="L4601"><span class="ln">4601</span>            cache.data<span class="s"> = </span>[];
+</code><code id="L4602"><span class="ln">4602</span>        }
+</code><code id="L4603"><span class="ln">4603</span>        precision<span class="s"> = </span>cache.precision<span class="s"> || </span>precision;
+</code><code id="L4604"><span class="ln">4604</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>; i &lt; precision<span class="s"> + </span><span class="d">1</span>; i++) {
+</code><code id="L4605"><span class="ln">4605</span>            <b>if</b> (cache.data[i<span class="s"> * </span>precision]) {
+</code><code id="L4606"><span class="ln">4606</span>                dot<span class="s"> = </span>cache.data[i<span class="s"> * </span>precision];
+</code><code id="L4607"><span class="ln">4607</span>            } <b>else</b> {
+</code><code id="L4608"><span class="ln">4608</span>                dot<span class="s"> = </span>R.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, i<span class="s"> / </span>precision);
+</code><code id="L4609"><span class="ln">4609</span>                cache.data[i<span class="s"> * </span>precision]<span class="s"> = </span>dot;
+</code><code id="L4610"><span class="ln">4610</span>            }
+</code><code id="L4611"><span class="ln">4611</span>            i<span class="s"> &amp;&amp; </span>(len += pow(pow(old.x<span class="s"> - </span>dot.x, <span class="d">2</span>)<span class="s"> + </span>pow(old.y<span class="s"> - </span>dot.y, <span class="d">2</span>), <span class="d">.5</span>));
+</code><code id="L4612"><span class="ln">4612</span>            <b>if</b> (length != <b>null</b><span class="s"> &amp;&amp; </span>len >= length) {
+</code><code id="L4613"><span class="ln">4613</span>                <b>return</b> dot;
+</code><code id="L4614"><span class="ln">4614</span>            }
+</code><code id="L4615"><span class="ln">4615</span>            old<span class="s"> = </span>dot;
+</code><code id="L4616"><span class="ln">4616</span>        }
+</code><code id="L4617"><span class="ln">4617</span>        <b>if</b> (length<span class="s"> == </span><b>null</b>) {
+</code><code id="L4618"><span class="ln">4618</span>            <b>return</b> len;
+</code><code id="L4619"><span class="ln">4619</span>        }
+</code><code id="L4620"><span class="ln">4620</span>    },
+</code><code id="L4621"><span class="ln">4621</span>    getLengthFactory<span class="s"> = </span><b>function</b> (istotal, subpath) {
+</code><code id="L4622"><span class="ln">4622</span>        <b>return</b> <b>function</b> (path, length, onlystart) {
+</code><code id="L4623"><span class="ln">4623</span>            path<span class="s"> = </span>path2curve(path);
+</code><code id="L4624"><span class="ln">4624</span>            <b>var</b> x, y, p, l, sp<span class="s"> = </span><i>""</i>, subpaths<span class="s"> = </span>{}, point,
+</code><code id="L4625"><span class="ln">4625</span>                len<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L4626"><span class="ln">4626</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>path.length; i &lt; ii; i++) {
+</code><code id="L4627"><span class="ln">4627</span>                p<span class="s"> = </span>path[i];
+</code><code id="L4628"><span class="ln">4628</span>                <b>if</b> (p[<span class="d">0</span>]<span class="s"> == </span><i>"M"</i>) {
+</code><code id="L4629"><span class="ln">4629</span>                    x<span class="s"> = </span>+p[<span class="d">1</span>];
+</code><code id="L4630"><span class="ln">4630</span>                    y<span class="s"> = </span>+p[<span class="d">2</span>];
+</code><code id="L4631"><span class="ln">4631</span>                } <b>else</b> {
+</code><code id="L4632"><span class="ln">4632</span>                    l<span class="s"> = </span>getPointAtSegmentLength(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>]);
+</code><code id="L4633"><span class="ln">4633</span>                    <b>if</b> (len<span class="s"> + </span>l > length) {
+</code><code id="L4634"><span class="ln">4634</span>                        <b>if</b> (subpath<span class="s"> &amp;&amp; </span>!subpaths.start) {
+</code><code id="L4635"><span class="ln">4635</span>                            point<span class="s"> = </span>getPointAtSegmentLength(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>], length<span class="s"> - </span>len);
+</code><code id="L4636"><span class="ln">4636</span>                            sp += [<i>"C"</i><span class="s"> + </span>point.start.x, point.start.y, point.m.x, point.m.y, point.x, point.y];
+</code><code id="L4637"><span class="ln">4637</span>                            <b>if</b> (onlystart) {<b>return</b> sp;}
+</code><code id="L4638"><span class="ln">4638</span>                            subpaths.start<span class="s"> = </span>sp;
+</code><code id="L4639"><span class="ln">4639</span>                            sp<span class="s"> = </span>[<i>"M"</i><span class="s"> + </span>point.x, point.y<span class="s"> + </span><i>"C"</i><span class="s"> + </span>point.n.x, point.n.y, point.end.x, point.end.y, p[<span class="d">5</span>], p[<span class="d">6</span>]].join();
+</code><code id="L4640"><span class="ln">4640</span>                            len += l;
+</code><code id="L4641"><span class="ln">4641</span>                            x<span class="s"> = </span>+p[<span class="d">5</span>];
+</code><code id="L4642"><span class="ln">4642</span>                            y<span class="s"> = </span>+p[<span class="d">6</span>];
+</code><code id="L4643"><span class="ln">4643</span>                            <b>continue</b>;
+</code><code id="L4644"><span class="ln">4644</span>                        }
+</code><code id="L4645"><span class="ln">4645</span>                        <b>if</b> (!istotal<span class="s"> &amp;&amp; </span>!subpath) {
+</code><code id="L4646"><span class="ln">4646</span>                            point<span class="s"> = </span>getPointAtSegmentLength(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>], length<span class="s"> - </span>len);
+</code><code id="L4647"><span class="ln">4647</span>                            <b>return</b> {x: point.x, y: point.y, alpha: point.alpha};
+</code><code id="L4648"><span class="ln">4648</span>                        }
+</code><code id="L4649"><span class="ln">4649</span>                    }
+</code><code id="L4650"><span class="ln">4650</span>                    len += l;
+</code><code id="L4651"><span class="ln">4651</span>                    x<span class="s"> = </span>+p[<span class="d">5</span>];
+</code><code id="L4652"><span class="ln">4652</span>                    y<span class="s"> = </span>+p[<span class="d">6</span>];
+</code><code id="L4653"><span class="ln">4653</span>                }
+</code><code id="L4654"><span class="ln">4654</span>                sp += p.shift()<span class="s"> + </span>p;
+</code><code id="L4655"><span class="ln">4655</span>            }
+</code><code id="L4656"><span class="ln">4656</span>            subpaths.end<span class="s"> = </span>sp;
+</code><code id="L4657"><span class="ln">4657</span>            point<span class="s"> = </span>istotal ? len : subpath ? subpaths : R.findDotsAtSegment(x, y, p[<span class="d">1</span>], p[<span class="d">2</span>], p[<span class="d">3</span>], p[<span class="d">4</span>], p[<span class="d">5</span>], p[<span class="d">6</span>], <span class="d">1</span>);
+</code><code id="L4658"><span class="ln">4658</span>            point.alpha<span class="s"> &amp;&amp; </span>(point<span class="s"> = </span>{x: point.x, y: point.y, alpha: point.alpha});
+</code><code id="L4659"><span class="ln">4659</span>            <b>return</b> point;
+</code><code id="L4660"><span class="ln">4660</span>        };
+</code><code id="L4661"><span class="ln">4661</span>    };
+</code><code id="L4662"><span class="ln">4662</span>    <b>var</b> getTotalLength<span class="s"> = </span>getLengthFactory(<span class="d">1</span>),
+</code><code id="L4663"><span class="ln">4663</span>        getPointAtLength<span class="s"> = </span>getLengthFactory(),
+</code><code id="L4664"><span class="ln">4664</span>        getSubpathsAtLength<span class="s"> = </span>getLengthFactory(<span class="d">0</span>, <span class="d">1</span>);
+</code><code id="L4665"><span class="ln">4665</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4666"><span class="ln">4666</span><span class="c">    <span class="s"> * </span>Raphael.getTotalLength
+</span></code><code id="L4667"><span class="ln">4667</span><span class="c">     [ method ]
+</span></code><code id="L4668"><span class="ln">4668</span><span class="c">     **
+</span></code><code id="L4669"><span class="ln">4669</span><span class="c">    <span class="s"> * </span>Returns length of the given path <b>in</b> pixels.
 </span></code><code id="L4670"><span class="ln">4670</span><span class="c">     **
-</span></code><code id="L4671"><span class="ln">4671</span><span class="c">    <span class="s"> * </span>Returns length of the given path <b>in</b> pixels.
+</span></code><code id="L4671"><span class="ln">4671</span><span class="c">     > Parameters
 </span></code><code id="L4672"><span class="ln">4672</span><span class="c">     **
-</span></code><code id="L4673"><span class="ln">4673</span><span class="c">     > Parameters
+</span></code><code id="L4673"><span class="ln">4673</span><span class="c">    <span class="s"> - </span>path (string) SVG path string.
 </span></code><code id="L4674"><span class="ln">4674</span><span class="c">     **
-</span></code><code id="L4675"><span class="ln">4675</span><span class="c">    <span class="s"> - </span>path (string) SVG path string.
-</span></code><code id="L4676"><span class="ln">4676</span><span class="c">     **
-</span></code><code id="L4677"><span class="ln">4677</span><span class="c">    <span class="s"> = </span>(number) length.
-</span></code><code id="L4678"><span class="ln">4678</span><span class="c">    \*/</span>
-</code><code id="L4679"><span class="ln">4679</span>    R.getTotalLength<span class="s"> = </span>getTotalLength;
-</code><code id="L4680"><span class="ln">4680</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4681"><span class="ln">4681</span><span class="c">    <span class="s"> * </span>Raphael.getPointAtLength
-</span></code><code id="L4682"><span class="ln">4682</span><span class="c">     [ method ]
+</span></code><code id="L4675"><span class="ln">4675</span><span class="c">    <span class="s"> = </span>(number) length.
+</span></code><code id="L4676"><span class="ln">4676</span><span class="c">    \*/</span>
+</code><code id="L4677"><span class="ln">4677</span>    R.getTotalLength<span class="s"> = </span>getTotalLength;
+</code><code id="L4678"><span class="ln">4678</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4679"><span class="ln">4679</span><span class="c">    <span class="s"> * </span>Raphael.getPointAtLength
+</span></code><code id="L4680"><span class="ln">4680</span><span class="c">     [ method ]
+</span></code><code id="L4681"><span class="ln">4681</span><span class="c">     **
+</span></code><code id="L4682"><span class="ln">4682</span><span class="c">    <span class="s"> * </span>Return coordinates of the point located at the given length on the given path.
 </span></code><code id="L4683"><span class="ln">4683</span><span class="c">     **
-</span></code><code id="L4684"><span class="ln">4684</span><span class="c">    <span class="s"> * </span>Return coordinates of the point located at the given length on the given path.
+</span></code><code id="L4684"><span class="ln">4684</span><span class="c">     > Parameters
 </span></code><code id="L4685"><span class="ln">4685</span><span class="c">     **
-</span></code><code id="L4686"><span class="ln">4686</span><span class="c">     > Parameters
-</span></code><code id="L4687"><span class="ln">4687</span><span class="c">     **
-</span></code><code id="L4688"><span class="ln">4688</span><span class="c">    <span class="s"> - </span>path (string) SVG path string
-</span></code><code id="L4689"><span class="ln">4689</span><span class="c">    <span class="s"> - </span>length (number)
-</span></code><code id="L4690"><span class="ln">4690</span><span class="c">     **
-</span></code><code id="L4691"><span class="ln">4691</span><span class="c">    <span class="s"> = </span>(object) representation of the point:
-</span></code><code id="L4692"><span class="ln">4692</span><span class="c">     o {
-</span></code><code id="L4693"><span class="ln">4693</span><span class="c">     o     x: (number) x coordinate
-</span></code><code id="L4694"><span class="ln">4694</span><span class="c">     o     y: (number) y coordinate
-</span></code><code id="L4695"><span class="ln">4695</span><span class="c">     o     alpha: (number) angle of derivative
-</span></code><code id="L4696"><span class="ln">4696</span><span class="c">     o }
-</span></code><code id="L4697"><span class="ln">4697</span><span class="c">    \*/</span>
-</code><code id="L4698"><span class="ln">4698</span>    R.getPointAtLength<span class="s"> = </span>getPointAtLength;
-</code><code id="L4699"><span class="ln">4699</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4700"><span class="ln">4700</span><span class="c">    <span class="s"> * </span>Raphael.getSubpath
-</span></code><code id="L4701"><span class="ln">4701</span><span class="c">     [ method ]
+</span></code><code id="L4686"><span class="ln">4686</span><span class="c">    <span class="s"> - </span>path (string) SVG path string
+</span></code><code id="L4687"><span class="ln">4687</span><span class="c">    <span class="s"> - </span>length (number)
+</span></code><code id="L4688"><span class="ln">4688</span><span class="c">     **
+</span></code><code id="L4689"><span class="ln">4689</span><span class="c">    <span class="s"> = </span>(object) representation of the point:
+</span></code><code id="L4690"><span class="ln">4690</span><span class="c">     o {
+</span></code><code id="L4691"><span class="ln">4691</span><span class="c">     o     x: (number) x coordinate
+</span></code><code id="L4692"><span class="ln">4692</span><span class="c">     o     y: (number) y coordinate
+</span></code><code id="L4693"><span class="ln">4693</span><span class="c">     o     alpha: (number) angle of derivative
+</span></code><code id="L4694"><span class="ln">4694</span><span class="c">     o }
+</span></code><code id="L4695"><span class="ln">4695</span><span class="c">    \*/</span>
+</code><code id="L4696"><span class="ln">4696</span>    R.getPointAtLength<span class="s"> = </span>getPointAtLength;
+</code><code id="L4697"><span class="ln">4697</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4698"><span class="ln">4698</span><span class="c">    <span class="s"> * </span>Raphael.getSubpath
+</span></code><code id="L4699"><span class="ln">4699</span><span class="c">     [ method ]
+</span></code><code id="L4700"><span class="ln">4700</span><span class="c">     **
+</span></code><code id="L4701"><span class="ln">4701</span><span class="c">    <span class="s"> * </span>Return subpath of a given path from given length to given length.
 </span></code><code id="L4702"><span class="ln">4702</span><span class="c">     **
-</span></code><code id="L4703"><span class="ln">4703</span><span class="c">    <span class="s"> * </span>Return subpath of a given path from given length to given length.
+</span></code><code id="L4703"><span class="ln">4703</span><span class="c">     > Parameters
 </span></code><code id="L4704"><span class="ln">4704</span><span class="c">     **
-</span></code><code id="L4705"><span class="ln">4705</span><span class="c">     > Parameters
-</span></code><code id="L4706"><span class="ln">4706</span><span class="c">     **
-</span></code><code id="L4707"><span class="ln">4707</span><span class="c">    <span class="s"> - </span>path (string) SVG path string
-</span></code><code id="L4708"><span class="ln">4708</span><span class="c">    <span class="s"> - </span>from (number) position of the start of the segment
-</span></code><code id="L4709"><span class="ln">4709</span><span class="c">    <span class="s"> - </span>to (number) position of the end of the segment
-</span></code><code id="L4710"><span class="ln">4710</span><span class="c">     **
-</span></code><code id="L4711"><span class="ln">4711</span><span class="c">    <span class="s"> = </span>(string) pathstring <b>for</b> the segment
-</span></code><code id="L4712"><span class="ln">4712</span><span class="c">    \*/</span>
-</code><code id="L4713"><span class="ln">4713</span>    R.getSubpath<span class="s"> = </span><b>function</b> (path, from, to) {
-</code><code id="L4714"><span class="ln">4714</span>        <b>if</b> (abs(<b>this</b>.getTotalLength(path)<span class="s"> - </span>to) &lt; <span class="d">1e-6</span>) {
-</code><code id="L4715"><span class="ln">4715</span>            <b>return</b> getSubpathsAtLength(path, from).end;
-</code><code id="L4716"><span class="ln">4716</span>        }
-</code><code id="L4717"><span class="ln">4717</span>        <b>var</b> a<span class="s"> = </span>getSubpathsAtLength(path, to, <span class="d">1</span>);
-</code><code id="L4718"><span class="ln">4718</span>        <b>return</b> from ? getSubpathsAtLength(a, from).end : a;
-</code><code id="L4719"><span class="ln">4719</span>    };
-</code><code id="L4720"><span class="ln">4720</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4721"><span class="ln">4721</span><span class="c">    <span class="s"> * </span>Element.getTotalLength
-</span></code><code id="L4722"><span class="ln">4722</span><span class="c">     [ method ]
-</span></code><code id="L4723"><span class="ln">4723</span><span class="c">     **
-</span></code><code id="L4724"><span class="ln">4724</span><span class="c">    <span class="s"> * </span>Returns length of the path <b>in</b> pixels. Only works <b>for</b> element of “path” type.
-</span></code><code id="L4725"><span class="ln">4725</span><span class="c">    <span class="s"> = </span>(number) length.
-</span></code><code id="L4726"><span class="ln">4726</span><span class="c">    \*/</span>
-</code><code id="L4727"><span class="ln">4727</span>    elproto.getTotalLength<span class="s"> = </span><b>function</b> () {
-</code><code id="L4728"><span class="ln">4728</span>        <b>if</b> (<b>this</b>.type != <i>"path"</i>) {<b>return</b>;}
-</code><code id="L4729"><span class="ln">4729</span>        <b>if</b> (<b>this</b>.node.getTotalLength) {
-</code><code id="L4730"><span class="ln">4730</span>            <b>return</b> <b>this</b>.node.getTotalLength();
-</code><code id="L4731"><span class="ln">4731</span>        }
-</code><code id="L4732"><span class="ln">4732</span>        <b>return</b> getTotalLength(<b>this</b>.attrs.path);
-</code><code id="L4733"><span class="ln">4733</span>    };
-</code><code id="L4734"><span class="ln">4734</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4735"><span class="ln">4735</span><span class="c">    <span class="s"> * </span>Element.getPointAtLength
-</span></code><code id="L4736"><span class="ln">4736</span><span class="c">     [ method ]
+</span></code><code id="L4705"><span class="ln">4705</span><span class="c">    <span class="s"> - </span>path (string) SVG path string
+</span></code><code id="L4706"><span class="ln">4706</span><span class="c">    <span class="s"> - </span>from (number) position of the start of the segment
+</span></code><code id="L4707"><span class="ln">4707</span><span class="c">    <span class="s"> - </span>to (number) position of the end of the segment
+</span></code><code id="L4708"><span class="ln">4708</span><span class="c">     **
+</span></code><code id="L4709"><span class="ln">4709</span><span class="c">    <span class="s"> = </span>(string) pathstring <b>for</b> the segment
+</span></code><code id="L4710"><span class="ln">4710</span><span class="c">    \*/</span>
+</code><code id="L4711"><span class="ln">4711</span>    R.getSubpath<span class="s"> = </span><b>function</b> (path, from, to) {
+</code><code id="L4712"><span class="ln">4712</span>        <b>if</b> (abs(<b>this</b>.getTotalLength(path)<span class="s"> - </span>to) &lt; <span class="d">1e-6</span>) {
+</code><code id="L4713"><span class="ln">4713</span>            <b>return</b> getSubpathsAtLength(path, from).end;
+</code><code id="L4714"><span class="ln">4714</span>        }
+</code><code id="L4715"><span class="ln">4715</span>        <b>var</b> a<span class="s"> = </span>getSubpathsAtLength(path, to, <span class="d">1</span>);
+</code><code id="L4716"><span class="ln">4716</span>        <b>return</b> from ? getSubpathsAtLength(a, from).end : a;
+</code><code id="L4717"><span class="ln">4717</span>    };
+</code><code id="L4718"><span class="ln">4718</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4719"><span class="ln">4719</span><span class="c">    <span class="s"> * </span>Element.getTotalLength
+</span></code><code id="L4720"><span class="ln">4720</span><span class="c">     [ method ]
+</span></code><code id="L4721"><span class="ln">4721</span><span class="c">     **
+</span></code><code id="L4722"><span class="ln">4722</span><span class="c">    <span class="s"> * </span>Returns length of the path <b>in</b> pixels. Only works <b>for</b> element of “path” type.
+</span></code><code id="L4723"><span class="ln">4723</span><span class="c">    <span class="s"> = </span>(number) length.
+</span></code><code id="L4724"><span class="ln">4724</span><span class="c">    \*/</span>
+</code><code id="L4725"><span class="ln">4725</span>    elproto.getTotalLength<span class="s"> = </span><b>function</b> () {
+</code><code id="L4726"><span class="ln">4726</span>        <b>if</b> (<b>this</b>.type != <i>"path"</i>) {<b>return</b>;}
+</code><code id="L4727"><span class="ln">4727</span>        <b>if</b> (<b>this</b>.node.getTotalLength) {
+</code><code id="L4728"><span class="ln">4728</span>            <b>return</b> <b>this</b>.node.getTotalLength();
+</code><code id="L4729"><span class="ln">4729</span>        }
+</code><code id="L4730"><span class="ln">4730</span>        <b>return</b> getTotalLength(<b>this</b>.attrs.path);
+</code><code id="L4731"><span class="ln">4731</span>    };
+</code><code id="L4732"><span class="ln">4732</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4733"><span class="ln">4733</span><span class="c">    <span class="s"> * </span>Element.getPointAtLength
+</span></code><code id="L4734"><span class="ln">4734</span><span class="c">     [ method ]
+</span></code><code id="L4735"><span class="ln">4735</span><span class="c">     **
+</span></code><code id="L4736"><span class="ln">4736</span><span class="c">    <span class="s"> * </span>Return coordinates of the point located at the given length on the given path. Only works <b>for</b> element of “path” type.
 </span></code><code id="L4737"><span class="ln">4737</span><span class="c">     **
-</span></code><code id="L4738"><span class="ln">4738</span><span class="c">    <span class="s"> * </span>Return coordinates of the point located at the given length on the given path. Only works <b>for</b> element of “path” type.
+</span></code><code id="L4738"><span class="ln">4738</span><span class="c">     > Parameters
 </span></code><code id="L4739"><span class="ln">4739</span><span class="c">     **
-</span></code><code id="L4740"><span class="ln">4740</span><span class="c">     > Parameters
+</span></code><code id="L4740"><span class="ln">4740</span><span class="c">    <span class="s"> - </span>length (number)
 </span></code><code id="L4741"><span class="ln">4741</span><span class="c">     **
-</span></code><code id="L4742"><span class="ln">4742</span><span class="c">    <span class="s"> - </span>length (number)
-</span></code><code id="L4743"><span class="ln">4743</span><span class="c">     **
-</span></code><code id="L4744"><span class="ln">4744</span><span class="c">    <span class="s"> = </span>(object) representation of the point:
-</span></code><code id="L4745"><span class="ln">4745</span><span class="c">     o {
-</span></code><code id="L4746"><span class="ln">4746</span><span class="c">     o     x: (number) x coordinate
-</span></code><code id="L4747"><span class="ln">4747</span><span class="c">     o     y: (number) y coordinate
-</span></code><code id="L4748"><span class="ln">4748</span><span class="c">     o     alpha: (number) angle of derivative
-</span></code><code id="L4749"><span class="ln">4749</span><span class="c">     o }
-</span></code><code id="L4750"><span class="ln">4750</span><span class="c">    \*/</span>
-</code><code id="L4751"><span class="ln">4751</span>    elproto.getPointAtLength<span class="s"> = </span><b>function</b> (length) {
-</code><code id="L4752"><span class="ln">4752</span>        <b>if</b> (<b>this</b>.type != <i>"path"</i>) {<b>return</b>;}
-</code><code id="L4753"><span class="ln">4753</span>        <b>return</b> getPointAtLength(<b>this</b>.attrs.path, length);
-</code><code id="L4754"><span class="ln">4754</span>    };
-</code><code id="L4755"><span class="ln">4755</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4756"><span class="ln">4756</span><span class="c">    <span class="s"> * </span>Element.getSubpath
-</span></code><code id="L4757"><span class="ln">4757</span><span class="c">     [ method ]
+</span></code><code id="L4742"><span class="ln">4742</span><span class="c">    <span class="s"> = </span>(object) representation of the point:
+</span></code><code id="L4743"><span class="ln">4743</span><span class="c">     o {
+</span></code><code id="L4744"><span class="ln">4744</span><span class="c">     o     x: (number) x coordinate
+</span></code><code id="L4745"><span class="ln">4745</span><span class="c">     o     y: (number) y coordinate
+</span></code><code id="L4746"><span class="ln">4746</span><span class="c">     o     alpha: (number) angle of derivative
+</span></code><code id="L4747"><span class="ln">4747</span><span class="c">     o }
+</span></code><code id="L4748"><span class="ln">4748</span><span class="c">    \*/</span>
+</code><code id="L4749"><span class="ln">4749</span>    elproto.getPointAtLength<span class="s"> = </span><b>function</b> (length) {
+</code><code id="L4750"><span class="ln">4750</span>        <b>if</b> (<b>this</b>.type != <i>"path"</i>) {<b>return</b>;}
+</code><code id="L4751"><span class="ln">4751</span>        <b>return</b> getPointAtLength(<b>this</b>.attrs.path, length);
+</code><code id="L4752"><span class="ln">4752</span>    };
+</code><code id="L4753"><span class="ln">4753</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4754"><span class="ln">4754</span><span class="c">    <span class="s"> * </span>Element.getSubpath
+</span></code><code id="L4755"><span class="ln">4755</span><span class="c">     [ method ]
+</span></code><code id="L4756"><span class="ln">4756</span><span class="c">     **
+</span></code><code id="L4757"><span class="ln">4757</span><span class="c">    <span class="s"> * </span>Return subpath of a given element from given length to given length. Only works <b>for</b> element of “path” type.
 </span></code><code id="L4758"><span class="ln">4758</span><span class="c">     **
-</span></code><code id="L4759"><span class="ln">4759</span><span class="c">    <span class="s"> * </span>Return subpath of a given element from given length to given length. Only works <b>for</b> element of “path” type.
+</span></code><code id="L4759"><span class="ln">4759</span><span class="c">     > Parameters
 </span></code><code id="L4760"><span class="ln">4760</span><span class="c">     **
-</span></code><code id="L4761"><span class="ln">4761</span><span class="c">     > Parameters
-</span></code><code id="L4762"><span class="ln">4762</span><span class="c">     **
-</span></code><code id="L4763"><span class="ln">4763</span><span class="c">    <span class="s"> - </span>from (number) position of the start of the segment
-</span></code><code id="L4764"><span class="ln">4764</span><span class="c">    <span class="s"> - </span>to (number) position of the end of the segment
-</span></code><code id="L4765"><span class="ln">4765</span><span class="c">     **
-</span></code><code id="L4766"><span class="ln">4766</span><span class="c">    <span class="s"> = </span>(string) pathstring <b>for</b> the segment
-</span></code><code id="L4767"><span class="ln">4767</span><span class="c">    \*/</span>
-</code><code id="L4768"><span class="ln">4768</span>    elproto.getSubpath<span class="s"> = </span><b>function</b> (from, to) {
-</code><code id="L4769"><span class="ln">4769</span>        <b>if</b> (<b>this</b>.type != <i>"path"</i>) {<b>return</b>;}
-</code><code id="L4770"><span class="ln">4770</span>        <b>return</b> R.getSubpath(<b>this</b>.attrs.path, from, to);
-</code><code id="L4771"><span class="ln">4771</span>    };
-</code><code id="L4772"><span class="ln">4772</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4773"><span class="ln">4773</span><span class="c">    <span class="s"> * </span>Raphael.easing_formulas
-</span></code><code id="L4774"><span class="ln">4774</span><span class="c">     [ property ]
-</span></code><code id="L4775"><span class="ln">4775</span><span class="c">     **
-</span></code><code id="L4776"><span class="ln">4776</span><span class="c">    <span class="s"> * </span>Object that contains easing formulas <b>for</b> animation. You could extend it <b>with</b> your owns. By <b>default</b> it has following list of easing:
-</span></code><code id="L4777"><span class="ln">4777</span><span class="c">     # &lt;ul>
-</span></code><code id="L4778"><span class="ln">4778</span><span class="c">     #     &lt;li>“linear”&lt;/li>
-</span></code><code id="L4779"><span class="ln">4779</span><span class="c">     #     &lt;li>“&lt;” or “easeIn” or “ease-<b>in</b>”&lt;/li>
-</span></code><code id="L4780"><span class="ln">4780</span><span class="c">     #     &lt;li>“>” or “easeOut” or “ease-out”&lt;/li>
-</span></code><code id="L4781"><span class="ln">4781</span><span class="c">     #     &lt;li>“&lt;>” or “easeInOut” or “ease-<b>in</b>-out”&lt;/li>
-</span></code><code id="L4782"><span class="ln">4782</span><span class="c">     #     &lt;li>“backIn” or “back-<b>in</b>”&lt;/li>
-</span></code><code id="L4783"><span class="ln">4783</span><span class="c">     #     &lt;li>“backOut” or “back-out”&lt;/li>
-</span></code><code id="L4784"><span class="ln">4784</span><span class="c">     #     &lt;li>“elastic”&lt;/li>
-</span></code><code id="L4785"><span class="ln">4785</span><span class="c">     #     &lt;li>“bounce”&lt;/li>
-</span></code><code id="L4786"><span class="ln">4786</span><span class="c">     # &lt;/ul>
-</span></code><code id="L4787"><span class="ln">4787</span><span class="c">     # &lt;p>See also &lt;a href=<i>"http:<span class="c">//raphaeljs.com/easing.html"</i>>Easing demo&lt;/a>.&lt;/p></span>
-</span></code><code id="L4788"><span class="ln">4788</span><span class="c">    \*/</span>
-</code><code id="L4789"><span class="ln">4789</span>    <b>var</b> ef<span class="s"> = </span>R.easing_formulas<span class="s"> = </span>{
-</code><code id="L4790"><span class="ln">4790</span>        linear: <b>function</b> (n) {
-</code><code id="L4791"><span class="ln">4791</span>            <b>return</b> n;
-</code><code id="L4792"><span class="ln">4792</span>        },
-</code><code id="L4793"><span class="ln">4793</span>        <i>"&lt;"</i>: <b>function</b> (n) {
-</code><code id="L4794"><span class="ln">4794</span>            <b>return</b> pow(n, <span class="d">1.7</span>);
-</code><code id="L4795"><span class="ln">4795</span>        },
-</code><code id="L4796"><span class="ln">4796</span>        <i>">"</i>: <b>function</b> (n) {
-</code><code id="L4797"><span class="ln">4797</span>            <b>return</b> pow(n, <span class="d">.48</span>);
-</code><code id="L4798"><span class="ln">4798</span>        },
-</code><code id="L4799"><span class="ln">4799</span>        <i>"&lt;>"</i>: <b>function</b> (n) {
-</code><code id="L4800"><span class="ln">4800</span>            <b>var</b> q<span class="s"> = </span><span class="d">.48</span><span class="s"> - </span>n<span class="s"> / </span><span class="d">1.04</span>,
-</code><code id="L4801"><span class="ln">4801</span>                Q<span class="s"> = </span>math.sqrt(<span class="d">.1734</span><span class="s"> + </span>q<span class="s"> * </span>q),
-</code><code id="L4802"><span class="ln">4802</span>                x<span class="s"> = </span>Q<span class="s"> - </span>q,
-</code><code id="L4803"><span class="ln">4803</span>                X<span class="s"> = </span>pow(abs(x), <span class="d">1</span><span class="s"> / </span><span class="d">3</span>)<span class="s"> * </span>(x &lt; <span class="d">0</span> ? -<span class="d">1</span> : <span class="d">1</span>),
-</code><code id="L4804"><span class="ln">4804</span>                y<span class="s"> = </span>-Q<span class="s"> - </span>q,
-</code><code id="L4805"><span class="ln">4805</span>                Y<span class="s"> = </span>pow(abs(y), <span class="d">1</span><span class="s"> / </span><span class="d">3</span>)<span class="s"> * </span>(y &lt; <span class="d">0</span> ? -<span class="d">1</span> : <span class="d">1</span>),
-</code><code id="L4806"><span class="ln">4806</span>                t<span class="s"> = </span>X<span class="s"> + </span>Y<span class="s"> + </span><span class="d">.5</span>;
-</code><code id="L4807"><span class="ln">4807</span>            <b>return</b> (<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>t;
-</code><code id="L4808"><span class="ln">4808</span>        },
-</code><code id="L4809"><span class="ln">4809</span>        backIn: <b>function</b> (n) {
-</code><code id="L4810"><span class="ln">4810</span>            <b>var</b> s<span class="s"> = </span><span class="d">1.70158</span>;
-</code><code id="L4811"><span class="ln">4811</span>            <b>return</b> n<span class="s"> * </span>n<span class="s"> * </span>((s<span class="s"> + </span><span class="d">1</span>)<span class="s"> * </span>n<span class="s"> - </span>s);
-</code><code id="L4812"><span class="ln">4812</span>        },
-</code><code id="L4813"><span class="ln">4813</span>        backOut: <b>function</b> (n) {
-</code><code id="L4814"><span class="ln">4814</span>            n<span class="s"> = </span>n<span class="s"> - </span><span class="d">1</span>;
-</code><code id="L4815"><span class="ln">4815</span>            <b>var</b> s<span class="s"> = </span><span class="d">1.70158</span>;
-</code><code id="L4816"><span class="ln">4816</span>            <b>return</b> n<span class="s"> * </span>n<span class="s"> * </span>((s<span class="s"> + </span><span class="d">1</span>)<span class="s"> * </span>n<span class="s"> + </span>s)<span class="s"> + </span><span class="d">1</span>;
-</code><code id="L4817"><span class="ln">4817</span>        },
-</code><code id="L4818"><span class="ln">4818</span>        elastic: <b>function</b> (n) {
-</code><code id="L4819"><span class="ln">4819</span>            <b>if</b> (n<span class="s"> == </span>!!n) {
-</code><code id="L4820"><span class="ln">4820</span>                <b>return</b> n;
-</code><code id="L4821"><span class="ln">4821</span>            }
-</code><code id="L4822"><span class="ln">4822</span>            <b>return</b> pow(<span class="d">2</span>, -<span class="d">10</span><span class="s"> * </span>n)<span class="s"> * </span>math.sin((n<span class="s"> - </span><span class="d">.075</span>)<span class="s"> * </span>(<span class="d">2</span><span class="s"> * </span>PI)<span class="s"> / </span><span class="d">.3</span>)<span class="s"> + </span><span class="d">1</span>;
-</code><code id="L4823"><span class="ln">4823</span>        },
-</code><code id="L4824"><span class="ln">4824</span>        bounce: <b>function</b> (n) {
-</code><code id="L4825"><span class="ln">4825</span>            <b>var</b> s<span class="s"> = </span><span class="d">7.5625</span>,
-</code><code id="L4826"><span class="ln">4826</span>                p<span class="s"> = </span><span class="d">2.75</span>,
-</code><code id="L4827"><span class="ln">4827</span>                l;
-</code><code id="L4828"><span class="ln">4828</span>            <b>if</b> (n &lt; (<span class="d">1</span><span class="s"> / </span>p)) {
-</code><code id="L4829"><span class="ln">4829</span>                l<span class="s"> = </span>s<span class="s"> * </span>n<span class="s"> * </span>n;
-</code><code id="L4830"><span class="ln">4830</span>            } <b>else</b> {
-</code><code id="L4831"><span class="ln">4831</span>                <b>if</b> (n &lt; (<span class="d">2</span><span class="s"> / </span>p)) {
-</code><code id="L4832"><span class="ln">4832</span>                    n -= (<span class="d">1.5</span><span class="s"> / </span>p);
-</code><code id="L4833"><span class="ln">4833</span>                    l<span class="s"> = </span>s<span class="s"> * </span>n<span class="s"> * </span>n<span class="s"> + </span><span class="d">.75</span>;
-</code><code id="L4834"><span class="ln">4834</span>                } <b>else</b> {
-</code><code id="L4835"><span class="ln">4835</span>                    <b>if</b> (n &lt; (<span class="d">2.5</span><span class="s"> / </span>p)) {
-</code><code id="L4836"><span class="ln">4836</span>                        n -= (<span class="d">2.25</span><span class="s"> / </span>p);
-</code><code id="L4837"><span class="ln">4837</span>                        l<span class="s"> = </span>s<span class="s"> * </span>n<span class="s"> * </span>n<span class="s"> + </span><span class="d">.9375</span>;
-</code><code id="L4838"><span class="ln">4838</span>                    } <b>else</b> {
-</code><code id="L4839"><span class="ln">4839</span>                        n -= (<span class="d">2.625</span><span class="s"> / </span>p);
-</code><code id="L4840"><span class="ln">4840</span>                        l<span class="s"> = </span>s<span class="s"> * </span>n<span class="s"> * </span>n<span class="s"> + </span><span class="d">.984375</span>;
-</code><code id="L4841"><span class="ln">4841</span>                    }
-</code><code id="L4842"><span class="ln">4842</span>                }
-</code><code id="L4843"><span class="ln">4843</span>            }
-</code><code id="L4844"><span class="ln">4844</span>            <b>return</b> l;
-</code><code id="L4845"><span class="ln">4845</span>        }
-</code><code id="L4846"><span class="ln">4846</span>    };
-</code><code id="L4847"><span class="ln">4847</span>    ef.easeIn<span class="s"> = </span>ef[<i>"ease-<b>in</b>"</i>]<span class="s"> = </span>ef[<i>"&lt;"</i>];
-</code><code id="L4848"><span class="ln">4848</span>    ef.easeOut<span class="s"> = </span>ef[<i>"ease-out"</i>]<span class="s"> = </span>ef[<i>">"</i>];
-</code><code id="L4849"><span class="ln">4849</span>    ef.easeInOut<span class="s"> = </span>ef[<i>"ease-<b>in</b>-out"</i>]<span class="s"> = </span>ef[<i>"&lt;>"</i>];
-</code><code id="L4850"><span class="ln">4850</span>    ef[<i>"back-<b>in</b>"</i>]<span class="s"> = </span>ef.backIn;
-</code><code id="L4851"><span class="ln">4851</span>    ef[<i>"back-out"</i>]<span class="s"> = </span>ef.backOut;
-</code><code id="L4852"><span class="ln">4852</span>
-</code><code id="L4853"><span class="ln">4853</span>    <b>var</b> animationElements<span class="s"> = </span>[],
-</code><code id="L4854"><span class="ln">4854</span>        requestAnimFrame<span class="s"> = </span>window.requestAnimationFrame       ||
-</code><code id="L4855"><span class="ln">4855</span>                           window.webkitRequestAnimationFrame ||
-</code><code id="L4856"><span class="ln">4856</span>                           window.mozRequestAnimationFrame    ||
-</code><code id="L4857"><span class="ln">4857</span>                           window.oRequestAnimationFrame      ||
-</code><code id="L4858"><span class="ln">4858</span>                           window.msRequestAnimationFrame     ||
-</code><code id="L4859"><span class="ln">4859</span>                           <b>function</b> (callback) {
-</code><code id="L4860"><span class="ln">4860</span>                               setTimeout(callback, <span class="d">16</span>);
-</code><code id="L4861"><span class="ln">4861</span>                           },
-</code><code id="L4862"><span class="ln">4862</span>        animation<span class="s"> = </span><b>function</b> () {
-</code><code id="L4863"><span class="ln">4863</span>            <b>var</b> Now<span class="s"> = </span>+<b>new</b> Date,
-</code><code id="L4864"><span class="ln">4864</span>                l<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L4865"><span class="ln">4865</span>            <b>for</b> (; l &lt; animationElements.length; l++) {
-</code><code id="L4866"><span class="ln">4866</span>                <b>var</b> e<span class="s"> = </span>animationElements[l];
-</code><code id="L4867"><span class="ln">4867</span>                <b>if</b> (e.el.removed<span class="s"> || </span>e.paused) {
-</code><code id="L4868"><span class="ln">4868</span>                    <b>continue</b>;
-</code><code id="L4869"><span class="ln">4869</span>                }
-</code><code id="L4870"><span class="ln">4870</span>                <b>var</b> time<span class="s"> = </span>Now<span class="s"> - </span>e.start,
-</code><code id="L4871"><span class="ln">4871</span>                    ms<span class="s"> = </span>e.ms,
-</code><code id="L4872"><span class="ln">4872</span>                    easing<span class="s"> = </span>e.easing,
-</code><code id="L4873"><span class="ln">4873</span>                    from<span class="s"> = </span>e.from,
-</code><code id="L4874"><span class="ln">4874</span>                    diff<span class="s"> = </span>e.diff,
-</code><code id="L4875"><span class="ln">4875</span>                    to<span class="s"> = </span>e.to,
-</code><code id="L4876"><span class="ln">4876</span>                    t<span class="s"> = </span>e.t,
-</code><code id="L4877"><span class="ln">4877</span>                    that<span class="s"> = </span>e.el,
-</code><code id="L4878"><span class="ln">4878</span>                    set<span class="s"> = </span>{},
-</code><code id="L4879"><span class="ln">4879</span>                    now;
-</code><code id="L4880"><span class="ln">4880</span>                <b>if</b> (e.initstatus) {
-</code><code id="L4881"><span class="ln">4881</span>                    time<span class="s"> = </span>(e.initstatus<span class="s"> * </span>e.anim.top<span class="s"> - </span>e.prev)<span class="s"> / </span>(e.percent<span class="s"> - </span>e.prev)<span class="s"> * </span>ms;
-</code><code id="L4882"><span class="ln">4882</span>                    e.status<span class="s"> = </span>e.initstatus;
-</code><code id="L4883"><span class="ln">4883</span>                    <b>delete</b> e.initstatus;
-</code><code id="L4884"><span class="ln">4884</span>                    e.stop<span class="s"> &amp;&amp; </span>animationElements.splice(l--, <span class="d">1</span>);
-</code><code id="L4885"><span class="ln">4885</span>                } <b>else</b> {
-</code><code id="L4886"><span class="ln">4886</span>                    e.status<span class="s"> = </span>(e.prev<span class="s"> + </span>(e.percent<span class="s"> - </span>e.prev)<span class="s"> * </span>(time<span class="s"> / </span>ms))<span class="s"> / </span>e.anim.top;
-</code><code id="L4887"><span class="ln">4887</span>                }
-</code><code id="L4888"><span class="ln">4888</span>                <b>if</b> (time &lt; <span class="d">0</span>) {
-</code><code id="L4889"><span class="ln">4889</span>                    <b>continue</b>;
-</code><code id="L4890"><span class="ln">4890</span>                }
-</code><code id="L4891"><span class="ln">4891</span>                <b>if</b> (time &lt; ms) {
-</code><code id="L4892"><span class="ln">4892</span>                    <b>var</b> pos<span class="s"> = </span>easing(time<span class="s"> / </span>ms);
-</code><code id="L4893"><span class="ln">4893</span>                    <b>for</b> (<b>var</b> attr <b>in</b> from) <b>if</b> (from[has](attr)) {
-</code><code id="L4894"><span class="ln">4894</span>                        <b>switch</b> (availableAnimAttrs[attr]) {
-</code><code id="L4895"><span class="ln">4895</span>                            <b>case</b> nu:
-</code><code id="L4896"><span class="ln">4896</span>                                now<span class="s"> = </span>+from[attr]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr];
-</code><code id="L4897"><span class="ln">4897</span>                                <b>break</b>;
-</code><code id="L4898"><span class="ln">4898</span>                            <b>case</b> <i>"colour"</i>:
-</code><code id="L4899"><span class="ln">4899</span>                                now<span class="s"> = </span><i>"rgb("</i><span class="s"> + </span>[
-</code><code id="L4900"><span class="ln">4900</span>                                    upto255(round(from[attr].r<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr].r)),
-</code><code id="L4901"><span class="ln">4901</span>                                    upto255(round(from[attr].g<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr].g)),
-</code><code id="L4902"><span class="ln">4902</span>                                    upto255(round(from[attr].b<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr].b))
-</code><code id="L4903"><span class="ln">4903</span>                                ].join(<i>","</i>)<span class="s"> + </span><i>")"</i>;
-</code><code id="L4904"><span class="ln">4904</span>                                <b>break</b>;
-</code><code id="L4905"><span class="ln">4905</span>                            <b>case</b> <i>"path"</i>:
-</code><code id="L4906"><span class="ln">4906</span>                                now<span class="s"> = </span>[];
-</code><code id="L4907"><span class="ln">4907</span>                                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>from[attr].length; i &lt; ii; i++) {
-</code><code id="L4908"><span class="ln">4908</span>                                    now[i]<span class="s"> = </span>[from[attr][i][<span class="d">0</span>]];
-</code><code id="L4909"><span class="ln">4909</span>                                    <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>from[attr][i].length; j &lt; jj; j++) {
-</code><code id="L4910"><span class="ln">4910</span>                                        now[i][j]<span class="s"> = </span>+from[attr][i][j]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i][j];
-</code><code id="L4911"><span class="ln">4911</span>                                    }
-</code><code id="L4912"><span class="ln">4912</span>                                    now[i]<span class="s"> = </span>now[i].join(S);
-</code><code id="L4913"><span class="ln">4913</span>                                }
-</code><code id="L4914"><span class="ln">4914</span>                                now<span class="s"> = </span>now.join(S);
-</code><code id="L4915"><span class="ln">4915</span>                                <b>break</b>;
-</code><code id="L4916"><span class="ln">4916</span>                            <b>case</b> <i>"transform"</i>:
-</code><code id="L4917"><span class="ln">4917</span>                                <b>if</b> (diff[attr].real) {
-</code><code id="L4918"><span class="ln">4918</span>                                    now<span class="s"> = </span>[];
-</code><code id="L4919"><span class="ln">4919</span>                                    <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>from[attr].length; i &lt; ii; i++) {
-</code><code id="L4920"><span class="ln">4920</span>                                        now[i]<span class="s"> = </span>[from[attr][i][<span class="d">0</span>]];
-</code><code id="L4921"><span class="ln">4921</span>                                        <b>for</b> (j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>from[attr][i].length; j &lt; jj; j++) {
-</code><code id="L4922"><span class="ln">4922</span>                                            now[i][j]<span class="s"> = </span>from[attr][i][j]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i][j];
-</code><code id="L4923"><span class="ln">4923</span>                                        }
-</code><code id="L4924"><span class="ln">4924</span>                                    }
-</code><code id="L4925"><span class="ln">4925</span>                                } <b>else</b> {
-</code><code id="L4926"><span class="ln">4926</span>                                    <b>var</b> get<span class="s"> = </span><b>function</b> (i) {
-</code><code id="L4927"><span class="ln">4927</span>                                        <b>return</b> +from[attr][i]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i];
-</code><code id="L4928"><span class="ln">4928</span>                                    };
-</code><code id="L4929"><span class="ln">4929</span>                                    <span class="c">// now<span class="s"> = </span>[[<i>"r"</i>, get(<span class="d">2</span>), <span class="d">0</span>, <span class="d">0</span>], [<i>"t"</i>, get(<span class="d">3</span>), get(<span class="d">4</span>)], [<i>"s"</i>, get(<span class="d">0</span>), get(<span class="d">1</span>), <span class="d">0</span>, <span class="d">0</span>]];</span>
-</code><code id="L4930"><span class="ln">4930</span>                                    now<span class="s"> = </span>[[<i>"m"</i>, get(<span class="d">0</span>), get(<span class="d">1</span>), get(<span class="d">2</span>), get(<span class="d">3</span>), get(<span class="d">4</span>), get(<span class="d">5</span>)]];
-</code><code id="L4931"><span class="ln">4931</span>                                }
-</code><code id="L4932"><span class="ln">4932</span>                                <b>break</b>;
-</code><code id="L4933"><span class="ln">4933</span>                            <b>case</b> <i>"csv"</i>:
-</code><code id="L4934"><span class="ln">4934</span>                                <b>if</b> (attr<span class="s"> == </span><i>"clip-rect"</i>) {
-</code><code id="L4935"><span class="ln">4935</span>                                    now<span class="s"> = </span>[];
-</code><code id="L4936"><span class="ln">4936</span>                                    i<span class="s"> = </span><span class="d">4</span>;
-</code><code id="L4937"><span class="ln">4937</span>                                    <b>while</b> (i--) {
-</code><code id="L4938"><span class="ln">4938</span>                                        now[i]<span class="s"> = </span>+from[attr][i]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i];
-</code><code id="L4939"><span class="ln">4939</span>                                    }
-</code><code id="L4940"><span class="ln">4940</span>                                }
-</code><code id="L4941"><span class="ln">4941</span>                                <b>break</b>;
-</code><code id="L4942"><span class="ln">4942</span>                            <b>default</b>:
-</code><code id="L4943"><span class="ln">4943</span>                                <b>var</b> from2<span class="s"> = </span>[].concat(from[attr]);
-</code><code id="L4944"><span class="ln">4944</span>                                now<span class="s"> = </span>[];
-</code><code id="L4945"><span class="ln">4945</span>                                i<span class="s"> = </span>that.paper.customAttributes[attr].length;
-</code><code id="L4946"><span class="ln">4946</span>                                <b>while</b> (i--) {
-</code><code id="L4947"><span class="ln">4947</span>                                    now[i]<span class="s"> = </span>+from2[i]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i];
-</code><code id="L4948"><span class="ln">4948</span>                                }
-</code><code id="L4949"><span class="ln">4949</span>                                <b>break</b>;
-</code><code id="L4950"><span class="ln">4950</span>                        }
-</code><code id="L4951"><span class="ln">4951</span>                        set[attr]<span class="s"> = </span>now;
-</code><code id="L4952"><span class="ln">4952</span>                    }
-</code><code id="L4953"><span class="ln">4953</span>                    that.attr(set);
-</code><code id="L4954"><span class="ln">4954</span>                    (<b>function</b> (id, that, anim) {
-</code><code id="L4955"><span class="ln">4955</span>                        setTimeout(<b>function</b> () {
-</code><code id="L4956"><span class="ln">4956</span>                            eve(<i>"anim.frame."</i><span class="s"> + </span>id, that, anim);
-</code><code id="L4957"><span class="ln">4957</span>                        });
-</code><code id="L4958"><span class="ln">4958</span>                    })(that.id, that, e.anim);
-</code><code id="L4959"><span class="ln">4959</span>                } <b>else</b> {
-</code><code id="L4960"><span class="ln">4960</span>                    (<b>function</b>(f, el, a) {
-</code><code id="L4961"><span class="ln">4961</span>                        setTimeout(<b>function</b>() {
-</code><code id="L4962"><span class="ln">4962</span>                            eve(<i>"anim.finish."</i><span class="s"> + </span>el.id, el, a);
-</code><code id="L4963"><span class="ln">4963</span>                            R.is(f, <i>"<b>function</b>"</i>)<span class="s"> &amp;&amp; </span>f.call(el);
-</code><code id="L4964"><span class="ln">4964</span>                        });
-</code><code id="L4965"><span class="ln">4965</span>                    })(e.callback, that, e.anim);
-</code><code id="L4966"><span class="ln">4966</span>                    <b>if</b> (--e.repeat) {
-</code><code id="L4967"><span class="ln">4967</span>                        that.attr(e.origin);
-</code><code id="L4968"><span class="ln">4968</span>                        e.start<span class="s"> = </span>Now;
-</code><code id="L4969"><span class="ln">4969</span>                    } <b>else</b> {
-</code><code id="L4970"><span class="ln">4970</span>                        that.attr(to);
-</code><code id="L4971"><span class="ln">4971</span>                        animationElements.splice(l--, <span class="d">1</span>);
-</code><code id="L4972"><span class="ln">4972</span>                    }
-</code><code id="L4973"><span class="ln">4973</span>                    <b>if</b> (e.next<span class="s"> &amp;&amp; </span>!e.stop) {
-</code><code id="L4974"><span class="ln">4974</span>                        runAnimation(e.anim, e.el, e.next, <b>null</b>, e.totalOrigin);
-</code><code id="L4975"><span class="ln">4975</span>                    }
-</code><code id="L4976"><span class="ln">4976</span>                }
-</code><code id="L4977"><span class="ln">4977</span>            }
-</code><code id="L4978"><span class="ln">4978</span>            R.svg<span class="s"> &amp;&amp; </span>that<span class="s"> &amp;&amp; </span>that.paper<span class="s"> &amp;&amp; </span>that.paper.safari();
-</code><code id="L4979"><span class="ln">4979</span>            animationElements.length<span class="s"> &amp;&amp; </span>requestAnimFrame(animation);
-</code><code id="L4980"><span class="ln">4980</span>        },
-</code><code id="L4981"><span class="ln">4981</span>        upto255<span class="s"> = </span><b>function</b> (color) {
-</code><code id="L4982"><span class="ln">4982</span>            <b>return</b> mmax(mmin(color, <span class="d">255</span>), <span class="d">0</span>);
-</code><code id="L4983"><span class="ln">4983</span>        };
-</code><code id="L4984"><span class="ln">4984</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L4985"><span class="ln">4985</span><span class="c">    <span class="s"> * </span>Element.animateWith
-</span></code><code id="L4986"><span class="ln">4986</span><span class="c">     [ method ]
+</span></code><code id="L4761"><span class="ln">4761</span><span class="c">    <span class="s"> - </span>from (number) position of the start of the segment
+</span></code><code id="L4762"><span class="ln">4762</span><span class="c">    <span class="s"> - </span>to (number) position of the end of the segment
+</span></code><code id="L4763"><span class="ln">4763</span><span class="c">     **
+</span></code><code id="L4764"><span class="ln">4764</span><span class="c">    <span class="s"> = </span>(string) pathstring <b>for</b> the segment
+</span></code><code id="L4765"><span class="ln">4765</span><span class="c">    \*/</span>
+</code><code id="L4766"><span class="ln">4766</span>    elproto.getSubpath<span class="s"> = </span><b>function</b> (from, to) {
+</code><code id="L4767"><span class="ln">4767</span>        <b>if</b> (<b>this</b>.type != <i>"path"</i>) {<b>return</b>;}
+</code><code id="L4768"><span class="ln">4768</span>        <b>return</b> R.getSubpath(<b>this</b>.attrs.path, from, to);
+</code><code id="L4769"><span class="ln">4769</span>    };
+</code><code id="L4770"><span class="ln">4770</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4771"><span class="ln">4771</span><span class="c">    <span class="s"> * </span>Raphael.easing_formulas
+</span></code><code id="L4772"><span class="ln">4772</span><span class="c">     [ property ]
+</span></code><code id="L4773"><span class="ln">4773</span><span class="c">     **
+</span></code><code id="L4774"><span class="ln">4774</span><span class="c">    <span class="s"> * </span>Object that contains easing formulas <b>for</b> animation. You could extend it <b>with</b> your own. By <b>default</b> it has following list of easing:
+</span></code><code id="L4775"><span class="ln">4775</span><span class="c">     # &lt;ul>
+</span></code><code id="L4776"><span class="ln">4776</span><span class="c">     #     &lt;li>“linear”&lt;/li>
+</span></code><code id="L4777"><span class="ln">4777</span><span class="c">     #     &lt;li>“&lt;” or “easeIn” or “ease-<b>in</b>”&lt;/li>
+</span></code><code id="L4778"><span class="ln">4778</span><span class="c">     #     &lt;li>“>” or “easeOut” or “ease-out”&lt;/li>
+</span></code><code id="L4779"><span class="ln">4779</span><span class="c">     #     &lt;li>“&lt;>” or “easeInOut” or “ease-<b>in</b>-out”&lt;/li>
+</span></code><code id="L4780"><span class="ln">4780</span><span class="c">     #     &lt;li>“backIn” or “back-<b>in</b>”&lt;/li>
+</span></code><code id="L4781"><span class="ln">4781</span><span class="c">     #     &lt;li>“backOut” or “back-out”&lt;/li>
+</span></code><code id="L4782"><span class="ln">4782</span><span class="c">     #     &lt;li>“elastic”&lt;/li>
+</span></code><code id="L4783"><span class="ln">4783</span><span class="c">     #     &lt;li>“bounce”&lt;/li>
+</span></code><code id="L4784"><span class="ln">4784</span><span class="c">     # &lt;/ul>
+</span></code><code id="L4785"><span class="ln">4785</span><span class="c">     # &lt;p>See also &lt;a href=<i>"http:<span class="c">//raphaeljs.com/easing.html"</i>>Easing demo&lt;/a>.&lt;/p></span>
+</span></code><code id="L4786"><span class="ln">4786</span><span class="c">    \*/</span>
+</code><code id="L4787"><span class="ln">4787</span>    <b>var</b> ef<span class="s"> = </span>R.easing_formulas<span class="s"> = </span>{
+</code><code id="L4788"><span class="ln">4788</span>        linear: <b>function</b> (n) {
+</code><code id="L4789"><span class="ln">4789</span>            <b>return</b> n;
+</code><code id="L4790"><span class="ln">4790</span>        },
+</code><code id="L4791"><span class="ln">4791</span>        <i>"&lt;"</i>: <b>function</b> (n) {
+</code><code id="L4792"><span class="ln">4792</span>            <b>return</b> pow(n, <span class="d">1.7</span>);
+</code><code id="L4793"><span class="ln">4793</span>        },
+</code><code id="L4794"><span class="ln">4794</span>        <i>">"</i>: <b>function</b> (n) {
+</code><code id="L4795"><span class="ln">4795</span>            <b>return</b> pow(n, <span class="d">.48</span>);
+</code><code id="L4796"><span class="ln">4796</span>        },
+</code><code id="L4797"><span class="ln">4797</span>        <i>"&lt;>"</i>: <b>function</b> (n) {
+</code><code id="L4798"><span class="ln">4798</span>            <b>var</b> q<span class="s"> = </span><span class="d">.48</span><span class="s"> - </span>n<span class="s"> / </span><span class="d">1.04</span>,
+</code><code id="L4799"><span class="ln">4799</span>                Q<span class="s"> = </span>math.sqrt(<span class="d">.1734</span><span class="s"> + </span>q<span class="s"> * </span>q),
+</code><code id="L4800"><span class="ln">4800</span>                x<span class="s"> = </span>Q<span class="s"> - </span>q,
+</code><code id="L4801"><span class="ln">4801</span>                X<span class="s"> = </span>pow(abs(x), <span class="d">1</span><span class="s"> / </span><span class="d">3</span>)<span class="s"> * </span>(x &lt; <span class="d">0</span> ? -<span class="d">1</span> : <span class="d">1</span>),
+</code><code id="L4802"><span class="ln">4802</span>                y<span class="s"> = </span>-Q<span class="s"> - </span>q,
+</code><code id="L4803"><span class="ln">4803</span>                Y<span class="s"> = </span>pow(abs(y), <span class="d">1</span><span class="s"> / </span><span class="d">3</span>)<span class="s"> * </span>(y &lt; <span class="d">0</span> ? -<span class="d">1</span> : <span class="d">1</span>),
+</code><code id="L4804"><span class="ln">4804</span>                t<span class="s"> = </span>X<span class="s"> + </span>Y<span class="s"> + </span><span class="d">.5</span>;
+</code><code id="L4805"><span class="ln">4805</span>            <b>return</b> (<span class="d">1</span><span class="s"> - </span>t)<span class="s"> * </span><span class="d">3</span><span class="s"> * </span>t<span class="s"> * </span>t<span class="s"> + </span>t<span class="s"> * </span>t<span class="s"> * </span>t;
+</code><code id="L4806"><span class="ln">4806</span>        },
+</code><code id="L4807"><span class="ln">4807</span>        backIn: <b>function</b> (n) {
+</code><code id="L4808"><span class="ln">4808</span>            <b>var</b> s<span class="s"> = </span><span class="d">1.70158</span>;
+</code><code id="L4809"><span class="ln">4809</span>            <b>return</b> n<span class="s"> * </span>n<span class="s"> * </span>((s<span class="s"> + </span><span class="d">1</span>)<span class="s"> * </span>n<span class="s"> - </span>s);
+</code><code id="L4810"><span class="ln">4810</span>        },
+</code><code id="L4811"><span class="ln">4811</span>        backOut: <b>function</b> (n) {
+</code><code id="L4812"><span class="ln">4812</span>            n<span class="s"> = </span>n<span class="s"> - </span><span class="d">1</span>;
+</code><code id="L4813"><span class="ln">4813</span>            <b>var</b> s<span class="s"> = </span><span class="d">1.70158</span>;
+</code><code id="L4814"><span class="ln">4814</span>            <b>return</b> n<span class="s"> * </span>n<span class="s"> * </span>((s<span class="s"> + </span><span class="d">1</span>)<span class="s"> * </span>n<span class="s"> + </span>s)<span class="s"> + </span><span class="d">1</span>;
+</code><code id="L4815"><span class="ln">4815</span>        },
+</code><code id="L4816"><span class="ln">4816</span>        elastic: <b>function</b> (n) {
+</code><code id="L4817"><span class="ln">4817</span>            <b>if</b> (n<span class="s"> == </span>!!n) {
+</code><code id="L4818"><span class="ln">4818</span>                <b>return</b> n;
+</code><code id="L4819"><span class="ln">4819</span>            }
+</code><code id="L4820"><span class="ln">4820</span>            <b>return</b> pow(<span class="d">2</span>, -<span class="d">10</span><span class="s"> * </span>n)<span class="s"> * </span>math.sin((n<span class="s"> - </span><span class="d">.075</span>)<span class="s"> * </span>(<span class="d">2</span><span class="s"> * </span>PI)<span class="s"> / </span><span class="d">.3</span>)<span class="s"> + </span><span class="d">1</span>;
+</code><code id="L4821"><span class="ln">4821</span>        },
+</code><code id="L4822"><span class="ln">4822</span>        bounce: <b>function</b> (n) {
+</code><code id="L4823"><span class="ln">4823</span>            <b>var</b> s<span class="s"> = </span><span class="d">7.5625</span>,
+</code><code id="L4824"><span class="ln">4824</span>                p<span class="s"> = </span><span class="d">2.75</span>,
+</code><code id="L4825"><span class="ln">4825</span>                l;
+</code><code id="L4826"><span class="ln">4826</span>            <b>if</b> (n &lt; (<span class="d">1</span><span class="s"> / </span>p)) {
+</code><code id="L4827"><span class="ln">4827</span>                l<span class="s"> = </span>s<span class="s"> * </span>n<span class="s"> * </span>n;
+</code><code id="L4828"><span class="ln">4828</span>            } <b>else</b> {
+</code><code id="L4829"><span class="ln">4829</span>                <b>if</b> (n &lt; (<span class="d">2</span><span class="s"> / </span>p)) {
+</code><code id="L4830"><span class="ln">4830</span>                    n -= (<span class="d">1.5</span><span class="s"> / </span>p);
+</code><code id="L4831"><span class="ln">4831</span>                    l<span class="s"> = </span>s<span class="s"> * </span>n<span class="s"> * </span>n<span class="s"> + </span><span class="d">.75</span>;
+</code><code id="L4832"><span class="ln">4832</span>                } <b>else</b> {
+</code><code id="L4833"><span class="ln">4833</span>                    <b>if</b> (n &lt; (<span class="d">2.5</span><span class="s"> / </span>p)) {
+</code><code id="L4834"><span class="ln">4834</span>                        n -= (<span class="d">2.25</span><span class="s"> / </span>p);
+</code><code id="L4835"><span class="ln">4835</span>                        l<span class="s"> = </span>s<span class="s"> * </span>n<span class="s"> * </span>n<span class="s"> + </span><span class="d">.9375</span>;
+</code><code id="L4836"><span class="ln">4836</span>                    } <b>else</b> {
+</code><code id="L4837"><span class="ln">4837</span>                        n -= (<span class="d">2.625</span><span class="s"> / </span>p);
+</code><code id="L4838"><span class="ln">4838</span>                        l<span class="s"> = </span>s<span class="s"> * </span>n<span class="s"> * </span>n<span class="s"> + </span><span class="d">.984375</span>;
+</code><code id="L4839"><span class="ln">4839</span>                    }
+</code><code id="L4840"><span class="ln">4840</span>                }
+</code><code id="L4841"><span class="ln">4841</span>            }
+</code><code id="L4842"><span class="ln">4842</span>            <b>return</b> l;
+</code><code id="L4843"><span class="ln">4843</span>        }
+</code><code id="L4844"><span class="ln">4844</span>    };
+</code><code id="L4845"><span class="ln">4845</span>    ef.easeIn<span class="s"> = </span>ef[<i>"ease-<b>in</b>"</i>]<span class="s"> = </span>ef[<i>"&lt;"</i>];
+</code><code id="L4846"><span class="ln">4846</span>    ef.easeOut<span class="s"> = </span>ef[<i>"ease-out"</i>]<span class="s"> = </span>ef[<i>">"</i>];
+</code><code id="L4847"><span class="ln">4847</span>    ef.easeInOut<span class="s"> = </span>ef[<i>"ease-<b>in</b>-out"</i>]<span class="s"> = </span>ef[<i>"&lt;>"</i>];
+</code><code id="L4848"><span class="ln">4848</span>    ef[<i>"back-<b>in</b>"</i>]<span class="s"> = </span>ef.backIn;
+</code><code id="L4849"><span class="ln">4849</span>    ef[<i>"back-out"</i>]<span class="s"> = </span>ef.backOut;
+</code><code id="L4850"><span class="ln">4850</span>
+</code><code id="L4851"><span class="ln">4851</span>    <b>var</b> animationElements<span class="s"> = </span>[],
+</code><code id="L4852"><span class="ln">4852</span>        requestAnimFrame<span class="s"> = </span>window.requestAnimationFrame       ||
+</code><code id="L4853"><span class="ln">4853</span>                           window.webkitRequestAnimationFrame ||
+</code><code id="L4854"><span class="ln">4854</span>                           window.mozRequestAnimationFrame    ||
+</code><code id="L4855"><span class="ln">4855</span>                           window.oRequestAnimationFrame      ||
+</code><code id="L4856"><span class="ln">4856</span>                           window.msRequestAnimationFrame     ||
+</code><code id="L4857"><span class="ln">4857</span>                           <b>function</b> (callback) {
+</code><code id="L4858"><span class="ln">4858</span>                               setTimeout(callback, <span class="d">16</span>);
+</code><code id="L4859"><span class="ln">4859</span>                           },
+</code><code id="L4860"><span class="ln">4860</span>        animation<span class="s"> = </span><b>function</b> () {
+</code><code id="L4861"><span class="ln">4861</span>            <b>var</b> Now<span class="s"> = </span>+<b>new</b> Date,
+</code><code id="L4862"><span class="ln">4862</span>                l<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L4863"><span class="ln">4863</span>            <b>for</b> (; l &lt; animationElements.length; l++) {
+</code><code id="L4864"><span class="ln">4864</span>                <b>var</b> e<span class="s"> = </span>animationElements[l];
+</code><code id="L4865"><span class="ln">4865</span>                <b>if</b> (e.el.removed<span class="s"> || </span>e.paused) {
+</code><code id="L4866"><span class="ln">4866</span>                    <b>continue</b>;
+</code><code id="L4867"><span class="ln">4867</span>                }
+</code><code id="L4868"><span class="ln">4868</span>                <b>var</b> time<span class="s"> = </span>Now<span class="s"> - </span>e.start,
+</code><code id="L4869"><span class="ln">4869</span>                    ms<span class="s"> = </span>e.ms,
+</code><code id="L4870"><span class="ln">4870</span>                    easing<span class="s"> = </span>e.easing,
+</code><code id="L4871"><span class="ln">4871</span>                    from<span class="s"> = </span>e.from,
+</code><code id="L4872"><span class="ln">4872</span>                    diff<span class="s"> = </span>e.diff,
+</code><code id="L4873"><span class="ln">4873</span>                    to<span class="s"> = </span>e.to,
+</code><code id="L4874"><span class="ln">4874</span>                    t<span class="s"> = </span>e.t,
+</code><code id="L4875"><span class="ln">4875</span>                    that<span class="s"> = </span>e.el,
+</code><code id="L4876"><span class="ln">4876</span>                    set<span class="s"> = </span>{},
+</code><code id="L4877"><span class="ln">4877</span>                    now;
+</code><code id="L4878"><span class="ln">4878</span>                <b>if</b> (e.initstatus) {
+</code><code id="L4879"><span class="ln">4879</span>                    time<span class="s"> = </span>(e.initstatus<span class="s"> * </span>e.anim.top<span class="s"> - </span>e.prev)<span class="s"> / </span>(e.percent<span class="s"> - </span>e.prev)<span class="s"> * </span>ms;
+</code><code id="L4880"><span class="ln">4880</span>                    e.status<span class="s"> = </span>e.initstatus;
+</code><code id="L4881"><span class="ln">4881</span>                    <b>delete</b> e.initstatus;
+</code><code id="L4882"><span class="ln">4882</span>                    e.stop<span class="s"> &amp;&amp; </span>animationElements.splice(l--, <span class="d">1</span>);
+</code><code id="L4883"><span class="ln">4883</span>                } <b>else</b> {
+</code><code id="L4884"><span class="ln">4884</span>                    e.status<span class="s"> = </span>(e.prev<span class="s"> + </span>(e.percent<span class="s"> - </span>e.prev)<span class="s"> * </span>(time<span class="s"> / </span>ms))<span class="s"> / </span>e.anim.top;
+</code><code id="L4885"><span class="ln">4885</span>                }
+</code><code id="L4886"><span class="ln">4886</span>                <b>if</b> (time &lt; <span class="d">0</span>) {
+</code><code id="L4887"><span class="ln">4887</span>                    <b>continue</b>;
+</code><code id="L4888"><span class="ln">4888</span>                }
+</code><code id="L4889"><span class="ln">4889</span>                <b>if</b> (time &lt; ms) {
+</code><code id="L4890"><span class="ln">4890</span>                    <b>var</b> pos<span class="s"> = </span>easing(time<span class="s"> / </span>ms);
+</code><code id="L4891"><span class="ln">4891</span>                    <b>for</b> (<b>var</b> attr <b>in</b> from) <b>if</b> (from[has](attr)) {
+</code><code id="L4892"><span class="ln">4892</span>                        <b>switch</b> (availableAnimAttrs[attr]) {
+</code><code id="L4893"><span class="ln">4893</span>                            <b>case</b> nu:
+</code><code id="L4894"><span class="ln">4894</span>                                now<span class="s"> = </span>+from[attr]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr];
+</code><code id="L4895"><span class="ln">4895</span>                                <b>break</b>;
+</code><code id="L4896"><span class="ln">4896</span>                            <b>case</b> <i>"colour"</i>:
+</code><code id="L4897"><span class="ln">4897</span>                                now<span class="s"> = </span><i>"rgb("</i><span class="s"> + </span>[
+</code><code id="L4898"><span class="ln">4898</span>                                    upto255(round(from[attr].r<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr].r)),
+</code><code id="L4899"><span class="ln">4899</span>                                    upto255(round(from[attr].g<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr].g)),
+</code><code id="L4900"><span class="ln">4900</span>                                    upto255(round(from[attr].b<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr].b))
+</code><code id="L4901"><span class="ln">4901</span>                                ].join(<i>","</i>)<span class="s"> + </span><i>")"</i>;
+</code><code id="L4902"><span class="ln">4902</span>                                <b>break</b>;
+</code><code id="L4903"><span class="ln">4903</span>                            <b>case</b> <i>"path"</i>:
+</code><code id="L4904"><span class="ln">4904</span>                                now<span class="s"> = </span>[];
+</code><code id="L4905"><span class="ln">4905</span>                                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>from[attr].length; i &lt; ii; i++) {
+</code><code id="L4906"><span class="ln">4906</span>                                    now[i]<span class="s"> = </span>[from[attr][i][<span class="d">0</span>]];
+</code><code id="L4907"><span class="ln">4907</span>                                    <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>from[attr][i].length; j &lt; jj; j++) {
+</code><code id="L4908"><span class="ln">4908</span>                                        now[i][j]<span class="s"> = </span>+from[attr][i][j]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i][j];
+</code><code id="L4909"><span class="ln">4909</span>                                    }
+</code><code id="L4910"><span class="ln">4910</span>                                    now[i]<span class="s"> = </span>now[i].join(S);
+</code><code id="L4911"><span class="ln">4911</span>                                }
+</code><code id="L4912"><span class="ln">4912</span>                                now<span class="s"> = </span>now.join(S);
+</code><code id="L4913"><span class="ln">4913</span>                                <b>break</b>;
+</code><code id="L4914"><span class="ln">4914</span>                            <b>case</b> <i>"transform"</i>:
+</code><code id="L4915"><span class="ln">4915</span>                                <b>if</b> (diff[attr].real) {
+</code><code id="L4916"><span class="ln">4916</span>                                    now<span class="s"> = </span>[];
+</code><code id="L4917"><span class="ln">4917</span>                                    <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>from[attr].length; i &lt; ii; i++) {
+</code><code id="L4918"><span class="ln">4918</span>                                        now[i]<span class="s"> = </span>[from[attr][i][<span class="d">0</span>]];
+</code><code id="L4919"><span class="ln">4919</span>                                        <b>for</b> (j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>from[attr][i].length; j &lt; jj; j++) {
+</code><code id="L4920"><span class="ln">4920</span>                                            now[i][j]<span class="s"> = </span>from[attr][i][j]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i][j];
+</code><code id="L4921"><span class="ln">4921</span>                                        }
+</code><code id="L4922"><span class="ln">4922</span>                                    }
+</code><code id="L4923"><span class="ln">4923</span>                                } <b>else</b> {
+</code><code id="L4924"><span class="ln">4924</span>                                    <b>var</b> get<span class="s"> = </span><b>function</b> (i) {
+</code><code id="L4925"><span class="ln">4925</span>                                        <b>return</b> +from[attr][i]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i];
+</code><code id="L4926"><span class="ln">4926</span>                                    };
+</code><code id="L4927"><span class="ln">4927</span>                                    <span class="c">// now<span class="s"> = </span>[[<i>"r"</i>, get(<span class="d">2</span>), <span class="d">0</span>, <span class="d">0</span>], [<i>"t"</i>, get(<span class="d">3</span>), get(<span class="d">4</span>)], [<i>"s"</i>, get(<span class="d">0</span>), get(<span class="d">1</span>), <span class="d">0</span>, <span class="d">0</span>]];</span>
+</code><code id="L4928"><span class="ln">4928</span>                                    now<span class="s"> = </span>[[<i>"m"</i>, get(<span class="d">0</span>), get(<span class="d">1</span>), get(<span class="d">2</span>), get(<span class="d">3</span>), get(<span class="d">4</span>), get(<span class="d">5</span>)]];
+</code><code id="L4929"><span class="ln">4929</span>                                }
+</code><code id="L4930"><span class="ln">4930</span>                                <b>break</b>;
+</code><code id="L4931"><span class="ln">4931</span>                            <b>case</b> <i>"csv"</i>:
+</code><code id="L4932"><span class="ln">4932</span>                                <b>if</b> (attr<span class="s"> == </span><i>"clip-rect"</i>) {
+</code><code id="L4933"><span class="ln">4933</span>                                    now<span class="s"> = </span>[];
+</code><code id="L4934"><span class="ln">4934</span>                                    i<span class="s"> = </span><span class="d">4</span>;
+</code><code id="L4935"><span class="ln">4935</span>                                    <b>while</b> (i--) {
+</code><code id="L4936"><span class="ln">4936</span>                                        now[i]<span class="s"> = </span>+from[attr][i]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i];
+</code><code id="L4937"><span class="ln">4937</span>                                    }
+</code><code id="L4938"><span class="ln">4938</span>                                }
+</code><code id="L4939"><span class="ln">4939</span>                                <b>break</b>;
+</code><code id="L4940"><span class="ln">4940</span>                            <b>default</b>:
+</code><code id="L4941"><span class="ln">4941</span>                                <b>var</b> from2<span class="s"> = </span>[].concat(from[attr]);
+</code><code id="L4942"><span class="ln">4942</span>                                now<span class="s"> = </span>[];
+</code><code id="L4943"><span class="ln">4943</span>                                i<span class="s"> = </span>that.paper.customAttributes[attr].length;
+</code><code id="L4944"><span class="ln">4944</span>                                <b>while</b> (i--) {
+</code><code id="L4945"><span class="ln">4945</span>                                    now[i]<span class="s"> = </span>+from2[i]<span class="s"> + </span>pos<span class="s"> * </span>ms<span class="s"> * </span>diff[attr][i];
+</code><code id="L4946"><span class="ln">4946</span>                                }
+</code><code id="L4947"><span class="ln">4947</span>                                <b>break</b>;
+</code><code id="L4948"><span class="ln">4948</span>                        }
+</code><code id="L4949"><span class="ln">4949</span>                        set[attr]<span class="s"> = </span>now;
+</code><code id="L4950"><span class="ln">4950</span>                    }
+</code><code id="L4951"><span class="ln">4951</span>                    that.attr(set);
+</code><code id="L4952"><span class="ln">4952</span>                    (<b>function</b> (id, that, anim) {
+</code><code id="L4953"><span class="ln">4953</span>                        setTimeout(<b>function</b> () {
+</code><code id="L4954"><span class="ln">4954</span>                            eve(<i>"anim.frame."</i><span class="s"> + </span>id, that, anim);
+</code><code id="L4955"><span class="ln">4955</span>                        });
+</code><code id="L4956"><span class="ln">4956</span>                    })(that.id, that, e.anim);
+</code><code id="L4957"><span class="ln">4957</span>                } <b>else</b> {
+</code><code id="L4958"><span class="ln">4958</span>                    (<b>function</b>(f, el, a) {
+</code><code id="L4959"><span class="ln">4959</span>                        setTimeout(<b>function</b>() {
+</code><code id="L4960"><span class="ln">4960</span>                            eve(<i>"anim.finish."</i><span class="s"> + </span>el.id, el, a);
+</code><code id="L4961"><span class="ln">4961</span>                            R.is(f, <i>"<b>function</b>"</i>)<span class="s"> &amp;&amp; </span>f.call(el);
+</code><code id="L4962"><span class="ln">4962</span>                        });
+</code><code id="L4963"><span class="ln">4963</span>                    })(e.callback, that, e.anim);
+</code><code id="L4964"><span class="ln">4964</span>                    <b>if</b> (--e.repeat) {
+</code><code id="L4965"><span class="ln">4965</span>                        that.attr(e.origin);
+</code><code id="L4966"><span class="ln">4966</span>                        e.start<span class="s"> = </span>Now;
+</code><code id="L4967"><span class="ln">4967</span>                    } <b>else</b> {
+</code><code id="L4968"><span class="ln">4968</span>                        that.attr(to);
+</code><code id="L4969"><span class="ln">4969</span>                        animationElements.splice(l--, <span class="d">1</span>);
+</code><code id="L4970"><span class="ln">4970</span>                    }
+</code><code id="L4971"><span class="ln">4971</span>                    <b>if</b> (e.next<span class="s"> &amp;&amp; </span>!e.stop) {
+</code><code id="L4972"><span class="ln">4972</span>                        runAnimation(e.anim, e.el, e.next, <b>null</b>, e.totalOrigin);
+</code><code id="L4973"><span class="ln">4973</span>                    }
+</code><code id="L4974"><span class="ln">4974</span>                }
+</code><code id="L4975"><span class="ln">4975</span>            }
+</code><code id="L4976"><span class="ln">4976</span>            R.svg<span class="s"> &amp;&amp; </span>that<span class="s"> &amp;&amp; </span>that.paper<span class="s"> &amp;&amp; </span>that.paper.safari();
+</code><code id="L4977"><span class="ln">4977</span>            animationElements.length<span class="s"> &amp;&amp; </span>requestAnimFrame(animation);
+</code><code id="L4978"><span class="ln">4978</span>        },
+</code><code id="L4979"><span class="ln">4979</span>        upto255<span class="s"> = </span><b>function</b> (color) {
+</code><code id="L4980"><span class="ln">4980</span>            <b>return</b> mmax(mmin(color, <span class="d">255</span>), <span class="d">0</span>);
+</code><code id="L4981"><span class="ln">4981</span>        };
+</code><code id="L4982"><span class="ln">4982</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L4983"><span class="ln">4983</span><span class="c">    <span class="s"> * </span>Element.animateWith
+</span></code><code id="L4984"><span class="ln">4984</span><span class="c">     [ method ]
+</span></code><code id="L4985"><span class="ln">4985</span><span class="c">     **
+</span></code><code id="L4986"><span class="ln">4986</span><span class="c">    <span class="s"> * </span>Acts similar to @Element.animate, but ensure that given animation runs <b>in</b> sync <b>with</b> another given element.
 </span></code><code id="L4987"><span class="ln">4987</span><span class="c">     **
-</span></code><code id="L4988"><span class="ln">4988</span><span class="c">    <span class="s"> * </span>Acts similar to @Element.animate, but ensure that given animation runs <b>in</b> sync <b>with</b> another given element.
+</span></code><code id="L4988"><span class="ln">4988</span><span class="c">     > Parameters
 </span></code><code id="L4989"><span class="ln">4989</span><span class="c">     **
-</span></code><code id="L4990"><span class="ln">4990</span><span class="c">     > Parameters
-</span></code><code id="L4991"><span class="ln">4991</span><span class="c">     **
-</span></code><code id="L4992"><span class="ln">4992</span><span class="c">    <span class="s"> - </span>params (object) <b>final</b> attributes <b>for</b> the element, see also @Element.attr
-</span></code><code id="L4993"><span class="ln">4993</span><span class="c">    <span class="s"> - </span>ms (number) number of milliseconds <b>for</b> animation to run
-</span></code><code id="L4994"><span class="ln">4994</span><span class="c">    <span class="s"> - </span>easing (string) #optional easing type. Accept on of @Raphael.easing_formulas or CSS format: `cubic&#x2010;bezier(XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX)`
-</span></code><code id="L4995"><span class="ln">4995</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) #optional callback <b>function</b>. Will be called at the end of animation.
-</span></code><code id="L4996"><span class="ln">4996</span><span class="c">    <span class="s"> * </span>or
-</span></code><code id="L4997"><span class="ln">4997</span><span class="c">    <span class="s"> - </span>animation (object) animation object, see @Raphael.animation
-</span></code><code id="L4998"><span class="ln">4998</span><span class="c">     **
-</span></code><code id="L4999"><span class="ln">4999</span><span class="c">    <span class="s"> = </span>(object) original element
-</span></code><code id="L5000"><span class="ln">5000</span><span class="c">    \*/</span>
-</code><code id="L5001"><span class="ln">5001</span>    elproto.animateWith<span class="s"> = </span><b>function</b> (element, params, ms, easing, callback) {
-</code><code id="L5002"><span class="ln">5002</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>animationElements.length; i &lt; ii; i++) {
-</code><code id="L5003"><span class="ln">5003</span>            <b>if</b> (animationElements[i].el.id<span class="s"> == </span>element.id) {
-</code><code id="L5004"><span class="ln">5004</span>                params.start<span class="s"> = </span>animationElements[i].timestamp;
-</code><code id="L5005"><span class="ln">5005</span>                <b>break</b>;
-</code><code id="L5006"><span class="ln">5006</span>            }
-</code><code id="L5007"><span class="ln">5007</span>        }
-</code><code id="L5008"><span class="ln">5008</span>        <b>return</b> <b>this</b>.animate(params, ms, easing, callback);
-</code><code id="L5009"><span class="ln">5009</span>    };
-</code><code id="L5010"><span class="ln">5010</span>    <b>function</b> CubicBezierAtTime(t, p1x, p1y, p2x, p2y, duration) {
-</code><code id="L5011"><span class="ln">5011</span>        <b>var</b> cx<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>p1x,
-</code><code id="L5012"><span class="ln">5012</span>            bx<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>(p2x<span class="s"> - </span>p1x)<span class="s"> - </span>cx,
-</code><code id="L5013"><span class="ln">5013</span>            ax<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>cx<span class="s"> - </span>bx,
-</code><code id="L5014"><span class="ln">5014</span>            cy<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>p1y,
-</code><code id="L5015"><span class="ln">5015</span>            by<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>(p2y<span class="s"> - </span>p1y)<span class="s"> - </span>cy,
-</code><code id="L5016"><span class="ln">5016</span>            ay<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>cy<span class="s"> - </span>by;
-</code><code id="L5017"><span class="ln">5017</span>        <b>function</b> sampleCurveX(t) {
-</code><code id="L5018"><span class="ln">5018</span>            <b>return</b> ((ax<span class="s"> * </span>t<span class="s"> + </span>bx)<span class="s"> * </span>t<span class="s"> + </span>cx)<span class="s"> * </span>t;
-</code><code id="L5019"><span class="ln">5019</span>        }
-</code><code id="L5020"><span class="ln">5020</span>        <b>function</b> solve(x, epsilon) {
-</code><code id="L5021"><span class="ln">5021</span>            <b>var</b> t<span class="s"> = </span>solveCurveX(x, epsilon);
-</code><code id="L5022"><span class="ln">5022</span>            <b>return</b> ((ay<span class="s"> * </span>t<span class="s"> + </span>by)<span class="s"> * </span>t<span class="s"> + </span>cy)<span class="s"> * </span>t;
-</code><code id="L5023"><span class="ln">5023</span>        }
-</code><code id="L5024"><span class="ln">5024</span>        <b>function</b> solveCurveX(x, epsilon) {
-</code><code id="L5025"><span class="ln">5025</span>            <b>var</b> t0, t1, t2, x2, d2, i;
-</code><code id="L5026"><span class="ln">5026</span>            <b>for</b>(t2<span class="s"> = </span>x, i<span class="s"> = </span><span class="d">0</span>; i &lt; <span class="d">8</span>; i++) {
-</code><code id="L5027"><span class="ln">5027</span>                x2<span class="s"> = </span>sampleCurveX(t2)<span class="s"> - </span>x;
-</code><code id="L5028"><span class="ln">5028</span>                <b>if</b> (abs(x2) &lt; epsilon) {
-</code><code id="L5029"><span class="ln">5029</span>                    <b>return</b> t2;
-</code><code id="L5030"><span class="ln">5030</span>                }
-</code><code id="L5031"><span class="ln">5031</span>                d2<span class="s"> = </span>(<span class="d">3</span><span class="s"> * </span>ax<span class="s"> * </span>t2<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>bx)<span class="s"> * </span>t2<span class="s"> + </span>cx;
-</code><code id="L5032"><span class="ln">5032</span>                <b>if</b> (abs(d2) &lt; <span class="d">1e-6</span>) {
-</code><code id="L5033"><span class="ln">5033</span>                    <b>break</b>;
-</code><code id="L5034"><span class="ln">5034</span>                }
-</code><code id="L5035"><span class="ln">5035</span>                t2<span class="s"> = </span>t2<span class="s"> - </span>x2<span class="s"> / </span>d2;
-</code><code id="L5036"><span class="ln">5036</span>            }
-</code><code id="L5037"><span class="ln">5037</span>            t0<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L5038"><span class="ln">5038</span>            t1<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L5039"><span class="ln">5039</span>            t2<span class="s"> = </span>x;
-</code><code id="L5040"><span class="ln">5040</span>            <b>if</b> (t2 &lt; t0) {
-</code><code id="L5041"><span class="ln">5041</span>                <b>return</b> t0;
-</code><code id="L5042"><span class="ln">5042</span>            }
-</code><code id="L5043"><span class="ln">5043</span>            <b>if</b> (t2 > t1) {
-</code><code id="L5044"><span class="ln">5044</span>                <b>return</b> t1;
-</code><code id="L5045"><span class="ln">5045</span>            }
-</code><code id="L5046"><span class="ln">5046</span>            <b>while</b> (t0 &lt; t1) {
-</code><code id="L5047"><span class="ln">5047</span>                x2<span class="s"> = </span>sampleCurveX(t2);
-</code><code id="L5048"><span class="ln">5048</span>                <b>if</b> (abs(x2<span class="s"> - </span>x) &lt; epsilon) {
-</code><code id="L5049"><span class="ln">5049</span>                    <b>return</b> t2;
-</code><code id="L5050"><span class="ln">5050</span>                }
-</code><code id="L5051"><span class="ln">5051</span>                <b>if</b> (x > x2) {
-</code><code id="L5052"><span class="ln">5052</span>                    t0<span class="s"> = </span>t2;
-</code><code id="L5053"><span class="ln">5053</span>                } <b>else</b> {
-</code><code id="L5054"><span class="ln">5054</span>                    t1<span class="s"> = </span>t2;
-</code><code id="L5055"><span class="ln">5055</span>                }
-</code><code id="L5056"><span class="ln">5056</span>                t2<span class="s"> = </span>(t1<span class="s"> - </span>t0)<span class="s"> / </span><span class="d">2</span><span class="s"> + </span>t0;
-</code><code id="L5057"><span class="ln">5057</span>            }
-</code><code id="L5058"><span class="ln">5058</span>            <b>return</b> t2;
-</code><code id="L5059"><span class="ln">5059</span>        }
-</code><code id="L5060"><span class="ln">5060</span>        <b>return</b> solve(t, <span class="d">1</span><span class="s"> / </span>(<span class="d">200</span><span class="s"> * </span>duration));
-</code><code id="L5061"><span class="ln">5061</span>    }
-</code><code id="L5062"><span class="ln">5062</span>    elproto.onAnimation<span class="s"> = </span><b>function</b> (f) {
-</code><code id="L5063"><span class="ln">5063</span>        f ? eve.on(<i>"anim.frame."</i><span class="s"> + </span><b>this</b>.id, f) : eve.unbind(<i>"anim.frame."</i><span class="s"> + </span><b>this</b>.id);
-</code><code id="L5064"><span class="ln">5064</span>        <b>return</b> <b>this</b>;
-</code><code id="L5065"><span class="ln">5065</span>    };
-</code><code id="L5066"><span class="ln">5066</span>    <b>function</b> Animation(anim, ms) {
-</code><code id="L5067"><span class="ln">5067</span>        <b>var</b> percents<span class="s"> = </span>[];
-</code><code id="L5068"><span class="ln">5068</span>        <b>this</b>.anim<span class="s"> = </span>anim;
-</code><code id="L5069"><span class="ln">5069</span>        <b>this</b>.ms<span class="s"> = </span>ms;
-</code><code id="L5070"><span class="ln">5070</span>        <b>this</b>.times<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L5071"><span class="ln">5071</span>        <b>if</b> (<b>this</b>.anim) {
-</code><code id="L5072"><span class="ln">5072</span>            <b>for</b> (<b>var</b> attr <b>in</b> <b>this</b>.anim) <b>if</b> (<b>this</b>.anim[has](attr)) {
-</code><code id="L5073"><span class="ln">5073</span>                percents.push(+attr);
-</code><code id="L5074"><span class="ln">5074</span>            }
-</code><code id="L5075"><span class="ln">5075</span>            percents.sort(sortByNumber);
-</code><code id="L5076"><span class="ln">5076</span>        }
-</code><code id="L5077"><span class="ln">5077</span>        <b>this</b>.top<span class="s"> = </span>percents[percents.length<span class="s"> - </span><span class="d">1</span>];
-</code><code id="L5078"><span class="ln">5078</span>        <b>this</b>.percents<span class="s"> = </span>percents;
-</code><code id="L5079"><span class="ln">5079</span>    }
-</code><code id="L5080"><span class="ln">5080</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5081"><span class="ln">5081</span><span class="c">    <span class="s"> * </span>Animation.delay
-</span></code><code id="L5082"><span class="ln">5082</span><span class="c">     [ method ]
+</span></code><code id="L4990"><span class="ln">4990</span><span class="c">    <span class="s"> - </span>params (object) <b>final</b> attributes <b>for</b> the element, see also @Element.attr
+</span></code><code id="L4991"><span class="ln">4991</span><span class="c">    <span class="s"> - </span>ms (number) number of milliseconds <b>for</b> animation to run
+</span></code><code id="L4992"><span class="ln">4992</span><span class="c">    <span class="s"> - </span>easing (string) #optional easing type. Accept on of @Raphael.easing_formulas or CSS format: `cubic&#x2010;bezier(XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX)`
+</span></code><code id="L4993"><span class="ln">4993</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) #optional callback <b>function</b>. Will be called at the end of animation.
+</span></code><code id="L4994"><span class="ln">4994</span><span class="c">    <span class="s"> * </span>or
+</span></code><code id="L4995"><span class="ln">4995</span><span class="c">    <span class="s"> - </span>animation (object) animation object, see @Raphael.animation
+</span></code><code id="L4996"><span class="ln">4996</span><span class="c">     **
+</span></code><code id="L4997"><span class="ln">4997</span><span class="c">    <span class="s"> = </span>(object) original element
+</span></code><code id="L4998"><span class="ln">4998</span><span class="c">    \*/</span>
+</code><code id="L4999"><span class="ln">4999</span>    elproto.animateWith<span class="s"> = </span><b>function</b> (element, params, ms, easing, callback) {
+</code><code id="L5000"><span class="ln">5000</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>animationElements.length; i &lt; ii; i++) {
+</code><code id="L5001"><span class="ln">5001</span>            <b>if</b> (animationElements[i].el.id<span class="s"> == </span>element.id) {
+</code><code id="L5002"><span class="ln">5002</span>                params.start<span class="s"> = </span>animationElements[i].timestamp;
+</code><code id="L5003"><span class="ln">5003</span>                <b>break</b>;
+</code><code id="L5004"><span class="ln">5004</span>            }
+</code><code id="L5005"><span class="ln">5005</span>        }
+</code><code id="L5006"><span class="ln">5006</span>        <b>return</b> <b>this</b>.animate(params, ms, easing, callback);
+</code><code id="L5007"><span class="ln">5007</span>    };
+</code><code id="L5008"><span class="ln">5008</span>    <b>function</b> CubicBezierAtTime(t, p1x, p1y, p2x, p2y, duration) {
+</code><code id="L5009"><span class="ln">5009</span>        <b>var</b> cx<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>p1x,
+</code><code id="L5010"><span class="ln">5010</span>            bx<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>(p2x<span class="s"> - </span>p1x)<span class="s"> - </span>cx,
+</code><code id="L5011"><span class="ln">5011</span>            ax<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>cx<span class="s"> - </span>bx,
+</code><code id="L5012"><span class="ln">5012</span>            cy<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>p1y,
+</code><code id="L5013"><span class="ln">5013</span>            by<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>(p2y<span class="s"> - </span>p1y)<span class="s"> - </span>cy,
+</code><code id="L5014"><span class="ln">5014</span>            ay<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>cy<span class="s"> - </span>by;
+</code><code id="L5015"><span class="ln">5015</span>        <b>function</b> sampleCurveX(t) {
+</code><code id="L5016"><span class="ln">5016</span>            <b>return</b> ((ax<span class="s"> * </span>t<span class="s"> + </span>bx)<span class="s"> * </span>t<span class="s"> + </span>cx)<span class="s"> * </span>t;
+</code><code id="L5017"><span class="ln">5017</span>        }
+</code><code id="L5018"><span class="ln">5018</span>        <b>function</b> solve(x, epsilon) {
+</code><code id="L5019"><span class="ln">5019</span>            <b>var</b> t<span class="s"> = </span>solveCurveX(x, epsilon);
+</code><code id="L5020"><span class="ln">5020</span>            <b>return</b> ((ay<span class="s"> * </span>t<span class="s"> + </span>by)<span class="s"> * </span>t<span class="s"> + </span>cy)<span class="s"> * </span>t;
+</code><code id="L5021"><span class="ln">5021</span>        }
+</code><code id="L5022"><span class="ln">5022</span>        <b>function</b> solveCurveX(x, epsilon) {
+</code><code id="L5023"><span class="ln">5023</span>            <b>var</b> t0, t1, t2, x2, d2, i;
+</code><code id="L5024"><span class="ln">5024</span>            <b>for</b>(t2<span class="s"> = </span>x, i<span class="s"> = </span><span class="d">0</span>; i &lt; <span class="d">8</span>; i++) {
+</code><code id="L5025"><span class="ln">5025</span>                x2<span class="s"> = </span>sampleCurveX(t2)<span class="s"> - </span>x;
+</code><code id="L5026"><span class="ln">5026</span>                <b>if</b> (abs(x2) &lt; epsilon) {
+</code><code id="L5027"><span class="ln">5027</span>                    <b>return</b> t2;
+</code><code id="L5028"><span class="ln">5028</span>                }
+</code><code id="L5029"><span class="ln">5029</span>                d2<span class="s"> = </span>(<span class="d">3</span><span class="s"> * </span>ax<span class="s"> * </span>t2<span class="s"> + </span><span class="d">2</span><span class="s"> * </span>bx)<span class="s"> * </span>t2<span class="s"> + </span>cx;
+</code><code id="L5030"><span class="ln">5030</span>                <b>if</b> (abs(d2) &lt; <span class="d">1e-6</span>) {
+</code><code id="L5031"><span class="ln">5031</span>                    <b>break</b>;
+</code><code id="L5032"><span class="ln">5032</span>                }
+</code><code id="L5033"><span class="ln">5033</span>                t2<span class="s"> = </span>t2<span class="s"> - </span>x2<span class="s"> / </span>d2;
+</code><code id="L5034"><span class="ln">5034</span>            }
+</code><code id="L5035"><span class="ln">5035</span>            t0<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L5036"><span class="ln">5036</span>            t1<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L5037"><span class="ln">5037</span>            t2<span class="s"> = </span>x;
+</code><code id="L5038"><span class="ln">5038</span>            <b>if</b> (t2 &lt; t0) {
+</code><code id="L5039"><span class="ln">5039</span>                <b>return</b> t0;
+</code><code id="L5040"><span class="ln">5040</span>            }
+</code><code id="L5041"><span class="ln">5041</span>            <b>if</b> (t2 > t1) {
+</code><code id="L5042"><span class="ln">5042</span>                <b>return</b> t1;
+</code><code id="L5043"><span class="ln">5043</span>            }
+</code><code id="L5044"><span class="ln">5044</span>            <b>while</b> (t0 &lt; t1) {
+</code><code id="L5045"><span class="ln">5045</span>                x2<span class="s"> = </span>sampleCurveX(t2);
+</code><code id="L5046"><span class="ln">5046</span>                <b>if</b> (abs(x2<span class="s"> - </span>x) &lt; epsilon) {
+</code><code id="L5047"><span class="ln">5047</span>                    <b>return</b> t2;
+</code><code id="L5048"><span class="ln">5048</span>                }
+</code><code id="L5049"><span class="ln">5049</span>                <b>if</b> (x > x2) {
+</code><code id="L5050"><span class="ln">5050</span>                    t0<span class="s"> = </span>t2;
+</code><code id="L5051"><span class="ln">5051</span>                } <b>else</b> {
+</code><code id="L5052"><span class="ln">5052</span>                    t1<span class="s"> = </span>t2;
+</code><code id="L5053"><span class="ln">5053</span>                }
+</code><code id="L5054"><span class="ln">5054</span>                t2<span class="s"> = </span>(t1<span class="s"> - </span>t0)<span class="s"> / </span><span class="d">2</span><span class="s"> + </span>t0;
+</code><code id="L5055"><span class="ln">5055</span>            }
+</code><code id="L5056"><span class="ln">5056</span>            <b>return</b> t2;
+</code><code id="L5057"><span class="ln">5057</span>        }
+</code><code id="L5058"><span class="ln">5058</span>        <b>return</b> solve(t, <span class="d">1</span><span class="s"> / </span>(<span class="d">200</span><span class="s"> * </span>duration));
+</code><code id="L5059"><span class="ln">5059</span>    }
+</code><code id="L5060"><span class="ln">5060</span>    elproto.onAnimation<span class="s"> = </span><b>function</b> (f) {
+</code><code id="L5061"><span class="ln">5061</span>        f ? eve.on(<i>"anim.frame."</i><span class="s"> + </span><b>this</b>.id, f) : eve.unbind(<i>"anim.frame."</i><span class="s"> + </span><b>this</b>.id);
+</code><code id="L5062"><span class="ln">5062</span>        <b>return</b> <b>this</b>;
+</code><code id="L5063"><span class="ln">5063</span>    };
+</code><code id="L5064"><span class="ln">5064</span>    <b>function</b> Animation(anim, ms) {
+</code><code id="L5065"><span class="ln">5065</span>        <b>var</b> percents<span class="s"> = </span>[];
+</code><code id="L5066"><span class="ln">5066</span>        <b>this</b>.anim<span class="s"> = </span>anim;
+</code><code id="L5067"><span class="ln">5067</span>        <b>this</b>.ms<span class="s"> = </span>ms;
+</code><code id="L5068"><span class="ln">5068</span>        <b>this</b>.times<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L5069"><span class="ln">5069</span>        <b>if</b> (<b>this</b>.anim) {
+</code><code id="L5070"><span class="ln">5070</span>            <b>for</b> (<b>var</b> attr <b>in</b> <b>this</b>.anim) <b>if</b> (<b>this</b>.anim[has](attr)) {
+</code><code id="L5071"><span class="ln">5071</span>                percents.push(+attr);
+</code><code id="L5072"><span class="ln">5072</span>            }
+</code><code id="L5073"><span class="ln">5073</span>            percents.sort(sortByNumber);
+</code><code id="L5074"><span class="ln">5074</span>        }
+</code><code id="L5075"><span class="ln">5075</span>        <b>this</b>.top<span class="s"> = </span>percents[percents.length<span class="s"> - </span><span class="d">1</span>];
+</code><code id="L5076"><span class="ln">5076</span>        <b>this</b>.percents<span class="s"> = </span>percents;
+</code><code id="L5077"><span class="ln">5077</span>    }
+</code><code id="L5078"><span class="ln">5078</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5079"><span class="ln">5079</span><span class="c">    <span class="s"> * </span>Animation.delay
+</span></code><code id="L5080"><span class="ln">5080</span><span class="c">     [ method ]
+</span></code><code id="L5081"><span class="ln">5081</span><span class="c">     **
+</span></code><code id="L5082"><span class="ln">5082</span><span class="c">    <span class="s"> * </span>Creates a copy of existing animation object <b>with</b> given delay.
 </span></code><code id="L5083"><span class="ln">5083</span><span class="c">     **
-</span></code><code id="L5084"><span class="ln">5084</span><span class="c">    <span class="s"> * </span>Creates copy of existing animation object <b>with</b> given delay.
+</span></code><code id="L5084"><span class="ln">5084</span><span class="c">     > Parameters
 </span></code><code id="L5085"><span class="ln">5085</span><span class="c">     **
-</span></code><code id="L5086"><span class="ln">5086</span><span class="c">     > Parameters
+</span></code><code id="L5086"><span class="ln">5086</span><span class="c">    <span class="s"> - </span>delay (number) number of ms to pass between animation start and actual animation
 </span></code><code id="L5087"><span class="ln">5087</span><span class="c">     **
-</span></code><code id="L5088"><span class="ln">5088</span><span class="c">    <span class="s"> - </span>delay (number) number of ms to pass between animation start and actual animation
-</span></code><code id="L5089"><span class="ln">5089</span><span class="c">     **
-</span></code><code id="L5090"><span class="ln">5090</span><span class="c">    <span class="s"> = </span>(object) <b>new</b> altered Animation object
-</span></code><code id="L5091"><span class="ln">5091</span><span class="c">    \*/</span>
-</code><code id="L5092"><span class="ln">5092</span>    Animation.prototype.delay<span class="s"> = </span><b>function</b> (delay) {
-</code><code id="L5093"><span class="ln">5093</span>        <b>var</b> a<span class="s"> = </span><b>new</b> Animation(<b>this</b>.anim, <b>this</b>.ms);
-</code><code id="L5094"><span class="ln">5094</span>        a.times<span class="s"> = </span><b>this</b>.times;
-</code><code id="L5095"><span class="ln">5095</span>        a.del<span class="s"> = </span>+delay<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L5096"><span class="ln">5096</span>        <b>return</b> a;
-</code><code id="L5097"><span class="ln">5097</span>    };
-</code><code id="L5098"><span class="ln">5098</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5099"><span class="ln">5099</span><span class="c">    <span class="s"> * </span>Animation.repeat
-</span></code><code id="L5100"><span class="ln">5100</span><span class="c">     [ method ]
+</span></code><code id="L5088"><span class="ln">5088</span><span class="c">    <span class="s"> = </span>(object) <b>new</b> altered Animation object
+</span></code><code id="L5089"><span class="ln">5089</span><span class="c">    \*/</span>
+</code><code id="L5090"><span class="ln">5090</span>    Animation.prototype.delay<span class="s"> = </span><b>function</b> (delay) {
+</code><code id="L5091"><span class="ln">5091</span>        <b>var</b> a<span class="s"> = </span><b>new</b> Animation(<b>this</b>.anim, <b>this</b>.ms);
+</code><code id="L5092"><span class="ln">5092</span>        a.times<span class="s"> = </span><b>this</b>.times;
+</code><code id="L5093"><span class="ln">5093</span>        a.del<span class="s"> = </span>+delay<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L5094"><span class="ln">5094</span>        <b>return</b> a;
+</code><code id="L5095"><span class="ln">5095</span>    };
+</code><code id="L5096"><span class="ln">5096</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5097"><span class="ln">5097</span><span class="c">    <span class="s"> * </span>Animation.repeat
+</span></code><code id="L5098"><span class="ln">5098</span><span class="c">     [ method ]
+</span></code><code id="L5099"><span class="ln">5099</span><span class="c">     **
+</span></code><code id="L5100"><span class="ln">5100</span><span class="c">    <span class="s"> * </span>Creates a copy of existing animation object <b>with</b> given repetition.
 </span></code><code id="L5101"><span class="ln">5101</span><span class="c">     **
-</span></code><code id="L5102"><span class="ln">5102</span><span class="c">    <span class="s"> * </span>Creates copy of existing animation object <b>with</b> given repetition.
+</span></code><code id="L5102"><span class="ln">5102</span><span class="c">     > Parameters
 </span></code><code id="L5103"><span class="ln">5103</span><span class="c">     **
-</span></code><code id="L5104"><span class="ln">5104</span><span class="c">     > Parameters
+</span></code><code id="L5104"><span class="ln">5104</span><span class="c">    <span class="s"> - </span>repeat (number) number iterations of animation. For infinite animation pass `Infinity`
 </span></code><code id="L5105"><span class="ln">5105</span><span class="c">     **
-</span></code><code id="L5106"><span class="ln">5106</span><span class="c">    <span class="s"> - </span>repeat (number) number iterations of animation. For infinite animation pass `Infinity`
-</span></code><code id="L5107"><span class="ln">5107</span><span class="c">     **
-</span></code><code id="L5108"><span class="ln">5108</span><span class="c">    <span class="s"> = </span>(object) <b>new</b> altered Animation object
-</span></code><code id="L5109"><span class="ln">5109</span><span class="c">    \*/</span>
-</code><code id="L5110"><span class="ln">5110</span>    Animation.prototype.repeat<span class="s"> = </span><b>function</b> (times) { 
-</code><code id="L5111"><span class="ln">5111</span>        <b>var</b> a<span class="s"> = </span><b>new</b> Animation(<b>this</b>.anim, <b>this</b>.ms);
-</code><code id="L5112"><span class="ln">5112</span>        a.del<span class="s"> = </span><b>this</b>.del;
-</code><code id="L5113"><span class="ln">5113</span>        a.times<span class="s"> = </span>math.floor(mmax(times, <span class="d">0</span>))<span class="s"> || </span><span class="d">1</span>;
-</code><code id="L5114"><span class="ln">5114</span>        <b>return</b> a;
-</code><code id="L5115"><span class="ln">5115</span>    };
-</code><code id="L5116"><span class="ln">5116</span>    <b>function</b> runAnimation(anim, element, percent, status, totalOrigin) {
-</code><code id="L5117"><span class="ln">5117</span>        percent<span class="s"> = </span>toFloat(percent);
-</code><code id="L5118"><span class="ln">5118</span>        <b>var</b> params,
-</code><code id="L5119"><span class="ln">5119</span>            isInAnim,
-</code><code id="L5120"><span class="ln">5120</span>            isInAnimSet,
-</code><code id="L5121"><span class="ln">5121</span>            percents<span class="s"> = </span>[],
-</code><code id="L5122"><span class="ln">5122</span>            next,
-</code><code id="L5123"><span class="ln">5123</span>            prev,
-</code><code id="L5124"><span class="ln">5124</span>            timestamp,
-</code><code id="L5125"><span class="ln">5125</span>            ms<span class="s"> = </span>anim.ms,
-</code><code id="L5126"><span class="ln">5126</span>            from<span class="s"> = </span>{},
-</code><code id="L5127"><span class="ln">5127</span>            to<span class="s"> = </span>{},
-</code><code id="L5128"><span class="ln">5128</span>            diff<span class="s"> = </span>{};
-</code><code id="L5129"><span class="ln">5129</span>        <b>if</b> (status) {
-</code><code id="L5130"><span class="ln">5130</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>animationElements.length; i &lt; ii; i++) {
-</code><code id="L5131"><span class="ln">5131</span>                <b>var</b> e<span class="s"> = </span>animationElements[i];
-</code><code id="L5132"><span class="ln">5132</span>                <b>if</b> (e.el.id<span class="s"> == </span>element.id<span class="s"> &amp;&amp; </span>e.anim<span class="s"> == </span>anim) {
-</code><code id="L5133"><span class="ln">5133</span>                    <b>if</b> (e.percent != percent) {
-</code><code id="L5134"><span class="ln">5134</span>                        animationElements.splice(i, <span class="d">1</span>);
-</code><code id="L5135"><span class="ln">5135</span>                        isInAnimSet<span class="s"> = </span><span class="d">1</span>;
-</code><code id="L5136"><span class="ln">5136</span>                    } <b>else</b> {
-</code><code id="L5137"><span class="ln">5137</span>                        isInAnim<span class="s"> = </span>e;
-</code><code id="L5138"><span class="ln">5138</span>                    }
-</code><code id="L5139"><span class="ln">5139</span>                    element.attr(e.totalOrigin);
-</code><code id="L5140"><span class="ln">5140</span>                    <b>break</b>;
-</code><code id="L5141"><span class="ln">5141</span>                }
-</code><code id="L5142"><span class="ln">5142</span>            }
-</code><code id="L5143"><span class="ln">5143</span>        } <b>else</b> {
-</code><code id="L5144"><span class="ln">5144</span>            status<span class="s"> = </span><span class="d">0</span><span class="s"> / </span><span class="d">0</span>;
-</code><code id="L5145"><span class="ln">5145</span>        }
-</code><code id="L5146"><span class="ln">5146</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>anim.percents.length; i &lt; ii; i++) {
-</code><code id="L5147"><span class="ln">5147</span>            <b>if</b> (anim.percents[i]<span class="s"> == </span>percent<span class="s"> || </span>anim.percents[i] > status<span class="s"> * </span>anim.top) {
-</code><code id="L5148"><span class="ln">5148</span>                percent<span class="s"> = </span>anim.percents[i];
-</code><code id="L5149"><span class="ln">5149</span>                prev<span class="s"> = </span>anim.percents[i<span class="s"> - </span><span class="d">1</span>]<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L5150"><span class="ln">5150</span>                ms<span class="s"> = </span>ms<span class="s"> / </span>anim.top<span class="s"> * </span>(percent<span class="s"> - </span>prev);
-</code><code id="L5151"><span class="ln">5151</span>                next<span class="s"> = </span>anim.percents[i<span class="s"> + </span><span class="d">1</span>];
-</code><code id="L5152"><span class="ln">5152</span>                params<span class="s"> = </span>anim.anim[percent];
-</code><code id="L5153"><span class="ln">5153</span>                <b>break</b>;
-</code><code id="L5154"><span class="ln">5154</span>            } <b>else</b> <b>if</b> (status) {
-</code><code id="L5155"><span class="ln">5155</span>                element.attr(anim.anim[anim.percents[i]]);
-</code><code id="L5156"><span class="ln">5156</span>            }
-</code><code id="L5157"><span class="ln">5157</span>        }
-</code><code id="L5158"><span class="ln">5158</span>        <b>if</b> (!params) {
-</code><code id="L5159"><span class="ln">5159</span>            <b>return</b>;
-</code><code id="L5160"><span class="ln">5160</span>        }
-</code><code id="L5161"><span class="ln">5161</span>        <b>if</b> (!isInAnim) {
-</code><code id="L5162"><span class="ln">5162</span>            <b>for</b> (attr <b>in</b> params) <b>if</b> (params[has](attr)) {
-</code><code id="L5163"><span class="ln">5163</span>                <b>if</b> (availableAnimAttrs[has](attr)<span class="s"> || </span>element.paper.customAttributes[has](attr)) {
-</code><code id="L5164"><span class="ln">5164</span>                    from[attr]<span class="s"> = </span>element.attr(attr);
-</code><code id="L5165"><span class="ln">5165</span>                    (from[attr]<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(from[attr]<span class="s"> = </span>availableAttrs[attr]);
-</code><code id="L5166"><span class="ln">5166</span>                    to[attr]<span class="s"> = </span>params[attr];
-</code><code id="L5167"><span class="ln">5167</span>                    <b>switch</b> (availableAnimAttrs[attr]) {
-</code><code id="L5168"><span class="ln">5168</span>                        <b>case</b> nu:
-</code><code id="L5169"><span class="ln">5169</span>                            diff[attr]<span class="s"> = </span>(to[attr]<span class="s"> - </span>from[attr])<span class="s"> / </span>ms;
-</code><code id="L5170"><span class="ln">5170</span>                            <b>break</b>;
-</code><code id="L5171"><span class="ln">5171</span>                        <b>case</b> <i>"colour"</i>:
-</code><code id="L5172"><span class="ln">5172</span>                            from[attr]<span class="s"> = </span>R.getRGB(from[attr]);
-</code><code id="L5173"><span class="ln">5173</span>                            <b>var</b> toColour<span class="s"> = </span>R.getRGB(to[attr]);
-</code><code id="L5174"><span class="ln">5174</span>                            diff[attr]<span class="s"> = </span>{
-</code><code id="L5175"><span class="ln">5175</span>                                r: (toColour.r<span class="s"> - </span>from[attr].r)<span class="s"> / </span>ms,
-</code><code id="L5176"><span class="ln">5176</span>                                g: (toColour.g<span class="s"> - </span>from[attr].g)<span class="s"> / </span>ms,
-</code><code id="L5177"><span class="ln">5177</span>                                b: (toColour.b<span class="s"> - </span>from[attr].b)<span class="s"> / </span>ms
-</code><code id="L5178"><span class="ln">5178</span>                            };
-</code><code id="L5179"><span class="ln">5179</span>                            <b>break</b>;
-</code><code id="L5180"><span class="ln">5180</span>                        <b>case</b> <i>"path"</i>:
-</code><code id="L5181"><span class="ln">5181</span>                            <b>var</b> pathes<span class="s"> = </span>path2curve(from[attr], to[attr]),
-</code><code id="L5182"><span class="ln">5182</span>                                toPath<span class="s"> = </span>pathes[<span class="d">1</span>];
-</code><code id="L5183"><span class="ln">5183</span>                            from[attr]<span class="s"> = </span>pathes[<span class="d">0</span>];
-</code><code id="L5184"><span class="ln">5184</span>                            diff[attr]<span class="s"> = </span>[];
-</code><code id="L5185"><span class="ln">5185</span>                            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>from[attr].length; i &lt; ii; i++) {
-</code><code id="L5186"><span class="ln">5186</span>                                diff[attr][i]<span class="s"> = </span>[<span class="d">0</span>];
-</code><code id="L5187"><span class="ln">5187</span>                                <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>from[attr][i].length; j &lt; jj; j++) {
-</code><code id="L5188"><span class="ln">5188</span>                                    diff[attr][i][j]<span class="s"> = </span>(toPath[i][j]<span class="s"> - </span>from[attr][i][j])<span class="s"> / </span>ms;
-</code><code id="L5189"><span class="ln">5189</span>                                }
-</code><code id="L5190"><span class="ln">5190</span>                            }
-</code><code id="L5191"><span class="ln">5191</span>                            <b>break</b>;
-</code><code id="L5192"><span class="ln">5192</span>                        <b>case</b> <i>"transform"</i>:
-</code><code id="L5193"><span class="ln">5193</span>                            <b>var</b> _<span class="s"> = </span>element._,
-</code><code id="L5194"><span class="ln">5194</span>                                eq<span class="s"> = </span>equaliseTransform(_[attr], to[attr]);
-</code><code id="L5195"><span class="ln">5195</span>                            <b>if</b> (eq) {
-</code><code id="L5196"><span class="ln">5196</span>                                from[attr]<span class="s"> = </span>eq.from;
-</code><code id="L5197"><span class="ln">5197</span>                                to[attr]<span class="s"> = </span>eq.to;
-</code><code id="L5198"><span class="ln">5198</span>                                diff[attr]<span class="s"> = </span>[];
-</code><code id="L5199"><span class="ln">5199</span>                                diff[attr].real<span class="s"> = </span><b>true</b>;
-</code><code id="L5200"><span class="ln">5200</span>                                <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>from[attr].length; i &lt; ii; i++) {
-</code><code id="L5201"><span class="ln">5201</span>                                    diff[attr][i]<span class="s"> = </span>[from[attr][i][<span class="d">0</span>]];
-</code><code id="L5202"><span class="ln">5202</span>                                    <b>for</b> (j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>from[attr][i].length; j &lt; jj; j++) {
-</code><code id="L5203"><span class="ln">5203</span>                                        diff[attr][i][j]<span class="s"> = </span>(to[attr][i][j]<span class="s"> - </span>from[attr][i][j])<span class="s"> / </span>ms;
-</code><code id="L5204"><span class="ln">5204</span>                                    }
-</code><code id="L5205"><span class="ln">5205</span>                                }
-</code><code id="L5206"><span class="ln">5206</span>                            } <b>else</b> {
-</code><code id="L5207"><span class="ln">5207</span>                                <b>var</b> m<span class="s"> = </span>(element.matrix<span class="s"> || </span><b>new</b> Matrix).m,
-</code><code id="L5208"><span class="ln">5208</span>                                    to2<span class="s"> = </span>{_:{transform: _.transform}, getBBox: <b>function</b> () { <b>return</b> element.getBBox(); }};
-</code><code id="L5209"><span class="ln">5209</span>                                from[attr]<span class="s"> = </span>[
-</code><code id="L5210"><span class="ln">5210</span>                                    m[<span class="d">0</span>][<span class="d">0</span>],
-</code><code id="L5211"><span class="ln">5211</span>                                    m[<span class="d">1</span>][<span class="d">0</span>],
-</code><code id="L5212"><span class="ln">5212</span>                                    m[<span class="d">0</span>][<span class="d">1</span>],
-</code><code id="L5213"><span class="ln">5213</span>                                    m[<span class="d">1</span>][<span class="d">1</span>],
-</code><code id="L5214"><span class="ln">5214</span>                                    m[<span class="d">0</span>][<span class="d">2</span>],
-</code><code id="L5215"><span class="ln">5215</span>                                    m[<span class="d">1</span>][<span class="d">2</span>]
-</code><code id="L5216"><span class="ln">5216</span>                                ];
-</code><code id="L5217"><span class="ln">5217</span>                                extractTransform(to2, to[attr]);
-</code><code id="L5218"><span class="ln">5218</span>                                to[attr]<span class="s"> = </span>to2._.transform;
-</code><code id="L5219"><span class="ln">5219</span>                                diff[attr]<span class="s"> = </span>[
-</code><code id="L5220"><span class="ln">5220</span>                                    (to2.matrix.m[<span class="d">0</span>][<span class="d">0</span>]<span class="s"> - </span>m[<span class="d">0</span>][<span class="d">0</span>])<span class="s"> / </span>ms,
-</code><code id="L5221"><span class="ln">5221</span>                                    (to2.matrix.m[<span class="d">1</span>][<span class="d">0</span>]<span class="s"> - </span>m[<span class="d">1</span>][<span class="d">0</span>])<span class="s"> / </span>ms,
-</code><code id="L5222"><span class="ln">5222</span>                                    (to2.matrix.m[<span class="d">0</span>][<span class="d">1</span>]<span class="s"> - </span>m[<span class="d">0</span>][<span class="d">1</span>])<span class="s"> / </span>ms,
-</code><code id="L5223"><span class="ln">5223</span>                                    (to2.matrix.m[<span class="d">1</span>][<span class="d">1</span>]<span class="s"> - </span>m[<span class="d">1</span>][<span class="d">1</span>])<span class="s"> / </span>ms,
-</code><code id="L5224"><span class="ln">5224</span>                                    (to2.matrix.m[<span class="d">0</span>][<span class="d">2</span>]<span class="s"> - </span>m[<span class="d">0</span>][<span class="d">2</span>])<span class="s"> / </span>ms,
-</code><code id="L5225"><span class="ln">5225</span>                                    (to2.matrix.m[<span class="d">1</span>][<span class="d">2</span>]<span class="s"> - </span>m[<span class="d">1</span>][<span class="d">2</span>])<span class="s"> / </span>ms
-</code><code id="L5226"><span class="ln">5226</span>                                ];
-</code><code id="L5227"><span class="ln">5227</span>                                <span class="c">// from[attr]<span class="s"> = </span>[_.sx, _.sy, _.deg, _.dx, _.dy];</span>
-</code><code id="L5228"><span class="ln">5228</span>                                <span class="c">// <b>var</b> to2<span class="s"> = </span>{_:{}, getBBox: <b>function</b> () { <b>return</b> element.getBBox(); }};</span>
-</code><code id="L5229"><span class="ln">5229</span>                                <span class="c">// extractTransform(to2, to[attr]);</span>
-</code><code id="L5230"><span class="ln">5230</span>                                <span class="c">// diff[attr]<span class="s"> = </span>[</span>
-</code><code id="L5231"><span class="ln">5231</span>                                <span class="c">//     (to2._.sx<span class="s"> - </span>_.sx)<span class="s"> / </span>ms,</span>
-</code><code id="L5232"><span class="ln">5232</span>                                <span class="c">//     (to2._.sy<span class="s"> - </span>_.sy)<span class="s"> / </span>ms,</span>
-</code><code id="L5233"><span class="ln">5233</span>                                <span class="c">//     (to2._.deg<span class="s"> - </span>_.deg)<span class="s"> / </span>ms,</span>
-</code><code id="L5234"><span class="ln">5234</span>                                <span class="c">//     (to2._.dx<span class="s"> - </span>_.dx)<span class="s"> / </span>ms,</span>
-</code><code id="L5235"><span class="ln">5235</span>                                <span class="c">//     (to2._.dy<span class="s"> - </span>_.dy)<span class="s"> / </span>ms</span>
-</code><code id="L5236"><span class="ln">5236</span>                                <span class="c">// ];</span>
-</code><code id="L5237"><span class="ln">5237</span>                            }
-</code><code id="L5238"><span class="ln">5238</span>                            <b>break</b>;
-</code><code id="L5239"><span class="ln">5239</span>                        <b>case</b> <i>"csv"</i>:
-</code><code id="L5240"><span class="ln">5240</span>                            <b>var</b> values<span class="s"> = </span>Str(params[attr]).split(separator),
-</code><code id="L5241"><span class="ln">5241</span>                                from2<span class="s"> = </span>Str(from[attr]).split(separator);
-</code><code id="L5242"><span class="ln">5242</span>                            <b>if</b> (attr<span class="s"> == </span><i>"clip-rect"</i>) {
-</code><code id="L5243"><span class="ln">5243</span>                                from[attr]<span class="s"> = </span>from2;
-</code><code id="L5244"><span class="ln">5244</span>                                diff[attr]<span class="s"> = </span>[];
-</code><code id="L5245"><span class="ln">5245</span>                                i<span class="s"> = </span>from2.length;
-</code><code id="L5246"><span class="ln">5246</span>                                <b>while</b> (i--) {
-</code><code id="L5247"><span class="ln">5247</span>                                    diff[attr][i]<span class="s"> = </span>(values[i]<span class="s"> - </span>from[attr][i])<span class="s"> / </span>ms;
-</code><code id="L5248"><span class="ln">5248</span>                                }
-</code><code id="L5249"><span class="ln">5249</span>                            }
-</code><code id="L5250"><span class="ln">5250</span>                            to[attr]<span class="s"> = </span>values;
-</code><code id="L5251"><span class="ln">5251</span>                            <b>break</b>;
-</code><code id="L5252"><span class="ln">5252</span>                        <b>default</b>:
-</code><code id="L5253"><span class="ln">5253</span>                            values<span class="s"> = </span>[].concat(params[attr]);
-</code><code id="L5254"><span class="ln">5254</span>                            from2<span class="s"> = </span>[].concat(from[attr]);
-</code><code id="L5255"><span class="ln">5255</span>                            diff[attr]<span class="s"> = </span>[];
-</code><code id="L5256"><span class="ln">5256</span>                            i<span class="s"> = </span>element.paper.customAttributes[attr].length;
-</code><code id="L5257"><span class="ln">5257</span>                            <b>while</b> (i--) {
-</code><code id="L5258"><span class="ln">5258</span>                                diff[attr][i]<span class="s"> = </span>((values[i]<span class="s"> || </span><span class="d">0</span>)<span class="s"> - </span>(from2[i]<span class="s"> || </span><span class="d">0</span>))<span class="s"> / </span>ms;
-</code><code id="L5259"><span class="ln">5259</span>                            }
-</code><code id="L5260"><span class="ln">5260</span>                            <b>break</b>;
-</code><code id="L5261"><span class="ln">5261</span>                    }
-</code><code id="L5262"><span class="ln">5262</span>                }
-</code><code id="L5263"><span class="ln">5263</span>            }
-</code><code id="L5264"><span class="ln">5264</span>            <b>var</b> easing<span class="s"> = </span>params.easing,
-</code><code id="L5265"><span class="ln">5265</span>                easyeasy<span class="s"> = </span>R.easing_formulas[easing];
-</code><code id="L5266"><span class="ln">5266</span>            <b>if</b> (!easyeasy) {
-</code><code id="L5267"><span class="ln">5267</span>                easyeasy<span class="s"> = </span>Str(easing).match(bezierrg);
-</code><code id="L5268"><span class="ln">5268</span>                <b>if</b> (easyeasy<span class="s"> &amp;&amp; </span>easyeasy.length<span class="s"> == </span><span class="d">5</span>) {
-</code><code id="L5269"><span class="ln">5269</span>                    <b>var</b> curve<span class="s"> = </span>easyeasy;
-</code><code id="L5270"><span class="ln">5270</span>                    easyeasy<span class="s"> = </span><b>function</b> (t) {
-</code><code id="L5271"><span class="ln">5271</span>                        <b>return</b> CubicBezierAtTime(t, +curve[<span class="d">1</span>], +curve[<span class="d">2</span>], +curve[<span class="d">3</span>], +curve[<span class="d">4</span>], ms);
-</code><code id="L5272"><span class="ln">5272</span>                    };
-</code><code id="L5273"><span class="ln">5273</span>                } <b>else</b> {
-</code><code id="L5274"><span class="ln">5274</span>                    easyeasy<span class="s"> = </span>pipe;
-</code><code id="L5275"><span class="ln">5275</span>                }
-</code><code id="L5276"><span class="ln">5276</span>            }
-</code><code id="L5277"><span class="ln">5277</span>            timestamp<span class="s"> = </span>params.start<span class="s"> || </span>anim.start<span class="s"> || </span>+<b>new</b> Date;
-</code><code id="L5278"><span class="ln">5278</span>            e<span class="s"> = </span>{
-</code><code id="L5279"><span class="ln">5279</span>                anim: anim,
-</code><code id="L5280"><span class="ln">5280</span>                percent: percent,
-</code><code id="L5281"><span class="ln">5281</span>                timestamp: timestamp,
-</code><code id="L5282"><span class="ln">5282</span>                start: timestamp<span class="s"> + </span>(anim.del<span class="s"> || </span><span class="d">0</span>),
-</code><code id="L5283"><span class="ln">5283</span>                status: <span class="d">0</span>,
-</code><code id="L5284"><span class="ln">5284</span>                initstatus: status<span class="s"> || </span><span class="d">0</span>,
-</code><code id="L5285"><span class="ln">5285</span>                stop: <b>false</b>,
-</code><code id="L5286"><span class="ln">5286</span>                ms: ms,
-</code><code id="L5287"><span class="ln">5287</span>                easing: easyeasy,
-</code><code id="L5288"><span class="ln">5288</span>                from: from,
-</code><code id="L5289"><span class="ln">5289</span>                diff: diff,
-</code><code id="L5290"><span class="ln">5290</span>                to: to,
-</code><code id="L5291"><span class="ln">5291</span>                el: element,
-</code><code id="L5292"><span class="ln">5292</span>                callback: params.callback,
-</code><code id="L5293"><span class="ln">5293</span>                prev: prev,
-</code><code id="L5294"><span class="ln">5294</span>                next: next,
-</code><code id="L5295"><span class="ln">5295</span>                repeat: anim.times,
-</code><code id="L5296"><span class="ln">5296</span>                origin: element.attr(),
-</code><code id="L5297"><span class="ln">5297</span>                totalOrigin: totalOrigin
-</code><code id="L5298"><span class="ln">5298</span>            };
-</code><code id="L5299"><span class="ln">5299</span>            animationElements.push(e);
-</code><code id="L5300"><span class="ln">5300</span>            <b>if</b> (status<span class="s"> &amp;&amp; </span>!isInAnim) {
-</code><code id="L5301"><span class="ln">5301</span>                e.stop<span class="s"> = </span><b>true</b>;
-</code><code id="L5302"><span class="ln">5302</span>                e.start<span class="s"> = </span><b>new</b> Date<span class="s"> - </span>ms<span class="s"> * </span>status;
-</code><code id="L5303"><span class="ln">5303</span>                <b>if</b> (animationElements.length<span class="s"> == </span><span class="d">1</span>) {
-</code><code id="L5304"><span class="ln">5304</span>                    <b>return</b> animation();
-</code><code id="L5305"><span class="ln">5305</span>                }
-</code><code id="L5306"><span class="ln">5306</span>            }
-</code><code id="L5307"><span class="ln">5307</span>            animationElements.length<span class="s"> == </span><span class="d">1</span><span class="s"> &amp;&amp; </span>requestAnimFrame(animation);
-</code><code id="L5308"><span class="ln">5308</span>        } <b>else</b> {
-</code><code id="L5309"><span class="ln">5309</span>            isInAnim.initstatus<span class="s"> = </span>status;
-</code><code id="L5310"><span class="ln">5310</span>            isInAnim.start<span class="s"> = </span><b>new</b> Date<span class="s"> - </span>isInAnim.ms<span class="s"> * </span>status;
-</code><code id="L5311"><span class="ln">5311</span>        }
-</code><code id="L5312"><span class="ln">5312</span>        eve(<i>"anim.start."</i><span class="s"> + </span>element.id, element, anim);
-</code><code id="L5313"><span class="ln">5313</span>    }
-</code><code id="L5314"><span class="ln">5314</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5315"><span class="ln">5315</span><span class="c">    <span class="s"> * </span>Raphael.animation
-</span></code><code id="L5316"><span class="ln">5316</span><span class="c">     [ method ]
-</span></code><code id="L5317"><span class="ln">5317</span><span class="c">     **
-</span></code><code id="L5318"><span class="ln">5318</span><span class="c">    <span class="s"> * </span>Creates animation object. That later could be used <b>for</b> @Element.animate or @Element.animateWith methods.
-</span></code><code id="L5319"><span class="ln">5319</span><span class="c">    <span class="s"> * </span>See also @Animation.delay and @Animation.repeat methods.
+</span></code><code id="L5106"><span class="ln">5106</span><span class="c">    <span class="s"> = </span>(object) <b>new</b> altered Animation object
+</span></code><code id="L5107"><span class="ln">5107</span><span class="c">    \*/</span>
+</code><code id="L5108"><span class="ln">5108</span>    Animation.prototype.repeat<span class="s"> = </span><b>function</b> (times) { 
+</code><code id="L5109"><span class="ln">5109</span>        <b>var</b> a<span class="s"> = </span><b>new</b> Animation(<b>this</b>.anim, <b>this</b>.ms);
+</code><code id="L5110"><span class="ln">5110</span>        a.del<span class="s"> = </span><b>this</b>.del;
+</code><code id="L5111"><span class="ln">5111</span>        a.times<span class="s"> = </span>math.floor(mmax(times, <span class="d">0</span>))<span class="s"> || </span><span class="d">1</span>;
+</code><code id="L5112"><span class="ln">5112</span>        <b>return</b> a;
+</code><code id="L5113"><span class="ln">5113</span>    };
+</code><code id="L5114"><span class="ln">5114</span>    <b>function</b> runAnimation(anim, element, percent, status, totalOrigin) {
+</code><code id="L5115"><span class="ln">5115</span>        percent<span class="s"> = </span>toFloat(percent);
+</code><code id="L5116"><span class="ln">5116</span>        <b>var</b> params,
+</code><code id="L5117"><span class="ln">5117</span>            isInAnim,
+</code><code id="L5118"><span class="ln">5118</span>            isInAnimSet,
+</code><code id="L5119"><span class="ln">5119</span>            percents<span class="s"> = </span>[],
+</code><code id="L5120"><span class="ln">5120</span>            next,
+</code><code id="L5121"><span class="ln">5121</span>            prev,
+</code><code id="L5122"><span class="ln">5122</span>            timestamp,
+</code><code id="L5123"><span class="ln">5123</span>            ms<span class="s"> = </span>anim.ms,
+</code><code id="L5124"><span class="ln">5124</span>            from<span class="s"> = </span>{},
+</code><code id="L5125"><span class="ln">5125</span>            to<span class="s"> = </span>{},
+</code><code id="L5126"><span class="ln">5126</span>            diff<span class="s"> = </span>{};
+</code><code id="L5127"><span class="ln">5127</span>        <b>if</b> (status) {
+</code><code id="L5128"><span class="ln">5128</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>animationElements.length; i &lt; ii; i++) {
+</code><code id="L5129"><span class="ln">5129</span>                <b>var</b> e<span class="s"> = </span>animationElements[i];
+</code><code id="L5130"><span class="ln">5130</span>                <b>if</b> (e.el.id<span class="s"> == </span>element.id<span class="s"> &amp;&amp; </span>e.anim<span class="s"> == </span>anim) {
+</code><code id="L5131"><span class="ln">5131</span>                    <b>if</b> (e.percent != percent) {
+</code><code id="L5132"><span class="ln">5132</span>                        animationElements.splice(i, <span class="d">1</span>);
+</code><code id="L5133"><span class="ln">5133</span>                        isInAnimSet<span class="s"> = </span><span class="d">1</span>;
+</code><code id="L5134"><span class="ln">5134</span>                    } <b>else</b> {
+</code><code id="L5135"><span class="ln">5135</span>                        isInAnim<span class="s"> = </span>e;
+</code><code id="L5136"><span class="ln">5136</span>                    }
+</code><code id="L5137"><span class="ln">5137</span>                    element.attr(e.totalOrigin);
+</code><code id="L5138"><span class="ln">5138</span>                    <b>break</b>;
+</code><code id="L5139"><span class="ln">5139</span>                }
+</code><code id="L5140"><span class="ln">5140</span>            }
+</code><code id="L5141"><span class="ln">5141</span>        } <b>else</b> {
+</code><code id="L5142"><span class="ln">5142</span>            status<span class="s"> = </span><span class="d">0</span><span class="s"> / </span><span class="d">0</span>;
+</code><code id="L5143"><span class="ln">5143</span>        }
+</code><code id="L5144"><span class="ln">5144</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>anim.percents.length; i &lt; ii; i++) {
+</code><code id="L5145"><span class="ln">5145</span>            <b>if</b> (anim.percents[i]<span class="s"> == </span>percent<span class="s"> || </span>anim.percents[i] > status<span class="s"> * </span>anim.top) {
+</code><code id="L5146"><span class="ln">5146</span>                percent<span class="s"> = </span>anim.percents[i];
+</code><code id="L5147"><span class="ln">5147</span>                prev<span class="s"> = </span>anim.percents[i<span class="s"> - </span><span class="d">1</span>]<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L5148"><span class="ln">5148</span>                ms<span class="s"> = </span>ms<span class="s"> / </span>anim.top<span class="s"> * </span>(percent<span class="s"> - </span>prev);
+</code><code id="L5149"><span class="ln">5149</span>                next<span class="s"> = </span>anim.percents[i<span class="s"> + </span><span class="d">1</span>];
+</code><code id="L5150"><span class="ln">5150</span>                params<span class="s"> = </span>anim.anim[percent];
+</code><code id="L5151"><span class="ln">5151</span>                <b>break</b>;
+</code><code id="L5152"><span class="ln">5152</span>            } <b>else</b> <b>if</b> (status) {
+</code><code id="L5153"><span class="ln">5153</span>                element.attr(anim.anim[anim.percents[i]]);
+</code><code id="L5154"><span class="ln">5154</span>            }
+</code><code id="L5155"><span class="ln">5155</span>        }
+</code><code id="L5156"><span class="ln">5156</span>        <b>if</b> (!params) {
+</code><code id="L5157"><span class="ln">5157</span>            <b>return</b>;
+</code><code id="L5158"><span class="ln">5158</span>        }
+</code><code id="L5159"><span class="ln">5159</span>        <b>if</b> (!isInAnim) {
+</code><code id="L5160"><span class="ln">5160</span>            <b>for</b> (attr <b>in</b> params) <b>if</b> (params[has](attr)) {
+</code><code id="L5161"><span class="ln">5161</span>                <b>if</b> (availableAnimAttrs[has](attr)<span class="s"> || </span>element.paper.customAttributes[has](attr)) {
+</code><code id="L5162"><span class="ln">5162</span>                    from[attr]<span class="s"> = </span>element.attr(attr);
+</code><code id="L5163"><span class="ln">5163</span>                    (from[attr]<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(from[attr]<span class="s"> = </span>availableAttrs[attr]);
+</code><code id="L5164"><span class="ln">5164</span>                    to[attr]<span class="s"> = </span>params[attr];
+</code><code id="L5165"><span class="ln">5165</span>                    <b>switch</b> (availableAnimAttrs[attr]) {
+</code><code id="L5166"><span class="ln">5166</span>                        <b>case</b> nu:
+</code><code id="L5167"><span class="ln">5167</span>                            diff[attr]<span class="s"> = </span>(to[attr]<span class="s"> - </span>from[attr])<span class="s"> / </span>ms;
+</code><code id="L5168"><span class="ln">5168</span>                            <b>break</b>;
+</code><code id="L5169"><span class="ln">5169</span>                        <b>case</b> <i>"colour"</i>:
+</code><code id="L5170"><span class="ln">5170</span>                            from[attr]<span class="s"> = </span>R.getRGB(from[attr]);
+</code><code id="L5171"><span class="ln">5171</span>                            <b>var</b> toColour<span class="s"> = </span>R.getRGB(to[attr]);
+</code><code id="L5172"><span class="ln">5172</span>                            diff[attr]<span class="s"> = </span>{
+</code><code id="L5173"><span class="ln">5173</span>                                r: (toColour.r<span class="s"> - </span>from[attr].r)<span class="s"> / </span>ms,
+</code><code id="L5174"><span class="ln">5174</span>                                g: (toColour.g<span class="s"> - </span>from[attr].g)<span class="s"> / </span>ms,
+</code><code id="L5175"><span class="ln">5175</span>                                b: (toColour.b<span class="s"> - </span>from[attr].b)<span class="s"> / </span>ms
+</code><code id="L5176"><span class="ln">5176</span>                            };
+</code><code id="L5177"><span class="ln">5177</span>                            <b>break</b>;
+</code><code id="L5178"><span class="ln">5178</span>                        <b>case</b> <i>"path"</i>:
+</code><code id="L5179"><span class="ln">5179</span>                            <b>var</b> pathes<span class="s"> = </span>path2curve(from[attr], to[attr]),
+</code><code id="L5180"><span class="ln">5180</span>                                toPath<span class="s"> = </span>pathes[<span class="d">1</span>];
+</code><code id="L5181"><span class="ln">5181</span>                            from[attr]<span class="s"> = </span>pathes[<span class="d">0</span>];
+</code><code id="L5182"><span class="ln">5182</span>                            diff[attr]<span class="s"> = </span>[];
+</code><code id="L5183"><span class="ln">5183</span>                            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>from[attr].length; i &lt; ii; i++) {
+</code><code id="L5184"><span class="ln">5184</span>                                diff[attr][i]<span class="s"> = </span>[<span class="d">0</span>];
+</code><code id="L5185"><span class="ln">5185</span>                                <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>from[attr][i].length; j &lt; jj; j++) {
+</code><code id="L5186"><span class="ln">5186</span>                                    diff[attr][i][j]<span class="s"> = </span>(toPath[i][j]<span class="s"> - </span>from[attr][i][j])<span class="s"> / </span>ms;
+</code><code id="L5187"><span class="ln">5187</span>                                }
+</code><code id="L5188"><span class="ln">5188</span>                            }
+</code><code id="L5189"><span class="ln">5189</span>                            <b>break</b>;
+</code><code id="L5190"><span class="ln">5190</span>                        <b>case</b> <i>"transform"</i>:
+</code><code id="L5191"><span class="ln">5191</span>                            <b>var</b> _<span class="s"> = </span>element._,
+</code><code id="L5192"><span class="ln">5192</span>                                eq<span class="s"> = </span>equaliseTransform(_[attr], to[attr]);
+</code><code id="L5193"><span class="ln">5193</span>                            <b>if</b> (eq) {
+</code><code id="L5194"><span class="ln">5194</span>                                from[attr]<span class="s"> = </span>eq.from;
+</code><code id="L5195"><span class="ln">5195</span>                                to[attr]<span class="s"> = </span>eq.to;
+</code><code id="L5196"><span class="ln">5196</span>                                diff[attr]<span class="s"> = </span>[];
+</code><code id="L5197"><span class="ln">5197</span>                                diff[attr].real<span class="s"> = </span><b>true</b>;
+</code><code id="L5198"><span class="ln">5198</span>                                <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>from[attr].length; i &lt; ii; i++) {
+</code><code id="L5199"><span class="ln">5199</span>                                    diff[attr][i]<span class="s"> = </span>[from[attr][i][<span class="d">0</span>]];
+</code><code id="L5200"><span class="ln">5200</span>                                    <b>for</b> (j<span class="s"> = </span><span class="d">1</span>, jj<span class="s"> = </span>from[attr][i].length; j &lt; jj; j++) {
+</code><code id="L5201"><span class="ln">5201</span>                                        diff[attr][i][j]<span class="s"> = </span>(to[attr][i][j]<span class="s"> - </span>from[attr][i][j])<span class="s"> / </span>ms;
+</code><code id="L5202"><span class="ln">5202</span>                                    }
+</code><code id="L5203"><span class="ln">5203</span>                                }
+</code><code id="L5204"><span class="ln">5204</span>                            } <b>else</b> {
+</code><code id="L5205"><span class="ln">5205</span>                                <b>var</b> m<span class="s"> = </span>(element.matrix<span class="s"> || </span><b>new</b> Matrix).m,
+</code><code id="L5206"><span class="ln">5206</span>                                    to2<span class="s"> = </span>{_:{transform: _.transform}, getBBox: <b>function</b> () { <b>return</b> element.getBBox(); }};
+</code><code id="L5207"><span class="ln">5207</span>                                from[attr]<span class="s"> = </span>[
+</code><code id="L5208"><span class="ln">5208</span>                                    m[<span class="d">0</span>][<span class="d">0</span>],
+</code><code id="L5209"><span class="ln">5209</span>                                    m[<span class="d">1</span>][<span class="d">0</span>],
+</code><code id="L5210"><span class="ln">5210</span>                                    m[<span class="d">0</span>][<span class="d">1</span>],
+</code><code id="L5211"><span class="ln">5211</span>                                    m[<span class="d">1</span>][<span class="d">1</span>],
+</code><code id="L5212"><span class="ln">5212</span>                                    m[<span class="d">0</span>][<span class="d">2</span>],
+</code><code id="L5213"><span class="ln">5213</span>                                    m[<span class="d">1</span>][<span class="d">2</span>]
+</code><code id="L5214"><span class="ln">5214</span>                                ];
+</code><code id="L5215"><span class="ln">5215</span>                                extractTransform(to2, to[attr]);
+</code><code id="L5216"><span class="ln">5216</span>                                to[attr]<span class="s"> = </span>to2._.transform;
+</code><code id="L5217"><span class="ln">5217</span>                                diff[attr]<span class="s"> = </span>[
+</code><code id="L5218"><span class="ln">5218</span>                                    (to2.matrix.m[<span class="d">0</span>][<span class="d">0</span>]<span class="s"> - </span>m[<span class="d">0</span>][<span class="d">0</span>])<span class="s"> / </span>ms,
+</code><code id="L5219"><span class="ln">5219</span>                                    (to2.matrix.m[<span class="d">1</span>][<span class="d">0</span>]<span class="s"> - </span>m[<span class="d">1</span>][<span class="d">0</span>])<span class="s"> / </span>ms,
+</code><code id="L5220"><span class="ln">5220</span>                                    (to2.matrix.m[<span class="d">0</span>][<span class="d">1</span>]<span class="s"> - </span>m[<span class="d">0</span>][<span class="d">1</span>])<span class="s"> / </span>ms,
+</code><code id="L5221"><span class="ln">5221</span>                                    (to2.matrix.m[<span class="d">1</span>][<span class="d">1</span>]<span class="s"> - </span>m[<span class="d">1</span>][<span class="d">1</span>])<span class="s"> / </span>ms,
+</code><code id="L5222"><span class="ln">5222</span>                                    (to2.matrix.m[<span class="d">0</span>][<span class="d">2</span>]<span class="s"> - </span>m[<span class="d">0</span>][<span class="d">2</span>])<span class="s"> / </span>ms,
+</code><code id="L5223"><span class="ln">5223</span>                                    (to2.matrix.m[<span class="d">1</span>][<span class="d">2</span>]<span class="s"> - </span>m[<span class="d">1</span>][<span class="d">2</span>])<span class="s"> / </span>ms
+</code><code id="L5224"><span class="ln">5224</span>                                ];
+</code><code id="L5225"><span class="ln">5225</span>                                <span class="c">// from[attr]<span class="s"> = </span>[_.sx, _.sy, _.deg, _.dx, _.dy];</span>
+</code><code id="L5226"><span class="ln">5226</span>                                <span class="c">// <b>var</b> to2<span class="s"> = </span>{_:{}, getBBox: <b>function</b> () { <b>return</b> element.getBBox(); }};</span>
+</code><code id="L5227"><span class="ln">5227</span>                                <span class="c">// extractTransform(to2, to[attr]);</span>
+</code><code id="L5228"><span class="ln">5228</span>                                <span class="c">// diff[attr]<span class="s"> = </span>[</span>
+</code><code id="L5229"><span class="ln">5229</span>                                <span class="c">//     (to2._.sx<span class="s"> - </span>_.sx)<span class="s"> / </span>ms,</span>
+</code><code id="L5230"><span class="ln">5230</span>                                <span class="c">//     (to2._.sy<span class="s"> - </span>_.sy)<span class="s"> / </span>ms,</span>
+</code><code id="L5231"><span class="ln">5231</span>                                <span class="c">//     (to2._.deg<span class="s"> - </span>_.deg)<span class="s"> / </span>ms,</span>
+</code><code id="L5232"><span class="ln">5232</span>                                <span class="c">//     (to2._.dx<span class="s"> - </span>_.dx)<span class="s"> / </span>ms,</span>
+</code><code id="L5233"><span class="ln">5233</span>                                <span class="c">//     (to2._.dy<span class="s"> - </span>_.dy)<span class="s"> / </span>ms</span>
+</code><code id="L5234"><span class="ln">5234</span>                                <span class="c">// ];</span>
+</code><code id="L5235"><span class="ln">5235</span>                            }
+</code><code id="L5236"><span class="ln">5236</span>                            <b>break</b>;
+</code><code id="L5237"><span class="ln">5237</span>                        <b>case</b> <i>"csv"</i>:
+</code><code id="L5238"><span class="ln">5238</span>                            <b>var</b> values<span class="s"> = </span>Str(params[attr]).split(separator),
+</code><code id="L5239"><span class="ln">5239</span>                                from2<span class="s"> = </span>Str(from[attr]).split(separator);
+</code><code id="L5240"><span class="ln">5240</span>                            <b>if</b> (attr<span class="s"> == </span><i>"clip-rect"</i>) {
+</code><code id="L5241"><span class="ln">5241</span>                                from[attr]<span class="s"> = </span>from2;
+</code><code id="L5242"><span class="ln">5242</span>                                diff[attr]<span class="s"> = </span>[];
+</code><code id="L5243"><span class="ln">5243</span>                                i<span class="s"> = </span>from2.length;
+</code><code id="L5244"><span class="ln">5244</span>                                <b>while</b> (i--) {
+</code><code id="L5245"><span class="ln">5245</span>                                    diff[attr][i]<span class="s"> = </span>(values[i]<span class="s"> - </span>from[attr][i])<span class="s"> / </span>ms;
+</code><code id="L5246"><span class="ln">5246</span>                                }
+</code><code id="L5247"><span class="ln">5247</span>                            }
+</code><code id="L5248"><span class="ln">5248</span>                            to[attr]<span class="s"> = </span>values;
+</code><code id="L5249"><span class="ln">5249</span>                            <b>break</b>;
+</code><code id="L5250"><span class="ln">5250</span>                        <b>default</b>:
+</code><code id="L5251"><span class="ln">5251</span>                            values<span class="s"> = </span>[].concat(params[attr]);
+</code><code id="L5252"><span class="ln">5252</span>                            from2<span class="s"> = </span>[].concat(from[attr]);
+</code><code id="L5253"><span class="ln">5253</span>                            diff[attr]<span class="s"> = </span>[];
+</code><code id="L5254"><span class="ln">5254</span>                            i<span class="s"> = </span>element.paper.customAttributes[attr].length;
+</code><code id="L5255"><span class="ln">5255</span>                            <b>while</b> (i--) {
+</code><code id="L5256"><span class="ln">5256</span>                                diff[attr][i]<span class="s"> = </span>((values[i]<span class="s"> || </span><span class="d">0</span>)<span class="s"> - </span>(from2[i]<span class="s"> || </span><span class="d">0</span>))<span class="s"> / </span>ms;
+</code><code id="L5257"><span class="ln">5257</span>                            }
+</code><code id="L5258"><span class="ln">5258</span>                            <b>break</b>;
+</code><code id="L5259"><span class="ln">5259</span>                    }
+</code><code id="L5260"><span class="ln">5260</span>                }
+</code><code id="L5261"><span class="ln">5261</span>            }
+</code><code id="L5262"><span class="ln">5262</span>            <b>var</b> easing<span class="s"> = </span>params.easing,
+</code><code id="L5263"><span class="ln">5263</span>                easyeasy<span class="s"> = </span>R.easing_formulas[easing];
+</code><code id="L5264"><span class="ln">5264</span>            <b>if</b> (!easyeasy) {
+</code><code id="L5265"><span class="ln">5265</span>                easyeasy<span class="s"> = </span>Str(easing).match(bezierrg);
+</code><code id="L5266"><span class="ln">5266</span>                <b>if</b> (easyeasy<span class="s"> &amp;&amp; </span>easyeasy.length<span class="s"> == </span><span class="d">5</span>) {
+</code><code id="L5267"><span class="ln">5267</span>                    <b>var</b> curve<span class="s"> = </span>easyeasy;
+</code><code id="L5268"><span class="ln">5268</span>                    easyeasy<span class="s"> = </span><b>function</b> (t) {
+</code><code id="L5269"><span class="ln">5269</span>                        <b>return</b> CubicBezierAtTime(t, +curve[<span class="d">1</span>], +curve[<span class="d">2</span>], +curve[<span class="d">3</span>], +curve[<span class="d">4</span>], ms);
+</code><code id="L5270"><span class="ln">5270</span>                    };
+</code><code id="L5271"><span class="ln">5271</span>                } <b>else</b> {
+</code><code id="L5272"><span class="ln">5272</span>                    easyeasy<span class="s"> = </span>pipe;
+</code><code id="L5273"><span class="ln">5273</span>                }
+</code><code id="L5274"><span class="ln">5274</span>            }
+</code><code id="L5275"><span class="ln">5275</span>            timestamp<span class="s"> = </span>params.start<span class="s"> || </span>anim.start<span class="s"> || </span>+<b>new</b> Date;
+</code><code id="L5276"><span class="ln">5276</span>            e<span class="s"> = </span>{
+</code><code id="L5277"><span class="ln">5277</span>                anim: anim,
+</code><code id="L5278"><span class="ln">5278</span>                percent: percent,
+</code><code id="L5279"><span class="ln">5279</span>                timestamp: timestamp,
+</code><code id="L5280"><span class="ln">5280</span>                start: timestamp<span class="s"> + </span>(anim.del<span class="s"> || </span><span class="d">0</span>),
+</code><code id="L5281"><span class="ln">5281</span>                status: <span class="d">0</span>,
+</code><code id="L5282"><span class="ln">5282</span>                initstatus: status<span class="s"> || </span><span class="d">0</span>,
+</code><code id="L5283"><span class="ln">5283</span>                stop: <b>false</b>,
+</code><code id="L5284"><span class="ln">5284</span>                ms: ms,
+</code><code id="L5285"><span class="ln">5285</span>                easing: easyeasy,
+</code><code id="L5286"><span class="ln">5286</span>                from: from,
+</code><code id="L5287"><span class="ln">5287</span>                diff: diff,
+</code><code id="L5288"><span class="ln">5288</span>                to: to,
+</code><code id="L5289"><span class="ln">5289</span>                el: element,
+</code><code id="L5290"><span class="ln">5290</span>                callback: params.callback,
+</code><code id="L5291"><span class="ln">5291</span>                prev: prev,
+</code><code id="L5292"><span class="ln">5292</span>                next: next,
+</code><code id="L5293"><span class="ln">5293</span>                repeat: anim.times,
+</code><code id="L5294"><span class="ln">5294</span>                origin: element.attr(),
+</code><code id="L5295"><span class="ln">5295</span>                totalOrigin: totalOrigin
+</code><code id="L5296"><span class="ln">5296</span>            };
+</code><code id="L5297"><span class="ln">5297</span>            animationElements.push(e);
+</code><code id="L5298"><span class="ln">5298</span>            <b>if</b> (status<span class="s"> &amp;&amp; </span>!isInAnim) {
+</code><code id="L5299"><span class="ln">5299</span>                e.stop<span class="s"> = </span><b>true</b>;
+</code><code id="L5300"><span class="ln">5300</span>                e.start<span class="s"> = </span><b>new</b> Date<span class="s"> - </span>ms<span class="s"> * </span>status;
+</code><code id="L5301"><span class="ln">5301</span>                <b>if</b> (animationElements.length<span class="s"> == </span><span class="d">1</span>) {
+</code><code id="L5302"><span class="ln">5302</span>                    <b>return</b> animation();
+</code><code id="L5303"><span class="ln">5303</span>                }
+</code><code id="L5304"><span class="ln">5304</span>            }
+</code><code id="L5305"><span class="ln">5305</span>            animationElements.length<span class="s"> == </span><span class="d">1</span><span class="s"> &amp;&amp; </span>requestAnimFrame(animation);
+</code><code id="L5306"><span class="ln">5306</span>        } <b>else</b> {
+</code><code id="L5307"><span class="ln">5307</span>            isInAnim.initstatus<span class="s"> = </span>status;
+</code><code id="L5308"><span class="ln">5308</span>            isInAnim.start<span class="s"> = </span><b>new</b> Date<span class="s"> - </span>isInAnim.ms<span class="s"> * </span>status;
+</code><code id="L5309"><span class="ln">5309</span>        }
+</code><code id="L5310"><span class="ln">5310</span>        eve(<i>"anim.start."</i><span class="s"> + </span>element.id, element, anim);
+</code><code id="L5311"><span class="ln">5311</span>    }
+</code><code id="L5312"><span class="ln">5312</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5313"><span class="ln">5313</span><span class="c">    <span class="s"> * </span>Raphael.animation
+</span></code><code id="L5314"><span class="ln">5314</span><span class="c">     [ method ]
+</span></code><code id="L5315"><span class="ln">5315</span><span class="c">     **
+</span></code><code id="L5316"><span class="ln">5316</span><span class="c">    <span class="s"> * </span>Creates an animation object that can be passed to the @Element.animate or @Element.animateWith methods.
+</span></code><code id="L5317"><span class="ln">5317</span><span class="c">    <span class="s"> * </span>See also @Animation.delay and @Animation.repeat methods.
+</span></code><code id="L5318"><span class="ln">5318</span><span class="c">     **
+</span></code><code id="L5319"><span class="ln">5319</span><span class="c">     > Parameters
 </span></code><code id="L5320"><span class="ln">5320</span><span class="c">     **
-</span></code><code id="L5321"><span class="ln">5321</span><span class="c">     > Parameters
-</span></code><code id="L5322"><span class="ln">5322</span><span class="c">     **
-</span></code><code id="L5323"><span class="ln">5323</span><span class="c">    <span class="s"> - </span>params (object) <b>final</b> attributes <b>for</b> the element, see also @Element.attr
-</span></code><code id="L5324"><span class="ln">5324</span><span class="c">    <span class="s"> - </span>ms (number) number of milliseconds <b>for</b> animation to run
-</span></code><code id="L5325"><span class="ln">5325</span><span class="c">    <span class="s"> - </span>easing (string) #optional easing type. Accept one of @Raphael.easing_formulas or CSS format: `cubic&#x2010;bezier(XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX)`
-</span></code><code id="L5326"><span class="ln">5326</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) #optional callback <b>function</b>. Will be called at the end of animation.
-</span></code><code id="L5327"><span class="ln">5327</span><span class="c">     **
-</span></code><code id="L5328"><span class="ln">5328</span><span class="c">    <span class="s"> = </span>(object) @Animation
-</span></code><code id="L5329"><span class="ln">5329</span><span class="c">    \*/</span>
-</code><code id="L5330"><span class="ln">5330</span>    R.animation<span class="s"> = </span><b>function</b> (params, ms, easing, callback) {
-</code><code id="L5331"><span class="ln">5331</span>        <b>if</b> (R.is(easing, <i>"<b>function</b>"</i>)<span class="s"> || </span>!easing) {
-</code><code id="L5332"><span class="ln">5332</span>            callback<span class="s"> = </span>callback<span class="s"> || </span>easing<span class="s"> || </span><b>null</b>;
-</code><code id="L5333"><span class="ln">5333</span>            easing<span class="s"> = </span><b>null</b>;
-</code><code id="L5334"><span class="ln">5334</span>        }
-</code><code id="L5335"><span class="ln">5335</span>        params<span class="s"> = </span>Object(params);
-</code><code id="L5336"><span class="ln">5336</span>        ms<span class="s"> = </span>+ms<span class="s"> || </span><span class="d">0</span>;
-</code><code id="L5337"><span class="ln">5337</span>        <b>var</b> p<span class="s"> = </span>{},
-</code><code id="L5338"><span class="ln">5338</span>            json,
-</code><code id="L5339"><span class="ln">5339</span>            attr;
-</code><code id="L5340"><span class="ln">5340</span>        <b>for</b> (attr <b>in</b> params) <b>if</b> (params[has](attr)<span class="s"> &amp;&amp; </span>toFloat(attr) != attr) {
-</code><code id="L5341"><span class="ln">5341</span>            json<span class="s"> = </span><b>true</b>;
-</code><code id="L5342"><span class="ln">5342</span>            p[attr]<span class="s"> = </span>params[attr];
-</code><code id="L5343"><span class="ln">5343</span>        }
-</code><code id="L5344"><span class="ln">5344</span>        <b>if</b> (!json) {
-</code><code id="L5345"><span class="ln">5345</span>            <b>return</b> <b>new</b> Animation(params, ms);
-</code><code id="L5346"><span class="ln">5346</span>        } <b>else</b> {
-</code><code id="L5347"><span class="ln">5347</span>            easing<span class="s"> &amp;&amp; </span>(p.easing<span class="s"> = </span>easing);
-</code><code id="L5348"><span class="ln">5348</span>            callback<span class="s"> &amp;&amp; </span>(p.callback<span class="s"> = </span>callback);
-</code><code id="L5349"><span class="ln">5349</span>            <b>return</b> <b>new</b> Animation({<span class="d">100</span>: p}, ms);
-</code><code id="L5350"><span class="ln">5350</span>        }
-</code><code id="L5351"><span class="ln">5351</span>    };
-</code><code id="L5352"><span class="ln">5352</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5353"><span class="ln">5353</span><span class="c">    <span class="s"> * </span>Element.animate
-</span></code><code id="L5354"><span class="ln">5354</span><span class="c">     [ method ]
+</span></code><code id="L5321"><span class="ln">5321</span><span class="c">    <span class="s"> - </span>params (object) <b>final</b> attributes <b>for</b> the element, see also @Element.attr
+</span></code><code id="L5322"><span class="ln">5322</span><span class="c">    <span class="s"> - </span>ms (number) number of milliseconds <b>for</b> animation to run
+</span></code><code id="L5323"><span class="ln">5323</span><span class="c">    <span class="s"> - </span>easing (string) #optional easing type. Accept one of @Raphael.easing_formulas or CSS format: `cubic&#x2010;bezier(XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX)`
+</span></code><code id="L5324"><span class="ln">5324</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) #optional callback <b>function</b>. Will be called at the end of animation.
+</span></code><code id="L5325"><span class="ln">5325</span><span class="c">     **
+</span></code><code id="L5326"><span class="ln">5326</span><span class="c">    <span class="s"> = </span>(object) @Animation
+</span></code><code id="L5327"><span class="ln">5327</span><span class="c">    \*/</span>
+</code><code id="L5328"><span class="ln">5328</span>    R.animation<span class="s"> = </span><b>function</b> (params, ms, easing, callback) {
+</code><code id="L5329"><span class="ln">5329</span>        <b>if</b> (R.is(easing, <i>"<b>function</b>"</i>)<span class="s"> || </span>!easing) {
+</code><code id="L5330"><span class="ln">5330</span>            callback<span class="s"> = </span>callback<span class="s"> || </span>easing<span class="s"> || </span><b>null</b>;
+</code><code id="L5331"><span class="ln">5331</span>            easing<span class="s"> = </span><b>null</b>;
+</code><code id="L5332"><span class="ln">5332</span>        }
+</code><code id="L5333"><span class="ln">5333</span>        params<span class="s"> = </span>Object(params);
+</code><code id="L5334"><span class="ln">5334</span>        ms<span class="s"> = </span>+ms<span class="s"> || </span><span class="d">0</span>;
+</code><code id="L5335"><span class="ln">5335</span>        <b>var</b> p<span class="s"> = </span>{},
+</code><code id="L5336"><span class="ln">5336</span>            json,
+</code><code id="L5337"><span class="ln">5337</span>            attr;
+</code><code id="L5338"><span class="ln">5338</span>        <b>for</b> (attr <b>in</b> params) <b>if</b> (params[has](attr)<span class="s"> &amp;&amp; </span>toFloat(attr) != attr) {
+</code><code id="L5339"><span class="ln">5339</span>            json<span class="s"> = </span><b>true</b>;
+</code><code id="L5340"><span class="ln">5340</span>            p[attr]<span class="s"> = </span>params[attr];
+</code><code id="L5341"><span class="ln">5341</span>        }
+</code><code id="L5342"><span class="ln">5342</span>        <b>if</b> (!json) {
+</code><code id="L5343"><span class="ln">5343</span>            <b>return</b> <b>new</b> Animation(params, ms);
+</code><code id="L5344"><span class="ln">5344</span>        } <b>else</b> {
+</code><code id="L5345"><span class="ln">5345</span>            easing<span class="s"> &amp;&amp; </span>(p.easing<span class="s"> = </span>easing);
+</code><code id="L5346"><span class="ln">5346</span>            callback<span class="s"> &amp;&amp; </span>(p.callback<span class="s"> = </span>callback);
+</code><code id="L5347"><span class="ln">5347</span>            <b>return</b> <b>new</b> Animation({<span class="d">100</span>: p}, ms);
+</code><code id="L5348"><span class="ln">5348</span>        }
+</code><code id="L5349"><span class="ln">5349</span>    };
+</code><code id="L5350"><span class="ln">5350</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5351"><span class="ln">5351</span><span class="c">    <span class="s"> * </span>Element.animate
+</span></code><code id="L5352"><span class="ln">5352</span><span class="c">     [ method ]
+</span></code><code id="L5353"><span class="ln">5353</span><span class="c">     **
+</span></code><code id="L5354"><span class="ln">5354</span><span class="c">    <span class="s"> * </span>Creates and starts animation <b>for</b> given element.
 </span></code><code id="L5355"><span class="ln">5355</span><span class="c">     **
-</span></code><code id="L5356"><span class="ln">5356</span><span class="c">    <span class="s"> * </span>Creates and starts animation <b>for</b> given element.
+</span></code><code id="L5356"><span class="ln">5356</span><span class="c">     > Parameters
 </span></code><code id="L5357"><span class="ln">5357</span><span class="c">     **
-</span></code><code id="L5358"><span class="ln">5358</span><span class="c">     > Parameters
-</span></code><code id="L5359"><span class="ln">5359</span><span class="c">     **
-</span></code><code id="L5360"><span class="ln">5360</span><span class="c">    <span class="s"> - </span>params (object) <b>final</b> attributes <b>for</b> the element, see also @Element.attr
-</span></code><code id="L5361"><span class="ln">5361</span><span class="c">    <span class="s"> - </span>ms (number) number of milliseconds <b>for</b> animation to run
-</span></code><code id="L5362"><span class="ln">5362</span><span class="c">    <span class="s"> - </span>easing (string) #optional easing type. Accept on of @Raphael.easing_formulas or CSS format: `cubic&#x2010;bezier(XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX)`
-</span></code><code id="L5363"><span class="ln">5363</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) #optional callback <b>function</b>. Will be called at the end of animation.
-</span></code><code id="L5364"><span class="ln">5364</span><span class="c">    <span class="s"> * </span>or
-</span></code><code id="L5365"><span class="ln">5365</span><span class="c">    <span class="s"> - </span>animation (object) animation object, see @Raphael.animation
-</span></code><code id="L5366"><span class="ln">5366</span><span class="c">     **
-</span></code><code id="L5367"><span class="ln">5367</span><span class="c">    <span class="s"> = </span>(object) original element
-</span></code><code id="L5368"><span class="ln">5368</span><span class="c">    \*/</span>
-</code><code id="L5369"><span class="ln">5369</span>    elproto.animate<span class="s"> = </span><b>function</b> (params, ms, easing, callback) {
-</code><code id="L5370"><span class="ln">5370</span>        <b>var</b> element<span class="s"> = </span><b>this</b>;
-</code><code id="L5371"><span class="ln">5371</span>        <b>if</b> (element.removed) {
-</code><code id="L5372"><span class="ln">5372</span>            callback<span class="s"> &amp;&amp; </span>callback.call(element);
-</code><code id="L5373"><span class="ln">5373</span>            <b>return</b> element;
-</code><code id="L5374"><span class="ln">5374</span>        }
-</code><code id="L5375"><span class="ln">5375</span>        <b>var</b> anim<span class="s"> = </span>params <b>instanceof</b> Animation ? params : R.animation(params, ms, easing, callback);
-</code><code id="L5376"><span class="ln">5376</span>        runAnimation(anim, element, anim.percents[<span class="d">0</span>], <b>null</b>, element.attr());
-</code><code id="L5377"><span class="ln">5377</span>        <b>return</b> element;
-</code><code id="L5378"><span class="ln">5378</span>    };
-</code><code id="L5379"><span class="ln">5379</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5380"><span class="ln">5380</span><span class="c">    <span class="s"> * </span>Element.setTime
-</span></code><code id="L5381"><span class="ln">5381</span><span class="c">     [ method ]
+</span></code><code id="L5358"><span class="ln">5358</span><span class="c">    <span class="s"> - </span>params (object) <b>final</b> attributes <b>for</b> the element, see also @Element.attr
+</span></code><code id="L5359"><span class="ln">5359</span><span class="c">    <span class="s"> - </span>ms (number) number of milliseconds <b>for</b> animation to run
+</span></code><code id="L5360"><span class="ln">5360</span><span class="c">    <span class="s"> - </span>easing (string) #optional easing type. Accept one of @Raphael.easing_formulas or CSS format: `cubic&#x2010;bezier(XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX,&#<span class="d">160</span>;XX)`
+</span></code><code id="L5361"><span class="ln">5361</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) #optional callback <b>function</b>. Will be called at the end of animation.
+</span></code><code id="L5362"><span class="ln">5362</span><span class="c">    <span class="s"> * </span>or
+</span></code><code id="L5363"><span class="ln">5363</span><span class="c">    <span class="s"> - </span>animation (object) animation object, see @Raphael.animation
+</span></code><code id="L5364"><span class="ln">5364</span><span class="c">     **
+</span></code><code id="L5365"><span class="ln">5365</span><span class="c">    <span class="s"> = </span>(object) original element
+</span></code><code id="L5366"><span class="ln">5366</span><span class="c">    \*/</span>
+</code><code id="L5367"><span class="ln">5367</span>    elproto.animate<span class="s"> = </span><b>function</b> (params, ms, easing, callback) {
+</code><code id="L5368"><span class="ln">5368</span>        <b>var</b> element<span class="s"> = </span><b>this</b>;
+</code><code id="L5369"><span class="ln">5369</span>        <b>if</b> (element.removed) {
+</code><code id="L5370"><span class="ln">5370</span>            callback<span class="s"> &amp;&amp; </span>callback.call(element);
+</code><code id="L5371"><span class="ln">5371</span>            <b>return</b> element;
+</code><code id="L5372"><span class="ln">5372</span>        }
+</code><code id="L5373"><span class="ln">5373</span>        <b>var</b> anim<span class="s"> = </span>params <b>instanceof</b> Animation ? params : R.animation(params, ms, easing, callback);
+</code><code id="L5374"><span class="ln">5374</span>        runAnimation(anim, element, anim.percents[<span class="d">0</span>], <b>null</b>, element.attr());
+</code><code id="L5375"><span class="ln">5375</span>        <b>return</b> element;
+</code><code id="L5376"><span class="ln">5376</span>    };
+</code><code id="L5377"><span class="ln">5377</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5378"><span class="ln">5378</span><span class="c">    <span class="s"> * </span>Element.setTime
+</span></code><code id="L5379"><span class="ln">5379</span><span class="c">     [ method ]
+</span></code><code id="L5380"><span class="ln">5380</span><span class="c">     **
+</span></code><code id="L5381"><span class="ln">5381</span><span class="c">    <span class="s"> * </span>Sets the status of animation of the element <b>in</b> milliseconds. Similar to @Element.status method.
 </span></code><code id="L5382"><span class="ln">5382</span><span class="c">     **
-</span></code><code id="L5383"><span class="ln">5383</span><span class="c">    <span class="s"> * </span>Sets the status of animation of the element <b>in</b> milliseconds. Similar to @Element.status method.
+</span></code><code id="L5383"><span class="ln">5383</span><span class="c">     > Parameters
 </span></code><code id="L5384"><span class="ln">5384</span><span class="c">     **
-</span></code><code id="L5385"><span class="ln">5385</span><span class="c">     > Parameters
-</span></code><code id="L5386"><span class="ln">5386</span><span class="c">     **
-</span></code><code id="L5387"><span class="ln">5387</span><span class="c">    <span class="s"> - </span>anim (object) animation object
-</span></code><code id="L5388"><span class="ln">5388</span><span class="c">    <span class="s"> - </span>value (number) number of milliseconds from the beginning of the animation
-</span></code><code id="L5389"><span class="ln">5389</span><span class="c">     **
-</span></code><code id="L5390"><span class="ln">5390</span><span class="c">    <span class="s"> = </span>(object) original element <b>if</b> `value` is specified
-</span></code><code id="L5391"><span class="ln">5391</span><span class="c">    <span class="s"> * </span>Note, that during animation following events are triggered:
-</span></code><code id="L5392"><span class="ln">5392</span><span class="c">     *
-</span></code><code id="L5393"><span class="ln">5393</span><span class="c">    <span class="s"> * </span>On each animation frame event `anim.frame.&lt;id>`, on start `anim.start.&lt;id>` and on end `anim.finish.&lt;id>`.
-</span></code><code id="L5394"><span class="ln">5394</span><span class="c">    \*/</span>
-</code><code id="L5395"><span class="ln">5395</span>    elproto.setTime<span class="s"> = </span><b>function</b> (anim, value) {
-</code><code id="L5396"><span class="ln">5396</span>        <b>if</b> (anim<span class="s"> &amp;&amp; </span>value != <b>null</b>) {
-</code><code id="L5397"><span class="ln">5397</span>            <b>this</b>.status(anim, mmin(value, anim.ms)<span class="s"> / </span>anim.ms);
-</code><code id="L5398"><span class="ln">5398</span>        }
-</code><code id="L5399"><span class="ln">5399</span>        <b>return</b> <b>this</b>;
-</code><code id="L5400"><span class="ln">5400</span>    };
-</code><code id="L5401"><span class="ln">5401</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5402"><span class="ln">5402</span><span class="c">    <span class="s"> * </span>Element.status
-</span></code><code id="L5403"><span class="ln">5403</span><span class="c">     [ method ]
+</span></code><code id="L5385"><span class="ln">5385</span><span class="c">    <span class="s"> - </span>anim (object) animation object
+</span></code><code id="L5386"><span class="ln">5386</span><span class="c">    <span class="s"> - </span>value (number) number of milliseconds from the beginning of the animation
+</span></code><code id="L5387"><span class="ln">5387</span><span class="c">     **
+</span></code><code id="L5388"><span class="ln">5388</span><span class="c">    <span class="s"> = </span>(object) original element <b>if</b> `value` is specified
+</span></code><code id="L5389"><span class="ln">5389</span><span class="c">    <span class="s"> * </span>Note, that during animation following events are triggered:
+</span></code><code id="L5390"><span class="ln">5390</span><span class="c">     *
+</span></code><code id="L5391"><span class="ln">5391</span><span class="c">    <span class="s"> * </span>On each animation frame event `anim.frame.&lt;id>`, on start `anim.start.&lt;id>` and on end `anim.finish.&lt;id>`.
+</span></code><code id="L5392"><span class="ln">5392</span><span class="c">    \*/</span>
+</code><code id="L5393"><span class="ln">5393</span>    elproto.setTime<span class="s"> = </span><b>function</b> (anim, value) {
+</code><code id="L5394"><span class="ln">5394</span>        <b>if</b> (anim<span class="s"> &amp;&amp; </span>value != <b>null</b>) {
+</code><code id="L5395"><span class="ln">5395</span>            <b>this</b>.status(anim, mmin(value, anim.ms)<span class="s"> / </span>anim.ms);
+</code><code id="L5396"><span class="ln">5396</span>        }
+</code><code id="L5397"><span class="ln">5397</span>        <b>return</b> <b>this</b>;
+</code><code id="L5398"><span class="ln">5398</span>    };
+</code><code id="L5399"><span class="ln">5399</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5400"><span class="ln">5400</span><span class="c">    <span class="s"> * </span>Element.status
+</span></code><code id="L5401"><span class="ln">5401</span><span class="c">     [ method ]
+</span></code><code id="L5402"><span class="ln">5402</span><span class="c">     **
+</span></code><code id="L5403"><span class="ln">5403</span><span class="c">    <span class="s"> * </span>Gets or sets the status of animation of the element.
 </span></code><code id="L5404"><span class="ln">5404</span><span class="c">     **
-</span></code><code id="L5405"><span class="ln">5405</span><span class="c">    <span class="s"> * </span>Gets or sets the status of animation of the element.
+</span></code><code id="L5405"><span class="ln">5405</span><span class="c">     > Parameters
 </span></code><code id="L5406"><span class="ln">5406</span><span class="c">     **
-</span></code><code id="L5407"><span class="ln">5407</span><span class="c">     > Parameters
-</span></code><code id="L5408"><span class="ln">5408</span><span class="c">     **
-</span></code><code id="L5409"><span class="ln">5409</span><span class="c">    <span class="s"> - </span>anim (object) #optional animation object
-</span></code><code id="L5410"><span class="ln">5410</span><span class="c">    <span class="s"> - </span>value (number) #optional <span class="d">0</span> – <span class="d">1</span>. If specified, method works like a setter and sets the status of a given animation to the value. This will cause animation to jump to the given position.
-</span></code><code id="L5411"><span class="ln">5411</span><span class="c">     **
-</span></code><code id="L5412"><span class="ln">5412</span><span class="c">    <span class="s"> = </span>(number) status
-</span></code><code id="L5413"><span class="ln">5413</span><span class="c">    <span class="s"> * </span>or
-</span></code><code id="L5414"><span class="ln">5414</span><span class="c">    <span class="s"> = </span>(array) status <b>if</b> `anim` is not specified. Array of objects <b>in</b> format:
-</span></code><code id="L5415"><span class="ln">5415</span><span class="c">     o {
-</span></code><code id="L5416"><span class="ln">5416</span><span class="c">     o     anim: (object) animation object
-</span></code><code id="L5417"><span class="ln">5417</span><span class="c">     o     status: (number) status
-</span></code><code id="L5418"><span class="ln">5418</span><span class="c">     o }
-</span></code><code id="L5419"><span class="ln">5419</span><span class="c">    <span class="s"> * </span>or
-</span></code><code id="L5420"><span class="ln">5420</span><span class="c">    <span class="s"> = </span>(object) original element <b>if</b> `value` is specified
-</span></code><code id="L5421"><span class="ln">5421</span><span class="c">    \*/</span>
-</code><code id="L5422"><span class="ln">5422</span>    elproto.status<span class="s"> = </span><b>function</b> (anim, value) {
-</code><code id="L5423"><span class="ln">5423</span>        <b>var</b> out<span class="s"> = </span>[],
-</code><code id="L5424"><span class="ln">5424</span>            i<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L5425"><span class="ln">5425</span>            len,
-</code><code id="L5426"><span class="ln">5426</span>            e;
-</code><code id="L5427"><span class="ln">5427</span>        <b>if</b> (value != <b>null</b>) {
-</code><code id="L5428"><span class="ln">5428</span>            runAnimation(anim, <b>this</b>, -<span class="d">1</span>, mmin(value, <span class="d">1</span>));
-</code><code id="L5429"><span class="ln">5429</span>            <b>return</b> <b>this</b>;
-</code><code id="L5430"><span class="ln">5430</span>        } <b>else</b> {
-</code><code id="L5431"><span class="ln">5431</span>            len<span class="s"> = </span>animationElements.length;
-</code><code id="L5432"><span class="ln">5432</span>            <b>for</b> (; i &lt; len; i++) {
-</code><code id="L5433"><span class="ln">5433</span>                e<span class="s"> = </span>animationElements[i];
-</code><code id="L5434"><span class="ln">5434</span>                <b>if</b> (e.el.id<span class="s"> == </span><b>this</b>.id<span class="s"> &amp;&amp; </span>(!anim<span class="s"> || </span>e.anim<span class="s"> == </span>anim)) {
-</code><code id="L5435"><span class="ln">5435</span>                    <b>if</b> (anim) {
-</code><code id="L5436"><span class="ln">5436</span>                        <b>return</b> e.status;
-</code><code id="L5437"><span class="ln">5437</span>                    }
-</code><code id="L5438"><span class="ln">5438</span>                    out.push({anim: e.anim, status: e.status});
-</code><code id="L5439"><span class="ln">5439</span>                }
-</code><code id="L5440"><span class="ln">5440</span>            }
-</code><code id="L5441"><span class="ln">5441</span>            <b>if</b> (anim) {
-</code><code id="L5442"><span class="ln">5442</span>                <b>return</b> <span class="d">0</span>;
-</code><code id="L5443"><span class="ln">5443</span>            }
-</code><code id="L5444"><span class="ln">5444</span>            <b>return</b> out;
-</code><code id="L5445"><span class="ln">5445</span>        }
-</code><code id="L5446"><span class="ln">5446</span>    };
-</code><code id="L5447"><span class="ln">5447</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5448"><span class="ln">5448</span><span class="c">    <span class="s"> * </span>Element.pause
-</span></code><code id="L5449"><span class="ln">5449</span><span class="c">     [ method ]
+</span></code><code id="L5407"><span class="ln">5407</span><span class="c">    <span class="s"> - </span>anim (object) #optional animation object
+</span></code><code id="L5408"><span class="ln">5408</span><span class="c">    <span class="s"> - </span>value (number) #optional <span class="d">0</span> – <span class="d">1</span>. If specified, method works like a setter and sets the status of a given animation to the value. This will cause animation to jump to the given position.
+</span></code><code id="L5409"><span class="ln">5409</span><span class="c">     **
+</span></code><code id="L5410"><span class="ln">5410</span><span class="c">    <span class="s"> = </span>(number) status
+</span></code><code id="L5411"><span class="ln">5411</span><span class="c">    <span class="s"> * </span>or
+</span></code><code id="L5412"><span class="ln">5412</span><span class="c">    <span class="s"> = </span>(array) status <b>if</b> `anim` is not specified. Array of objects <b>in</b> format:
+</span></code><code id="L5413"><span class="ln">5413</span><span class="c">     o {
+</span></code><code id="L5414"><span class="ln">5414</span><span class="c">     o     anim: (object) animation object
+</span></code><code id="L5415"><span class="ln">5415</span><span class="c">     o     status: (number) status
+</span></code><code id="L5416"><span class="ln">5416</span><span class="c">     o }
+</span></code><code id="L5417"><span class="ln">5417</span><span class="c">    <span class="s"> * </span>or
+</span></code><code id="L5418"><span class="ln">5418</span><span class="c">    <span class="s"> = </span>(object) original element <b>if</b> `value` is specified
+</span></code><code id="L5419"><span class="ln">5419</span><span class="c">    \*/</span>
+</code><code id="L5420"><span class="ln">5420</span>    elproto.status<span class="s"> = </span><b>function</b> (anim, value) {
+</code><code id="L5421"><span class="ln">5421</span>        <b>var</b> out<span class="s"> = </span>[],
+</code><code id="L5422"><span class="ln">5422</span>            i<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L5423"><span class="ln">5423</span>            len,
+</code><code id="L5424"><span class="ln">5424</span>            e;
+</code><code id="L5425"><span class="ln">5425</span>        <b>if</b> (value != <b>null</b>) {
+</code><code id="L5426"><span class="ln">5426</span>            runAnimation(anim, <b>this</b>, -<span class="d">1</span>, mmin(value, <span class="d">1</span>));
+</code><code id="L5427"><span class="ln">5427</span>            <b>return</b> <b>this</b>;
+</code><code id="L5428"><span class="ln">5428</span>        } <b>else</b> {
+</code><code id="L5429"><span class="ln">5429</span>            len<span class="s"> = </span>animationElements.length;
+</code><code id="L5430"><span class="ln">5430</span>            <b>for</b> (; i &lt; len; i++) {
+</code><code id="L5431"><span class="ln">5431</span>                e<span class="s"> = </span>animationElements[i];
+</code><code id="L5432"><span class="ln">5432</span>                <b>if</b> (e.el.id<span class="s"> == </span><b>this</b>.id<span class="s"> &amp;&amp; </span>(!anim<span class="s"> || </span>e.anim<span class="s"> == </span>anim)) {
+</code><code id="L5433"><span class="ln">5433</span>                    <b>if</b> (anim) {
+</code><code id="L5434"><span class="ln">5434</span>                        <b>return</b> e.status;
+</code><code id="L5435"><span class="ln">5435</span>                    }
+</code><code id="L5436"><span class="ln">5436</span>                    out.push({anim: e.anim, status: e.status});
+</code><code id="L5437"><span class="ln">5437</span>                }
+</code><code id="L5438"><span class="ln">5438</span>            }
+</code><code id="L5439"><span class="ln">5439</span>            <b>if</b> (anim) {
+</code><code id="L5440"><span class="ln">5440</span>                <b>return</b> <span class="d">0</span>;
+</code><code id="L5441"><span class="ln">5441</span>            }
+</code><code id="L5442"><span class="ln">5442</span>            <b>return</b> out;
+</code><code id="L5443"><span class="ln">5443</span>        }
+</code><code id="L5444"><span class="ln">5444</span>    };
+</code><code id="L5445"><span class="ln">5445</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5446"><span class="ln">5446</span><span class="c">    <span class="s"> * </span>Element.pause
+</span></code><code id="L5447"><span class="ln">5447</span><span class="c">     [ method ]
+</span></code><code id="L5448"><span class="ln">5448</span><span class="c">     **
+</span></code><code id="L5449"><span class="ln">5449</span><span class="c">    <span class="s"> * </span>Stops animation of the element <b>with</b> ability to resume it later on.
 </span></code><code id="L5450"><span class="ln">5450</span><span class="c">     **
-</span></code><code id="L5451"><span class="ln">5451</span><span class="c">    <span class="s"> * </span>Stops animation of the element <b>with</b> ability to resume it later on.
+</span></code><code id="L5451"><span class="ln">5451</span><span class="c">     > Parameters
 </span></code><code id="L5452"><span class="ln">5452</span><span class="c">     **
-</span></code><code id="L5453"><span class="ln">5453</span><span class="c">     > Parameters
+</span></code><code id="L5453"><span class="ln">5453</span><span class="c">    <span class="s"> - </span>anim (object) #optional animation object
 </span></code><code id="L5454"><span class="ln">5454</span><span class="c">     **
-</span></code><code id="L5455"><span class="ln">5455</span><span class="c">    <span class="s"> - </span>anim (object) #optional animation object
-</span></code><code id="L5456"><span class="ln">5456</span><span class="c">     **
-</span></code><code id="L5457"><span class="ln">5457</span><span class="c">    <span class="s"> = </span>(object) original element
-</span></code><code id="L5458"><span class="ln">5458</span><span class="c">    \*/</span>
-</code><code id="L5459"><span class="ln">5459</span>    elproto.pause<span class="s"> = </span><b>function</b> (anim) {
-</code><code id="L5460"><span class="ln">5460</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>; i &lt; animationElements.length; i++) <b>if</b> (animationElements[i].el.id<span class="s"> == </span><b>this</b>.id<span class="s"> &amp;&amp; </span>(!anim<span class="s"> || </span>animationElements[i].anim<span class="s"> == </span>anim)) {
-</code><code id="L5461"><span class="ln">5461</span>            <b>if</b> (eve(<i>"anim.pause."</i><span class="s"> + </span><b>this</b>.id, <b>this</b>, animationElements[i].anim) !== <b>false</b>) {
-</code><code id="L5462"><span class="ln">5462</span>                animationElements[i].paused<span class="s"> = </span><b>true</b>;
-</code><code id="L5463"><span class="ln">5463</span>            }
-</code><code id="L5464"><span class="ln">5464</span>        }
-</code><code id="L5465"><span class="ln">5465</span>        <b>return</b> <b>this</b>;
-</code><code id="L5466"><span class="ln">5466</span>    };
-</code><code id="L5467"><span class="ln">5467</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5468"><span class="ln">5468</span><span class="c">    <span class="s"> * </span>Element.resume
-</span></code><code id="L5469"><span class="ln">5469</span><span class="c">     [ method ]
+</span></code><code id="L5455"><span class="ln">5455</span><span class="c">    <span class="s"> = </span>(object) original element
+</span></code><code id="L5456"><span class="ln">5456</span><span class="c">    \*/</span>
+</code><code id="L5457"><span class="ln">5457</span>    elproto.pause<span class="s"> = </span><b>function</b> (anim) {
+</code><code id="L5458"><span class="ln">5458</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>; i &lt; animationElements.length; i++) <b>if</b> (animationElements[i].el.id<span class="s"> == </span><b>this</b>.id<span class="s"> &amp;&amp; </span>(!anim<span class="s"> || </span>animationElements[i].anim<span class="s"> == </span>anim)) {
+</code><code id="L5459"><span class="ln">5459</span>            <b>if</b> (eve(<i>"anim.pause."</i><span class="s"> + </span><b>this</b>.id, <b>this</b>, animationElements[i].anim) !== <b>false</b>) {
+</code><code id="L5460"><span class="ln">5460</span>                animationElements[i].paused<span class="s"> = </span><b>true</b>;
+</code><code id="L5461"><span class="ln">5461</span>            }
+</code><code id="L5462"><span class="ln">5462</span>        }
+</code><code id="L5463"><span class="ln">5463</span>        <b>return</b> <b>this</b>;
+</code><code id="L5464"><span class="ln">5464</span>    };
+</code><code id="L5465"><span class="ln">5465</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5466"><span class="ln">5466</span><span class="c">    <span class="s"> * </span>Element.resume
+</span></code><code id="L5467"><span class="ln">5467</span><span class="c">     [ method ]
+</span></code><code id="L5468"><span class="ln">5468</span><span class="c">     **
+</span></code><code id="L5469"><span class="ln">5469</span><span class="c">    <span class="s"> * </span>Resumes animation <b>if</b> it was paused <b>with</b> @Element.pause method.
 </span></code><code id="L5470"><span class="ln">5470</span><span class="c">     **
-</span></code><code id="L5471"><span class="ln">5471</span><span class="c">    <span class="s"> * </span>Resumes animation <b>if</b> it was paused <b>with</b> @Element.pause method.
+</span></code><code id="L5471"><span class="ln">5471</span><span class="c">     > Parameters
 </span></code><code id="L5472"><span class="ln">5472</span><span class="c">     **
-</span></code><code id="L5473"><span class="ln">5473</span><span class="c">     > Parameters
+</span></code><code id="L5473"><span class="ln">5473</span><span class="c">    <span class="s"> - </span>anim (object) #optional animation object
 </span></code><code id="L5474"><span class="ln">5474</span><span class="c">     **
-</span></code><code id="L5475"><span class="ln">5475</span><span class="c">    <span class="s"> - </span>anim (object) #optional animation object
-</span></code><code id="L5476"><span class="ln">5476</span><span class="c">     **
-</span></code><code id="L5477"><span class="ln">5477</span><span class="c">    <span class="s"> = </span>(object) original element
-</span></code><code id="L5478"><span class="ln">5478</span><span class="c">    \*/</span>
-</code><code id="L5479"><span class="ln">5479</span>    elproto.resume<span class="s"> = </span><b>function</b> (anim) {
-</code><code id="L5480"><span class="ln">5480</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>; i &lt; animationElements.length; i++) <b>if</b> (animationElements[i].el.id<span class="s"> == </span><b>this</b>.id<span class="s"> &amp;&amp; </span>(!anim<span class="s"> || </span>animationElements[i].anim<span class="s"> == </span>anim)) {
-</code><code id="L5481"><span class="ln">5481</span>            <b>var</b> e<span class="s"> = </span>animationElements[i];
-</code><code id="L5482"><span class="ln">5482</span>            <b>if</b> (eve(<i>"anim.resume."</i><span class="s"> + </span><b>this</b>.id, <b>this</b>, e.anim) !== <b>false</b>) {
-</code><code id="L5483"><span class="ln">5483</span>                <b>delete</b> e.paused;
-</code><code id="L5484"><span class="ln">5484</span>                <b>this</b>.status(e.anim, e.status);
-</code><code id="L5485"><span class="ln">5485</span>            }
-</code><code id="L5486"><span class="ln">5486</span>        }
-</code><code id="L5487"><span class="ln">5487</span>        <b>return</b> <b>this</b>;
-</code><code id="L5488"><span class="ln">5488</span>    };
-</code><code id="L5489"><span class="ln">5489</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5490"><span class="ln">5490</span><span class="c">    <span class="s"> * </span>Element.stop
-</span></code><code id="L5491"><span class="ln">5491</span><span class="c">     [ method ]
+</span></code><code id="L5475"><span class="ln">5475</span><span class="c">    <span class="s"> = </span>(object) original element
+</span></code><code id="L5476"><span class="ln">5476</span><span class="c">    \*/</span>
+</code><code id="L5477"><span class="ln">5477</span>    elproto.resume<span class="s"> = </span><b>function</b> (anim) {
+</code><code id="L5478"><span class="ln">5478</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>; i &lt; animationElements.length; i++) <b>if</b> (animationElements[i].el.id<span class="s"> == </span><b>this</b>.id<span class="s"> &amp;&amp; </span>(!anim<span class="s"> || </span>animationElements[i].anim<span class="s"> == </span>anim)) {
+</code><code id="L5479"><span class="ln">5479</span>            <b>var</b> e<span class="s"> = </span>animationElements[i];
+</code><code id="L5480"><span class="ln">5480</span>            <b>if</b> (eve(<i>"anim.resume."</i><span class="s"> + </span><b>this</b>.id, <b>this</b>, e.anim) !== <b>false</b>) {
+</code><code id="L5481"><span class="ln">5481</span>                <b>delete</b> e.paused;
+</code><code id="L5482"><span class="ln">5482</span>                <b>this</b>.status(e.anim, e.status);
+</code><code id="L5483"><span class="ln">5483</span>            }
+</code><code id="L5484"><span class="ln">5484</span>        }
+</code><code id="L5485"><span class="ln">5485</span>        <b>return</b> <b>this</b>;
+</code><code id="L5486"><span class="ln">5486</span>    };
+</code><code id="L5487"><span class="ln">5487</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5488"><span class="ln">5488</span><span class="c">    <span class="s"> * </span>Element.stop
+</span></code><code id="L5489"><span class="ln">5489</span><span class="c">     [ method ]
+</span></code><code id="L5490"><span class="ln">5490</span><span class="c">     **
+</span></code><code id="L5491"><span class="ln">5491</span><span class="c">    <span class="s"> * </span>Stops animation of the element.
 </span></code><code id="L5492"><span class="ln">5492</span><span class="c">     **
-</span></code><code id="L5493"><span class="ln">5493</span><span class="c">    <span class="s"> * </span>Stops animation of the element.
+</span></code><code id="L5493"><span class="ln">5493</span><span class="c">     > Parameters
 </span></code><code id="L5494"><span class="ln">5494</span><span class="c">     **
-</span></code><code id="L5495"><span class="ln">5495</span><span class="c">     > Parameters
+</span></code><code id="L5495"><span class="ln">5495</span><span class="c">    <span class="s"> - </span>anim (object) #optional animation object
 </span></code><code id="L5496"><span class="ln">5496</span><span class="c">     **
-</span></code><code id="L5497"><span class="ln">5497</span><span class="c">    <span class="s"> - </span>anim (object) #optional animation object
-</span></code><code id="L5498"><span class="ln">5498</span><span class="c">     **
-</span></code><code id="L5499"><span class="ln">5499</span><span class="c">    <span class="s"> = </span>(object) original element
-</span></code><code id="L5500"><span class="ln">5500</span><span class="c">    \*/</span>
-</code><code id="L5501"><span class="ln">5501</span>    elproto.stop<span class="s"> = </span><b>function</b> (anim) {
-</code><code id="L5502"><span class="ln">5502</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>; i &lt; animationElements.length; i++) <b>if</b> (animationElements[i].el.id<span class="s"> == </span><b>this</b>.id<span class="s"> &amp;&amp; </span>(!anim<span class="s"> || </span>animationElements[i].anim<span class="s"> == </span>anim)) {
-</code><code id="L5503"><span class="ln">5503</span>            <b>if</b> (eve(<i>"anim.stop."</i><span class="s"> + </span><b>this</b>.id, <b>this</b>, animationElements[i].anim) !== <b>false</b>) {
-</code><code id="L5504"><span class="ln">5504</span>                animationElements.splice(i--, <span class="d">1</span>);
-</code><code id="L5505"><span class="ln">5505</span>            }
-</code><code id="L5506"><span class="ln">5506</span>        }
-</code><code id="L5507"><span class="ln">5507</span>        <b>return</b> <b>this</b>;
-</code><code id="L5508"><span class="ln">5508</span>    };
-</code><code id="L5509"><span class="ln">5509</span>    elproto.toString<span class="s"> = </span><b>function</b> () {
-</code><code id="L5510"><span class="ln">5510</span>        <b>return</b> <i>"Rapha\xebl\u2019s object"</i>;
-</code><code id="L5511"><span class="ln">5511</span>    };
-</code><code id="L5512"><span class="ln">5512</span>
-</code><code id="L5513"><span class="ln">5513</span>    <span class="c">// Set</span>
-</code><code id="L5514"><span class="ln">5514</span>    <b>var</b> Set<span class="s"> = </span><b>function</b> (items) {
-</code><code id="L5515"><span class="ln">5515</span>        <b>this</b>.items<span class="s"> = </span>[];
-</code><code id="L5516"><span class="ln">5516</span>        <b>this</b>.length<span class="s"> = </span><span class="d">0</span>;
-</code><code id="L5517"><span class="ln">5517</span>        <b>this</b>.type<span class="s"> = </span><i>"set"</i>;
-</code><code id="L5518"><span class="ln">5518</span>        <b>if</b> (items) {
-</code><code id="L5519"><span class="ln">5519</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>items.length; i &lt; ii; i++) {
-</code><code id="L5520"><span class="ln">5520</span>                <b>if</b> (items[i]<span class="s"> &amp;&amp; </span>(items[i].constructor<span class="s"> == </span>Element<span class="s"> || </span>items[i].constructor<span class="s"> == </span>Set)) {
-</code><code id="L5521"><span class="ln">5521</span>                    <b>this</b>[<b>this</b>.items.length]<span class="s"> = </span><b>this</b>.items[<b>this</b>.items.length]<span class="s"> = </span>items[i];
-</code><code id="L5522"><span class="ln">5522</span>                    <b>this</b>.length++;
-</code><code id="L5523"><span class="ln">5523</span>                }
-</code><code id="L5524"><span class="ln">5524</span>            }
-</code><code id="L5525"><span class="ln">5525</span>        }
-</code><code id="L5526"><span class="ln">5526</span>    },
-</code><code id="L5527"><span class="ln">5527</span>    setproto<span class="s"> = </span>Set.prototype;
-</code><code id="L5528"><span class="ln">5528</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5529"><span class="ln">5529</span><span class="c">    <span class="s"> * </span>Set.push
-</span></code><code id="L5530"><span class="ln">5530</span><span class="c">     [ method ]
-</span></code><code id="L5531"><span class="ln">5531</span><span class="c">     **
-</span></code><code id="L5532"><span class="ln">5532</span><span class="c">    <span class="s"> * </span>Adds each argument to the current set.
-</span></code><code id="L5533"><span class="ln">5533</span><span class="c">    <span class="s"> = </span>(object) original element
-</span></code><code id="L5534"><span class="ln">5534</span><span class="c">    \*/</span>
-</code><code id="L5535"><span class="ln">5535</span>    setproto.push<span class="s"> = </span><b>function</b> () {
-</code><code id="L5536"><span class="ln">5536</span>        <b>var</b> item,
-</code><code id="L5537"><span class="ln">5537</span>            len;
-</code><code id="L5538"><span class="ln">5538</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>arguments.length; i &lt; ii; i++) {
-</code><code id="L5539"><span class="ln">5539</span>            item<span class="s"> = </span>arguments[i];
-</code><code id="L5540"><span class="ln">5540</span>            <b>if</b> (item<span class="s"> &amp;&amp; </span>(item.constructor<span class="s"> == </span>Element<span class="s"> || </span>item.constructor<span class="s"> == </span>Set)) {
-</code><code id="L5541"><span class="ln">5541</span>                len<span class="s"> = </span><b>this</b>.items.length;
-</code><code id="L5542"><span class="ln">5542</span>                <b>this</b>[len]<span class="s"> = </span><b>this</b>.items[len]<span class="s"> = </span>item;
-</code><code id="L5543"><span class="ln">5543</span>                <b>this</b>.length++;
-</code><code id="L5544"><span class="ln">5544</span>            }
-</code><code id="L5545"><span class="ln">5545</span>        }
-</code><code id="L5546"><span class="ln">5546</span>        <b>return</b> <b>this</b>;
-</code><code id="L5547"><span class="ln">5547</span>    };
-</code><code id="L5548"><span class="ln">5548</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5549"><span class="ln">5549</span><span class="c">    <span class="s"> * </span>Set.pop
-</span></code><code id="L5550"><span class="ln">5550</span><span class="c">     [ method ]
-</span></code><code id="L5551"><span class="ln">5551</span><span class="c">     **
-</span></code><code id="L5552"><span class="ln">5552</span><span class="c">    <span class="s"> * </span>Removes last element and returns it.
-</span></code><code id="L5553"><span class="ln">5553</span><span class="c">    <span class="s"> = </span>(object) element
-</span></code><code id="L5554"><span class="ln">5554</span><span class="c">    \*/</span>
-</code><code id="L5555"><span class="ln">5555</span>    setproto.pop<span class="s"> = </span><b>function</b> () {
-</code><code id="L5556"><span class="ln">5556</span>        <b>this</b>.length<span class="s"> &amp;&amp; </span><b>delete</b> <b>this</b>[<b>this</b>.length--];
-</code><code id="L5557"><span class="ln">5557</span>        <b>return</b> <b>this</b>.items.pop();
-</code><code id="L5558"><span class="ln">5558</span>    };
-</code><code id="L5559"><span class="ln">5559</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5560"><span class="ln">5560</span><span class="c">    <span class="s"> * </span>Set.forEach
-</span></code><code id="L5561"><span class="ln">5561</span><span class="c">     [ method ]
-</span></code><code id="L5562"><span class="ln">5562</span><span class="c">     **
-</span></code><code id="L5563"><span class="ln">5563</span><span class="c">    <span class="s"> * </span>Executes given <b>function</b> <b>for</b> each element <b>in</b> the set.
-</span></code><code id="L5564"><span class="ln">5564</span><span class="c">     *
-</span></code><code id="L5565"><span class="ln">5565</span><span class="c">    <span class="s"> * </span>If <b>function</b> returns `<b>false</b>` it will stop loop running.
+</span></code><code id="L5497"><span class="ln">5497</span><span class="c">    <span class="s"> = </span>(object) original element
+</span></code><code id="L5498"><span class="ln">5498</span><span class="c">    \*/</span>
+</code><code id="L5499"><span class="ln">5499</span>    elproto.stop<span class="s"> = </span><b>function</b> (anim) {
+</code><code id="L5500"><span class="ln">5500</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>; i &lt; animationElements.length; i++) <b>if</b> (animationElements[i].el.id<span class="s"> == </span><b>this</b>.id<span class="s"> &amp;&amp; </span>(!anim<span class="s"> || </span>animationElements[i].anim<span class="s"> == </span>anim)) {
+</code><code id="L5501"><span class="ln">5501</span>            <b>if</b> (eve(<i>"anim.stop."</i><span class="s"> + </span><b>this</b>.id, <b>this</b>, animationElements[i].anim) !== <b>false</b>) {
+</code><code id="L5502"><span class="ln">5502</span>                animationElements.splice(i--, <span class="d">1</span>);
+</code><code id="L5503"><span class="ln">5503</span>            }
+</code><code id="L5504"><span class="ln">5504</span>        }
+</code><code id="L5505"><span class="ln">5505</span>        <b>return</b> <b>this</b>;
+</code><code id="L5506"><span class="ln">5506</span>    };
+</code><code id="L5507"><span class="ln">5507</span>    elproto.toString<span class="s"> = </span><b>function</b> () {
+</code><code id="L5508"><span class="ln">5508</span>        <b>return</b> <i>"Rapha\xebl\u2019s object"</i>;
+</code><code id="L5509"><span class="ln">5509</span>    };
+</code><code id="L5510"><span class="ln">5510</span>
+</code><code id="L5511"><span class="ln">5511</span>    <span class="c">// Set</span>
+</code><code id="L5512"><span class="ln">5512</span>    <b>var</b> Set<span class="s"> = </span><b>function</b> (items) {
+</code><code id="L5513"><span class="ln">5513</span>        <b>this</b>.items<span class="s"> = </span>[];
+</code><code id="L5514"><span class="ln">5514</span>        <b>this</b>.length<span class="s"> = </span><span class="d">0</span>;
+</code><code id="L5515"><span class="ln">5515</span>        <b>this</b>.type<span class="s"> = </span><i>"set"</i>;
+</code><code id="L5516"><span class="ln">5516</span>        <b>if</b> (items) {
+</code><code id="L5517"><span class="ln">5517</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>items.length; i &lt; ii; i++) {
+</code><code id="L5518"><span class="ln">5518</span>                <b>if</b> (items[i]<span class="s"> &amp;&amp; </span>(items[i].constructor<span class="s"> == </span>Element<span class="s"> || </span>items[i].constructor<span class="s"> == </span>Set)) {
+</code><code id="L5519"><span class="ln">5519</span>                    <b>this</b>[<b>this</b>.items.length]<span class="s"> = </span><b>this</b>.items[<b>this</b>.items.length]<span class="s"> = </span>items[i];
+</code><code id="L5520"><span class="ln">5520</span>                    <b>this</b>.length++;
+</code><code id="L5521"><span class="ln">5521</span>                }
+</code><code id="L5522"><span class="ln">5522</span>            }
+</code><code id="L5523"><span class="ln">5523</span>        }
+</code><code id="L5524"><span class="ln">5524</span>    },
+</code><code id="L5525"><span class="ln">5525</span>    setproto<span class="s"> = </span>Set.prototype;
+</code><code id="L5526"><span class="ln">5526</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5527"><span class="ln">5527</span><span class="c">    <span class="s"> * </span>Set.push
+</span></code><code id="L5528"><span class="ln">5528</span><span class="c">     [ method ]
+</span></code><code id="L5529"><span class="ln">5529</span><span class="c">     **
+</span></code><code id="L5530"><span class="ln">5530</span><span class="c">    <span class="s"> * </span>Adds each argument to the current set.
+</span></code><code id="L5531"><span class="ln">5531</span><span class="c">    <span class="s"> = </span>(object) original element
+</span></code><code id="L5532"><span class="ln">5532</span><span class="c">    \*/</span>
+</code><code id="L5533"><span class="ln">5533</span>    setproto.push<span class="s"> = </span><b>function</b> () {
+</code><code id="L5534"><span class="ln">5534</span>        <b>var</b> item,
+</code><code id="L5535"><span class="ln">5535</span>            len;
+</code><code id="L5536"><span class="ln">5536</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>arguments.length; i &lt; ii; i++) {
+</code><code id="L5537"><span class="ln">5537</span>            item<span class="s"> = </span>arguments[i];
+</code><code id="L5538"><span class="ln">5538</span>            <b>if</b> (item<span class="s"> &amp;&amp; </span>(item.constructor<span class="s"> == </span>Element<span class="s"> || </span>item.constructor<span class="s"> == </span>Set)) {
+</code><code id="L5539"><span class="ln">5539</span>                len<span class="s"> = </span><b>this</b>.items.length;
+</code><code id="L5540"><span class="ln">5540</span>                <b>this</b>[len]<span class="s"> = </span><b>this</b>.items[len]<span class="s"> = </span>item;
+</code><code id="L5541"><span class="ln">5541</span>                <b>this</b>.length++;
+</code><code id="L5542"><span class="ln">5542</span>            }
+</code><code id="L5543"><span class="ln">5543</span>        }
+</code><code id="L5544"><span class="ln">5544</span>        <b>return</b> <b>this</b>;
+</code><code id="L5545"><span class="ln">5545</span>    };
+</code><code id="L5546"><span class="ln">5546</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5547"><span class="ln">5547</span><span class="c">    <span class="s"> * </span>Set.pop
+</span></code><code id="L5548"><span class="ln">5548</span><span class="c">     [ method ]
+</span></code><code id="L5549"><span class="ln">5549</span><span class="c">     **
+</span></code><code id="L5550"><span class="ln">5550</span><span class="c">    <span class="s"> * </span>Removes last element and returns it.
+</span></code><code id="L5551"><span class="ln">5551</span><span class="c">    <span class="s"> = </span>(object) element
+</span></code><code id="L5552"><span class="ln">5552</span><span class="c">    \*/</span>
+</code><code id="L5553"><span class="ln">5553</span>    setproto.pop<span class="s"> = </span><b>function</b> () {
+</code><code id="L5554"><span class="ln">5554</span>        <b>this</b>.length<span class="s"> &amp;&amp; </span><b>delete</b> <b>this</b>[<b>this</b>.length--];
+</code><code id="L5555"><span class="ln">5555</span>        <b>return</b> <b>this</b>.items.pop();
+</code><code id="L5556"><span class="ln">5556</span>    };
+</code><code id="L5557"><span class="ln">5557</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5558"><span class="ln">5558</span><span class="c">    <span class="s"> * </span>Set.forEach
+</span></code><code id="L5559"><span class="ln">5559</span><span class="c">     [ method ]
+</span></code><code id="L5560"><span class="ln">5560</span><span class="c">     **
+</span></code><code id="L5561"><span class="ln">5561</span><span class="c">    <span class="s"> * </span>Executes given <b>function</b> <b>for</b> each element <b>in</b> the set.
+</span></code><code id="L5562"><span class="ln">5562</span><span class="c">     *
+</span></code><code id="L5563"><span class="ln">5563</span><span class="c">    <span class="s"> * </span>If <b>function</b> returns `<b>false</b>` it will stop loop running.
+</span></code><code id="L5564"><span class="ln">5564</span><span class="c">     **
+</span></code><code id="L5565"><span class="ln">5565</span><span class="c">     > Parameters
 </span></code><code id="L5566"><span class="ln">5566</span><span class="c">     **
-</span></code><code id="L5567"><span class="ln">5567</span><span class="c">     > Parameters
-</span></code><code id="L5568"><span class="ln">5568</span><span class="c">     **
-</span></code><code id="L5569"><span class="ln">5569</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) <b>function</b> to run
-</span></code><code id="L5570"><span class="ln">5570</span><span class="c">    <span class="s"> - </span>thisArg (object) context object <b>for</b> the callback
-</span></code><code id="L5571"><span class="ln">5571</span><span class="c">    <span class="s"> = </span>(object) Set object
-</span></code><code id="L5572"><span class="ln">5572</span><span class="c">    \*/</span>
-</code><code id="L5573"><span class="ln">5573</span>    setproto.forEach<span class="s"> = </span><b>function</b> (callback, thisArg) {
-</code><code id="L5574"><span class="ln">5574</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span><b>this</b>.items.length; i &lt; ii; i++) {
-</code><code id="L5575"><span class="ln">5575</span>            <b>if</b> (callback.call(thisArg, <b>this</b>.items[i])<span class="s"> === </span><b>false</b>) {
-</code><code id="L5576"><span class="ln">5576</span>                <b>return</b> <b>this</b>;
-</code><code id="L5577"><span class="ln">5577</span>            }
-</code><code id="L5578"><span class="ln">5578</span>        }
-</code><code id="L5579"><span class="ln">5579</span>        <b>return</b> <b>this</b>;
-</code><code id="L5580"><span class="ln">5580</span>    };
-</code><code id="L5581"><span class="ln">5581</span>    <b>for</b> (<b>var</b> method <b>in</b> elproto) <b>if</b> (elproto[has](method)) {
-</code><code id="L5582"><span class="ln">5582</span>        setproto[method]<span class="s"> = </span>(<b>function</b> (methodname) {
-</code><code id="L5583"><span class="ln">5583</span>            <b>return</b> <b>function</b> () {
-</code><code id="L5584"><span class="ln">5584</span>                <b>var</b> arg<span class="s"> = </span>arguments;
-</code><code id="L5585"><span class="ln">5585</span>                <b>return</b> <b>this</b>.forEach(<b>function</b> (el) {
-</code><code id="L5586"><span class="ln">5586</span>                    el[methodname][apply](el, arg);
-</code><code id="L5587"><span class="ln">5587</span>                });
-</code><code id="L5588"><span class="ln">5588</span>            };
-</code><code id="L5589"><span class="ln">5589</span>        })(method);
-</code><code id="L5590"><span class="ln">5590</span>    }
-</code><code id="L5591"><span class="ln">5591</span>    setproto.attr<span class="s"> = </span><b>function</b> (name, value) {
-</code><code id="L5592"><span class="ln">5592</span>        <b>if</b> (name<span class="s"> &amp;&amp; </span>R.is(name, array)<span class="s"> &amp;&amp; </span>R.is(name[<span class="d">0</span>], <i>"object"</i>)) {
-</code><code id="L5593"><span class="ln">5593</span>            <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>name.length; j &lt; jj; j++) {
-</code><code id="L5594"><span class="ln">5594</span>                <b>this</b>.items[j].attr(name[j]);
-</code><code id="L5595"><span class="ln">5595</span>            }
-</code><code id="L5596"><span class="ln">5596</span>        } <b>else</b> {
-</code><code id="L5597"><span class="ln">5597</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span><b>this</b>.items.length; i &lt; ii; i++) {
-</code><code id="L5598"><span class="ln">5598</span>                <b>this</b>.items[i].attr(name, value);
-</code><code id="L5599"><span class="ln">5599</span>            }
-</code><code id="L5600"><span class="ln">5600</span>        }
-</code><code id="L5601"><span class="ln">5601</span>        <b>return</b> <b>this</b>;
-</code><code id="L5602"><span class="ln">5602</span>    };
-</code><code id="L5603"><span class="ln">5603</span>    setproto.animate<span class="s"> = </span><b>function</b> (params, ms, easing, callback) {
-</code><code id="L5604"><span class="ln">5604</span>        (R.is(easing, <i>"<b>function</b>"</i>)<span class="s"> || </span>!easing)<span class="s"> &amp;&amp; </span>(callback<span class="s"> = </span>easing<span class="s"> || </span><b>null</b>);
-</code><code id="L5605"><span class="ln">5605</span>        <b>var</b> len<span class="s"> = </span><b>this</b>.items.length,
-</code><code id="L5606"><span class="ln">5606</span>            i<span class="s"> = </span>len,
-</code><code id="L5607"><span class="ln">5607</span>            item,
-</code><code id="L5608"><span class="ln">5608</span>            set<span class="s"> = </span><b>this</b>,
-</code><code id="L5609"><span class="ln">5609</span>            collector;
-</code><code id="L5610"><span class="ln">5610</span>        callback<span class="s"> &amp;&amp; </span>(collector<span class="s"> = </span><b>function</b> () {
-</code><code id="L5611"><span class="ln">5611</span>            !--len<span class="s"> &amp;&amp; </span>callback.call(set);
-</code><code id="L5612"><span class="ln">5612</span>        });
-</code><code id="L5613"><span class="ln">5613</span>        easing<span class="s"> = </span>R.is(easing, string) ? easing : collector;
-</code><code id="L5614"><span class="ln">5614</span>        <b>var</b> anim<span class="s"> = </span>params <b>instanceof</b> Animation ? params : R.animation(params, ms, easing, collector);
-</code><code id="L5615"><span class="ln">5615</span>        item<span class="s"> = </span><b>this</b>.items[--i].animate(anim);
-</code><code id="L5616"><span class="ln">5616</span>        <b>while</b> (i--) {
-</code><code id="L5617"><span class="ln">5617</span>            <b>this</b>.items[i]<span class="s"> &amp;&amp; </span>!<b>this</b>.items[i].removed<span class="s"> &amp;&amp; </span><b>this</b>.items[i].animateWith(item, anim);
-</code><code id="L5618"><span class="ln">5618</span>        }
-</code><code id="L5619"><span class="ln">5619</span>        <b>return</b> <b>this</b>;
-</code><code id="L5620"><span class="ln">5620</span>    };
-</code><code id="L5621"><span class="ln">5621</span>    setproto.insertAfter<span class="s"> = </span><b>function</b> (el) {
-</code><code id="L5622"><span class="ln">5622</span>        <b>var</b> i<span class="s"> = </span><b>this</b>.items.length;
-</code><code id="L5623"><span class="ln">5623</span>        <b>while</b> (i--) {
-</code><code id="L5624"><span class="ln">5624</span>            <b>this</b>.items[i].insertAfter(el);
-</code><code id="L5625"><span class="ln">5625</span>        }
-</code><code id="L5626"><span class="ln">5626</span>        <b>return</b> <b>this</b>;
-</code><code id="L5627"><span class="ln">5627</span>    };
-</code><code id="L5628"><span class="ln">5628</span>    setproto.getBBox<span class="s"> = </span><b>function</b> () {
-</code><code id="L5629"><span class="ln">5629</span>        <b>var</b> x<span class="s"> = </span>[],
-</code><code id="L5630"><span class="ln">5630</span>            y<span class="s"> = </span>[],
-</code><code id="L5631"><span class="ln">5631</span>            w<span class="s"> = </span>[],
-</code><code id="L5632"><span class="ln">5632</span>            h<span class="s"> = </span>[];
-</code><code id="L5633"><span class="ln">5633</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><b>this</b>.items.length; i--;) <b>if</b> (!<b>this</b>.items[i].removed) {
-</code><code id="L5634"><span class="ln">5634</span>            <b>var</b> box<span class="s"> = </span><b>this</b>.items[i].getBBox();
-</code><code id="L5635"><span class="ln">5635</span>            x.push(box.x);
-</code><code id="L5636"><span class="ln">5636</span>            y.push(box.y);
-</code><code id="L5637"><span class="ln">5637</span>            w.push(box.x<span class="s"> + </span>box.width);
-</code><code id="L5638"><span class="ln">5638</span>            h.push(box.y<span class="s"> + </span>box.height);
-</code><code id="L5639"><span class="ln">5639</span>        }
-</code><code id="L5640"><span class="ln">5640</span>        x<span class="s"> = </span>mmin[apply](<span class="d">0</span>, x);
-</code><code id="L5641"><span class="ln">5641</span>        y<span class="s"> = </span>mmin[apply](<span class="d">0</span>, y);
-</code><code id="L5642"><span class="ln">5642</span>        <b>return</b> {
-</code><code id="L5643"><span class="ln">5643</span>            x: x,
-</code><code id="L5644"><span class="ln">5644</span>            y: y,
-</code><code id="L5645"><span class="ln">5645</span>            width: mmax[apply](<span class="d">0</span>, w)<span class="s"> - </span>x,
-</code><code id="L5646"><span class="ln">5646</span>            height: mmax[apply](<span class="d">0</span>, h)<span class="s"> - </span>y
-</code><code id="L5647"><span class="ln">5647</span>        };
-</code><code id="L5648"><span class="ln">5648</span>    };
-</code><code id="L5649"><span class="ln">5649</span>    setproto.clone<span class="s"> = </span><b>function</b> (s) {
-</code><code id="L5650"><span class="ln">5650</span>        s<span class="s"> = </span><b>new</b> Set;
-</code><code id="L5651"><span class="ln">5651</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span><b>this</b>.items.length; i &lt; ii; i++) {
-</code><code id="L5652"><span class="ln">5652</span>            s.push(<b>this</b>.items[i].clone());
-</code><code id="L5653"><span class="ln">5653</span>        }
-</code><code id="L5654"><span class="ln">5654</span>        <b>return</b> s;
-</code><code id="L5655"><span class="ln">5655</span>    };
-</code><code id="L5656"><span class="ln">5656</span>    setproto.toString<span class="s"> = </span><b>function</b> () {
-</code><code id="L5657"><span class="ln">5657</span>        <b>return</b> <i>"Rapha\xebl\u2018s set"</i>;
-</code><code id="L5658"><span class="ln">5658</span>    };
-</code><code id="L5659"><span class="ln">5659</span>
-</code><code id="L5660"><span class="ln">5660</span>    R.registerFont<span class="s"> = </span><b>function</b> (font) {
-</code><code id="L5661"><span class="ln">5661</span>        <b>if</b> (!font.face) {
-</code><code id="L5662"><span class="ln">5662</span>            <b>return</b> font;
-</code><code id="L5663"><span class="ln">5663</span>        }
-</code><code id="L5664"><span class="ln">5664</span>        <b>this</b>.fonts<span class="s"> = </span><b>this</b>.fonts<span class="s"> || </span>{};
-</code><code id="L5665"><span class="ln">5665</span>        <b>var</b> fontcopy<span class="s"> = </span>{
-</code><code id="L5666"><span class="ln">5666</span>                w: font.w,
-</code><code id="L5667"><span class="ln">5667</span>                face: {},
-</code><code id="L5668"><span class="ln">5668</span>                glyphs: {}
-</code><code id="L5669"><span class="ln">5669</span>            },
-</code><code id="L5670"><span class="ln">5670</span>            family<span class="s"> = </span>font.face[<i>"font-family"</i>];
-</code><code id="L5671"><span class="ln">5671</span>        <b>for</b> (<b>var</b> prop <b>in</b> font.face) <b>if</b> (font.face[has](prop)) {
-</code><code id="L5672"><span class="ln">5672</span>            fontcopy.face[prop]<span class="s"> = </span>font.face[prop];
-</code><code id="L5673"><span class="ln">5673</span>        }
-</code><code id="L5674"><span class="ln">5674</span>        <b>if</b> (<b>this</b>.fonts[family]) {
-</code><code id="L5675"><span class="ln">5675</span>            <b>this</b>.fonts[family].push(fontcopy);
-</code><code id="L5676"><span class="ln">5676</span>        } <b>else</b> {
-</code><code id="L5677"><span class="ln">5677</span>            <b>this</b>.fonts[family]<span class="s"> = </span>[fontcopy];
-</code><code id="L5678"><span class="ln">5678</span>        }
-</code><code id="L5679"><span class="ln">5679</span>        <b>if</b> (!font.svg) {
-</code><code id="L5680"><span class="ln">5680</span>            fontcopy.face[<i>"units-per-em"</i>]<span class="s"> = </span>toInt(font.face[<i>"units-per-em"</i>], <span class="d">10</span>);
-</code><code id="L5681"><span class="ln">5681</span>            <b>for</b> (<b>var</b> glyph <b>in</b> font.glyphs) <b>if</b> (font.glyphs[has](glyph)) {
-</code><code id="L5682"><span class="ln">5682</span>                <b>var</b> path<span class="s"> = </span>font.glyphs[glyph];
-</code><code id="L5683"><span class="ln">5683</span>                fontcopy.glyphs[glyph]<span class="s"> = </span>{
-</code><code id="L5684"><span class="ln">5684</span>                    w: path.w,
-</code><code id="L5685"><span class="ln">5685</span>                    k: {},
-</code><code id="L5686"><span class="ln">5686</span>                    d: path.d<span class="s"> &amp;&amp; </span><i>"M"</i><span class="s"> + </span>path.d.replace(/[mlcxtrv]/g, <b>function</b> (command) {
-</code><code id="L5687"><span class="ln">5687</span>                            <b>return</b> {l: <i>"L"</i>, c: <i>"C"</i>, x: <i>"z"</i>, t: <i>"m"</i>, r: <i>"l"</i>, v: <i>"c"</i>}[command]<span class="s"> || </span><i>"M"</i>;
-</code><code id="L5688"><span class="ln">5688</span>                        })<span class="s"> + </span><i>"z"</i>
-</code><code id="L5689"><span class="ln">5689</span>                };
-</code><code id="L5690"><span class="ln">5690</span>                <b>if</b> (path.k) {
-</code><code id="L5691"><span class="ln">5691</span>                    <b>for</b> (<b>var</b> k <b>in</b> path.k) <b>if</b> (path[has](k)) {
-</code><code id="L5692"><span class="ln">5692</span>                        fontcopy.glyphs[glyph].k[k]<span class="s"> = </span>path.k[k];
-</code><code id="L5693"><span class="ln">5693</span>                    }
-</code><code id="L5694"><span class="ln">5694</span>                }
-</code><code id="L5695"><span class="ln">5695</span>            }
-</code><code id="L5696"><span class="ln">5696</span>        }
-</code><code id="L5697"><span class="ln">5697</span>        <b>return</b> font;
-</code><code id="L5698"><span class="ln">5698</span>    };
-</code><code id="L5699"><span class="ln">5699</span>    paperproto.getFont<span class="s"> = </span><b>function</b> (family, weight, style, stretch) {
-</code><code id="L5700"><span class="ln">5700</span>        stretch<span class="s"> = </span>stretch<span class="s"> || </span><i>"normal"</i>;
-</code><code id="L5701"><span class="ln">5701</span>        style<span class="s"> = </span>style<span class="s"> || </span><i>"normal"</i>;
-</code><code id="L5702"><span class="ln">5702</span>        weight<span class="s"> = </span>+weight<span class="s"> || </span>{normal: <span class="d">400</span>, bold: <span class="d">700</span>, lighter: <span class="d">300</span>, bolder: <span class="d">800</span>}[weight]<span class="s"> || </span><span class="d">400</span>;
-</code><code id="L5703"><span class="ln">5703</span>        <b>if</b> (!R.fonts) {
-</code><code id="L5704"><span class="ln">5704</span>            <b>return</b>;
-</code><code id="L5705"><span class="ln">5705</span>        }
-</code><code id="L5706"><span class="ln">5706</span>        <b>var</b> font<span class="s"> = </span>R.fonts[family];
-</code><code id="L5707"><span class="ln">5707</span>        <b>if</b> (!font) {
-</code><code id="L5708"><span class="ln">5708</span>            <b>var</b> name<span class="s"> = </span><b>new</b> RegExp(<i>"(^|\\s)"</i><span class="s"> + </span>family.replace(/[^\w\d\s+!~.:_-]/g, E)<span class="s"> + </span><i>"(\\s|$)"</i>, <i>"i"</i>);
-</code><code id="L5709"><span class="ln">5709</span>            <b>for</b> (<b>var</b> fontName <b>in</b> R.fonts) <b>if</b> (R.fonts[has](fontName)) {
-</code><code id="L5710"><span class="ln">5710</span>                <b>if</b> (name.test(fontName)) {
-</code><code id="L5711"><span class="ln">5711</span>                    font<span class="s"> = </span>R.fonts[fontName];
-</code><code id="L5712"><span class="ln">5712</span>                    <b>break</b>;
-</code><code id="L5713"><span class="ln">5713</span>                }
-</code><code id="L5714"><span class="ln">5714</span>            }
-</code><code id="L5715"><span class="ln">5715</span>        }
-</code><code id="L5716"><span class="ln">5716</span>        <b>var</b> thefont;
-</code><code id="L5717"><span class="ln">5717</span>        <b>if</b> (font) {
-</code><code id="L5718"><span class="ln">5718</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>font.length; i &lt; ii; i++) {
-</code><code id="L5719"><span class="ln">5719</span>                thefont<span class="s"> = </span>font[i];
-</code><code id="L5720"><span class="ln">5720</span>                <b>if</b> (thefont.face[<i>"font-weight"</i>]<span class="s"> == </span>weight<span class="s"> &amp;&amp; </span>(thefont.face[<i>"font-style"</i>]<span class="s"> == </span>style<span class="s"> || </span>!thefont.face[<i>"font-style"</i>])<span class="s"> &amp;&amp; </span>thefont.face[<i>"font-stretch"</i>]<span class="s"> == </span>stretch) {
-</code><code id="L5721"><span class="ln">5721</span>                    <b>break</b>;
-</code><code id="L5722"><span class="ln">5722</span>                }
-</code><code id="L5723"><span class="ln">5723</span>            }
-</code><code id="L5724"><span class="ln">5724</span>        }
-</code><code id="L5725"><span class="ln">5725</span>        <b>return</b> thefont;
-</code><code id="L5726"><span class="ln">5726</span>    };
-</code><code id="L5727"><span class="ln">5727</span>    paperproto.print<span class="s"> = </span><b>function</b> (x, y, string, font, size, origin, letter_spacing) {
-</code><code id="L5728"><span class="ln">5728</span>        origin<span class="s"> = </span>origin<span class="s"> || </span><i>"middle"</i>; <span class="c">// baseline|middle</span>
-</code><code id="L5729"><span class="ln">5729</span>        letter_spacing<span class="s"> = </span>mmax(mmin(letter_spacing<span class="s"> || </span><span class="d">0</span>, <span class="d">1</span>), -<span class="d">1</span>);
-</code><code id="L5730"><span class="ln">5730</span>        <b>var</b> out<span class="s"> = </span><b>this</b>.set(),
-</code><code id="L5731"><span class="ln">5731</span>            letters<span class="s"> = </span>Str(string).split(E),
-</code><code id="L5732"><span class="ln">5732</span>            shift<span class="s"> = </span><span class="d">0</span>,
-</code><code id="L5733"><span class="ln">5733</span>            path<span class="s"> = </span>E,
-</code><code id="L5734"><span class="ln">5734</span>            scale;
-</code><code id="L5735"><span class="ln">5735</span>        R.is(font, string)<span class="s"> &amp;&amp; </span>(font<span class="s"> = </span><b>this</b>.getFont(font));
-</code><code id="L5736"><span class="ln">5736</span>        <b>if</b> (font) {
-</code><code id="L5737"><span class="ln">5737</span>            scale<span class="s"> = </span>(size<span class="s"> || </span><span class="d">16</span>)<span class="s"> / </span>font.face[<i>"units-per-em"</i>];
-</code><code id="L5738"><span class="ln">5738</span>            <b>var</b> bb<span class="s"> = </span>font.face.bbox.split(separator),
-</code><code id="L5739"><span class="ln">5739</span>                top<span class="s"> = </span>+bb[<span class="d">0</span>],
-</code><code id="L5740"><span class="ln">5740</span>                height<span class="s"> = </span>+bb[<span class="d">1</span>]<span class="s"> + </span>(origin<span class="s"> == </span><i>"baseline"</i> ? bb[<span class="d">3</span>]<span class="s"> - </span>bb[<span class="d">1</span>]<span class="s"> + </span>(+font.face.descent) : (bb[<span class="d">3</span>]<span class="s"> - </span>bb[<span class="d">1</span>])<span class="s"> / </span><span class="d">2</span>);
-</code><code id="L5741"><span class="ln">5741</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>letters.length; i &lt; ii; i++) {
-</code><code id="L5742"><span class="ln">5742</span>                <b>var</b> prev<span class="s"> = </span>i<span class="s"> &amp;&amp; </span>font.glyphs[letters[i<span class="s"> - </span><span class="d">1</span>]]<span class="s"> || </span>{},
-</code><code id="L5743"><span class="ln">5743</span>                    curr<span class="s"> = </span>font.glyphs[letters[i]];
-</code><code id="L5744"><span class="ln">5744</span>                shift += i ? (prev.w<span class="s"> || </span>font.w)<span class="s"> + </span>(prev.k<span class="s"> &amp;&amp; </span>prev.k[letters[i]]<span class="s"> || </span><span class="d">0</span>)<span class="s"> + </span>(font.w<span class="s"> * </span>letter_spacing) : <span class="d">0</span>;
-</code><code id="L5745"><span class="ln">5745</span>                curr<span class="s"> &amp;&amp; </span>curr.d<span class="s"> &amp;&amp; </span>out.push(<b>this</b>.path(curr.d).attr({fill: <i>"#<span class="d">000</span>"</i>, stroke: <i>"none"</i>, transform: [[<i>"t"</i>, shift, <span class="d">0</span>]]}));
-</code><code id="L5746"><span class="ln">5746</span>            }
-</code><code id="L5747"><span class="ln">5747</span>            out.scale(scale, scale, top, height).translate(x<span class="s"> - </span>top, y<span class="s"> - </span>height);
-</code><code id="L5748"><span class="ln">5748</span>        }
-</code><code id="L5749"><span class="ln">5749</span>        <b>return</b> out;
-</code><code id="L5750"><span class="ln">5750</span>    };
-</code><code id="L5751"><span class="ln">5751</span>
-</code><code id="L5752"><span class="ln">5752</span>    R.format<span class="s"> = </span><b>function</b> (token, params) {
-</code><code id="L5753"><span class="ln">5753</span>        <b>var</b> args<span class="s"> = </span>R.is(params, array) ? [<span class="d">0</span>][concat](params) : arguments;
-</code><code id="L5754"><span class="ln">5754</span>        token<span class="s"> &amp;&amp; </span>R.is(token, string)<span class="s"> &amp;&amp; </span>args.length<span class="s"> - </span><span class="d">1</span><span class="s"> &amp;&amp; </span>(token<span class="s"> = </span>token.replace(formatrg, <b>function</b> (str, i) {
-</code><code id="L5755"><span class="ln">5755</span>            <b>return</b> args[++i]<span class="s"> == </span><b>null</b> ? E : args[i];
-</code><code id="L5756"><span class="ln">5756</span>        }));
-</code><code id="L5757"><span class="ln">5757</span>        <b>return</b> token<span class="s"> || </span>E;
-</code><code id="L5758"><span class="ln">5758</span>    };
-</code><code id="L5759"><span class="ln">5759</span>    R.ninja<span class="s"> = </span><b>function</b> () {
-</code><code id="L5760"><span class="ln">5760</span>        oldRaphael.was ? (g.win.Raphael<span class="s"> = </span>oldRaphael.is) : <b>delete</b> Raphael;
-</code><code id="L5761"><span class="ln">5761</span>        <b>return</b> R;
-</code><code id="L5762"><span class="ln">5762</span>    };
-</code><code id="L5763"><span class="ln">5763</span><span class="c">    <span class="c">/*\</span>
-</span></code><code id="L5764"><span class="ln">5764</span><span class="c">    <span class="s"> * </span>Raphael.el
-</span></code><code id="L5765"><span class="ln">5765</span><span class="c">     [ property (object) ]
-</span></code><code id="L5766"><span class="ln">5766</span><span class="c">     **
-</span></code><code id="L5767"><span class="ln">5767</span><span class="c">    <span class="s"> * </span>You can add your own method to elements. This is usefull when you want to hack <b>default</b> functionality or
-</span></code><code id="L5768"><span class="ln">5768</span><span class="c">    <span class="s"> * </span>want to wrap some common transformation or attributes <b>in</b> one method. In difference to canvas methods,
-</span></code><code id="L5769"><span class="ln">5769</span><span class="c">    <span class="s"> * </span>you can redefine element method at any time. Expending element methods wouldn’t affect set
-</span></code><code id="L5770"><span class="ln">5770</span><span class="c">     > Usage
-</span></code><code id="L5771"><span class="ln">5771</span><span class="c">    <span class="s"> | </span>Raphael.el.red<span class="s"> = </span><b>function</b> () {
-</span></code><code id="L5772"><span class="ln">5772</span><span class="c">    <span class="s"> | </span>    <b>this</b>.attr({fill: <i>"#f00"</i>});
-</span></code><code id="L5773"><span class="ln">5773</span><span class="c">    <span class="s"> | </span>};
-</span></code><code id="L5774"><span class="ln">5774</span><span class="c">    <span class="s"> | </span><span class="c">// then use it</span>
-</span></code><code id="L5775"><span class="ln">5775</span><span class="c">    <span class="s"> | </span>paper.circle(<span class="d">100</span>, <span class="d">100</span>, <span class="d">20</span>).red();
-</span></code><code id="L5776"><span class="ln">5776</span><span class="c">    \*/</span>
-</code><code id="L5777"><span class="ln">5777</span>    R.el<span class="s"> = </span>elproto;
-</code><code id="L5778"><span class="ln">5778</span>    R.st<span class="s"> = </span>setproto;
-</code><code id="L5779"><span class="ln">5779</span>    <span class="c">// Firefox &lt;<span class="d">3.6</span> fix: http://webreflection.blogspot.com/<span class="d">2009</span>/<span class="d">11</span>/<span class="d">195</span>-chars-to-help-lazy-loading.html</span>
-</code><code id="L5780"><span class="ln">5780</span>    (<b>function</b> (doc, loaded, f) {
-</code><code id="L5781"><span class="ln">5781</span>        <b>if</b> (doc.readyState<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>doc.addEventListener){
-</code><code id="L5782"><span class="ln">5782</span>            doc.addEventListener(loaded, f<span class="s"> = </span><b>function</b> () {
-</code><code id="L5783"><span class="ln">5783</span>                doc.removeEventListener(loaded, f, <b>false</b>);
-</code><code id="L5784"><span class="ln">5784</span>                doc.readyState<span class="s"> = </span><i>"complete"</i>;
-</code><code id="L5785"><span class="ln">5785</span>            }, <b>false</b>);
-</code><code id="L5786"><span class="ln">5786</span>            doc.readyState<span class="s"> = </span><i>"loading"</i>;
-</code><code id="L5787"><span class="ln">5787</span>        }
-</code><code id="L5788"><span class="ln">5788</span>        <b>function</b> isLoaded() {
-</code><code id="L5789"><span class="ln">5789</span>            (/<b>in</b>/).test(doc.readyState) ? setTimeout(isLoaded, <span class="d">9</span>) : eve(<i>"DOMload"</i>);
-</code><code id="L5790"><span class="ln">5790</span>        }
-</code><code id="L5791"><span class="ln">5791</span>        isLoaded();
-</code><code id="L5792"><span class="ln">5792</span>    })(document, <i>"DOMContentLoaded"</i>);
+</span></code><code id="L5567"><span class="ln">5567</span><span class="c">    <span class="s"> - </span>callback (<b>function</b>) <b>function</b> to run
+</span></code><code id="L5568"><span class="ln">5568</span><span class="c">    <span class="s"> - </span>thisArg (object) context object <b>for</b> the callback
+</span></code><code id="L5569"><span class="ln">5569</span><span class="c">    <span class="s"> = </span>(object) Set object
+</span></code><code id="L5570"><span class="ln">5570</span><span class="c">    \*/</span>
+</code><code id="L5571"><span class="ln">5571</span>    setproto.forEach<span class="s"> = </span><b>function</b> (callback, thisArg) {
+</code><code id="L5572"><span class="ln">5572</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span><b>this</b>.items.length; i &lt; ii; i++) {
+</code><code id="L5573"><span class="ln">5573</span>            <b>if</b> (callback.call(thisArg, <b>this</b>.items[i])<span class="s"> === </span><b>false</b>) {
+</code><code id="L5574"><span class="ln">5574</span>                <b>return</b> <b>this</b>;
+</code><code id="L5575"><span class="ln">5575</span>            }
+</code><code id="L5576"><span class="ln">5576</span>        }
+</code><code id="L5577"><span class="ln">5577</span>        <b>return</b> <b>this</b>;
+</code><code id="L5578"><span class="ln">5578</span>    };
+</code><code id="L5579"><span class="ln">5579</span>    <b>for</b> (<b>var</b> method <b>in</b> elproto) <b>if</b> (elproto[has](method)) {
+</code><code id="L5580"><span class="ln">5580</span>        setproto[method]<span class="s"> = </span>(<b>function</b> (methodname) {
+</code><code id="L5581"><span class="ln">5581</span>            <b>return</b> <b>function</b> () {
+</code><code id="L5582"><span class="ln">5582</span>                <b>var</b> arg<span class="s"> = </span>arguments;
+</code><code id="L5583"><span class="ln">5583</span>                <b>return</b> <b>this</b>.forEach(<b>function</b> (el) {
+</code><code id="L5584"><span class="ln">5584</span>                    el[methodname][apply](el, arg);
+</code><code id="L5585"><span class="ln">5585</span>                });
+</code><code id="L5586"><span class="ln">5586</span>            };
+</code><code id="L5587"><span class="ln">5587</span>        })(method);
+</code><code id="L5588"><span class="ln">5588</span>    }
+</code><code id="L5589"><span class="ln">5589</span>    setproto.attr<span class="s"> = </span><b>function</b> (name, value) {
+</code><code id="L5590"><span class="ln">5590</span>        <b>if</b> (name<span class="s"> &amp;&amp; </span>R.is(name, array)<span class="s"> &amp;&amp; </span>R.is(name[<span class="d">0</span>], <i>"object"</i>)) {
+</code><code id="L5591"><span class="ln">5591</span>            <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>name.length; j &lt; jj; j++) {
+</code><code id="L5592"><span class="ln">5592</span>                <b>this</b>.items[j].attr(name[j]);
+</code><code id="L5593"><span class="ln">5593</span>            }
+</code><code id="L5594"><span class="ln">5594</span>        } <b>else</b> {
+</code><code id="L5595"><span class="ln">5595</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span><b>this</b>.items.length; i &lt; ii; i++) {
+</code><code id="L5596"><span class="ln">5596</span>                <b>this</b>.items[i].attr(name, value);
+</code><code id="L5597"><span class="ln">5597</span>            }
+</code><code id="L5598"><span class="ln">5598</span>        }
+</code><code id="L5599"><span class="ln">5599</span>        <b>return</b> <b>this</b>;
+</code><code id="L5600"><span class="ln">5600</span>    };
+</code><code id="L5601"><span class="ln">5601</span>    setproto.animate<span class="s"> = </span><b>function</b> (params, ms, easing, callback) {
+</code><code id="L5602"><span class="ln">5602</span>        (R.is(easing, <i>"<b>function</b>"</i>)<span class="s"> || </span>!easing)<span class="s"> &amp;&amp; </span>(callback<span class="s"> = </span>easing<span class="s"> || </span><b>null</b>);
+</code><code id="L5603"><span class="ln">5603</span>        <b>var</b> len<span class="s"> = </span><b>this</b>.items.length,
+</code><code id="L5604"><span class="ln">5604</span>            i<span class="s"> = </span>len,
+</code><code id="L5605"><span class="ln">5605</span>            item,
+</code><code id="L5606"><span class="ln">5606</span>            set<span class="s"> = </span><b>this</b>,
+</code><code id="L5607"><span class="ln">5607</span>            collector;
+</code><code id="L5608"><span class="ln">5608</span>        callback<span class="s"> &amp;&amp; </span>(collector<span class="s"> = </span><b>function</b> () {
+</code><code id="L5609"><span class="ln">5609</span>            !--len<span class="s"> &amp;&amp; </span>callback.call(set);
+</code><code id="L5610"><span class="ln">5610</span>        });
+</code><code id="L5611"><span class="ln">5611</span>        easing<span class="s"> = </span>R.is(easing, string) ? easing : collector;
+</code><code id="L5612"><span class="ln">5612</span>        <b>var</b> anim<span class="s"> = </span>params <b>instanceof</b> Animation ? params : R.animation(params, ms, easing, collector);
+</code><code id="L5613"><span class="ln">5613</span>        item<span class="s"> = </span><b>this</b>.items[--i].animate(anim);
+</code><code id="L5614"><span class="ln">5614</span>        <b>while</b> (i--) {
+</code><code id="L5615"><span class="ln">5615</span>            <b>this</b>.items[i]<span class="s"> &amp;&amp; </span>!<b>this</b>.items[i].removed<span class="s"> &amp;&amp; </span><b>this</b>.items[i].animateWith(item, anim);
+</code><code id="L5616"><span class="ln">5616</span>        }
+</code><code id="L5617"><span class="ln">5617</span>        <b>return</b> <b>this</b>;
+</code><code id="L5618"><span class="ln">5618</span>    };
+</code><code id="L5619"><span class="ln">5619</span>    setproto.insertAfter<span class="s"> = </span><b>function</b> (el) {
+</code><code id="L5620"><span class="ln">5620</span>        <b>var</b> i<span class="s"> = </span><b>this</b>.items.length;
+</code><code id="L5621"><span class="ln">5621</span>        <b>while</b> (i--) {
+</code><code id="L5622"><span class="ln">5622</span>            <b>this</b>.items[i].insertAfter(el);
+</code><code id="L5623"><span class="ln">5623</span>        }
+</code><code id="L5624"><span class="ln">5624</span>        <b>return</b> <b>this</b>;
+</code><code id="L5625"><span class="ln">5625</span>    };
+</code><code id="L5626"><span class="ln">5626</span>    setproto.getBBox<span class="s"> = </span><b>function</b> () {
+</code><code id="L5627"><span class="ln">5627</span>        <b>var</b> x<span class="s"> = </span>[],
+</code><code id="L5628"><span class="ln">5628</span>            y<span class="s"> = </span>[],
+</code><code id="L5629"><span class="ln">5629</span>            w<span class="s"> = </span>[],
+</code><code id="L5630"><span class="ln">5630</span>            h<span class="s"> = </span>[];
+</code><code id="L5631"><span class="ln">5631</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><b>this</b>.items.length; i--;) <b>if</b> (!<b>this</b>.items[i].removed) {
+</code><code id="L5632"><span class="ln">5632</span>            <b>var</b> box<span class="s"> = </span><b>this</b>.items[i].getBBox();
+</code><code id="L5633"><span class="ln">5633</span>            x.push(box.x);
+</code><code id="L5634"><span class="ln">5634</span>            y.push(box.y);
+</code><code id="L5635"><span class="ln">5635</span>            w.push(box.x<span class="s"> + </span>box.width);
+</code><code id="L5636"><span class="ln">5636</span>            h.push(box.y<span class="s"> + </span>box.height);
+</code><code id="L5637"><span class="ln">5637</span>        }
+</code><code id="L5638"><span class="ln">5638</span>        x<span class="s"> = </span>mmin[apply](<span class="d">0</span>, x);
+</code><code id="L5639"><span class="ln">5639</span>        y<span class="s"> = </span>mmin[apply](<span class="d">0</span>, y);
+</code><code id="L5640"><span class="ln">5640</span>        <b>return</b> {
+</code><code id="L5641"><span class="ln">5641</span>            x: x,
+</code><code id="L5642"><span class="ln">5642</span>            y: y,
+</code><code id="L5643"><span class="ln">5643</span>            width: mmax[apply](<span class="d">0</span>, w)<span class="s"> - </span>x,
+</code><code id="L5644"><span class="ln">5644</span>            height: mmax[apply](<span class="d">0</span>, h)<span class="s"> - </span>y
+</code><code id="L5645"><span class="ln">5645</span>        };
+</code><code id="L5646"><span class="ln">5646</span>    };
+</code><code id="L5647"><span class="ln">5647</span>    setproto.clone<span class="s"> = </span><b>function</b> (s) {
+</code><code id="L5648"><span class="ln">5648</span>        s<span class="s"> = </span><b>new</b> Set;
+</code><code id="L5649"><span class="ln">5649</span>        <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span><b>this</b>.items.length; i &lt; ii; i++) {
+</code><code id="L5650"><span class="ln">5650</span>            s.push(<b>this</b>.items[i].clone());
+</code><code id="L5651"><span class="ln">5651</span>        }
+</code><code id="L5652"><span class="ln">5652</span>        <b>return</b> s;
+</code><code id="L5653"><span class="ln">5653</span>    };
+</code><code id="L5654"><span class="ln">5654</span>    setproto.toString<span class="s"> = </span><b>function</b> () {
+</code><code id="L5655"><span class="ln">5655</span>        <b>return</b> <i>"Rapha\xebl\u2018s set"</i>;
+</code><code id="L5656"><span class="ln">5656</span>    };
+</code><code id="L5657"><span class="ln">5657</span>
+</code><code id="L5658"><span class="ln">5658</span>    R.registerFont<span class="s"> = </span><b>function</b> (font) {
+</code><code id="L5659"><span class="ln">5659</span>        <b>if</b> (!font.face) {
+</code><code id="L5660"><span class="ln">5660</span>            <b>return</b> font;
+</code><code id="L5661"><span class="ln">5661</span>        }
+</code><code id="L5662"><span class="ln">5662</span>        <b>this</b>.fonts<span class="s"> = </span><b>this</b>.fonts<span class="s"> || </span>{};
+</code><code id="L5663"><span class="ln">5663</span>        <b>var</b> fontcopy<span class="s"> = </span>{
+</code><code id="L5664"><span class="ln">5664</span>                w: font.w,
+</code><code id="L5665"><span class="ln">5665</span>                face: {},
+</code><code id="L5666"><span class="ln">5666</span>                glyphs: {}
+</code><code id="L5667"><span class="ln">5667</span>            },
+</code><code id="L5668"><span class="ln">5668</span>            family<span class="s"> = </span>font.face[<i>"font-family"</i>];
+</code><code id="L5669"><span class="ln">5669</span>        <b>for</b> (<b>var</b> prop <b>in</b> font.face) <b>if</b> (font.face[has](prop)) {
+</code><code id="L5670"><span class="ln">5670</span>            fontcopy.face[prop]<span class="s"> = </span>font.face[prop];
+</code><code id="L5671"><span class="ln">5671</span>        }
+</code><code id="L5672"><span class="ln">5672</span>        <b>if</b> (<b>this</b>.fonts[family]) {
+</code><code id="L5673"><span class="ln">5673</span>            <b>this</b>.fonts[family].push(fontcopy);
+</code><code id="L5674"><span class="ln">5674</span>        } <b>else</b> {
+</code><code id="L5675"><span class="ln">5675</span>            <b>this</b>.fonts[family]<span class="s"> = </span>[fontcopy];
+</code><code id="L5676"><span class="ln">5676</span>        }
+</code><code id="L5677"><span class="ln">5677</span>        <b>if</b> (!font.svg) {
+</code><code id="L5678"><span class="ln">5678</span>            fontcopy.face[<i>"units-per-em"</i>]<span class="s"> = </span>toInt(font.face[<i>"units-per-em"</i>], <span class="d">10</span>);
+</code><code id="L5679"><span class="ln">5679</span>            <b>for</b> (<b>var</b> glyph <b>in</b> font.glyphs) <b>if</b> (font.glyphs[has](glyph)) {
+</code><code id="L5680"><span class="ln">5680</span>                <b>var</b> path<span class="s"> = </span>font.glyphs[glyph];
+</code><code id="L5681"><span class="ln">5681</span>                fontcopy.glyphs[glyph]<span class="s"> = </span>{
+</code><code id="L5682"><span class="ln">5682</span>                    w: path.w,
+</code><code id="L5683"><span class="ln">5683</span>                    k: {},
+</code><code id="L5684"><span class="ln">5684</span>                    d: path.d<span class="s"> &amp;&amp; </span><i>"M"</i><span class="s"> + </span>path.d.replace(/[mlcxtrv]/g, <b>function</b> (command) {
+</code><code id="L5685"><span class="ln">5685</span>                            <b>return</b> {l: <i>"L"</i>, c: <i>"C"</i>, x: <i>"z"</i>, t: <i>"m"</i>, r: <i>"l"</i>, v: <i>"c"</i>}[command]<span class="s"> || </span><i>"M"</i>;
+</code><code id="L5686"><span class="ln">5686</span>                        })<span class="s"> + </span><i>"z"</i>
+</code><code id="L5687"><span class="ln">5687</span>                };
+</code><code id="L5688"><span class="ln">5688</span>                <b>if</b> (path.k) {
+</code><code id="L5689"><span class="ln">5689</span>                    <b>for</b> (<b>var</b> k <b>in</b> path.k) <b>if</b> (path[has](k)) {
+</code><code id="L5690"><span class="ln">5690</span>                        fontcopy.glyphs[glyph].k[k]<span class="s"> = </span>path.k[k];
+</code><code id="L5691"><span class="ln">5691</span>                    }
+</code><code id="L5692"><span class="ln">5692</span>                }
+</code><code id="L5693"><span class="ln">5693</span>            }
+</code><code id="L5694"><span class="ln">5694</span>        }
+</code><code id="L5695"><span class="ln">5695</span>        <b>return</b> font;
+</code><code id="L5696"><span class="ln">5696</span>    };
+</code><code id="L5697"><span class="ln">5697</span>    paperproto.getFont<span class="s"> = </span><b>function</b> (family, weight, style, stretch) {
+</code><code id="L5698"><span class="ln">5698</span>        stretch<span class="s"> = </span>stretch<span class="s"> || </span><i>"normal"</i>;
+</code><code id="L5699"><span class="ln">5699</span>        style<span class="s"> = </span>style<span class="s"> || </span><i>"normal"</i>;
+</code><code id="L5700"><span class="ln">5700</span>        weight<span class="s"> = </span>+weight<span class="s"> || </span>{normal: <span class="d">400</span>, bold: <span class="d">700</span>, lighter: <span class="d">300</span>, bolder: <span class="d">800</span>}[weight]<span class="s"> || </span><span class="d">400</span>;
+</code><code id="L5701"><span class="ln">5701</span>        <b>if</b> (!R.fonts) {
+</code><code id="L5702"><span class="ln">5702</span>            <b>return</b>;
+</code><code id="L5703"><span class="ln">5703</span>        }
+</code><code id="L5704"><span class="ln">5704</span>        <b>var</b> font<span class="s"> = </span>R.fonts[family];
+</code><code id="L5705"><span class="ln">5705</span>        <b>if</b> (!font) {
+</code><code id="L5706"><span class="ln">5706</span>            <b>var</b> name<span class="s"> = </span><b>new</b> RegExp(<i>"(^|\\s)"</i><span class="s"> + </span>family.replace(/[^\w\d\s+!~.:_-]/g, E)<span class="s"> + </span><i>"(\\s|$)"</i>, <i>"i"</i>);
+</code><code id="L5707"><span class="ln">5707</span>            <b>for</b> (<b>var</b> fontName <b>in</b> R.fonts) <b>if</b> (R.fonts[has](fontName)) {
+</code><code id="L5708"><span class="ln">5708</span>                <b>if</b> (name.test(fontName)) {
+</code><code id="L5709"><span class="ln">5709</span>                    font<span class="s"> = </span>R.fonts[fontName];
+</code><code id="L5710"><span class="ln">5710</span>                    <b>break</b>;
+</code><code id="L5711"><span class="ln">5711</span>                }
+</code><code id="L5712"><span class="ln">5712</span>            }
+</code><code id="L5713"><span class="ln">5713</span>        }
+</code><code id="L5714"><span class="ln">5714</span>        <b>var</b> thefont;
+</code><code id="L5715"><span class="ln">5715</span>        <b>if</b> (font) {
+</code><code id="L5716"><span class="ln">5716</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>font.length; i &lt; ii; i++) {
+</code><code id="L5717"><span class="ln">5717</span>                thefont<span class="s"> = </span>font[i];
+</code><code id="L5718"><span class="ln">5718</span>                <b>if</b> (thefont.face[<i>"font-weight"</i>]<span class="s"> == </span>weight<span class="s"> &amp;&amp; </span>(thefont.face[<i>"font-style"</i>]<span class="s"> == </span>style<span class="s"> || </span>!thefont.face[<i>"font-style"</i>])<span class="s"> &amp;&amp; </span>thefont.face[<i>"font-stretch"</i>]<span class="s"> == </span>stretch) {
+</code><code id="L5719"><span class="ln">5719</span>                    <b>break</b>;
+</code><code id="L5720"><span class="ln">5720</span>                }
+</code><code id="L5721"><span class="ln">5721</span>            }
+</code><code id="L5722"><span class="ln">5722</span>        }
+</code><code id="L5723"><span class="ln">5723</span>        <b>return</b> thefont;
+</code><code id="L5724"><span class="ln">5724</span>    };
+</code><code id="L5725"><span class="ln">5725</span>    paperproto.print<span class="s"> = </span><b>function</b> (x, y, string, font, size, origin, letter_spacing) {
+</code><code id="L5726"><span class="ln">5726</span>        origin<span class="s"> = </span>origin<span class="s"> || </span><i>"middle"</i>; <span class="c">// baseline|middle</span>
+</code><code id="L5727"><span class="ln">5727</span>        letter_spacing<span class="s"> = </span>mmax(mmin(letter_spacing<span class="s"> || </span><span class="d">0</span>, <span class="d">1</span>), -<span class="d">1</span>);
+</code><code id="L5728"><span class="ln">5728</span>        <b>var</b> out<span class="s"> = </span><b>this</b>.set(),
+</code><code id="L5729"><span class="ln">5729</span>            letters<span class="s"> = </span>Str(string).split(E),
+</code><code id="L5730"><span class="ln">5730</span>            shift<span class="s"> = </span><span class="d">0</span>,
+</code><code id="L5731"><span class="ln">5731</span>            path<span class="s"> = </span>E,
+</code><code id="L5732"><span class="ln">5732</span>            scale;
+</code><code id="L5733"><span class="ln">5733</span>        R.is(font, string)<span class="s"> &amp;&amp; </span>(font<span class="s"> = </span><b>this</b>.getFont(font));
+</code><code id="L5734"><span class="ln">5734</span>        <b>if</b> (font) {
+</code><code id="L5735"><span class="ln">5735</span>            scale<span class="s"> = </span>(size<span class="s"> || </span><span class="d">16</span>)<span class="s"> / </span>font.face[<i>"units-per-em"</i>];
+</code><code id="L5736"><span class="ln">5736</span>            <b>var</b> bb<span class="s"> = </span>font.face.bbox.split(separator),
+</code><code id="L5737"><span class="ln">5737</span>                top<span class="s"> = </span>+bb[<span class="d">0</span>],
+</code><code id="L5738"><span class="ln">5738</span>                height<span class="s"> = </span>+bb[<span class="d">1</span>]<span class="s"> + </span>(origin<span class="s"> == </span><i>"baseline"</i> ? bb[<span class="d">3</span>]<span class="s"> - </span>bb[<span class="d">1</span>]<span class="s"> + </span>(+font.face.descent) : (bb[<span class="d">3</span>]<span class="s"> - </span>bb[<span class="d">1</span>])<span class="s"> / </span><span class="d">2</span>);
+</code><code id="L5739"><span class="ln">5739</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>letters.length; i &lt; ii; i++) {
+</code><code id="L5740"><span class="ln">5740</span>                <b>var</b> prev<span class="s"> = </span>i<span class="s"> &amp;&amp; </span>font.glyphs[letters[i<span class="s"> - </span><span class="d">1</span>]]<span class="s"> || </span>{},
+</code><code id="L5741"><span class="ln">5741</span>                    curr<span class="s"> = </span>font.glyphs[letters[i]];
+</code><code id="L5742"><span class="ln">5742</span>                shift += i ? (prev.w<span class="s"> || </span>font.w)<span class="s"> + </span>(prev.k<span class="s"> &amp;&amp; </span>prev.k[letters[i]]<span class="s"> || </span><span class="d">0</span>)<span class="s"> + </span>(font.w<span class="s"> * </span>letter_spacing) : <span class="d">0</span>;
+</code><code id="L5743"><span class="ln">5743</span>                curr<span class="s"> &amp;&amp; </span>curr.d<span class="s"> &amp;&amp; </span>out.push(<b>this</b>.path(curr.d).attr({fill: <i>"#<span class="d">000</span>"</i>, stroke: <i>"none"</i>, transform: [[<i>"t"</i>, shift, <span class="d">0</span>]]}));
+</code><code id="L5744"><span class="ln">5744</span>            }
+</code><code id="L5745"><span class="ln">5745</span>            out.scale(scale, scale, top, height).translate(x<span class="s"> - </span>top, y<span class="s"> - </span>height);
+</code><code id="L5746"><span class="ln">5746</span>        }
+</code><code id="L5747"><span class="ln">5747</span>        <b>return</b> out;
+</code><code id="L5748"><span class="ln">5748</span>    };
+</code><code id="L5749"><span class="ln">5749</span>
+</code><code id="L5750"><span class="ln">5750</span>    R.format<span class="s"> = </span><b>function</b> (token, params) {
+</code><code id="L5751"><span class="ln">5751</span>        <b>var</b> args<span class="s"> = </span>R.is(params, array) ? [<span class="d">0</span>][concat](params) : arguments;
+</code><code id="L5752"><span class="ln">5752</span>        token<span class="s"> &amp;&amp; </span>R.is(token, string)<span class="s"> &amp;&amp; </span>args.length<span class="s"> - </span><span class="d">1</span><span class="s"> &amp;&amp; </span>(token<span class="s"> = </span>token.replace(formatrg, <b>function</b> (str, i) {
+</code><code id="L5753"><span class="ln">5753</span>            <b>return</b> args[++i]<span class="s"> == </span><b>null</b> ? E : args[i];
+</code><code id="L5754"><span class="ln">5754</span>        }));
+</code><code id="L5755"><span class="ln">5755</span>        <b>return</b> token<span class="s"> || </span>E;
+</code><code id="L5756"><span class="ln">5756</span>    };
+</code><code id="L5757"><span class="ln">5757</span>    R.ninja<span class="s"> = </span><b>function</b> () {
+</code><code id="L5758"><span class="ln">5758</span>        oldRaphael.was ? (g.win.Raphael<span class="s"> = </span>oldRaphael.is) : <b>delete</b> Raphael;
+</code><code id="L5759"><span class="ln">5759</span>        <b>return</b> R;
+</code><code id="L5760"><span class="ln">5760</span>    };
+</code><code id="L5761"><span class="ln">5761</span><span class="c">    <span class="c">/*\</span>
+</span></code><code id="L5762"><span class="ln">5762</span><span class="c">    <span class="s"> * </span>Raphael.el
+</span></code><code id="L5763"><span class="ln">5763</span><span class="c">     [ property (object) ]
+</span></code><code id="L5764"><span class="ln">5764</span><span class="c">     **
+</span></code><code id="L5765"><span class="ln">5765</span><span class="c">    <span class="s"> * </span>You can add your own method to elements. This is usefull when you want to hack <b>default</b> functionality or
+</span></code><code id="L5766"><span class="ln">5766</span><span class="c">    <span class="s"> * </span>want to wrap some common transformation or attributes <b>in</b> one method. In difference to canvas methods,
+</span></code><code id="L5767"><span class="ln">5767</span><span class="c">    <span class="s"> * </span>you can redefine element method at any time. Expending element methods wouldn’t affect set.
+</span></code><code id="L5768"><span class="ln">5768</span><span class="c">     > Usage
+</span></code><code id="L5769"><span class="ln">5769</span><span class="c">    <span class="s"> | </span>Raphael.el.red<span class="s"> = </span><b>function</b> () {
+</span></code><code id="L5770"><span class="ln">5770</span><span class="c">    <span class="s"> | </span>    <b>this</b>.attr({fill: <i>"#f00"</i>});
+</span></code><code id="L5771"><span class="ln">5771</span><span class="c">    <span class="s"> | </span>};
+</span></code><code id="L5772"><span class="ln">5772</span><span class="c">    <span class="s"> | </span><span class="c">// then use it</span>
+</span></code><code id="L5773"><span class="ln">5773</span><span class="c">    <span class="s"> | </span>paper.circle(<span class="d">100</span>, <span class="d">100</span>, <span class="d">20</span>).red();
+</span></code><code id="L5774"><span class="ln">5774</span><span class="c">    \*/</span>
+</code><code id="L5775"><span class="ln">5775</span>    R.el<span class="s"> = </span>elproto;
+</code><code id="L5776"><span class="ln">5776</span>    R.st<span class="s"> = </span>setproto;
+</code><code id="L5777"><span class="ln">5777</span>    <span class="c">// Firefox &lt;<span class="d">3.6</span> fix: http://webreflection.blogspot.com/<span class="d">2009</span>/<span class="d">11</span>/<span class="d">195</span>-chars-to-help-lazy-loading.html</span>
+</code><code id="L5778"><span class="ln">5778</span>    (<b>function</b> (doc, loaded, f) {
+</code><code id="L5779"><span class="ln">5779</span>        <b>if</b> (doc.readyState<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>doc.addEventListener){
+</code><code id="L5780"><span class="ln">5780</span>            doc.addEventListener(loaded, f<span class="s"> = </span><b>function</b> () {
+</code><code id="L5781"><span class="ln">5781</span>                doc.removeEventListener(loaded, f, <b>false</b>);
+</code><code id="L5782"><span class="ln">5782</span>                doc.readyState<span class="s"> = </span><i>"complete"</i>;
+</code><code id="L5783"><span class="ln">5783</span>            }, <b>false</b>);
+</code><code id="L5784"><span class="ln">5784</span>            doc.readyState<span class="s"> = </span><i>"loading"</i>;
+</code><code id="L5785"><span class="ln">5785</span>        }
+</code><code id="L5786"><span class="ln">5786</span>        <b>function</b> isLoaded() {
+</code><code id="L5787"><span class="ln">5787</span>            (/<b>in</b>/).test(doc.readyState) ? setTimeout(isLoaded, <span class="d">9</span>) : eve(<i>"DOMload"</i>);
+</code><code id="L5788"><span class="ln">5788</span>        }
+</code><code id="L5789"><span class="ln">5789</span>        isLoaded();
+</code><code id="L5790"><span class="ln">5790</span>    })(document, <i>"DOMContentLoaded"</i>);
+</code><code id="L5791"><span class="ln">5791</span>
+</code><code id="L5792"><span class="ln">5792</span>    oldRaphael.was ? (g.win.Raphael<span class="s"> = </span>R) : (Raphael<span class="s"> = </span>R);
 </code><code id="L5793"><span class="ln">5793</span>
-</code><code id="L5794"><span class="ln">5794</span>    oldRaphael.was ? (g.win.Raphael<span class="s"> = </span>R) : (Raphael<span class="s"> = </span>R);
-</code><code id="L5795"><span class="ln">5795</span>
-</code><code id="L5796"><span class="ln">5796</span><span class="c">    /*
-</span></code><code id="L5797"><span class="ln">5797</span><span class="c">    <span class="s"> * </span>Eve <span class="d">0.2</span><span class="d">.1</span><span class="s"> - </span>JavaScript Events Library
-</span></code><code id="L5798"><span class="ln">5798</span><span class="c">     *
-</span></code><code id="L5799"><span class="ln">5799</span><span class="c">    <span class="s"> * </span>Copyright (c) <span class="d">2010</span> Dmitry Baranovskiy (http:<span class="c">//dmitry.baranovskiy.com/)</span>
-</span></code><code id="L5800"><span class="ln">5800</span><span class="c">    <span class="s"> * </span>Licensed under the MIT (http:<span class="c">//www.opensource.org/licenses/mit-license.php) license.</span>
-</span></code><code id="L5801"><span class="ln">5801</span><span class="c">     */</span>
-</code><code id="L5802"><span class="ln">5802</span>
-</code><code id="L5803"><span class="ln">5803</span>    <b>var</b> eve<span class="s"> = </span>R.eve<span class="s"> = </span>(<b>function</b> () {
-</code><code id="L5804"><span class="ln">5804</span>        <b>var</b> version<span class="s"> = </span><i>"<span class="d">0.2</span><span class="d">.1</span>"</i>,
-</code><code id="L5805"><span class="ln">5805</span>            has<span class="s"> = </span><i>"hasOwnProperty"</i>,
-</code><code id="L5806"><span class="ln">5806</span>            separator<span class="s"> = </span>/[\.\/]/,
-</code><code id="L5807"><span class="ln">5807</span>            wildcard<span class="s"> = </span><i>"*"</i>,
-</code><code id="L5808"><span class="ln">5808</span>            events<span class="s"> = </span>{n: {}},
-</code><code id="L5809"><span class="ln">5809</span>            eve<span class="s"> = </span><b>function</b> (name, scope) {
-</code><code id="L5810"><span class="ln">5810</span>                <b>var</b> e<span class="s"> = </span>events,
-</code><code id="L5811"><span class="ln">5811</span>                    args<span class="s"> = </span>Array.prototype.slice.call(arguments, <span class="d">2</span>),
-</code><code id="L5812"><span class="ln">5812</span>                    listeners<span class="s"> = </span>eve.listeners(name),
-</code><code id="L5813"><span class="ln">5813</span>                    errors<span class="s"> = </span>[];
-</code><code id="L5814"><span class="ln">5814</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>listeners.length; i &lt; ii; i++) {
-</code><code id="L5815"><span class="ln">5815</span>                    <b>try</b> {
-</code><code id="L5816"><span class="ln">5816</span>                        listeners[i].apply(scope, args);
-</code><code id="L5817"><span class="ln">5817</span>                    } <b>catch</b> (ex) {
-</code><code id="L5818"><span class="ln">5818</span>                        errors.push({error: ex<span class="s"> &amp;&amp; </span>ex.message<span class="s"> || </span>ex, func: listeners[i]});
-</code><code id="L5819"><span class="ln">5819</span>                    }
-</code><code id="L5820"><span class="ln">5820</span>                }
-</code><code id="L5821"><span class="ln">5821</span>                <b>if</b> (errors.length) {
-</code><code id="L5822"><span class="ln">5822</span>                    <b>return</b> errors;
-</code><code id="L5823"><span class="ln">5823</span>                }
-</code><code id="L5824"><span class="ln">5824</span>            };
-</code><code id="L5825"><span class="ln">5825</span>        eve.listeners<span class="s"> = </span><b>function</b> (name) {
-</code><code id="L5826"><span class="ln">5826</span>            <b>var</b> names<span class="s"> = </span>name.split(separator),
-</code><code id="L5827"><span class="ln">5827</span>                e<span class="s"> = </span>events,
-</code><code id="L5828"><span class="ln">5828</span>                item,
-</code><code id="L5829"><span class="ln">5829</span>                items,
-</code><code id="L5830"><span class="ln">5830</span>                k,
-</code><code id="L5831"><span class="ln">5831</span>                i,
-</code><code id="L5832"><span class="ln">5832</span>                ii,
-</code><code id="L5833"><span class="ln">5833</span>                j,
-</code><code id="L5834"><span class="ln">5834</span>                jj,
-</code><code id="L5835"><span class="ln">5835</span>                nes,
-</code><code id="L5836"><span class="ln">5836</span>                es<span class="s"> = </span>[e],
-</code><code id="L5837"><span class="ln">5837</span>                out<span class="s"> = </span>[];
-</code><code id="L5838"><span class="ln">5838</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>names.length; i &lt; ii; i++) {
-</code><code id="L5839"><span class="ln">5839</span>                nes<span class="s"> = </span>[];
-</code><code id="L5840"><span class="ln">5840</span>                <b>for</b> (j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>es.length; j &lt; jj; j++) {
-</code><code id="L5841"><span class="ln">5841</span>                    e<span class="s"> = </span>es[j].n;
-</code><code id="L5842"><span class="ln">5842</span>                    items<span class="s"> = </span>[e[names[i]], e[wildcard]];
-</code><code id="L5843"><span class="ln">5843</span>                    k<span class="s"> = </span><span class="d">2</span>;
-</code><code id="L5844"><span class="ln">5844</span>                    <b>while</b> (k--) {
-</code><code id="L5845"><span class="ln">5845</span>                        item<span class="s"> = </span>items[k];
-</code><code id="L5846"><span class="ln">5846</span>                        <b>if</b> (item) {
-</code><code id="L5847"><span class="ln">5847</span>                            nes.push(item);
-</code><code id="L5848"><span class="ln">5848</span>                            out<span class="s"> = </span>out.concat(item.f<span class="s"> || </span>[]);
-</code><code id="L5849"><span class="ln">5849</span>                        }
-</code><code id="L5850"><span class="ln">5850</span>                    }
-</code><code id="L5851"><span class="ln">5851</span>                }
-</code><code id="L5852"><span class="ln">5852</span>                es<span class="s"> = </span>nes;
-</code><code id="L5853"><span class="ln">5853</span>            }
-</code><code id="L5854"><span class="ln">5854</span>            <b>return</b> out;
-</code><code id="L5855"><span class="ln">5855</span>        };
-</code><code id="L5856"><span class="ln">5856</span>        eve.on<span class="s"> = </span><b>function</b> (name, f) {
-</code><code id="L5857"><span class="ln">5857</span>            <b>var</b> names<span class="s"> = </span>name.split(separator),
-</code><code id="L5858"><span class="ln">5858</span>                e<span class="s"> = </span>events;
-</code><code id="L5859"><span class="ln">5859</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>names.length; i &lt; ii; i++) {
-</code><code id="L5860"><span class="ln">5860</span>                e<span class="s"> = </span>e.n;
-</code><code id="L5861"><span class="ln">5861</span>                !e[names[i]]<span class="s"> &amp;&amp; </span>(e[names[i]]<span class="s"> = </span>{n: {}});
-</code><code id="L5862"><span class="ln">5862</span>                e<span class="s"> = </span>e[names[i]];
-</code><code id="L5863"><span class="ln">5863</span>            }
-</code><code id="L5864"><span class="ln">5864</span>            e.f<span class="s"> = </span>e.f<span class="s"> || </span>[];
-</code><code id="L5865"><span class="ln">5865</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>e.f.length; i &lt; ii; i++) <b>if</b> (e.f[i]<span class="s"> == </span>f) {
-</code><code id="L5866"><span class="ln">5866</span>                <b>return</b> <b>false</b>;
-</code><code id="L5867"><span class="ln">5867</span>            }
-</code><code id="L5868"><span class="ln">5868</span>            e.f.push(f);
-</code><code id="L5869"><span class="ln">5869</span>        };
-</code><code id="L5870"><span class="ln">5870</span>        eve.unbind<span class="s"> = </span><b>function</b> (name, f) {
-</code><code id="L5871"><span class="ln">5871</span>            <b>var</b> names<span class="s"> = </span>name.split(separator),
-</code><code id="L5872"><span class="ln">5872</span>                e,
-</code><code id="L5873"><span class="ln">5873</span>                key,
-</code><code id="L5874"><span class="ln">5874</span>                splice,
-</code><code id="L5875"><span class="ln">5875</span>                cur<span class="s"> = </span>[events];
-</code><code id="L5876"><span class="ln">5876</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>names.length; i &lt; ii; i++) {
-</code><code id="L5877"><span class="ln">5877</span>                <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">0</span>; j &lt; cur.length; j += splice.length<span class="s"> - </span><span class="d">2</span>) {
-</code><code id="L5878"><span class="ln">5878</span>                    splice<span class="s"> = </span>[j, <span class="d">1</span>];
-</code><code id="L5879"><span class="ln">5879</span>                    e<span class="s"> = </span>cur[j].n;
-</code><code id="L5880"><span class="ln">5880</span>                    <b>if</b> (names[i] != wildcard) {
-</code><code id="L5881"><span class="ln">5881</span>                        <b>if</b> (e[names[i]]) {
-</code><code id="L5882"><span class="ln">5882</span>                            splice.push(e[names[i]]);
-</code><code id="L5883"><span class="ln">5883</span>                        }
-</code><code id="L5884"><span class="ln">5884</span>                    } <b>else</b> {
-</code><code id="L5885"><span class="ln">5885</span>                        <b>for</b> (key <b>in</b> e) <b>if</b> (e[has](key)) {
-</code><code id="L5886"><span class="ln">5886</span>                            splice.push(e[key]);
-</code><code id="L5887"><span class="ln">5887</span>                        }
-</code><code id="L5888"><span class="ln">5888</span>                    }
-</code><code id="L5889"><span class="ln">5889</span>                    cur.splice.apply(cur, splice);
-</code><code id="L5890"><span class="ln">5890</span>                }
-</code><code id="L5891"><span class="ln">5891</span>            }
-</code><code id="L5892"><span class="ln">5892</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>cur.length; i &lt; ii; i++) {
-</code><code id="L5893"><span class="ln">5893</span>                e<span class="s"> = </span>cur[i];
-</code><code id="L5894"><span class="ln">5894</span>                <b>while</b> (e.n) {
-</code><code id="L5895"><span class="ln">5895</span>                    <b>if</b> (f) {
-</code><code id="L5896"><span class="ln">5896</span>                        <b>if</b> (e.f) {
-</code><code id="L5897"><span class="ln">5897</span>                            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>e.f.length; i &lt; ii; i++) <b>if</b> (e.f[i]<span class="s"> == </span>f) {
-</code><code id="L5898"><span class="ln">5898</span>                                e.f.splice(i, <span class="d">1</span>);
-</code><code id="L5899"><span class="ln">5899</span>                                <b>break</b>;
-</code><code id="L5900"><span class="ln">5900</span>                            }
-</code><code id="L5901"><span class="ln">5901</span>                            !e.f.length<span class="s"> &amp;&amp; </span><b>delete</b> e.f;
-</code><code id="L5902"><span class="ln">5902</span>                        }
-</code><code id="L5903"><span class="ln">5903</span>                        <b>for</b> (key <b>in</b> e.n) <b>if</b> (e.n[has](key)<span class="s"> &amp;&amp; </span>e.n[key].f) {
-</code><code id="L5904"><span class="ln">5904</span>                            <b>var</b> funcs<span class="s"> = </span>e.n[key].f;
-</code><code id="L5905"><span class="ln">5905</span>                            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>funcs.length; i &lt; ii; i++) <b>if</b> (funcs[i]<span class="s"> == </span>f) {
-</code><code id="L5906"><span class="ln">5906</span>                                funcs.splice(i, <span class="d">1</span>);
-</code><code id="L5907"><span class="ln">5907</span>                                <b>break</b>;
-</code><code id="L5908"><span class="ln">5908</span>                            }
-</code><code id="L5909"><span class="ln">5909</span>                            !funcs.length<span class="s"> &amp;&amp; </span><b>delete</b> e.n[key].f;
-</code><code id="L5910"><span class="ln">5910</span>                        }
-</code><code id="L5911"><span class="ln">5911</span>                    } <b>else</b> {
-</code><code id="L5912"><span class="ln">5912</span>                        <b>delete</b> e.f;
-</code><code id="L5913"><span class="ln">5913</span>                        <b>for</b> (key <b>in</b> e.n) <b>if</b> (e.n[has](key)<span class="s"> &amp;&amp; </span>e.n[key].f) {
-</code><code id="L5914"><span class="ln">5914</span>                            <b>delete</b> e.n[key].f;
-</code><code id="L5915"><span class="ln">5915</span>                        }
-</code><code id="L5916"><span class="ln">5916</span>                    }
-</code><code id="L5917"><span class="ln">5917</span>                    e<span class="s"> = </span>e.n;
-</code><code id="L5918"><span class="ln">5918</span>                }
-</code><code id="L5919"><span class="ln">5919</span>            }
-</code><code id="L5920"><span class="ln">5920</span>            <b>return</b> <b>true</b>;
-</code><code id="L5921"><span class="ln">5921</span>        };
-</code><code id="L5922"><span class="ln">5922</span>        eve.version<span class="s"> = </span>version;
-</code><code id="L5923"><span class="ln">5923</span>        eve.toString<span class="s"> = </span><b>function</b> () {
-</code><code id="L5924"><span class="ln">5924</span>            <b>return</b> <i>"You are running Eve "</i><span class="s"> + </span>version;
-</code><code id="L5925"><span class="ln">5925</span>        };
-</code><code id="L5926"><span class="ln">5926</span>        <b>return</b> eve;
-</code><code id="L5927"><span class="ln">5927</span>    })();
-</code><code id="L5928"><span class="ln">5928</span>})();
+</code><code id="L5794"><span class="ln">5794</span><span class="c">    /*
+</span></code><code id="L5795"><span class="ln">5795</span><span class="c">    <span class="s"> * </span>Eve <span class="d">0.2</span><span class="d">.1</span><span class="s"> - </span>JavaScript Events Library
+</span></code><code id="L5796"><span class="ln">5796</span><span class="c">     *
+</span></code><code id="L5797"><span class="ln">5797</span><span class="c">    <span class="s"> * </span>Copyright (c) <span class="d">2010</span> Dmitry Baranovskiy (http:<span class="c">//dmitry.baranovskiy.com/)</span>
+</span></code><code id="L5798"><span class="ln">5798</span><span class="c">    <span class="s"> * </span>Licensed under the MIT (http:<span class="c">//www.opensource.org/licenses/mit-license.php) license.</span>
+</span></code><code id="L5799"><span class="ln">5799</span><span class="c">     */</span>
+</code><code id="L5800"><span class="ln">5800</span>
+</code><code id="L5801"><span class="ln">5801</span>    <b>var</b> eve<span class="s"> = </span>R.eve<span class="s"> = </span>(<b>function</b> () {
+</code><code id="L5802"><span class="ln">5802</span>        <b>var</b> version<span class="s"> = </span><i>"<span class="d">0.2</span><span class="d">.1</span>"</i>,
+</code><code id="L5803"><span class="ln">5803</span>            has<span class="s"> = </span><i>"hasOwnProperty"</i>,
+</code><code id="L5804"><span class="ln">5804</span>            separator<span class="s"> = </span>/[\.\/]/,
+</code><code id="L5805"><span class="ln">5805</span>            wildcard<span class="s"> = </span><i>"*"</i>,
+</code><code id="L5806"><span class="ln">5806</span>            events<span class="s"> = </span>{n: {}},
+</code><code id="L5807"><span class="ln">5807</span>            eve<span class="s"> = </span><b>function</b> (name, scope) {
+</code><code id="L5808"><span class="ln">5808</span>                <b>var</b> e<span class="s"> = </span>events,
+</code><code id="L5809"><span class="ln">5809</span>                    args<span class="s"> = </span>Array.prototype.slice.call(arguments, <span class="d">2</span>),
+</code><code id="L5810"><span class="ln">5810</span>                    listeners<span class="s"> = </span>eve.listeners(name),
+</code><code id="L5811"><span class="ln">5811</span>                    errors<span class="s"> = </span>[];
+</code><code id="L5812"><span class="ln">5812</span>                <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>listeners.length; i &lt; ii; i++) {
+</code><code id="L5813"><span class="ln">5813</span>                    <b>try</b> {
+</code><code id="L5814"><span class="ln">5814</span>                        listeners[i].apply(scope, args);
+</code><code id="L5815"><span class="ln">5815</span>                    } <b>catch</b> (ex) {
+</code><code id="L5816"><span class="ln">5816</span>                        errors.push({error: ex<span class="s"> &amp;&amp; </span>ex.message<span class="s"> || </span>ex, func: listeners[i]});
+</code><code id="L5817"><span class="ln">5817</span>                    }
+</code><code id="L5818"><span class="ln">5818</span>                }
+</code><code id="L5819"><span class="ln">5819</span>                <b>if</b> (errors.length) {
+</code><code id="L5820"><span class="ln">5820</span>                    <b>return</b> errors;
+</code><code id="L5821"><span class="ln">5821</span>                }
+</code><code id="L5822"><span class="ln">5822</span>            };
+</code><code id="L5823"><span class="ln">5823</span>        eve.listeners<span class="s"> = </span><b>function</b> (name) {
+</code><code id="L5824"><span class="ln">5824</span>            <b>var</b> names<span class="s"> = </span>name.split(separator),
+</code><code id="L5825"><span class="ln">5825</span>                e<span class="s"> = </span>events,
+</code><code id="L5826"><span class="ln">5826</span>                item,
+</code><code id="L5827"><span class="ln">5827</span>                items,
+</code><code id="L5828"><span class="ln">5828</span>                k,
+</code><code id="L5829"><span class="ln">5829</span>                i,
+</code><code id="L5830"><span class="ln">5830</span>                ii,
+</code><code id="L5831"><span class="ln">5831</span>                j,
+</code><code id="L5832"><span class="ln">5832</span>                jj,
+</code><code id="L5833"><span class="ln">5833</span>                nes,
+</code><code id="L5834"><span class="ln">5834</span>                es<span class="s"> = </span>[e],
+</code><code id="L5835"><span class="ln">5835</span>                out<span class="s"> = </span>[];
+</code><code id="L5836"><span class="ln">5836</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>names.length; i &lt; ii; i++) {
+</code><code id="L5837"><span class="ln">5837</span>                nes<span class="s"> = </span>[];
+</code><code id="L5838"><span class="ln">5838</span>                <b>for</b> (j<span class="s"> = </span><span class="d">0</span>, jj<span class="s"> = </span>es.length; j &lt; jj; j++) {
+</code><code id="L5839"><span class="ln">5839</span>                    e<span class="s"> = </span>es[j].n;
+</code><code id="L5840"><span class="ln">5840</span>                    items<span class="s"> = </span>[e[names[i]], e[wildcard]];
+</code><code id="L5841"><span class="ln">5841</span>                    k<span class="s"> = </span><span class="d">2</span>;
+</code><code id="L5842"><span class="ln">5842</span>                    <b>while</b> (k--) {
+</code><code id="L5843"><span class="ln">5843</span>                        item<span class="s"> = </span>items[k];
+</code><code id="L5844"><span class="ln">5844</span>                        <b>if</b> (item) {
+</code><code id="L5845"><span class="ln">5845</span>                            nes.push(item);
+</code><code id="L5846"><span class="ln">5846</span>                            out<span class="s"> = </span>out.concat(item.f<span class="s"> || </span>[]);
+</code><code id="L5847"><span class="ln">5847</span>                        }
+</code><code id="L5848"><span class="ln">5848</span>                    }
+</code><code id="L5849"><span class="ln">5849</span>                }
+</code><code id="L5850"><span class="ln">5850</span>                es<span class="s"> = </span>nes;
+</code><code id="L5851"><span class="ln">5851</span>            }
+</code><code id="L5852"><span class="ln">5852</span>            <b>return</b> out;
+</code><code id="L5853"><span class="ln">5853</span>        };
+</code><code id="L5854"><span class="ln">5854</span>        eve.on<span class="s"> = </span><b>function</b> (name, f) {
+</code><code id="L5855"><span class="ln">5855</span>            <b>var</b> names<span class="s"> = </span>name.split(separator),
+</code><code id="L5856"><span class="ln">5856</span>                e<span class="s"> = </span>events;
+</code><code id="L5857"><span class="ln">5857</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>names.length; i &lt; ii; i++) {
+</code><code id="L5858"><span class="ln">5858</span>                e<span class="s"> = </span>e.n;
+</code><code id="L5859"><span class="ln">5859</span>                !e[names[i]]<span class="s"> &amp;&amp; </span>(e[names[i]]<span class="s"> = </span>{n: {}});
+</code><code id="L5860"><span class="ln">5860</span>                e<span class="s"> = </span>e[names[i]];
+</code><code id="L5861"><span class="ln">5861</span>            }
+</code><code id="L5862"><span class="ln">5862</span>            e.f<span class="s"> = </span>e.f<span class="s"> || </span>[];
+</code><code id="L5863"><span class="ln">5863</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>e.f.length; i &lt; ii; i++) <b>if</b> (e.f[i]<span class="s"> == </span>f) {
+</code><code id="L5864"><span class="ln">5864</span>                <b>return</b> <b>false</b>;
+</code><code id="L5865"><span class="ln">5865</span>            }
+</code><code id="L5866"><span class="ln">5866</span>            e.f.push(f);
+</code><code id="L5867"><span class="ln">5867</span>        };
+</code><code id="L5868"><span class="ln">5868</span>        eve.unbind<span class="s"> = </span><b>function</b> (name, f) {
+</code><code id="L5869"><span class="ln">5869</span>            <b>var</b> names<span class="s"> = </span>name.split(separator),
+</code><code id="L5870"><span class="ln">5870</span>                e,
+</code><code id="L5871"><span class="ln">5871</span>                key,
+</code><code id="L5872"><span class="ln">5872</span>                splice,
+</code><code id="L5873"><span class="ln">5873</span>                cur<span class="s"> = </span>[events];
+</code><code id="L5874"><span class="ln">5874</span>            <b>for</b> (<b>var</b> i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>names.length; i &lt; ii; i++) {
+</code><code id="L5875"><span class="ln">5875</span>                <b>for</b> (<b>var</b> j<span class="s"> = </span><span class="d">0</span>; j &lt; cur.length; j += splice.length<span class="s"> - </span><span class="d">2</span>) {
+</code><code id="L5876"><span class="ln">5876</span>                    splice<span class="s"> = </span>[j, <span class="d">1</span>];
+</code><code id="L5877"><span class="ln">5877</span>                    e<span class="s"> = </span>cur[j].n;
+</code><code id="L5878"><span class="ln">5878</span>                    <b>if</b> (names[i] != wildcard) {
+</code><code id="L5879"><span class="ln">5879</span>                        <b>if</b> (e[names[i]]) {
+</code><code id="L5880"><span class="ln">5880</span>                            splice.push(e[names[i]]);
+</code><code id="L5881"><span class="ln">5881</span>                        }
+</code><code id="L5882"><span class="ln">5882</span>                    } <b>else</b> {
+</code><code id="L5883"><span class="ln">5883</span>                        <b>for</b> (key <b>in</b> e) <b>if</b> (e[has](key)) {
+</code><code id="L5884"><span class="ln">5884</span>                            splice.push(e[key]);
+</code><code id="L5885"><span class="ln">5885</span>                        }
+</code><code id="L5886"><span class="ln">5886</span>                    }
+</code><code id="L5887"><span class="ln">5887</span>                    cur.splice.apply(cur, splice);
+</code><code id="L5888"><span class="ln">5888</span>                }
+</code><code id="L5889"><span class="ln">5889</span>            }
+</code><code id="L5890"><span class="ln">5890</span>            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>cur.length; i &lt; ii; i++) {
+</code><code id="L5891"><span class="ln">5891</span>                e<span class="s"> = </span>cur[i];
+</code><code id="L5892"><span class="ln">5892</span>                <b>while</b> (e.n) {
+</code><code id="L5893"><span class="ln">5893</span>                    <b>if</b> (f) {
+</code><code id="L5894"><span class="ln">5894</span>                        <b>if</b> (e.f) {
+</code><code id="L5895"><span class="ln">5895</span>                            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>e.f.length; i &lt; ii; i++) <b>if</b> (e.f[i]<span class="s"> == </span>f) {
+</code><code id="L5896"><span class="ln">5896</span>                                e.f.splice(i, <span class="d">1</span>);
+</code><code id="L5897"><span class="ln">5897</span>                                <b>break</b>;
+</code><code id="L5898"><span class="ln">5898</span>                            }
+</code><code id="L5899"><span class="ln">5899</span>                            !e.f.length<span class="s"> &amp;&amp; </span><b>delete</b> e.f;
+</code><code id="L5900"><span class="ln">5900</span>                        }
+</code><code id="L5901"><span class="ln">5901</span>                        <b>for</b> (key <b>in</b> e.n) <b>if</b> (e.n[has](key)<span class="s"> &amp;&amp; </span>e.n[key].f) {
+</code><code id="L5902"><span class="ln">5902</span>                            <b>var</b> funcs<span class="s"> = </span>e.n[key].f;
+</code><code id="L5903"><span class="ln">5903</span>                            <b>for</b> (i<span class="s"> = </span><span class="d">0</span>, ii<span class="s"> = </span>funcs.length; i &lt; ii; i++) <b>if</b> (funcs[i]<span class="s"> == </span>f) {
+</code><code id="L5904"><span class="ln">5904</span>                                funcs.splice(i, <span class="d">1</span>);
+</code><code id="L5905"><span class="ln">5905</span>                                <b>break</b>;
+</code><code id="L5906"><span class="ln">5906</span>                            }
+</code><code id="L5907"><span class="ln">5907</span>                            !funcs.length<span class="s"> &amp;&amp; </span><b>delete</b> e.n[key].f;
+</code><code id="L5908"><span class="ln">5908</span>                        }
+</code><code id="L5909"><span class="ln">5909</span>                    } <b>else</b> {
+</code><code id="L5910"><span class="ln">5910</span>                        <b>delete</b> e.f;
+</code><code id="L5911"><span class="ln">5911</span>                        <b>for</b> (key <b>in</b> e.n) <b>if</b> (e.n[has](key)<span class="s"> &amp;&amp; </span>e.n[key].f) {
+</code><code id="L5912"><span class="ln">5912</span>                            <b>delete</b> e.n[key].f;
+</code><code id="L5913"><span class="ln">5913</span>                        }
+</code><code id="L5914"><span class="ln">5914</span>                    }
+</code><code id="L5915"><span class="ln">5915</span>                    e<span class="s"> = </span>e.n;
+</code><code id="L5916"><span class="ln">5916</span>                }
+</code><code id="L5917"><span class="ln">5917</span>            }
+</code><code id="L5918"><span class="ln">5918</span>            <b>return</b> <b>true</b>;
+</code><code id="L5919"><span class="ln">5919</span>        };
+</code><code id="L5920"><span class="ln">5920</span>        eve.version<span class="s"> = </span>version;
+</code><code id="L5921"><span class="ln">5921</span>        eve.toString<span class="s"> = </span><b>function</b> () {
+</code><code id="L5922"><span class="ln">5922</span>            <b>return</b> <i>"You are running Eve "</i><span class="s"> + </span>version;
+</code><code id="L5923"><span class="ln">5923</span>        };
+</code><code id="L5924"><span class="ln">5924</span>        <b>return</b> eve;
+</code><code id="L5925"><span class="ln">5925</span>    })();
+</code><code id="L5926"><span class="ln">5926</span>})();
 </code></body></html>
\ No newline at end of file
index 571cc90..9f39b0c 100644 (file)
@@ -29,8 +29,9 @@
      - onReadyCallback (function) function that is going to be called on DOM ready event. You can also subscribe to this event via Eve’s “DOMLoad” event. In this case method returns `undefined`.
      = (object) @Paper
      > Usage
-     | // Each of the following examples create a canvas that is 320px wide by 200px high
-     | // Canvas is created at the viewport’s 10,50 coordinate
+     | // Each of the following examples create a canvas
+     | // that is 320px wide by 200px high.
+     | // Canvas is created at the viewport’s 10,50 coordinate.
      | var paper = Raphael(10, 50, 320, 200);
      | // Canvas is created at the top left corner of the #notepad element
      | // (or its top right corner in dir="rtl" elements)
      > Parameters
      - colour (string) colour string in one of formats:
      # <ul>
-     #     <li>Colour name (“<samp>red</samp>”, “<samp>green</samp>”, “<samp>cornflowerblue</samp>”, etc)</li>
-     #     <li>#••• — shortened HTML colour: (“<samp>#000</samp>”, “<samp>#fc0</samp>”, etc)</li>
-     #     <li>#•••••• — full length HTML colour: (“<samp>#000000</samp>”, “<samp>#bd2300</samp>”)</li>
-     #     <li>rgb(•••, •••, •••) — red, green and blue channels’ values: (“<samp>rgb(200,&nbsp;100,&nbsp;0)</samp>”)</li>
-     #     <li>rgb(•••%, •••%, •••%) — same as above, but in %: (“<samp>rgb(100%,&nbsp;175%,&nbsp;0%)</samp>”)</li>
-     #     <li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“<samp>hsb(0.5,&nbsp;0.25,&nbsp;1)</samp>”)</li>
+     #     <li>Colour name (“<code>red</code>”, “<code>green</code>”, “<code>cornflowerblue</code>”, etc)</li>
+     #     <li>#••• — shortened HTML colour: (“<code>#000</code>”, “<code>#fc0</code>”, etc)</li>
+     #     <li>#•••••• — full length HTML colour: (“<code>#000000</code>”, “<code>#bd2300</code>”)</li>
+     #     <li>rgb(•••, •••, •••) — red, green and blue channels’ values: (“<code>rgb(200,&nbsp;100,&nbsp;0)</code>”)</li>
+     #     <li>rgb(•••%, •••%, •••%) — same as above, but in %: (“<code>rgb(100%,&nbsp;175%,&nbsp;0%)</code>”)</li>
+     #     <li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“<code>hsb(0.5,&nbsp;0.25,&nbsp;1)</code>”)</li>
      #     <li>hsb(•••%, •••%, •••%) — same as above, but in %</li>
      #     <li>hsl(•••, •••, •••) — same as hsb</li>
      #     <li>hsl(•••%, •••%, •••%) — same as hsb</li>
      **
      * You can add your own method to elements. This is usefull when you want to hack default functionality or
      * want to wrap some common transformation or attributes in one method. In difference to canvas methods,
-     * you can redefine element method at any time. Expending element methods wouldn’t affect set
+     * you can redefine element method at any time. Expending element methods wouldn’t affect set.
      > Usage
      | Raphael.el.red = function () {
      |     this.attr({fill: "#f00"});
index b998b3c..6ccc661 100644 (file)
@@ -1,8 +1,8 @@
 <!DOCTYPE html>
 <!-- Generated with Dr.js -->
-<html lang="en"><head><meta charset="utf-8"><title>Raphaël Reference</title><link rel="stylesheet" href="dr.css"></head><body id="dr-js"><div id="dr"><ol class="dr-toc"><li class="dr-lvl0"><a href="#Animation" class="undefined"><span>Animation</span></a></li><li class="dr-lvl1"><a href="#Animation.delay" class="dr-method"><span>Animation.delay()</span></a></li><li class="dr-lvl1"><a href="#Animation.repeat" class="dr-method"><span>Animation.repeat()</span></a></li><li class="dr-lvl0"><a href="#Element" class="undefined"><span>Element</span></a></li><li class="dr-lvl1"><a href="#Element.animate" class="dr-method"><span>Element.animate()</span></a></li><li class="dr-lvl1"><a href="#Element.animateWith" class="dr-method"><span>Element.animateWith()</span></a></li><li class="dr-lvl1"><a href="#Element.attr" class="dr-method"><span>Element.attr()</span></a></li><li class="dr-lvl1"><a href="#Element.clone" class="dr-method"><span>Element.clone()</span></a></li><li class="dr-lvl1"><a href="#Element.drag" class="dr-method"><span>Element.drag()</span></a></li><li class="dr-lvl1"><a href="#Element.getBBox" class="dr-method"><span>Element.getBBox()</span></a></li><li class="dr-lvl1"><a href="#Element.getPointAtLength" class="dr-method"><span>Element.getPointAtLength()</span></a></li><li class="dr-lvl1"><a href="#Element.getSubpath" class="dr-method"><span>Element.getSubpath()</span></a></li><li class="dr-lvl1"><a href="#Element.getTotalLength" class="dr-method"><span>Element.getTotalLength()</span></a></li><li class="dr-lvl1"><a href="#Element.glow" class="dr-method"><span>Element.glow()</span></a></li><li class="dr-lvl1"><a href="#Element.hide" class="dr-method"><span>Element.hide()</span></a></li><li class="dr-lvl1"><a href="#Element.hover" class="dr-method"><span>Element.hover()</span></a></li><li class="dr-lvl1"><a href="#Element.id" class="dr-property"><span>Element.id</span></a></li><li class="dr-lvl1"><a href="#Element.insertAfter" class="dr-method"><span>Element.insertAfter()</span></a></li><li class="dr-lvl1"><a href="#Element.insertBefore" class="dr-method"><span>Element.insertBefore()</span></a></li><li class="dr-lvl1"><a href="#Element.next" class="dr-property"><span>Element.next</span></a></li><li class="dr-lvl1"><a href="#Element.node" class="dr-property"><span>Element.node</span></a></li><li class="dr-lvl1"><a href="#Element.onDragOver" class="dr-method"><span>Element.onDragOver()</span></a></li><li class="dr-lvl1"><a href="#Element.paper" class="dr-property"><span>Element.paper</span></a></li><li class="dr-lvl1"><a href="#Element.pause" class="dr-method"><span>Element.pause()</span></a></li><li class="dr-lvl1"><a href="#Element.prev" class="dr-property"><span>Element.prev</span></a></li><li class="dr-lvl1"><a href="#Element.raphael" class="dr-property"><span>Element.raphael</span></a></li><li class="dr-lvl1"><a href="#Element.remove" class="dr-method"><span>Element.remove()</span></a></li><li class="dr-lvl1"><a href="#Element.resume" class="dr-method"><span>Element.resume()</span></a></li><li class="dr-lvl1"><a href="#Element.rotate" class="dr-method"><span>Element.rotate()</span></a></li><li class="dr-lvl1"><a href="#Element.scale" class="dr-method"><span>Element.scale()</span></a></li><li class="dr-lvl1"><a href="#Element.setTime" class="dr-method"><span>Element.setTime()</span></a></li><li class="dr-lvl1"><a href="#Element.show" class="dr-method"><span>Element.show()</span></a></li><li class="dr-lvl1"><a href="#Element.status" class="dr-method"><span>Element.status()</span></a></li><li class="dr-lvl1"><a href="#Element.stop" class="dr-method"><span>Element.stop()</span></a></li><li class="dr-lvl1"><a href="#Element.toBack" class="dr-method"><span>Element.toBack()</span></a></li><li class="dr-lvl1"><a href="#Element.toFront" class="dr-method"><span>Element.toFront()</span></a></li><li class="dr-lvl1"><a href="#Element.transform" class="dr-method"><span>Element.transform()</span></a></li><li class="dr-lvl1"><a href="#Element.translate" class="dr-method"><span>Element.translate()</span></a></li><li class="dr-lvl1"><a href="#Element.undrag" class="dr-method"><span>Element.undrag()</span></a></li><li class="dr-lvl1"><a href="#Element.unhover" class="dr-method"><span>Element.unhover()</span></a></li><li class="dr-lvl0"><a href="#Paper" class="undefined"><span>Paper</span></a></li><li class="dr-lvl1"><a href="#Paper.bottom" class="dr-property"><span>Paper.bottom</span></a></li><li class="dr-lvl1"><a href="#Paper.circle" class="dr-method"><span>Paper.circle()</span></a></li><li class="dr-lvl1"><a href="#Paper.clear" class="dr-method"><span>Paper.clear()</span></a></li><li class="dr-lvl1"><a href="#Paper.customAttributes" class="dr-property"><span>Paper.customAttributes</span></a></li><li class="dr-lvl1"><a href="#Paper.ellipse" class="dr-method"><span>Paper.ellipse()</span></a></li><li class="dr-lvl1"><a href="#Paper.forEach" class="dr-method"><span>Paper.forEach()</span></a></li><li class="dr-lvl1"><a href="#Paper.getById" class="dr-method"><span>Paper.getById()</span></a></li><li class="dr-lvl1"><a href="#Paper.getElementByPoint" class="dr-method"><span>Paper.getElementByPoint()</span></a></li><li class="dr-lvl1"><a href="#Paper.image" class="dr-method"><span>Paper.image()</span></a></li><li class="dr-lvl1"><a href="#Paper.path" class="dr-method"><span>Paper.path()</span></a></li><li class="dr-lvl1"><a href="#Paper.raphael" class="dr-property"><span>Paper.raphael</span></a></li><li class="dr-lvl1"><a href="#Paper.rect" class="dr-method"><span>Paper.rect()</span></a></li><li class="dr-lvl1"><a href="#Paper.remove" class="dr-method"><span>Paper.remove()</span></a></li><li class="dr-lvl1"><a href="#Paper.safari" class="dr-method"><span>Paper.safari()</span></a></li><li class="dr-lvl1"><a href="#Paper.set" class="dr-method"><span>Paper.set()</span></a></li><li class="dr-lvl1"><a href="#Paper.setSize" class="dr-method"><span>Paper.setSize()</span></a></li><li class="dr-lvl1"><a href="#Paper.setViewBox" class="dr-method"><span>Paper.setViewBox()</span></a></li><li class="dr-lvl1"><a href="#Paper.text" class="dr-method"><span>Paper.text()</span></a></li><li class="dr-lvl1"><a href="#Paper.top" class="dr-property"><span>Paper.top</span></a></li><li class="dr-lvl0"><a href="#Raphael" class="dr-method"><span>Raphael()</span></a></li><li class="dr-lvl1"><a href="#Raphael.angle" class="dr-method"><span>Raphael.angle()</span></a></li><li class="dr-lvl1"><a href="#Raphael.animation" class="dr-method"><span>Raphael.animation()</span></a></li><li class="dr-lvl1"><a href="#Raphael.deg" class="dr-method"><span>Raphael.deg()</span></a></li><li class="dr-lvl1"><a href="#Raphael.easing_formulas" class="dr-property"><span>Raphael.easing_formulas</span></a></li><li class="dr-lvl1"><a href="#Raphael.el" class="dr-property"><span>Raphael.el</span></a></li><li class="dr-lvl1"><a href="#Raphael.findDotsAtSegment" class="dr-method"><span>Raphael.findDotsAtSegment()</span></a></li><li class="dr-lvl1"><a href="#Raphael.fn" class="dr-property"><span>Raphael.fn</span></a></li><li class="dr-lvl1"><a href="#Raphael.getColor" class="dr-method"><span>Raphael.getColor()</span></a></li><li class="dr-lvl2"><a href="#Raphael.getColor.reset" class="dr-method"><span>Raphael.getColor.reset()</span></a></li><li class="dr-lvl1"><a href="#Raphael.getPointAtLength" class="dr-method"><span>Raphael.getPointAtLength()</span></a></li><li class="dr-lvl1"><a href="#Raphael.getRGB" class="dr-method"><span>Raphael.getRGB()</span></a></li><li class="dr-lvl1"><a href="#Raphael.getSubpath" class="dr-method"><span>Raphael.getSubpath()</span></a></li><li class="dr-lvl1"><a href="#Raphael.getTotalLength" class="dr-method"><span>Raphael.getTotalLength()</span></a></li><li class="dr-lvl1"><a href="#Raphael.hsb" class="dr-method"><span>Raphael.hsb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.hsb2rgb" class="dr-method"><span>Raphael.hsb2rgb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.hsl" class="dr-method"><span>Raphael.hsl()</span></a></li><li class="dr-lvl1"><a href="#Raphael.hsl2rgb" class="dr-method"><span>Raphael.hsl2rgb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.is" class="dr-method"><span>Raphael.is()</span></a></li><li class="dr-lvl1"><a href="#Raphael.parsePathString" class="dr-method"><span>Raphael.parsePathString()</span></a></li><li class="dr-lvl1"><a href="#Raphael.parseTransformString" class="dr-method"><span>Raphael.parseTransformString()</span></a></li><li class="dr-lvl1"><a href="#Raphael.path2curve" class="dr-method"><span>Raphael.path2curve()</span></a></li><li class="dr-lvl1"><a href="#Raphael.pathToRelative" class="dr-method"><span>Raphael.pathToRelative()</span></a></li><li class="dr-lvl1"><a href="#Raphael.rad" class="dr-method"><span>Raphael.rad()</span></a></li><li class="dr-lvl1"><a href="#Raphael.rgb" class="dr-method"><span>Raphael.rgb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.rgb2hsb" class="dr-method"><span>Raphael.rgb2hsb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.rgb2hsl" class="dr-method"><span>Raphael.rgb2hsl()</span></a></li><li class="dr-lvl1"><a href="#Raphael.setWindow" class="dr-method"><span>Raphael.setWindow()</span></a></li><li class="dr-lvl1"><a href="#Raphael.snapTo" class="dr-method"><span>Raphael.snapTo()</span></a></li><li class="dr-lvl1"><a href="#Raphael.svg" class="dr-property"><span>Raphael.svg</span></a></li><li class="dr-lvl1"><a href="#Raphael.type" class="dr-property"><span>Raphael.type</span></a></li><li class="dr-lvl1"><a href="#Raphael.vml" class="dr-property"><span>Raphael.vml</span></a></li><li class="dr-lvl0"><a href="#Set" class="undefined"><span>Set</span></a></li><li class="dr-lvl1"><a href="#Set.forEach" class="dr-method"><span>Set.forEach()</span></a></li><li class="dr-lvl1"><a href="#Set.pop" class="dr-method"><span>Set.pop()</span></a></li><li class="dr-lvl1"><a href="#Set.push" class="dr-method"><span>Set.push()</span></a></li></ol><div class="dr-doc"><h1>Raphaël Reference</h1><p class="dr-source">Check out the source: <a href="raphael-src.html">raphael.js</a></p><h2 id="Animation" class="undefined">Animation<a href="#Animation" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#Lundefined">&#x27ad;</a></h2>
-<h3 id="Animation.delay" class="dr-method">Animation.delay(delay)<a href="#Animation.delay" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5092">&#x27ad;</a></h3>
-<div class="dr-method"><p>Creates copy of existing animation object with given delay.
+<html lang="en"><head><meta charset="utf-8"><title>Raphaël Reference</title><link rel="stylesheet" href="dr.css"></head><body id="dr-js"><div id="dr"><ol class="dr-toc"><li class="dr-lvl0"><a href="#Animation" class="undefined"><span>Animation</span></a></li><li class="dr-lvl1"><a href="#Animation.delay" class="dr-method"><span>Animation.delay()</span></a></li><li class="dr-lvl1"><a href="#Animation.repeat" class="dr-method"><span>Animation.repeat()</span></a></li><li class="dr-lvl0"><a href="#Element" class="undefined"><span>Element</span></a></li><li class="dr-lvl1"><a href="#Element.animate" class="dr-method"><span>Element.animate()</span></a></li><li class="dr-lvl1"><a href="#Element.animateWith" class="dr-method"><span>Element.animateWith()</span></a></li><li class="dr-lvl1"><a href="#Element.attr" class="dr-method"><span>Element.attr()</span></a></li><li class="dr-lvl1"><a href="#Element.clone" class="dr-method"><span>Element.clone()</span></a></li><li class="dr-lvl1"><a href="#Element.drag" class="dr-method"><span>Element.drag()</span></a></li><li class="dr-lvl1"><a href="#Element.getBBox" class="dr-method"><span>Element.getBBox()</span></a></li><li class="dr-lvl1"><a href="#Element.getPointAtLength" class="dr-method"><span>Element.getPointAtLength()</span></a></li><li class="dr-lvl1"><a href="#Element.getSubpath" class="dr-method"><span>Element.getSubpath()</span></a></li><li class="dr-lvl1"><a href="#Element.getTotalLength" class="dr-method"><span>Element.getTotalLength()</span></a></li><li class="dr-lvl1"><a href="#Element.glow" class="dr-method"><span>Element.glow()</span></a></li><li class="dr-lvl1"><a href="#Element.hide" class="dr-method"><span>Element.hide()</span></a></li><li class="dr-lvl1"><a href="#Element.hover" class="dr-method"><span>Element.hover()</span></a></li><li class="dr-lvl1"><a href="#Element.id" class="dr-property"><span>Element.id</span></a></li><li class="dr-lvl1"><a href="#Element.insertAfter" class="dr-method"><span>Element.insertAfter()</span></a></li><li class="dr-lvl1"><a href="#Element.insertBefore" class="dr-method"><span>Element.insertBefore()</span></a></li><li class="dr-lvl1"><a href="#Element.next" class="dr-property"><span>Element.next</span></a></li><li class="dr-lvl1"><a href="#Element.node" class="dr-property"><span>Element.node</span></a></li><li class="dr-lvl1"><a href="#Element.onDragOver" class="dr-method"><span>Element.onDragOver()</span></a></li><li class="dr-lvl1"><a href="#Element.paper" class="dr-property"><span>Element.paper</span></a></li><li class="dr-lvl1"><a href="#Element.pause" class="dr-method"><span>Element.pause()</span></a></li><li class="dr-lvl1"><a href="#Element.prev" class="dr-property"><span>Element.prev</span></a></li><li class="dr-lvl1"><a href="#Element.raphael" class="dr-property"><span>Element.raphael</span></a></li><li class="dr-lvl1"><a href="#Element.remove" class="dr-method"><span>Element.remove()</span></a></li><li class="dr-lvl1"><a href="#Element.resume" class="dr-method"><span>Element.resume()</span></a></li><li class="dr-lvl1"><a href="#Element.rotate" class="dr-method"><span>Element.rotate()</span></a></li><li class="dr-lvl1"><a href="#Element.scale" class="dr-method"><span>Element.scale()</span></a></li><li class="dr-lvl1"><a href="#Element.setTime" class="dr-method"><span>Element.setTime()</span></a></li><li class="dr-lvl1"><a href="#Element.show" class="dr-method"><span>Element.show()</span></a></li><li class="dr-lvl1"><a href="#Element.status" class="dr-method"><span>Element.status()</span></a></li><li class="dr-lvl1"><a href="#Element.stop" class="dr-method"><span>Element.stop()</span></a></li><li class="dr-lvl1"><a href="#Element.toBack" class="dr-method"><span>Element.toBack()</span></a></li><li class="dr-lvl1"><a href="#Element.toFront" class="dr-method"><span>Element.toFront()</span></a></li><li class="dr-lvl1"><a href="#Element.transform" class="dr-method"><span>Element.transform()</span></a></li><li class="dr-lvl1"><a href="#Element.translate" class="dr-method"><span>Element.translate()</span></a></li><li class="dr-lvl1"><a href="#Element.undrag" class="dr-method"><span>Element.undrag()</span></a></li><li class="dr-lvl1"><a href="#Element.unhover" class="dr-method"><span>Element.unhover()</span></a></li><li class="dr-lvl0"><a href="#Paper" class="undefined"><span>Paper</span></a></li><li class="dr-lvl1"><a href="#Paper.bottom" class="dr-property"><span>Paper.bottom</span></a></li><li class="dr-lvl1"><a href="#Paper.circle" class="dr-method"><span>Paper.circle()</span></a></li><li class="dr-lvl1"><a href="#Paper.clear" class="dr-method"><span>Paper.clear()</span></a></li><li class="dr-lvl1"><a href="#Paper.customAttributes" class="dr-property"><span>Paper.customAttributes</span></a></li><li class="dr-lvl1"><a href="#Paper.ellipse" class="dr-method"><span>Paper.ellipse()</span></a></li><li class="dr-lvl1"><a href="#Paper.forEach" class="dr-method"><span>Paper.forEach()</span></a></li><li class="dr-lvl1"><a href="#Paper.getById" class="dr-method"><span>Paper.getById()</span></a></li><li class="dr-lvl1"><a href="#Paper.getElementByPoint" class="dr-method"><span>Paper.getElementByPoint()</span></a></li><li class="dr-lvl1"><a href="#Paper.image" class="dr-method"><span>Paper.image()</span></a></li><li class="dr-lvl1"><a href="#Paper.path" class="dr-method"><span>Paper.path()</span></a></li><li class="dr-lvl1"><a href="#Paper.raphael" class="dr-property"><span>Paper.raphael</span></a></li><li class="dr-lvl1"><a href="#Paper.rect" class="dr-method"><span>Paper.rect()</span></a></li><li class="dr-lvl1"><a href="#Paper.remove" class="dr-method"><span>Paper.remove()</span></a></li><li class="dr-lvl1"><a href="#Paper.safari" class="dr-method"><span>Paper.safari()</span></a></li><li class="dr-lvl1"><a href="#Paper.set" class="dr-method"><span>Paper.set()</span></a></li><li class="dr-lvl1"><a href="#Paper.setSize" class="dr-method"><span>Paper.setSize()</span></a></li><li class="dr-lvl1"><a href="#Paper.setViewBox" class="dr-method"><span>Paper.setViewBox()</span></a></li><li class="dr-lvl1"><a href="#Paper.text" class="dr-method"><span>Paper.text()</span></a></li><li class="dr-lvl1"><a href="#Paper.top" class="dr-property"><span>Paper.top</span></a></li><li class="dr-lvl0"><a href="#Raphael" class="dr-method"><span>Raphael()</span></a></li><li class="dr-lvl1"><a href="#Raphael.angle" class="dr-method"><span>Raphael.angle()</span></a></li><li class="dr-lvl1"><a href="#Raphael.animation" class="dr-method"><span>Raphael.animation()</span></a></li><li class="dr-lvl1"><a href="#Raphael.deg" class="dr-method"><span>Raphael.deg()</span></a></li><li class="dr-lvl1"><a href="#Raphael.easing_formulas" class="dr-property"><span>Raphael.easing_formulas</span></a></li><li class="dr-lvl1"><a href="#Raphael.el" class="dr-property"><span>Raphael.el</span></a></li><li class="dr-lvl1"><a href="#Raphael.findDotsAtSegment" class="dr-method"><span>Raphael.findDotsAtSegment()</span></a></li><li class="dr-lvl1"><a href="#Raphael.fn" class="dr-property"><span>Raphael.fn</span></a></li><li class="dr-lvl1"><a href="#Raphael.getColor" class="dr-method"><span>Raphael.getColor()</span></a></li><li class="dr-lvl2"><a href="#Raphael.getColor.reset" class="dr-method"><span>Raphael.getColor.reset()</span></a></li><li class="dr-lvl1"><a href="#Raphael.getPointAtLength" class="dr-method"><span>Raphael.getPointAtLength()</span></a></li><li class="dr-lvl1"><a href="#Raphael.getRGB" class="dr-method"><span>Raphael.getRGB()</span></a></li><li class="dr-lvl1"><a href="#Raphael.getSubpath" class="dr-method"><span>Raphael.getSubpath()</span></a></li><li class="dr-lvl1"><a href="#Raphael.getTotalLength" class="dr-method"><span>Raphael.getTotalLength()</span></a></li><li class="dr-lvl1"><a href="#Raphael.hsb" class="dr-method"><span>Raphael.hsb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.hsb2rgb" class="dr-method"><span>Raphael.hsb2rgb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.hsl" class="dr-method"><span>Raphael.hsl()</span></a></li><li class="dr-lvl1"><a href="#Raphael.hsl2rgb" class="dr-method"><span>Raphael.hsl2rgb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.is" class="dr-method"><span>Raphael.is()</span></a></li><li class="dr-lvl1"><a href="#Raphael.parsePathString" class="dr-method"><span>Raphael.parsePathString()</span></a></li><li class="dr-lvl1"><a href="#Raphael.parseTransformString" class="dr-method"><span>Raphael.parseTransformString()</span></a></li><li class="dr-lvl1"><a href="#Raphael.path2curve" class="dr-method"><span>Raphael.path2curve()</span></a></li><li class="dr-lvl1"><a href="#Raphael.pathToRelative" class="dr-method"><span>Raphael.pathToRelative()</span></a></li><li class="dr-lvl1"><a href="#Raphael.rad" class="dr-method"><span>Raphael.rad()</span></a></li><li class="dr-lvl1"><a href="#Raphael.rgb" class="dr-method"><span>Raphael.rgb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.rgb2hsb" class="dr-method"><span>Raphael.rgb2hsb()</span></a></li><li class="dr-lvl1"><a href="#Raphael.rgb2hsl" class="dr-method"><span>Raphael.rgb2hsl()</span></a></li><li class="dr-lvl1"><a href="#Raphael.setWindow" class="dr-method"><span>Raphael.setWindow()</span></a></li><li class="dr-lvl1"><a href="#Raphael.snapTo" class="dr-method"><span>Raphael.snapTo()</span></a></li><li class="dr-lvl1"><a href="#Raphael.svg" class="dr-property"><span>Raphael.svg</span></a></li><li class="dr-lvl1"><a href="#Raphael.type" class="dr-property"><span>Raphael.type</span></a></li><li class="dr-lvl1"><a href="#Raphael.vml" class="dr-property"><span>Raphael.vml</span></a></li><li class="dr-lvl0"><a href="#Set" class="undefined"><span>Set</span></a></li><li class="dr-lvl1"><a href="#Set.forEach" class="dr-method"><span>Set.forEach()</span></a></li><li class="dr-lvl1"><a href="#Set.pop" class="dr-method"><span>Set.pop()</span></a></li><li class="dr-lvl1"><a href="#Set.push" class="dr-method"><span>Set.push()</span></a></li></ol><div class="dr-doc"><h1>Raphaël Reference</h1><p class="dr-source">Check out the source: <a href="raphael-src.html">raphael.js</a></p><h2 id="Animation" class="undefined"><i class="dr-trixie">&#160;</i>Animation<a href="#Animation" title="Link to this section" class="dr-hash">&#x2693;</a></h2>
+<h3 id="Animation.delay" class="dr-method"><i class="dr-trixie">&#160;</i>Animation.delay(delay)<a href="#Animation.delay" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5090">&#x27ad;</a></h3>
+<div class="dr-method"><p>Creates copy of existing animation object with given delay.
 </p>
 <p class="header">Parameters
 </p>
@@ -11,8 +11,8 @@
 <dd class="dr-description">number of ms to pass between animation start and actual animation</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">new altered Animation object</span></p>
-</div><h3 id="Animation.repeat" class="dr-method">Animation.repeat(repeat)<a href="#Animation.repeat" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5110">&#x27ad;</a></h3>
-<div class="dr-method"><p>Creates copy of existing animation object with given repetition.
+</div><h3 id="Animation.repeat" class="dr-method"><i class="dr-trixie">&#160;</i>Animation.repeat(repeat)<a href="#Animation.repeat" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5108">&#x27ad;</a></h3>
+<div class="dr-method"><p>Creates copy of existing animation object with given repetition.
 </p>
 <p class="header">Parameters
 </p>
@@ -21,8 +21,8 @@
 <dd class="dr-description">number iterations of animation. For infinite animation pass <code>Infinity</code></dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">new altered Animation object</span></p>
-</div><h2 id="Element" class="undefined">Element<a href="#Element" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#Lundefined">&#x27ad;</a></h2>
-<h3 id="Element.animate" class="dr-method">Element.animate(…)<a href="#Element.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5369">&#x27ad;</a></h3>
+</div><h2 id="Element" class="undefined"><i class="dr-trixie">&#160;</i>Element<a href="#Element" title="Link to this section" class="dr-hash">&#x2693;</a></h2>
+<h3 id="Element.animate" class="dr-method"><i class="dr-trixie">&#160;</i>Element.animate(…)<a href="#Element.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5367">&#x27ad;</a></h3>
 <div class="dr-method"><p>Creates and starts animation for given element.
 </p>
 <p class="header">Parameters
@@ -36,7 +36,7 @@
 <dt class="dr-param optional">easing</dt>
 <dd class="dr-optional">optional</dd>
 <dd class="dr-type"><em class="dr-type-string">string</em></dd>
-<dd class="dr-description">easing type. Accept on of <a href="#Raphael.easing_formulas" class="dr-link">Raphael.easing_formulas</a> or CSS format: <code>cubic&#x2010;bezier(XX,&#160;XX,&#160;XX,&#160;XX)</code></dd>
+<dd class="dr-description">easing type. Accept one of <a href="#Raphael.easing_formulas" class="dr-link">Raphael.easing_formulas</a> or CSS format: <code>cubic&#x2010;bezier(XX,&#160;XX,&#160;XX,&#160;XX)</code></dd>
 <dt class="dr-param optional">callback</dt>
 <dd class="dr-optional">optional</dd>
 <dd class="dr-type"><em class="dr-type-function">function</em></dd>
@@ -49,7 +49,7 @@
 <dd class="dr-description">animation object, see <a href="#Raphael.animation" class="dr-link">Raphael.animation</a></dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">original element</span></p>
-</div><h3 id="Element.animateWith" class="dr-method">Element.animateWith(…)<a href="#Element.animateWith" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5001">&#x27ad;</a></h3>
+</div><h3 id="Element.animateWith" class="dr-method"><i class="dr-trixie">&#160;</i>Element.animateWith(…)<a href="#Element.animateWith" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4999">&#x27ad;</a></h3>
 <div class="dr-method"><p>Acts similar to <a href="#Element.animate" class="dr-link">Element.animate</a>, but ensure that given animation runs in sync with another given element.
 </p>
 <p class="header">Parameters
@@ -76,7 +76,7 @@
 <dd class="dr-description">animation object, see <a href="#Raphael.animation" class="dr-link">Raphael.animation</a></dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">original element</span></p>
-</div><h3 id="Element.attr" class="dr-method">Element.attr(…)<a href="#Element.attr" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2713">&#x27ad;</a></h3>
+</div><h3 id="Element.attr" class="dr-method"><i class="dr-trixie">&#160;</i>Element.attr(…)<a href="#Element.attr" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2714">&#x27ad;</a></h3>
 <div class="dr-method"><p>Sets the attributes of the element.
 </p>
 <p class="header">Parameters
@@ -177,9 +177,9 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o
     <li>hsla(•••, •••, •••) — same as above, but with opacity</li>
     <li>Optionally for hsb and hsl you could specify hue as a degree: “<code>hsl(240deg,&nbsp;1,&nbsp;.5)</code>” or, if you want to go fancy, “<code>hsl(240°,&nbsp;1,&nbsp;.5)</code>”</li>
 </ul>
-</div><h3 id="Element.clone" class="dr-method">Element.clone()<a href="#Element.clone" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4548">&#x27ad;</a></h3>
+</div><h3 id="Element.clone" class="dr-method"><i class="dr-trixie">&#160;</i>Element.clone()<a href="#Element.clone" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4546">&#x27ad;</a></h3>
 <div class="dr-method"><p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">clone of a given element</span></p>
-</div><h3 id="Element.drag" class="dr-method">Element.drag(onmove, onstart, onend, [mcontext], [scontext], [econtext])<a href="#Element.drag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4151">&#x27ad;</a></h3>
+</div><h3 id="Element.drag" class="dr-method"><i class="dr-trixie">&#160;</i>Element.drag(onmove, onstart, onend, [mcontext], [scontext], [econtext])<a href="#Element.drag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4148">&#x27ad;</a></h3>
 <div class="dr-method"><p>Adds event handlers for drag of the element.
 </p>
 <p class="header">Parameters
@@ -229,7 +229,7 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o
 <ol class="dr-json"><li><span class="dr-json-key">event</span><span class="dr-type"><em class="dr-type-object">object</em></span><span class="dr-json-description">DOM event object</span>
 </ol>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.getBBox" class="dr-method">Element.getBBox(isWithoutTransform)<a href="#Element.getBBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4516">&#x27ad;</a></h3>
+</div><h3 id="Element.getBBox" class="dr-method"><i class="dr-trixie">&#160;</i>Element.getBBox(isWithoutTransform)<a href="#Element.getBBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4514">&#x27ad;</a></h3>
 <div class="dr-method"><p>Return bounding box for a given element
 </p>
 <p class="header">Parameters
@@ -244,7 +244,7 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o
 <li><span class="dr-json-key">width:</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">width</span>
 <li><span class="dr-json-key">height:</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">height</span>
 </ol></li><li>}</li></ol>
-</div><h3 id="Element.getPointAtLength" class="dr-method">Element.getPointAtLength(length)<a href="#Element.getPointAtLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4751">&#x27ad;</a></h3>
+</div><h3 id="Element.getPointAtLength" class="dr-method"><i class="dr-trixie">&#160;</i>Element.getPointAtLength(length)<a href="#Element.getPointAtLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4749">&#x27ad;</a></h3>
 <div class="dr-method"><p>Return coordinates of the point located at the given length on the given path. Only works for element of “path” type.
 </p>
 <p class="header">Parameters
@@ -258,7 +258,7 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o
 <li><span class="dr-json-key">y:</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">y coordinate</span>
 <li><span class="dr-json-key">alpha:</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">angle of derivative</span>
 </ol></li><li>}</li></ol>
-</div><h3 id="Element.getSubpath" class="dr-method">Element.getSubpath(from, to)<a href="#Element.getSubpath" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4768">&#x27ad;</a></h3>
+</div><h3 id="Element.getSubpath" class="dr-method"><i class="dr-trixie">&#160;</i>Element.getSubpath(from, to)<a href="#Element.getSubpath" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4766">&#x27ad;</a></h3>
 <div class="dr-method"><p>Return subpath of a given element from given length to given length. Only works for element of “path” type.
 </p>
 <p class="header">Parameters
@@ -271,21 +271,21 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o
 <dd class="dr-description">position of the end of the segment</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">pathstring for the segment</span></p>
-</div><h3 id="Element.getTotalLength" class="dr-method">Element.getTotalLength()<a href="#Element.getTotalLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4727">&#x27ad;</a></h3>
+</div><h3 id="Element.getTotalLength" class="dr-method"><i class="dr-trixie">&#160;</i>Element.getTotalLength()<a href="#Element.getTotalLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4725">&#x27ad;</a></h3>
 <div class="dr-method"><p>Returns length of the path in pixels. Only works for element of “path” type.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">length.</span></p>
-</div><h3 id="Element.glow" class="dr-method">Element.glow()<a href="#Element.glow" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4567">&#x27ad;</a></h3>
+</div><h3 id="Element.glow" class="dr-method"><i class="dr-trixie">&#160;</i>Element.glow()<a href="#Element.glow" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4565">&#x27ad;</a></h3>
 <div class="dr-method"><p>Return set of elements that create glow-like effect around given element. See <a href="#Paper.set" class="dr-link">Paper.set</a>.
 </p>
-<p>Note: Glow is not connected to the elment. If you change element attributes it won’t adjust itself.
+<p>Note: Glow is not connected to the element. If you change element attributes it won’t adjust itself.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Paper.set" class="dr-link">Paper.set</a> of elements that represents glow</span></p>
-</div><h3 id="Element.hide" class="dr-method">Element.hide()<a href="#Element.hide" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2583">&#x27ad;</a></h3>
+</div><h3 id="Element.hide" class="dr-method"><i class="dr-trixie">&#160;</i>Element.hide()<a href="#Element.hide" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2584">&#x27ad;</a></h3>
 <div class="dr-method"><p>Makes element invisible. See <a href="#Element.show" class="dr-link">Element.show</a>.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.hover" class="dr-method">Element.hover(f_in, f_out, [icontext], [ocontext])<a href="#Element.hover" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4105">&#x27ad;</a></h3>
+</div><h3 id="Element.hover" class="dr-method"><i class="dr-trixie">&#160;</i>Element.hover(f_in, f_out, [icontext], [ocontext])<a href="#Element.hover" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4102">&#x27ad;</a></h3>
 <div class="dr-method"><p>Adds event handlers for hover for the element.
 </p>
 <p class="header">Parameters
@@ -306,22 +306,22 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o
 <dd class="dr-description">context for hover out handler</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.id" class="dr-property">Element.id<a href="#Element.id" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2386">&#x27ad;</a></h3>
+</div><h3 id="Element.id" class="dr-property"><i class="dr-trixie">&#160;</i>Element.id<a href="#Element.id" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2387">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-number">number</em><p>Unique id of the element. Especially usesful when you want to listen to events of the element, 
 because all events are fired in format <code>&lt;module>.&lt;action>.&lt;id></code>. Also useful for <a href="#Paper.getById" class="dr-link">Paper.getById</a> method.
 </p>
-</div><h3 id="Element.insertAfter" class="dr-method">Element.insertAfter()<a href="#Element.insertAfter" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2805">&#x27ad;</a></h3>
+</div><h3 id="Element.insertAfter" class="dr-method"><i class="dr-trixie">&#160;</i>Element.insertAfter()<a href="#Element.insertAfter" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2806">&#x27ad;</a></h3>
 <div class="dr-method"><p>Inserts current object after the given one.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.insertBefore" class="dr-method">Element.insertBefore()<a href="#Element.insertBefore" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2825">&#x27ad;</a></h3>
+</div><h3 id="Element.insertBefore" class="dr-method"><i class="dr-trixie">&#160;</i>Element.insertBefore()<a href="#Element.insertBefore" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2826">&#x27ad;</a></h3>
 <div class="dr-method"><p>Inserts current object before the given one.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.next" class="dr-property">Element.next<a href="#Element.next" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2429">&#x27ad;</a></h3>
+</div><h3 id="Element.next" class="dr-property"><i class="dr-trixie">&#160;</i>Element.next<a href="#Element.next" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2430">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-object">object</em><p>Reference to the next element in the hierarchy.
 </p>
-</div><h3 id="Element.node" class="dr-property">Element.node<a href="#Element.node" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2365">&#x27ad;</a></h3>
+</div><h3 id="Element.node" class="dr-property"><i class="dr-trixie">&#160;</i>Element.node<a href="#Element.node" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2366">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-object">object</em><p>Gives you a reference to the DOM object, so you can assign event handlers or just mess around.
 </p>
 <p class="header">Usage
@@ -332,7 +332,7 @@ c.node.onclick<span class="s"> = </span><b>function</b> () {
     c.attr(<i>"fill"</i>, <i>"red"</i>);
 };
 </code></pre>
-</div><h3 id="Element.onDragOver" class="dr-method">Element.onDragOver(f)<a href="#Element.onDragOver" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4178">&#x27ad;</a></h3>
+</div><h3 id="Element.onDragOver" class="dr-method"><i class="dr-trixie">&#160;</i>Element.onDragOver(f)<a href="#Element.onDragOver" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4175">&#x27ad;</a></h3>
 <div class="dr-method"><p>Shortcut for assigning event handler for <code>drag.over.&lt;id></code> event, where id is id of the element (see <a href="#Element.id" class="dr-link">Element.id</a>).
 </p>
 <p class="header">Parameters
@@ -341,7 +341,7 @@ c.node.onclick<span class="s"> = </span><b>function</b> () {
 <dd class="dr-type"><em class="dr-type-function">function</em></dd>
 <dd class="dr-description">handler for event</dd>
 </dl>
-</div><h3 id="Element.paper" class="dr-property">Element.paper<a href="#Element.paper" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2402">&#x27ad;</a></h3>
+</div><h3 id="Element.paper" class="dr-property"><i class="dr-trixie">&#160;</i>Element.paper<a href="#Element.paper" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2403">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-object">object</em><p>Internal reference to “paper” where object drawn. Mainly for use in plugins and element extensions.
 </p>
 <p class="header">Usage
@@ -352,7 +352,7 @@ c.node.onclick<span class="s"> = </span><b>function</b> () {
         .attr({stroke: <i>"red"</i>});
 }
 </code></pre>
-</div><h3 id="Element.pause" class="dr-method">Element.pause([anim])<a href="#Element.pause" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5459">&#x27ad;</a></h3>
+</div><h3 id="Element.pause" class="dr-method"><i class="dr-trixie">&#160;</i>Element.pause([anim])<a href="#Element.pause" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5457">&#x27ad;</a></h3>
 <div class="dr-method"><p>Stops animation of the element with ability to resume it later on.
 </p>
 <p class="header">Parameters
@@ -363,10 +363,10 @@ c.node.onclick<span class="s"> = </span><b>function</b> () {
 <dd class="dr-description">animation object</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">original element</span></p>
-</div><h3 id="Element.prev" class="dr-property">Element.prev<a href="#Element.prev" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2420">&#x27ad;</a></h3>
+</div><h3 id="Element.prev" class="dr-property"><i class="dr-trixie">&#160;</i>Element.prev<a href="#Element.prev" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2421">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-object">object</em><p>Reference to the previous element in the hierarchy.
 </p>
-</div><h3 id="Element.raphael" class="dr-property">Element.raphael<a href="#Element.raphael" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2378">&#x27ad;</a></h3>
+</div><h3 id="Element.raphael" class="dr-property"><i class="dr-trixie">&#160;</i>Element.raphael<a href="#Element.raphael" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2379">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-object">object</em><p>Internal reference to <a href="#Raphael" class="dr-link">Raphael</a> object. In case it is not available.
 </p>
 <p class="header">Usage
@@ -377,10 +377,10 @@ c.node.onclick<span class="s"> = </span><b>function</b> () {
     <b>this</b>.attr({fill: <b>this</b>.paper.raphael.hsb2rgb(hsb).hex});
 }
 </code></pre>
-</div><h3 id="Element.remove" class="dr-method">Element.remove()<a href="#Element.remove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2604">&#x27ad;</a></h3>
+</div><h3 id="Element.remove" class="dr-method"><i class="dr-trixie">&#160;</i>Element.remove()<a href="#Element.remove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2605">&#x27ad;</a></h3>
 <div class="dr-method"><p>Removes element form the paper.
 </p>
-</div><h3 id="Element.resume" class="dr-method">Element.resume([anim])<a href="#Element.resume" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5479">&#x27ad;</a></h3>
+</div><h3 id="Element.resume" class="dr-method"><i class="dr-trixie">&#160;</i>Element.resume([anim])<a href="#Element.resume" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5477">&#x27ad;</a></h3>
 <div class="dr-method"><p>Resumes animation if it was paused with <a href="#Element.pause" class="dr-link">Element.pause</a> method.
 </p>
 <p class="header">Parameters
@@ -391,7 +391,7 @@ c.node.onclick<span class="s"> = </span><b>function</b> () {
 <dd class="dr-description">animation object</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">original element</span></p>
-</div><h3 id="Element.rotate" class="dr-method">Element.rotate(deg, [cx], [cy])<a href="#Element.rotate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2445">&#x27ad;</a></h3>
+</div><h3 id="Element.rotate" class="dr-method"><i class="dr-trixie">&#160;</i>Element.rotate(deg, [cx], [cy])<a href="#Element.rotate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2446">&#x27ad;</a></h3>
 <div class="dr-method"><p>Adds rotation by given angle around given point to the list of
 transformations of the element.
 </p>
@@ -412,7 +412,7 @@ transformations of the element.
 <p>If cx <em class="amp">&amp;</em> cy aren’t specified centre of the shape is used as a point of rotation.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.scale" class="dr-method">Element.scale(sx, sy, [cx], [cy])<a href="#Element.scale" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2478">&#x27ad;</a></h3>
+</div><h3 id="Element.scale" class="dr-method"><i class="dr-trixie">&#160;</i>Element.scale(sx, sy, [cx], [cy])<a href="#Element.scale" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2479">&#x27ad;</a></h3>
 <div class="dr-method"><p>Adds scale by given amount relative to given point to the list of
 transformations of the element.
 </p>
@@ -436,7 +436,7 @@ transformations of the element.
 <p>If cx <em class="amp">&amp;</em> cy aren’t specified centre of the shape is used instead.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.setTime" class="dr-method">Element.setTime(anim, value)<a href="#Element.setTime" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5395">&#x27ad;</a></h3>
+</div><h3 id="Element.setTime" class="dr-method"><i class="dr-trixie">&#160;</i>Element.setTime(anim, value)<a href="#Element.setTime" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5393">&#x27ad;</a></h3>
 <div class="dr-method"><p>Sets the status of animation of the element in milliseconds. Similar to <a href="#Element.status" class="dr-link">Element.status</a> method.
 </p>
 <p class="header">Parameters
@@ -453,11 +453,11 @@ transformations of the element.
 </p>
 <p>On each animation frame event <code>anim.frame.&lt;id></code>, on start <code>anim.start.&lt;id></code> and on end <code>anim.finish.&lt;id></code>.
 </p>
-</div><h3 id="Element.show" class="dr-method">Element.show()<a href="#Element.show" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2594">&#x27ad;</a></h3>
+</div><h3 id="Element.show" class="dr-method"><i class="dr-trixie">&#160;</i>Element.show()<a href="#Element.show" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2595">&#x27ad;</a></h3>
 <div class="dr-method"><p>Makes element visible. See <a href="#Element.hide" class="dr-link">Element.hide</a>.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.status" class="dr-method">Element.status([anim], [value])<a href="#Element.status" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5422">&#x27ad;</a></h3>
+</div><h3 id="Element.status" class="dr-method"><i class="dr-trixie">&#160;</i>Element.status([anim], [value])<a href="#Element.status" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5420">&#x27ad;</a></h3>
 <div class="dr-method"><p>Gets or sets the status of animation of the element.
 </p>
 <p class="header">Parameters
@@ -481,7 +481,7 @@ transformations of the element.
 <p>or
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">original element if <code>value</code> is specified</span></p>
-</div><h3 id="Element.stop" class="dr-method">Element.stop([anim])<a href="#Element.stop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5501">&#x27ad;</a></h3>
+</div><h3 id="Element.stop" class="dr-method"><i class="dr-trixie">&#160;</i>Element.stop([anim])<a href="#Element.stop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5499">&#x27ad;</a></h3>
 <div class="dr-method"><p>Stops animation of the element.
 </p>
 <p class="header">Parameters
@@ -492,15 +492,15 @@ transformations of the element.
 <dd class="dr-description">animation object</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">original element</span></p>
-</div><h3 id="Element.toBack" class="dr-method">Element.toBack()<a href="#Element.toBack" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2787">&#x27ad;</a></h3>
+</div><h3 id="Element.toBack" class="dr-method"><i class="dr-trixie">&#160;</i>Element.toBack()<a href="#Element.toBack" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2788">&#x27ad;</a></h3>
 <div class="dr-method"><p>Moves the element so it is the furthest from the viewer’s eyes, behind other elements.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.toFront" class="dr-method">Element.toFront()<a href="#Element.toFront" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2771">&#x27ad;</a></h3>
+</div><h3 id="Element.toFront" class="dr-method"><i class="dr-trixie">&#160;</i>Element.toFront()<a href="#Element.toFront" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2772">&#x27ad;</a></h3>
 <div class="dr-method"><p>Moves the element so it is the closest to the viewer’s eyes, on top of other elements.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.transform" class="dr-method">Element.transform([tstr])<a href="#Element.transform" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2557">&#x27ad;</a></h3>
+</div><h3 id="Element.transform" class="dr-method"><i class="dr-trixie">&#160;</i>Element.transform([tstr])<a href="#Element.transform" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2558">&#x27ad;</a></h3>
 <div class="dr-method"><p>Adds transformation to the element which is separate to other attributes,
 i.e. translation doesn’t change <code>x</code> or <code>y</code> of the rectange. The format
 of transformation string is similar to the path string syntax:
@@ -510,9 +510,9 @@ of transformation string is similar to the path string syntax:
 <p>Each letter is a command. There are four commands: <code>t</code> is for translate, <code>r</code> is for rotate, <code>s</code> is for
 scale and <code>m</code> is for matrix.
 </p>
-<p>So, example line could be read like “translate by 100, 100, rotate 30° around 100, 100, scale twice around 100, 100
-rotate 45° around centre and scale 1.5 times relative to centre”. As you see rotate and scale commands has origin
-coordinates as a optional parameters.
+<p>So, the example line above could be read like “translate by 100, 100; rotate 30° around 100, 100; scale twice around 100, 100;
+rotate 45° around centre; scale 1.5 times relative to centre”. As you can see rotate and scale commands have origin
+coordinates as optional parameters, the default is the centre point of the element.
 Matrix accepts six parameters.
 </p>
 <p class="header">Usage
@@ -543,7 +543,7 @@ console.log(el.transform());
 <p>else
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.translate" class="dr-method">Element.translate(dx, dy)<a href="#Element.translate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2509">&#x27ad;</a></h3>
+</div><h3 id="Element.translate" class="dr-method"><i class="dr-trixie">&#160;</i>Element.translate(dx, dy)<a href="#Element.translate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2510">&#x27ad;</a></h3>
 <div class="dr-method"><p>Adds translation by given amount to the list of transformations of the element.
 </p>
 <p class="header">Parameters
@@ -556,10 +556,10 @@ console.log(el.transform());
 <dd class="dr-description">vertical shift</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Element.undrag" class="dr-method">Element.undrag()<a href="#Element.undrag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4187">&#x27ad;</a></h3>
+</div><h3 id="Element.undrag" class="dr-method"><i class="dr-trixie">&#160;</i>Element.undrag()<a href="#Element.undrag" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4184">&#x27ad;</a></h3>
 <div class="dr-method"><p>Removes all drag event handlers from given element.
 </p>
-</div><h3 id="Element.unhover" class="dr-method">Element.unhover(f_in, f_out)<a href="#Element.unhover" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4118">&#x27ad;</a></h3>
+</div><h3 id="Element.unhover" class="dr-method"><i class="dr-trixie">&#160;</i>Element.unhover(f_in, f_out)<a href="#Element.unhover" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4115">&#x27ad;</a></h3>
 <div class="dr-method"><p>Removes event handlers for hover for the element.
 </p>
 <p class="header">Parameters
@@ -572,11 +572,11 @@ console.log(el.transform());
 <dd class="dr-description">handler for hover out</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h2 id="Paper" class="undefined">Paper<a href="#Paper" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#Lundefined">&#x27ad;</a></h2>
-<h3 id="Paper.bottom" class="dr-property">Paper.bottom<a href="#Paper.bottom" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4388">&#x27ad;</a></h3>
+</div><h2 id="Paper" class="undefined"><i class="dr-trixie">&#160;</i>Paper<a href="#Paper" title="Link to this section" class="dr-hash">&#x2693;</a></h2>
+<h3 id="Paper.bottom" class="dr-property"><i class="dr-trixie">&#160;</i>Paper.bottom<a href="#Paper.bottom" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4386">&#x27ad;</a></h3>
 <div class="dr-property"><p>Points to the bottom element on the paper
 </p>
-</div><h3 id="Paper.circle" class="dr-method">Paper.circle(x, y, r)<a href="#Paper.circle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4212">&#x27ad;</a></h3>
+</div><h3 id="Paper.circle" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.circle(x, y, r)<a href="#Paper.circle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4209">&#x27ad;</a></h3>
 <div class="dr-method"><p>Draws a circle.
 </p>
 <p class="header">Parameters
@@ -596,10 +596,10 @@ console.log(el.transform());
 </p>
 <pre class="javascript code"><code><b>var</b> c<span class="s"> = </span>paper.circle(<span class="d">50</span>, <span class="d">50</span>, <span class="d">40</span>);
 </code></pre>
-</div><h3 id="Paper.clear" class="dr-method">Paper.clear()<a href="#Paper.clear" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2991">&#x27ad;</a></h3>
+</div><h3 id="Paper.clear" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.clear()<a href="#Paper.clear" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L2992">&#x27ad;</a></h3>
 <div class="dr-method"><p>Clears the paper, i.e. removes all the elements.
 </p>
-</div><h3 id="Paper.customAttributes" class="dr-property">Paper.customAttributes<a href="#Paper.customAttributes" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L260">&#x27ad;</a></h3>
+</div><h3 id="Paper.customAttributes" class="dr-property"><i class="dr-trixie">&#160;</i>Paper.customAttributes<a href="#Paper.customAttributes" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L261">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-object">object</em><p>If you have a set of attributes that you would like to represent
 as a function of some number you can do it easily with custom attributes:
 </p>
@@ -624,7 +624,7 @@ paper.customAttributes.hsb<span class="s"> = </span><b>function</b> (h, s, b) {
 c.attr({hsb: <i>"<span class="d">.5</span> <span class="d">.8</span> <span class="d">1</span>"</i>});
 c.animate({hsb: <i>"<span class="d">1</span> <span class="d">0</span> <span class="d">.5</span>"</i>}, <span class="d">1e3</span>);
 </code></pre>
-</div><h3 id="Paper.ellipse" class="dr-method">Paper.ellipse(x, y, rx, ry)<a href="#Paper.ellipse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4256">&#x27ad;</a></h3>
+</div><h3 id="Paper.ellipse" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.ellipse(x, y, rx, ry)<a href="#Paper.ellipse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4253">&#x27ad;</a></h3>
 <div class="dr-method"><p>Draws an ellipse.
 </p>
 <p class="header">Parameters
@@ -637,7 +637,7 @@ c.animate({hsb: <i>"<span class="d">1</span> <span class="d">0</span> <span clas
 <dd class="dr-description">y coordinate of the centre</dd>
 <dt class="dr-param">rx</dt>
 <dd class="dr-type"><em class="dr-type-number">number</em></dd>
-<dd class="dr-description">horisontal radius</dd>
+<dd class="dr-description">horizontal radius</dd>
 <dt class="dr-param">ry</dt>
 <dd class="dr-type"><em class="dr-type-number">number</em></dd>
 <dd class="dr-description">vertical radius</dd>
@@ -647,10 +647,10 @@ c.animate({hsb: <i>"<span class="d">1</span> <span class="d">0</span> <span clas
 </p>
 <pre class="javascript code"><code><b>var</b> c<span class="s"> = </span>paper.ellipse(<span class="d">50</span>, <span class="d">50</span>, <span class="d">40</span>, <span class="d">20</span>);
 </code></pre>
-</div><h3 id="Paper.forEach" class="dr-method">Paper.forEach(callback, thisArg)<a href="#Paper.forEach" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4483">&#x27ad;</a></h3>
+</div><h3 id="Paper.forEach" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.forEach(callback, thisArg)<a href="#Paper.forEach" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4481">&#x27ad;</a></h3>
 <div class="dr-method"><p>Executes given function for each element on the paper
 </p>
-<p>If function returns <code>false</code> it will stop loop running.
+<p>If callback function returns <code>false</code> it will stop loop running.
 </p>
 <p class="header">Parameters
 </p>
@@ -662,8 +662,8 @@ c.animate({hsb: <i>"<span class="d">1</span> <span class="d">0</span> <span clas
 <dd class="dr-description">context object for the callback</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Paper object</span></p>
-</div><h3 id="Paper.getById" class="dr-method">Paper.getById(id)<a href="#Paper.getById" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4459">&#x27ad;</a></h3>
-<div class="dr-method"><p>Returns you element by its internal ID.
+</div><h3 id="Paper.getById" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.getById(id)<a href="#Paper.getById" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4457">&#x27ad;</a></h3>
+<div class="dr-method"><p>Returns you element by its internal ID.
 </p>
 <p class="header">Parameters
 </p>
@@ -672,7 +672,7 @@ c.animate({hsb: <i>"<span class="d">1</span> <span class="d">0</span> <span clas
 <dd class="dr-description">id</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Raphaël element object</span></p>
-</div><h3 id="Paper.getElementByPoint" class="dr-method">Paper.getElementByPoint(x, y)<a href="#Paper.getElementByPoint" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4423">&#x27ad;</a></h3>
+</div><h3 id="Paper.getElementByPoint" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.getElementByPoint(x, y)<a href="#Paper.getElementByPoint" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4421">&#x27ad;</a></h3>
 <div class="dr-method"><p>Returns you topmost element under given point.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Raphaël element object</span></p>
@@ -689,7 +689,7 @@ c.animate({hsb: <i>"<span class="d">1</span> <span class="d">0</span> <span clas
 </p>
 <pre class="javascript code"><code>paper.getElementByPoint(mouseX, mouseY).attr({stroke: <i>"#f00"</i>});
 </code></pre>
-</div><h3 id="Paper.image" class="dr-method">Paper.image(src, x, y, width, height)<a href="#Paper.image" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4298">&#x27ad;</a></h3>
+</div><h3 id="Paper.image" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.image(src, x, y, width, height)<a href="#Paper.image" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4295">&#x27ad;</a></h3>
 <div class="dr-method"><p>Embeds an image into the surface.
 </p>
 <p class="header">Parameters
@@ -715,7 +715,7 @@ c.animate({hsb: <i>"<span class="d">1</span> <span class="d">0</span> <span clas
 </p>
 <pre class="javascript code"><code><b>var</b> c<span class="s"> = </span>paper.image(<i>"apple.png"</i>, <span class="d">10</span>, <span class="d">10</span>, <span class="d">80</span>, <span class="d">80</span>);
 </code></pre>
-</div><h3 id="Paper.path" class="dr-method">Paper.path(pathString)<a href="#Paper.path" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4276">&#x27ad;</a></h3>
+</div><h3 id="Paper.path" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.path(pathString)<a href="#Paper.path" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4273">&#x27ad;</a></h3>
 <div class="dr-method"><p>Creates a path element by given path data string.
 </p>
 <p class="header">Parameters
@@ -732,10 +732,10 @@ Details of a path's data attribute's format are described in the <a href="http:/
 <span class="c">// draw a diagonal line:</span>
 <span class="c">// move to <span class="d">10</span>,<span class="d">10</span>, line to <span class="d">90</span>,<span class="d">90</span></span>
 </code></pre>
-</div><h3 id="Paper.raphael" class="dr-property">Paper.raphael<a href="#Paper.raphael" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4395">&#x27ad;</a></h3>
+</div><h3 id="Paper.raphael" class="dr-property"><i class="dr-trixie">&#160;</i>Paper.raphael<a href="#Paper.raphael" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4393">&#x27ad;</a></h3>
 <div class="dr-property"><p>Points to the <a href="#Raphael" class="dr-link">Raphael</a> object/function
 </p>
-</div><h3 id="Paper.rect" class="dr-method">Paper.rect(x, y, width, height, r)<a href="#Paper.rect" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4236">&#x27ad;</a></h3>
+</div><h3 id="Paper.rect" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.rect(x, y, width, height, [r])<a href="#Paper.rect" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4233">&#x27ad;</a></h3>
 <div class="dr-method"><p></p>
 <p>Draws a rectangle.
 </p>
@@ -753,9 +753,10 @@ Details of a path's data attribute's format are described in the <a href="http:/
 <dt class="dr-param">height</dt>
 <dd class="dr-type"><em class="dr-type-number">number</em></dd>
 <dd class="dr-description">height</dd>
-<dt class="dr-param">r</dt>
+<dt class="dr-param optional">r</dt>
+<dd class="dr-optional">optional</dd>
 <dd class="dr-type"><em class="dr-type-number">number</em></dd>
-<dd class="dr-description"><a href="#optional" class="dr-link">optional</a> radius for rounded corners, default is 0</dd>
+<dd class="dr-description">radius for rounded corners, default is 0</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Raphaël element object with type “rect”</span></p>
 <p class="header">Usage
@@ -765,33 +766,18 @@ Details of a path's data attribute's format are described in the <a href="http:/
 <span class="c">// rectangle <b>with</b> rounded corners</span>
 <b>var</b> c<span class="s"> = </span>paper.rect(<span class="d">40</span>, <span class="d">40</span>, <span class="d">50</span>, <span class="d">50</span>, <span class="d">10</span>);
 </code></pre>
-</div><h3 id="Paper.remove" class="dr-method">Paper.remove()<a href="#Paper.remove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L3008">&#x27ad;</a></h3>
+</div><h3 id="Paper.remove" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.remove()<a href="#Paper.remove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L3009">&#x27ad;</a></h3>
 <div class="dr-method"><p>Removes the paper from the DOM.
 </p>
-</div><h3 id="Paper.safari" class="dr-method">Paper.safari(f_in, f_out, [icontext], [ocontext])<a href="#Paper.safari" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L3956">&#x27ad;</a></h3>
-<div class="dr-method"><p>Adds event handlers for hover for the element.
+</div><h3 id="Paper.safari" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.safari()<a href="#Paper.safari" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L3953">&#x27ad;</a></h3>
+<div class="dr-method"><p>There is an inconvenient rendering bug in Safari (WebKit):
+sometimes the rendering should be forced.
+This method should help with dealing with this bug.
 </p>
-<p class="header">Parameters
-</p>
-<dl class="dr-parameters"><dt class="dr-param">f_in</dt>
-<dd class="dr-type"><em class="dr-type-function">function</em></dd>
-<dd class="dr-description">handler for hover in</dd>
-<dt class="dr-param">f_out</dt>
-<dd class="dr-type"><em class="dr-type-function">function</em></dd>
-<dd class="dr-description">handler for hover out</dd>
-<dt class="dr-param optional">icontext</dt>
-<dd class="dr-optional">optional</dd>
-<dd class="dr-type"><em class="dr-type-object">object</em></dd>
-<dd class="dr-description">context for hover in handler</dd>
-<dt class="dr-param optional">ocontext</dt>
-<dd class="dr-optional">optional</dd>
-<dd class="dr-type"><em class="dr-type-object">object</em></dd>
-<dd class="dr-description">context for hover out handler</dd>
-</dl>
-<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
-</div><h3 id="Paper.set" class="dr-method">Paper.set()<a href="#Paper.set" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4336">&#x27ad;</a></h3>
-<div class="dr-method"><p>Creates array-like object to keep and operate couple of elements at once.
-Warning: it doesn’t create any elements for itself in the page.
+</div><h3 id="Paper.set" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.set()<a href="#Paper.set" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4334">&#x27ad;</a></h3>
+<div class="dr-method"><p>Creates array-like object to keep and operate several elements at once.
+Warning: it doesn’t create any elements for itself in the page, it just groups existing elements.
+Sets act as pseudo elements — all methods available to an element can be used on a set.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">array-like object that represents set of elements</span></p>
 <p class="header">Usage
@@ -803,7 +789,7 @@ st.push(
 );
 st.attr({fill: <i>"red"</i>});
 </code></pre>
-</div><h3 id="Paper.setSize" class="dr-method">Paper.setSize(width, height)<a href="#Paper.setSize" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4358">&#x27ad;</a></h3>
+</div><h3 id="Paper.setSize" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.setSize(width, height)<a href="#Paper.setSize" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4356">&#x27ad;</a></h3>
 <div class="dr-method"><p>If you need to change dimensions of the canvas call this method
 </p>
 <p class="header">Parameters
@@ -824,7 +810,7 @@ st.push(
 );
 st.attr({fill: <i>"red"</i>});
 </code></pre>
-</div><h3 id="Paper.setViewBox" class="dr-method">Paper.setViewBox(x, y, w, h, fit)<a href="#Paper.setViewBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4375">&#x27ad;</a></h3>
+</div><h3 id="Paper.setViewBox" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.setViewBox(x, y, w, h, fit)<a href="#Paper.setViewBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4373">&#x27ad;</a></h3>
 <div class="dr-method"><p>Sets the view box of the paper. Practically it gives you ability to zoom and pan whole paper surface by 
 specifying new boundaries.
 </p>
@@ -846,7 +832,7 @@ specifying new boundaries.
 <dd class="dr-type"><em class="dr-type-boolean">boolean</em></dd>
 <dd class="dr-description"><code>true</code> if you want graphics to fit into new boundary box</dd>
 </dl>
-</div><h3 id="Paper.text" class="dr-method">Paper.text(x, y, text)<a href="#Paper.text" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4317">&#x27ad;</a></h3>
+</div><h3 id="Paper.text" class="dr-method"><i class="dr-trixie">&#160;</i>Paper.text(x, y, text)<a href="#Paper.text" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4314">&#x27ad;</a></h3>
 <div class="dr-method"><p>Draws a text string. If you need line breaks, put “\n” in the string.
 </p>
 <p class="header">Parameters
@@ -866,10 +852,10 @@ specifying new boundaries.
 </p>
 <pre class="javascript code"><code><b>var</b> t<span class="s"> = </span>paper.text(<span class="d">50</span>, <span class="d">50</span>, <i>"Raphaël\nkicks\nbutt!"</i>);
 </code></pre>
-</div><h3 id="Paper.top" class="dr-property">Paper.top<a href="#Paper.top" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4382">&#x27ad;</a></h3>
+</div><h3 id="Paper.top" class="dr-property"><i class="dr-trixie">&#160;</i>Paper.top<a href="#Paper.top" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4380">&#x27ad;</a></h3>
 <div class="dr-property"><p>Points to the topmost element on the paper
 </p>
-</div><h2 id="Raphael" class="dr-method">Raphael(…)<a href="#Raphael" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L55">&#x27ad;</a></h2>
+</div><h2 id="Raphael" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael(…)<a href="#Raphael" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L56">&#x27ad;</a></h2>
 <div class="dr-method"><p>Creates a canvas object on which to draw.
 You must do this first, as all future calls to drawing methods
 from this instance will be bound to this canvas.
@@ -878,7 +864,7 @@ from this instance will be bound to this canvas.
 </p>
 <dl class="dr-parameters"><dt class="dr-param">container</dt>
 <dd class="dr-type"><em class="dr-type-HTMLElement">HTMLElement</em> <em class="dr-type-string">string</em></dd>
-<dd class="dr-description">DOM element or it’s id which is going to be a parent for drawing surface</dd>
+<dd class="dr-description">DOM element or its ID which is going to be a parent for drawing surface</dd>
 <dt class="dr-param">width</dt>
 <dd class="dr-type"><em class="dr-type-number">number</em></dd>
 <dd class="dr-description">&#160;</dd>
@@ -916,8 +902,9 @@ from this instance will be bound to this canvas.
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Paper" class="dr-link">Paper</a></span></p>
 <p class="header">Usage
 </p>
-<pre class="javascript code"><code><span class="c">// Each of the following examples create a canvas that is 320px wide by 200px high</span>
-<span class="c">// Canvas is created at the viewport’s <span class="d">10</span>,<span class="d">50</span> coordinate</span>
+<pre class="javascript code"><code><span class="c">// Each of the following examples create a canvas</span>
+<span class="c">// that is 320px wide by 200px high.</span>
+<span class="c">// Canvas is created at the viewport’s <span class="d">10</span>,<span class="d">50</span> coordinate.</span>
 <b>var</b> paper<span class="s"> = </span>Raphael(<span class="d">10</span>, <span class="d">50</span>, <span class="d">320</span>, <span class="d">200</span>);
 <span class="c">// Canvas is created at the top left corner of the #notepad element</span>
 <span class="c">// (or its top right corner <b>in</b> dir=<i>"rtl"</i> elements)</span>
@@ -939,7 +926,7 @@ from this instance will be bound to this canvas.
     text: <i>"Dump"</i>
 }]);
 </code></pre>
-</div><h3 id="Raphael.angle" class="dr-method">Raphael.angle(x1, y1, x2, y2, [x3], [y3])<a href="#Raphael.angle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L324">&#x27ad;</a></h3>
+</div><h3 id="Raphael.angle" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.angle(x1, y1, x2, y2, [x3], [y3])<a href="#Raphael.angle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L325">&#x27ad;</a></h3>
 <div class="dr-method"><p>Returns angle between two or three points
 </p>
 <p class="header">Parameters
@@ -966,8 +953,8 @@ from this instance will be bound to this canvas.
 <dd class="dr-description">y coord of third point</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">angle in degrees.</span></p>
-</div><h3 id="Raphael.animation" class="dr-method">Raphael.animation(params, ms, [easing], [callback])<a href="#Raphael.animation" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5330">&#x27ad;</a></h3>
-<div class="dr-method"><p>Creates animation object. That later could be used for <a href="#Element.animate" class="dr-link">Element.animate</a> or <a href="#Element.animateWith" class="dr-link">Element.animateWith</a> methods.
+</div><h3 id="Raphael.animation" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.animation(params, ms, [easing], [callback])<a href="#Raphael.animation" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5328">&#x27ad;</a></h3>
+<div class="dr-method"><p>Creates an animation object that can be passed to the <a href="#Element.animate" class="dr-link">Element.animate</a> or <a href="#Element.animateWith" class="dr-link">Element.animateWith</a> methods.
 See also <a href="#Animation.delay" class="dr-link">Animation.delay</a> and <a href="#Animation.repeat" class="dr-link">Animation.repeat</a> methods.
 </p>
 <p class="header">Parameters
@@ -988,7 +975,7 @@ See also <a href="#Animation.delay" class="dr-link">Animation.delay</a> and <a h
 <dd class="dr-description">callback function. Will be called at the end of animation.</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Animation" class="dr-link">Animation</a></span></p>
-</div><h3 id="Raphael.deg" class="dr-method">Raphael.deg(deg)<a href="#Raphael.deg" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L357">&#x27ad;</a></h3>
+</div><h3 id="Raphael.deg" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.deg(deg)<a href="#Raphael.deg" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L358">&#x27ad;</a></h3>
 <div class="dr-method"><p>Transform angle to degrees
 </p>
 <p class="header">Parameters
@@ -998,8 +985,8 @@ See also <a href="#Animation.delay" class="dr-link">Animation.delay</a> and <a h
 <dd class="dr-description">angle in radians</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">angle in degrees.</span></p>
-</div><h3 id="Raphael.easing_formulas" class="dr-property">Raphael.easing_formulas<a href="#Raphael.easing_formulas" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4789">&#x27ad;</a></h3>
-<div class="dr-property"><p>Object that contains easing formulas for animation. You could extend it with your owns. By default it has following list of easing:
+</div><h3 id="Raphael.easing_formulas" class="dr-property"><i class="dr-trixie">&#160;</i>Raphael.easing_formulas<a href="#Raphael.easing_formulas" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4787">&#x27ad;</a></h3>
+<div class="dr-property"><p>Object that contains easing formulas for animation. You could extend it with your own. By default it has following list of easing:
 </p>
 <ul>
     <li>“linear”</li>
@@ -1012,10 +999,10 @@ See also <a href="#Animation.delay" class="dr-link">Animation.delay</a> and <a h
     <li>“bounce”</li>
 </ul>
 <p>See also <a href="http://raphaeljs.com/easing.html">Easing demo</a>.</p>
-</div><h3 id="Raphael.el" class="dr-property">Raphael.el<a href="#Raphael.el" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5777">&#x27ad;</a></h3>
+</div><h3 id="Raphael.el" class="dr-property"><i class="dr-trixie">&#160;</i>Raphael.el<a href="#Raphael.el" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5775">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-object">object</em><p>You can add your own method to elements. This is usefull when you want to hack default functionality or
 want to wrap some common transformation or attributes in one method. In difference to canvas methods,
-you can redefine element method at any time. Expending element methods wouldn’t affect set
+you can redefine element method at any time. Expending element methods wouldn’t affect set.
 </p>
 <p class="header">Usage
 </p>
@@ -1025,7 +1012,7 @@ you can redefine element method at any time. Expending element methods wouldn’
 <span class="c">// then use it</span>
 paper.circle(<span class="d">100</span>, <span class="d">100</span>, <span class="d">20</span>).red();
 </code></pre>
-</div><h3 id="Raphael.findDotsAtSegment" class="dr-method">Raphael.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t)<a href="#Raphael.findDotsAtSegment" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L966">&#x27ad;</a></h3>
+</div><h3 id="Raphael.findDotsAtSegment" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t)<a href="#Raphael.findDotsAtSegment" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L967">&#x27ad;</a></h3>
 <div class="dr-method"><p>Utility method
 Find dot coordinates on the given cubic bezier curve at the given t.
 </p>
@@ -1072,12 +1059,12 @@ Find dot coordinates on the given cubic bezier curve at the given t.
 <li><span class="dr-json-key">y:</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">y coordinate of the end of the curve</span>
 </ol></li><li>    }</li><li><span class="dr-json-key">alpha:</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">angle of the curve derivative at the point</span>
 </ol></li><li>}</li></ol>
-</div><h3 id="Raphael.fn" class="dr-property">Raphael.fn<a href="#Raphael.fn" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L288">&#x27ad;</a></h3>
-<div class="dr-property"><em class="dr-type dr-type-object">object</em><p>You can add your own method to the canvas. For example if you want to draw pie chart,
+</div><h3 id="Raphael.fn" class="dr-property"><i class="dr-trixie">&#160;</i>Raphael.fn<a href="#Raphael.fn" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L289">&#x27ad;</a></h3>
+<div class="dr-property"><em class="dr-type dr-type-object">object</em><p>You can add your own method to the canvas. For example if you want to draw pie chart,
 you can create your own pie chart function and ship it as a Raphaël plugin. To do this
-you need to extend <code>Raphael.fn</code> object. Please note that you can create your own namespaces
-inside <code>fn</code> object. Methods will be run in context of canvas anyway. You should alter <code>fn</code>
-object before Raphaël instance was created, otherwise it will take no effect.
+you need to extend the <code>Raphael.fn</code> object. Please note that you can create your own namespaces
+inside the <code>fn</code> object — methods will be run in the context of canvas anyway. You should alter
+the <code>fn</code> object before a Raphaël instance is created, otherwise it will take no effect.
 </p>
 <p class="header">Usage
 </p>
@@ -1096,7 +1083,7 @@ paper.arrow(<span class="d">10</span>, <span class="d">10</span>, <span class="d
 paper.mystuff.arrow();
 paper.mystuff.star();
 </code></pre>
-</div><h3 id="Raphael.getColor" class="dr-method">Raphael.getColor([value])<a href="#Raphael.getColor" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L829">&#x27ad;</a></h3>
+</div><h3 id="Raphael.getColor" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.getColor([value])<a href="#Raphael.getColor" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L830">&#x27ad;</a></h3>
 <div class="dr-method"><p>On each call returns next colour in the spectrum. To reset it back to red call <a href="#Raphael.getColor.reset" class="dr-link">Raphael.getColor.reset</a>
 </p>
 <p class="header">Parameters
@@ -1107,10 +1094,10 @@ paper.mystuff.star();
 <dd class="dr-description">brightness, default is <code>0.75</code></dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the colour.</span></p>
-</div><h4 id="Raphael.getColor.reset" class="dr-method">Raphael.getColor.reset()<a href="#Raphael.getColor.reset" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L846">&#x27ad;</a></h4>
+</div><h4 id="Raphael.getColor.reset" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.getColor.reset()<a href="#Raphael.getColor.reset" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L847">&#x27ad;</a></h4>
 <div class="dr-method"><p>Resets spectrum position for <a href="#Raphael.getColor" class="dr-link">Raphael.getColor</a> back to red.
 </p>
-</div><h3 id="Raphael.getPointAtLength" class="dr-method">Raphael.getPointAtLength(path, length)<a href="#Raphael.getPointAtLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4698">&#x27ad;</a></h3>
+</div><h3 id="Raphael.getPointAtLength" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.getPointAtLength(path, length)<a href="#Raphael.getPointAtLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4696">&#x27ad;</a></h3>
 <div class="dr-method"><p>Return coordinates of the point located at the given length on the given path.
 </p>
 <p class="header">Parameters
@@ -1127,7 +1114,7 @@ paper.mystuff.star();
 <li><span class="dr-json-key">y:</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">y coordinate</span>
 <li><span class="dr-json-key">alpha:</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">angle of derivative</span>
 </ol></li><li>}</li></ol>
-</div><h3 id="Raphael.getRGB" class="dr-method">Raphael.getRGB(colour)<a href="#Raphael.getRGB" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L707">&#x27ad;</a></h3>
+</div><h3 id="Raphael.getRGB" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.getRGB(colour)<a href="#Raphael.getRGB" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L708">&#x27ad;</a></h3>
 <div class="dr-method"><p>Parses colour string as RGB object
 </p>
 <p class="header">Parameters
@@ -1136,6 +1123,17 @@ paper.mystuff.star();
 <dd class="dr-type"><em class="dr-type-string">string</em></dd>
 <dd class="dr-description">colour string in one of formats:</dd>
 </dl>
+<ul>
+    <li>Colour name (“<code>red</code>”, “<code>green</code>”, “<code>cornflowerblue</code>”, etc)</li>
+    <li>#••• — shortened HTML colour: (“<code>#000</code>”, “<code>#fc0</code>”, etc)</li>
+    <li>#•••••• — full length HTML colour: (“<code>#000000</code>”, “<code>#bd2300</code>”)</li>
+    <li>rgb(•••, •••, •••) — red, green and blue channels’ values: (“<code>rgb(200,&nbsp;100,&nbsp;0)</code>”)</li>
+    <li>rgb(•••%, •••%, •••%) — same as above, but in %: (“<code>rgb(100%,&nbsp;175%,&nbsp;0%)</code>”)</li>
+    <li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“<code>hsb(0.5,&nbsp;0.25,&nbsp;1)</code>”)</li>
+    <li>hsb(•••%, •••%, •••%) — same as above, but in %</li>
+    <li>hsl(•••, •••, •••) — same as hsb</li>
+    <li>hsl(•••%, •••%, •••%) — same as hsb</li>
+</ul>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">RGB object in format:</span></p>
 <ol class="dr-json"><li>{<ol class="dr-json"><li><span class="dr-json-key">r</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">red,</span>
 <li><span class="dr-json-key">g</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">green,</span>
@@ -1143,7 +1141,7 @@ paper.mystuff.star();
 <li><span class="dr-json-key">hex</span><span class="dr-type"><em class="dr-type-string">string</em></span><span class="dr-json-description">color in HTML/CSS format: #••••••,</span>
 <li><span class="dr-json-key">error</span><span class="dr-type"><em class="dr-type-boolean">boolean</em></span><span class="dr-json-description">true if string can’t be parsed</span>
 </ol></li><li>}</li></ol>
-</div><h3 id="Raphael.getSubpath" class="dr-method">Raphael.getSubpath(path, from, to)<a href="#Raphael.getSubpath" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4713">&#x27ad;</a></h3>
+</div><h3 id="Raphael.getSubpath" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.getSubpath(path, from, to)<a href="#Raphael.getSubpath" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4711">&#x27ad;</a></h3>
 <div class="dr-method"><p>Return subpath of a given path from given length to given length.
 </p>
 <p class="header">Parameters
@@ -1159,7 +1157,7 @@ paper.mystuff.star();
 <dd class="dr-description">position of the end of the segment</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">pathstring for the segment</span></p>
-</div><h3 id="Raphael.getTotalLength" class="dr-method">Raphael.getTotalLength(path)<a href="#Raphael.getTotalLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4679">&#x27ad;</a></h3>
+</div><h3 id="Raphael.getTotalLength" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.getTotalLength(path)<a href="#Raphael.getTotalLength" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L4677">&#x27ad;</a></h3>
 <div class="dr-method"><p>Returns length of the given path in pixels.
 </p>
 <p class="header">Parameters
@@ -1169,7 +1167,7 @@ paper.mystuff.star();
 <dd class="dr-description">SVG path string.</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">length.</span></p>
-</div><h3 id="Raphael.hsb" class="dr-method">Raphael.hsb(h, s, b)<a href="#Raphael.hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L789">&#x27ad;</a></h3>
+</div><h3 id="Raphael.hsb" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.hsb(h, s, b)<a href="#Raphael.hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L790">&#x27ad;</a></h3>
 <div class="dr-method"><p>Converts HSB values to hex representation of the colour.
 </p>
 <p class="header">Parameters
@@ -1185,7 +1183,7 @@ paper.mystuff.star();
 <dd class="dr-description">value or brightness</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the colour.</span></p>
-</div><h3 id="Raphael.hsb2rgb" class="dr-method">Raphael.hsb2rgb(h, s, v)<a href="#Raphael.hsb2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L514">&#x27ad;</a></h3>
+</div><h3 id="Raphael.hsb2rgb" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.hsb2rgb(h, s, v)<a href="#Raphael.hsb2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L515">&#x27ad;</a></h3>
 <div class="dr-method"><p>Converts HSB values to RGB object.
 </p>
 <p class="header">Parameters
@@ -1206,7 +1204,7 @@ paper.mystuff.star();
 <li><span class="dr-json-key">b</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">blue,</span>
 <li><span class="dr-json-key">hex</span><span class="dr-type"><em class="dr-type-string">string</em></span><span class="dr-json-description">color in HTML/CSS format: #••••••</span>
 </ol></li><li>}</li></ol>
-</div><h3 id="Raphael.hsl" class="dr-method">Raphael.hsl(h, s, l)<a href="#Raphael.hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L803">&#x27ad;</a></h3>
+</div><h3 id="Raphael.hsl" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.hsl(h, s, l)<a href="#Raphael.hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L804">&#x27ad;</a></h3>
 <div class="dr-method"><p>Converts HSL values to hex representation of the colour.
 </p>
 <p class="header">Parameters
@@ -1222,7 +1220,7 @@ paper.mystuff.star();
 <dd class="dr-description">luminosity</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the colour.</span></p>
-</div><h3 id="Raphael.hsl2rgb" class="dr-method">Raphael.hsl2rgb(h, s, l)<a href="#Raphael.hsl2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L551">&#x27ad;</a></h3>
+</div><h3 id="Raphael.hsl2rgb" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.hsl2rgb(h, s, l)<a href="#Raphael.hsl2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L552">&#x27ad;</a></h3>
 <div class="dr-method"><p>Converts HSL values to RGB object.
 </p>
 <p class="header">Parameters
@@ -1243,7 +1241,7 @@ paper.mystuff.star();
 <li><span class="dr-json-key">b</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">blue,</span>
 <li><span class="dr-json-key">hex</span><span class="dr-type"><em class="dr-type-string">string</em></span><span class="dr-json-description">color in HTML/CSS format: #••••••</span>
 </ol></li><li>}</li></ol>
-</div><h3 id="Raphael.is" class="dr-method">Raphael.is(o, type)<a href="#Raphael.is" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L299">&#x27ad;</a></h3>
+</div><h3 id="Raphael.is" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.is(o, type)<a href="#Raphael.is" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L300">&#x27ad;</a></h3>
 <div class="dr-method"><p>Handfull replacement for <code>typeof</code> operator.
 </p>
 <p class="header">Parameters
@@ -1256,7 +1254,7 @@ paper.mystuff.star();
 <dd class="dr-description">name of the type, i.e. “string”, “function”, “number”, etc.</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-boolean">boolean</em> <span class="dr-description">is given value is of given type</span></p>
-</div><h3 id="Raphael.parsePathString" class="dr-method">Raphael.parsePathString(pathString)<a href="#Raphael.parsePathString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L861">&#x27ad;</a></h3>
+</div><h3 id="Raphael.parsePathString" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.parsePathString(pathString)<a href="#Raphael.parsePathString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L862">&#x27ad;</a></h3>
 <div class="dr-method"><p>Utility method
 Parses given path string into an array of arrays of path segments.
 </p>
@@ -1264,10 +1262,10 @@ Parses given path string into an array of arrays of path segments.
 </p>
 <dl class="dr-parameters"><dt class="dr-param">pathString</dt>
 <dd class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-array">array</em></dd>
-<dd class="dr-description">path string or array of segments (in the last case it will be returned stright away)</dd>
+<dd class="dr-description">path string or array of segments (in the last case it will be returned straight away)</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-array">array</em> <span class="dr-description">array of segments.</span></p>
-</div><h3 id="Raphael.parseTransformString" class="dr-method">Raphael.parseTransformString(TString)<a href="#Raphael.parseTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L904">&#x27ad;</a></h3>
+</div><h3 id="Raphael.parseTransformString" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.parseTransformString(TString)<a href="#Raphael.parseTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L905">&#x27ad;</a></h3>
 <div class="dr-method"><p>Utility method
 Parses given path string into an array of transformations.
 </p>
@@ -1275,12 +1273,12 @@ Parses given path string into an array of transformations.
 </p>
 <dl class="dr-parameters"><dt class="dr-param">TString</dt>
 <dd class="dr-type"><em class="dr-type-string">string</em> <em class="dr-type-array">array</em></dd>
-<dd class="dr-description">transform string or array of transformations (in the last case it will be returned stright away)</dd>
+<dd class="dr-description">transform string or array of transformations (in the last case it will be returned straight away)</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-array">array</em> <span class="dr-description">array of transformations.</span></p>
-</div><h3 id="Raphael.path2curve" class="dr-method">Raphael.path2curve(pathString)<a href="#Raphael.path2curve" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L1683">&#x27ad;</a></h3>
+</div><h3 id="Raphael.path2curve" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.path2curve(pathString)<a href="#Raphael.path2curve" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L1684">&#x27ad;</a></h3>
 <div class="dr-method"><p>Utility method
-Converts path to path where all segments are cubic bezier curves.
+Converts path to a new path where all segments are cubic bezier curves.
 </p>
 <p class="header">Parameters
 </p>
@@ -1289,7 +1287,7 @@ Converts path to path where all segments are cubic bezier curves.
 <dd class="dr-description">path string or array of segments</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-array">array</em> <span class="dr-description">array of segments.</span></p>
-</div><h3 id="Raphael.pathToRelative" class="dr-method">Raphael.pathToRelative(pathString)<a href="#Raphael.pathToRelative" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L1671">&#x27ad;</a></h3>
+</div><h3 id="Raphael.pathToRelative" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.pathToRelative(pathString)<a href="#Raphael.pathToRelative" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L1672">&#x27ad;</a></h3>
 <div class="dr-method"><p>Utility method
 Converts path to relative form
 </p>
@@ -1300,7 +1298,7 @@ Converts path to relative form
 <dd class="dr-description">path string or array of segments</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-array">array</em> <span class="dr-description">array of segments.</span></p>
-</div><h3 id="Raphael.rad" class="dr-method">Raphael.rad(deg)<a href="#Raphael.rad" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L345">&#x27ad;</a></h3>
+</div><h3 id="Raphael.rad" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.rad(deg)<a href="#Raphael.rad" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L346">&#x27ad;</a></h3>
 <div class="dr-method"><p>Transform angle to radians
 </p>
 <p class="header">Parameters
@@ -1310,7 +1308,7 @@ Converts path to relative form
 <dd class="dr-description">angle in degrees</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">angle in radians.</span></p>
-</div><h3 id="Raphael.rgb" class="dr-method">Raphael.rgb(r, g, b)<a href="#Raphael.rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L817">&#x27ad;</a></h3>
+</div><h3 id="Raphael.rgb" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.rgb(r, g, b)<a href="#Raphael.rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L818">&#x27ad;</a></h3>
 <div class="dr-method"><p>Converts RGB values to hex representation of the colour.
 </p>
 <p class="header">Parameters
@@ -1326,7 +1324,7 @@ Converts path to relative form
 <dd class="dr-description">blue</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the colour.</span></p>
-</div><h3 id="Raphael.rgb2hsb" class="dr-method">Raphael.rgb2hsb(r, g, b)<a href="#Raphael.rgb2hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L591">&#x27ad;</a></h3>
+</div><h3 id="Raphael.rgb2hsb" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.rgb2hsb(r, g, b)<a href="#Raphael.rgb2hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L592">&#x27ad;</a></h3>
 <div class="dr-method"><p>Converts RGB values to HSB object.
 </p>
 <p class="header">Parameters
@@ -1346,7 +1344,7 @@ Converts path to relative form
 <li><span class="dr-json-key">s</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">saturation</span>
 <li><span class="dr-json-key">b</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">brightness</span>
 </ol></li><li>}</li></ol>
-</div><h3 id="Raphael.rgb2hsl" class="dr-method">Raphael.rgb2hsl(r, g, b)<a href="#Raphael.rgb2hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L624">&#x27ad;</a></h3>
+</div><h3 id="Raphael.rgb2hsl" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.rgb2hsl(r, g, b)<a href="#Raphael.rgb2hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L625">&#x27ad;</a></h3>
 <div class="dr-method"><p>Converts RGB values to HSL object.
 </p>
 <p class="header">Parameters
@@ -1366,7 +1364,7 @@ Converts path to relative form
 <li><span class="dr-json-key">s</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">saturation</span>
 <li><span class="dr-json-key">l</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">luminosity</span>
 </ol></li><li>}</li></ol>
-</div><h3 id="Raphael.setWindow" class="dr-method">Raphael.setWindow(newwin)<a href="#Raphael.setWindow" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L409">&#x27ad;</a></h3>
+</div><h3 id="Raphael.setWindow" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.setWindow(newwin)<a href="#Raphael.setWindow" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L410">&#x27ad;</a></h3>
 <div class="dr-method"><p>Used when you need to draw in <code>&lt;iframe></code>. Switched window to the iframe one.
 </p>
 <p class="header">Parameters
@@ -1375,7 +1373,7 @@ Converts path to relative form
 <dd class="dr-type"><em class="dr-type-window">window</em></dd>
 <dd class="dr-description">new window object</dd>
 </dl>
-</div><h3 id="Raphael.snapTo" class="dr-method">Raphael.snapTo(values, value, [tolerance])<a href="#Raphael.snapTo" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L371">&#x27ad;</a></h3>
+</div><h3 id="Raphael.snapTo" class="dr-method"><i class="dr-trixie">&#160;</i>Raphael.snapTo(values, value, [tolerance])<a href="#Raphael.snapTo" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L372">&#x27ad;</a></h3>
 <div class="dr-method"><p>Snaps given value to given grid.
 </p>
 <p class="header">Parameters
@@ -1392,17 +1390,17 @@ Converts path to relative form
 <dd class="dr-description">tolerance for snapping. Default is <code>10</code>.</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">adjusted value.</span></p>
-</div><h3 id="Raphael.svg" class="dr-property">Raphael.svg<a href="#Raphael.svg" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L226">&#x27ad;</a></h3>
+</div><h3 id="Raphael.svg" class="dr-property"><i class="dr-trixie">&#160;</i>Raphael.svg<a href="#Raphael.svg" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L227">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-boolean">boolean</em><p><code>true</code> if browser supports SVG.
 </p>
-</div><h3 id="Raphael.type" class="dr-property">Raphael.type<a href="#Raphael.type" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L208">&#x27ad;</a></h3>
+</div><h3 id="Raphael.type" class="dr-property"><i class="dr-trixie">&#160;</i>Raphael.type<a href="#Raphael.type" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L209">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-string">string</em><p>Can be “SVG”, “VML” or empty, depending on browser support.
 </p>
-</div><h3 id="Raphael.vml" class="dr-property">Raphael.vml<a href="#Raphael.vml" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L232">&#x27ad;</a></h3>
+</div><h3 id="Raphael.vml" class="dr-property"><i class="dr-trixie">&#160;</i>Raphael.vml<a href="#Raphael.vml" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L233">&#x27ad;</a></h3>
 <div class="dr-property"><em class="dr-type dr-type-boolean">boolean</em><p><code>true</code> if browser supports VML.
 </p>
-</div><h2 id="Set" class="undefined">Set<a href="#Set" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#Lundefined">&#x27ad;</a></h2>
-<h3 id="Set.forEach" class="dr-method">Set.forEach(callback, thisArg)<a href="#Set.forEach" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5573">&#x27ad;</a></h3>
+</div><h2 id="Set" class="undefined"><i class="dr-trixie">&#160;</i>Set<a href="#Set" title="Link to this section" class="dr-hash">&#x2693;</a></h2>
+<h3 id="Set.forEach" class="dr-method"><i class="dr-trixie">&#160;</i>Set.forEach(callback, thisArg)<a href="#Set.forEach" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5571">&#x27ad;</a></h3>
 <div class="dr-method"><p>Executes given function for each element in the set.
 </p>
 <p>If function returns <code>false</code> it will stop loop running.
@@ -1417,11 +1415,11 @@ Converts path to relative form
 <dd class="dr-description">context object for the callback</dd>
 </dl>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Set object</span></p>
-</div><h3 id="Set.pop" class="dr-method">Set.pop()<a href="#Set.pop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5555">&#x27ad;</a></h3>
+</div><h3 id="Set.pop" class="dr-method"><i class="dr-trixie">&#160;</i>Set.pop()<a href="#Set.pop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5553">&#x27ad;</a></h3>
 <div class="dr-method"><p>Removes last element and returns it.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">element</span></p>
-</div><h3 id="Set.push" class="dr-method">Set.push()<a href="#Set.push" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5535">&#x27ad;</a></h3>
+</div><h3 id="Set.push" class="dr-method"><i class="dr-trixie">&#160;</i>Set.push()<a href="#Set.push" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to source" href="raphael-src.html#L5533">&#x27ad;</a></h3>
 <div class="dr-method"><p>Adds each argument to the current set.
 </p>
 <p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">original element</span></p>