Comunic/ComunicWeb
1
0
Fork 0
mirror of https://github.com/pierre42100/ComunicWeb synced 2024-11-24 13:09:20 +00:00
Code Issues Projects Releases Wiki Activity
master
ComunicWeb/assets/3rdparty/adminLTE/plugins/raphael/raphael-src.html
Pierre 196bbdc585 Updated 3rdparty structure
2017-05-26 08:56:32 +02:00

5985 lines
741 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<!-- Generated with Dr.js -->
<html lang="en"><head><meta charset="utf-8"><title>raphael.js</title><link rel="stylesheet" href="dr.css"></head><body id="src-dr-js"><code id="L1"><span class="ln">1</span><span class="c">/*
</span></code><code id="L2"><span class="ln">2</span><span class="c"><span class="s"> * </span>Raphaël <span class="d">2.0</span><span class="d">.0</span><span class="s"> - </span>JavaScript Vector Library
</span></code><code id="L3"><span class="ln">3</span><span class="c"> *
</span></code><code id="L4"><span class="ln">4</span><span class="c"><span class="s"> * </span>Copyright (c) <span class="d">2011</span> Dmitry Baranovskiy (http:<span class="c">//raphaeljs.com)</span>
</span></code><code id="L5"><span class="ln">5</span><span class="c"><span class="s"> * </span>Copyright (c) <span class="d">2011</span> Sencha Labs (http:<span class="c">//sencha.com)</span>
</span></code><code id="L6"><span class="ln">6</span><span class="c"><span class="s"> * </span>Licensed under the MIT (http:<span class="c">//raphaeljs.com/license.html) license.</span>
</span></code><code id="L7"><span class="ln">7</span><span class="c"> */</span>
</code><code id="L8"><span class="ln">8</span>(<b>function</b> () {
</code><code id="L9"><span class="ln">9</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L10"><span class="ln">10</span><span class="c"> <span class="s"> * </span>Raphael
</span></code><code id="L11"><span class="ln">11</span><span class="c"> [ method ]
</span></code><code id="L12"><span class="ln">12</span><span class="c"> **
</span></code><code id="L13"><span class="ln">13</span><span class="c"> <span class="s"> * </span>Creates a canvas object on which to draw.
</span></code><code id="L14"><span class="ln">14</span><span class="c"> <span class="s"> * </span>You must <b>do</b> <b>this</b> first, as all future calls to drawing methods
</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 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="L22"><span class="ln">22</span><span class="c"> <span class="s"> - </span>x (number)
</span></code><code id="L23"><span class="ln">23</span><span class="c"> <span class="s"> - </span>y (number)
</span></code><code id="L24"><span class="ln">24</span><span class="c"> <span class="s"> - </span>width (number)
</span></code><code id="L25"><span class="ln">25</span><span class="c"> <span class="s"> - </span>height (number)
</span></code><code id="L26"><span class="ln">26</span><span class="c"> <span class="s"> * </span>or
</span></code><code id="L27"><span class="ln">27</span><span class="c"> <span class="s"> - </span>all (array) (first <span class="d">3</span> or <span class="d">4</span> elements <b>in</b> the array are equal to [containerID, width, height] or [x, y, width, height]. The rest are element descriptions <b>in</b> format {type: type, &lt;attributes>})
</span></code><code id="L28"><span class="ln">28</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</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> isFloating;
</code><code id="L2927"><span class="ln">2927</span> x<span class="s"> = </span>x<span class="s"> || </span><span class="d">0</span>;
</code><code id="L2928"><span class="ln">2928</span> y<span class="s"> = </span>y<span class="s"> || </span><span class="d">0</span>;
</code><code id="L2929"><span class="ln">2929</span> width<span class="s"> = </span>width<span class="s"> || </span><span class="d">512</span>;
</code><code id="L2930"><span class="ln">2930</span> height<span class="s"> = </span>height<span class="s"> || </span><span class="d">342</span>;
</code><code id="L2931"><span class="ln">2931</span> $(cnvs, {
</code><code id="L2932"><span class="ln">2932</span> height: height,
</code><code id="L2933"><span class="ln">2933</span> version: <span class="d">1.1</span>,
</code><code id="L2934"><span class="ln">2934</span> width: width,
</code><code id="L2935"><span class="ln">2935</span> xmlns: <i>"http:<span class="c">//www.w3.org/<span class="d">2000</span>/svg"</i></span>
</code><code id="L2936"><span class="ln">2936</span> });
</code><code id="L2937"><span class="ln">2937</span> <b>if</b> (container<span class="s"> == </span><span class="d">1</span>) {
</code><code id="L2938"><span class="ln">2938</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="L2939"><span class="ln">2939</span> g.doc.body.appendChild(cnvs);
</code><code id="L2940"><span class="ln">2940</span> isFloating<span class="s"> = </span><span class="d">1</span>;
</code><code id="L2941"><span class="ln">2941</span> } <b>else</b> {
</code><code id="L2942"><span class="ln">2942</span> cnvs.style.cssText<span class="s"> = </span>css<span class="s"> + </span><i>"position:relative"</i>;
</code><code id="L2943"><span class="ln">2943</span> <b>if</b> (container.firstChild) {
</code><code id="L2944"><span class="ln">2944</span> container.insertBefore(cnvs, container.firstChild);
</code><code id="L2945"><span class="ln">2945</span> } <b>else</b> {
</code><code id="L2946"><span class="ln">2946</span> container.appendChild(cnvs);
</code><code id="L2947"><span class="ln">2947</span> }
</code><code id="L2948"><span class="ln">2948</span> }
</code><code id="L2949"><span class="ln">2949</span> container<span class="s"> = </span><b>new</b> Paper;
</code><code id="L2950"><span class="ln">2950</span> container.width<span class="s"> = </span>width;
</code><code id="L2951"><span class="ln">2951</span> container.height<span class="s"> = </span>height;
</code><code id="L2952"><span class="ln">2952</span> container.canvas<span class="s"> = </span>cnvs;
</code><code id="L2953"><span class="ln">2953</span> plugins.call(container, container, R.fn);
</code><code id="L2954"><span class="ln">2954</span> container.clear();
</code><code id="L2955"><span class="ln">2955</span> container._left<span class="s"> = </span>container._top<span class="s"> = </span><span class="d">0</span>;
</code><code id="L2956"><span class="ln">2956</span> isFloating<span class="s"> &amp;&amp; </span>(container.renderfix<span class="s"> = </span>fun);
</code><code id="L2957"><span class="ln">2957</span> container.renderfix();
</code><code id="L2958"><span class="ln">2958</span> <b>return</b> container;
</code><code id="L2959"><span class="ln">2959</span> },
</code><code id="L2960"><span class="ln">2960</span> setViewBox<span class="s"> = </span><b>function</b> (x, y, w, h, fit) {
</code><code id="L2961"><span class="ln">2961</span> eve(<i>"setViewBox"</i>, <b>this</b>, <b>this</b>._viewBox, [x, y, w, h, fit]);
</code><code id="L2962"><span class="ln">2962</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="L2963"><span class="ln">2963</span> top<span class="s"> = </span><b>this</b>.top,
</code><code id="L2964"><span class="ln">2964</span> aspectRatio<span class="s"> = </span>fit ? <i>"meet"</i> : <i>"xMinYMin"</i>,
</code><code id="L2965"><span class="ln">2965</span> vb,
</code><code id="L2966"><span class="ln">2966</span> sw;
</code><code id="L2967"><span class="ln">2967</span> <b>if</b> (x<span class="s"> == </span><b>null</b>) {
</code><code id="L2968"><span class="ln">2968</span> <b>if</b> (<b>this</b>._vbSize) {
</code><code id="L2969"><span class="ln">2969</span> size<span class="s"> = </span><span class="d">1</span>;
</code><code id="L2970"><span class="ln">2970</span> }
</code><code id="L2971"><span class="ln">2971</span> <b>delete</b> <b>this</b>._vbSize;
</code><code id="L2972"><span class="ln">2972</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="L2973"><span class="ln">2973</span> } <b>else</b> {
</code><code id="L2974"><span class="ln">2974</span> <b>this</b>._vbSize<span class="s"> = </span>size;
</code><code id="L2975"><span class="ln">2975</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="L2976"><span class="ln">2976</span> }
</code><code id="L2977"><span class="ln">2977</span> $(<b>this</b>.canvas, {
</code><code id="L2978"><span class="ln">2978</span> viewBox: vb,
</code><code id="L2979"><span class="ln">2979</span> preserveAspectRatio: aspectRatio
</code><code id="L2980"><span class="ln">2980</span> });
</code><code id="L2981"><span class="ln">2981</span> <b>while</b> (size<span class="s"> &amp;&amp; </span>top) {
</code><code id="L2982"><span class="ln">2982</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="L2983"><span class="ln">2983</span> top.attr({<i>"stroke-width"</i>: sw});
</code><code id="L2984"><span class="ln">2984</span> top._.dirty<span class="s"> = </span><span class="d">1</span>;
</code><code id="L2985"><span class="ln">2985</span> top._.dirtyT<span class="s"> = </span><span class="d">1</span>;
</code><code id="L2986"><span class="ln">2986</span> top<span class="s"> = </span>top.prev;
</code><code id="L2987"><span class="ln">2987</span> }
</code><code id="L2988"><span class="ln">2988</span> <b>this</b>._viewBox<span class="s"> = </span>[x, y, w, h, !!fit];
</code><code id="L2989"><span class="ln">2989</span> <b>return</b> <b>this</b>;
</code><code id="L2990"><span class="ln">2990</span> };
</code><code id="L2991"><span class="ln">2991</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L2992"><span class="ln">2992</span><span class="c"> <span class="s"> * </span>Paper.renderfix
</span></code><code id="L2993"><span class="ln">2993</span><span class="c"> [ method ]
</span></code><code id="L2994"><span class="ln">2994</span><span class="c"> **
</span></code><code id="L2995"><span class="ln">2995</span><span class="c"> <span class="s"> * </span>Fixes the issue of Firefox and IE9 regarding subpixel rendering. If paper is dependant
</span></code><code id="L2996"><span class="ln">2996</span><span class="c"> <span class="s"> * </span>on other elements after reflow it could shift half pixel which cause <b>for</b> lines to lost their crispness.
</span></code><code id="L2997"><span class="ln">2997</span><span class="c"> <span class="s"> * </span>This method fixes the issue.
</span></code><code id="L2998"><span class="ln">2998</span><span class="c"> **
</span></code><code id="L2999"><span class="ln">2999</span><span class="c"> Special thanks to Mariusz Nowak (http:<span class="c">//www.medikoo.com/) <b>for</b> <b>this</b> method.</span>
</span></code><code id="L3000"><span class="ln">3000</span><span class="c"> \*/</span>
</code><code id="L3001"><span class="ln">3001</span> paperproto.renderfix<span class="s"> = </span><b>function</b> () {
</code><code id="L3002"><span class="ln">3002</span> <b>var</b> cnvs<span class="s"> = </span><b>this</b>.canvas,
</code><code id="L3003"><span class="ln">3003</span> s<span class="s"> = </span>cnvs.style,
</code><code id="L3004"><span class="ln">3004</span> pos<span class="s"> = </span>cnvs.getScreenCTM(),
</code><code id="L3005"><span class="ln">3005</span> left<span class="s"> = </span>-pos.e<span class="s"> % </span><span class="d">1</span>,
</code><code id="L3006"><span class="ln">3006</span> top<span class="s"> = </span>-pos.f<span class="s"> % </span><span class="d">1</span>;
</code><code id="L3007"><span class="ln">3007</span> <b>if</b> (left<span class="s"> || </span>top) {
</code><code id="L3008"><span class="ln">3008</span> <b>if</b> (left) {
</code><code id="L3009"><span class="ln">3009</span> <b>this</b>._left<span class="s"> = </span>(<b>this</b>._left<span class="s"> + </span>left)<span class="s"> % </span><span class="d">1</span>;
</code><code id="L3010"><span class="ln">3010</span> s.left<span class="s"> = </span><b>this</b>._left<span class="s"> + </span><i>"px"</i>;
</code><code id="L3011"><span class="ln">3011</span> }
</code><code id="L3012"><span class="ln">3012</span> <b>if</b> (top) {
</code><code id="L3013"><span class="ln">3013</span> <b>this</b>._top<span class="s"> = </span>(<b>this</b>._top<span class="s"> + </span>top)<span class="s"> % </span><span class="d">1</span>;
</code><code id="L3014"><span class="ln">3014</span> s.top<span class="s"> = </span><b>this</b>._top<span class="s"> + </span><i>"px"</i>;
</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"> <span class="c">/*\</span>
</span></code><code id="L3019"><span class="ln">3019</span><span class="c"> <span class="s"> * </span>Paper.clear
</span></code><code id="L3020"><span class="ln">3020</span><span class="c"> [ method ]
</span></code><code id="L3021"><span class="ln">3021</span><span class="c"> **
</span></code><code id="L3022"><span class="ln">3022</span><span class="c"> <span class="s"> * </span>Clears the paper, i.e. removes all the elements.
</span></code><code id="L3023"><span class="ln">3023</span><span class="c"> \*/</span>
</code><code id="L3024"><span class="ln">3024</span> paperproto.clear<span class="s"> = </span><b>function</b> () {
</code><code id="L3025"><span class="ln">3025</span> eve(<i>"clear"</i>, <b>this</b>);
</code><code id="L3026"><span class="ln">3026</span> <b>var</b> c<span class="s"> = </span><b>this</b>.canvas;
</code><code id="L3027"><span class="ln">3027</span> <b>while</b> (c.firstChild) {
</code><code id="L3028"><span class="ln">3028</span> c.removeChild(c.firstChild);
</code><code id="L3029"><span class="ln">3029</span> }
</code><code id="L3030"><span class="ln">3030</span> <b>this</b>.bottom<span class="s"> = </span><b>this</b>.top<span class="s"> = </span><b>null</b>;
</code><code id="L3031"><span class="ln">3031</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="L3032"><span class="ln">3032</span> c.appendChild(<b>this</b>.desc);
</code><code id="L3033"><span class="ln">3033</span> c.appendChild(<b>this</b>.defs<span class="s"> = </span>$(<i>"defs"</i>));
</code><code id="L3034"><span class="ln">3034</span> };
</code><code id="L3035"><span class="ln">3035</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L3036"><span class="ln">3036</span><span class="c"> <span class="s"> * </span>Paper.remove
</span></code><code id="L3037"><span class="ln">3037</span><span class="c"> [ method ]
</span></code><code id="L3038"><span class="ln">3038</span><span class="c"> **
</span></code><code id="L3039"><span class="ln">3039</span><span class="c"> <span class="s"> * </span>Removes the paper from the DOM.
</span></code><code id="L3040"><span class="ln">3040</span><span class="c"> \*/</span>
</code><code id="L3041"><span class="ln">3041</span> paperproto.remove<span class="s"> = </span><b>function</b> () {
</code><code id="L3042"><span class="ln">3042</span> eve(<i>"remove"</i>, <b>this</b>);
</code><code id="L3043"><span class="ln">3043</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="L3044"><span class="ln">3044</span> <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
</code><code id="L3045"><span class="ln">3045</span> <b>this</b>[i]<span class="s"> = </span>removed(i);
</code><code id="L3046"><span class="ln">3046</span> }
</code><code id="L3047"><span class="ln">3047</span> };
</code><code id="L3048"><span class="ln">3048</span> }
</code><code id="L3049"><span class="ln">3049</span>
</code><code id="L3050"><span class="ln">3050</span> <span class="c">// VML</span>
</code><code id="L3051"><span class="ln">3051</span> <b>if</b> (R.vml) {
</code><code id="L3052"><span class="ln">3052</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="L3053"><span class="ln">3053</span> bites<span class="s"> = </span>/([clmz]),?([^clmz]*)/gi,
</code><code id="L3054"><span class="ln">3054</span> blurregexp<span class="s"> = </span>/ progid:\S+Blur\([^\)]+\)/g,
</code><code id="L3055"><span class="ln">3055</span> val<span class="s"> = </span>/-?[^,\s-]+/g,
</code><code id="L3056"><span class="ln">3056</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="L3057"><span class="ln">3057</span> zoom<span class="s"> = </span><span class="d">21600</span>,
</code><code id="L3058"><span class="ln">3058</span> pathTypes<span class="s"> = </span>{path: <span class="d">1</span>, rect: <span class="d">1</span>},
</code><code id="L3059"><span class="ln">3059</span> ovalTypes<span class="s"> = </span>{circle: <span class="d">1</span>, ellipse: <span class="d">1</span>},
</code><code id="L3060"><span class="ln">3060</span> path2vml<span class="s"> = </span><b>function</b> (path) {
</code><code id="L3061"><span class="ln">3061</span> <b>var</b> total<span class="s"> = </span> /[ahqstv]/ig,
</code><code id="L3062"><span class="ln">3062</span> command<span class="s"> = </span>pathToAbsolute;
</code><code id="L3063"><span class="ln">3063</span> Str(path).match(total)<span class="s"> &amp;&amp; </span>(command<span class="s"> = </span>path2curve);
</code><code id="L3064"><span class="ln">3064</span> total<span class="s"> = </span>/[clmz]/g;
</code><code id="L3065"><span class="ln">3065</span> <b>if</b> (command<span class="s"> == </span>pathToAbsolute<span class="s"> &amp;&amp; </span>!Str(path).match(total)) {
</code><code id="L3066"><span class="ln">3066</span> <b>var</b> res<span class="s"> = </span>Str(path).replace(bites, <b>function</b> (all, command, args) {
</code><code id="L3067"><span class="ln">3067</span> <b>var</b> vals<span class="s"> = </span>[],
</code><code id="L3068"><span class="ln">3068</span> isMove<span class="s"> = </span>lowerCase.call(command)<span class="s"> == </span><i>"m"</i>,
</code><code id="L3069"><span class="ln">3069</span> res<span class="s"> = </span>map[command];
</code><code id="L3070"><span class="ln">3070</span> args.replace(val, <b>function</b> (value) {
</code><code id="L3071"><span class="ln">3071</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="L3072"><span class="ln">3072</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="L3073"><span class="ln">3073</span> vals<span class="s"> = </span>[];
</code><code id="L3074"><span class="ln">3074</span> }
</code><code id="L3075"><span class="ln">3075</span> vals.push(round(value<span class="s"> * </span>zoom));
</code><code id="L3076"><span class="ln">3076</span> });
</code><code id="L3077"><span class="ln">3077</span> <b>return</b> res<span class="s"> + </span>vals;
</code><code id="L3078"><span class="ln">3078</span> });
</code><code id="L3079"><span class="ln">3079</span> <b>return</b> res;
</code><code id="L3080"><span class="ln">3080</span> }
</code><code id="L3081"><span class="ln">3081</span> <b>var</b> pa<span class="s"> = </span>command(path), p, r;
</code><code id="L3082"><span class="ln">3082</span> res<span class="s"> = </span>[];
</code><code id="L3083"><span class="ln">3083</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="L3084"><span class="ln">3084</span> p<span class="s"> = </span>pa[i];
</code><code id="L3085"><span class="ln">3085</span> r<span class="s"> = </span>lowerCase.call(pa[i][<span class="d">0</span>]);
</code><code id="L3086"><span class="ln">3086</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="L3087"><span class="ln">3087</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="L3088"><span class="ln">3088</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="L3089"><span class="ln">3089</span> }
</code><code id="L3090"><span class="ln">3090</span> res.push(r);
</code><code id="L3091"><span class="ln">3091</span> }
</code><code id="L3092"><span class="ln">3092</span> <b>return</b> res.join(S);
</code><code id="L3093"><span class="ln">3093</span> },
</code><code id="L3094"><span class="ln">3094</span> compensation<span class="s"> = </span><b>function</b> (deg, dx, dy) {
</code><code id="L3095"><span class="ln">3095</span> <b>var</b> m<span class="s"> = </span><b>new</b> Matrix;
</code><code id="L3096"><span class="ln">3096</span> m.rotate(-deg, <span class="d">.5</span>, <span class="d">.5</span>);
</code><code id="L3097"><span class="ln">3097</span> <b>return</b> {
</code><code id="L3098"><span class="ln">3098</span> dx: m.x(dx, dy),
</code><code id="L3099"><span class="ln">3099</span> dy: m.y(dx, dy)
</code><code id="L3100"><span class="ln">3100</span> };
</code><code id="L3101"><span class="ln">3101</span> },
</code><code id="L3102"><span class="ln">3102</span> setCoords<span class="s"> = </span><b>function</b> (p) {
</code><code id="L3103"><span class="ln">3103</span> <b>var</b> _<span class="s"> = </span>p._,
</code><code id="L3104"><span class="ln">3104</span> sx<span class="s"> = </span>_.sx,
</code><code id="L3105"><span class="ln">3105</span> sy<span class="s"> = </span>_.sy,
</code><code id="L3106"><span class="ln">3106</span> deg<span class="s"> = </span>_.deg,
</code><code id="L3107"><span class="ln">3107</span> dx<span class="s"> = </span>_.dx,
</code><code id="L3108"><span class="ln">3108</span> dy<span class="s"> = </span>_.dy,
</code><code id="L3109"><span class="ln">3109</span> fillpos<span class="s"> = </span>_.fillpos,
</code><code id="L3110"><span class="ln">3110</span> o<span class="s"> = </span>p.node,
</code><code id="L3111"><span class="ln">3111</span> s<span class="s"> = </span>o.style,
</code><code id="L3112"><span class="ln">3112</span> y<span class="s"> = </span><span class="d">1</span>,
</code><code id="L3113"><span class="ln">3113</span> m<span class="s"> = </span>p.matrix,
</code><code id="L3114"><span class="ln">3114</span> flip<span class="s"> = </span><i>""</i>,
</code><code id="L3115"><span class="ln">3115</span> dxdy,
</code><code id="L3116"><span class="ln">3116</span> kx<span class="s"> = </span>zoom<span class="s"> / </span>sx,
</code><code id="L3117"><span class="ln">3117</span> ky<span class="s"> = </span>zoom<span class="s"> / </span>sy;
</code><code id="L3118"><span class="ln">3118</span> s.visibility<span class="s"> = </span><i>"hidden"</i>;
</code><code id="L3119"><span class="ln">3119</span> o.coordsize<span class="s"> = </span>abs(kx)<span class="s"> + </span>S<span class="s"> + </span>abs(ky);
</code><code id="L3120"><span class="ln">3120</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="L3121"><span class="ln">3121</span> <b>if</b> (deg) {
</code><code id="L3122"><span class="ln">3122</span> <b>var</b> c<span class="s"> = </span>compensation(deg, dx, dy);
</code><code id="L3123"><span class="ln">3123</span> dx<span class="s"> = </span>c.dx;
</code><code id="L3124"><span class="ln">3124</span> dy<span class="s"> = </span>c.dy;
</code><code id="L3125"><span class="ln">3125</span> }
</code><code id="L3126"><span class="ln">3126</span> sx &lt; <span class="d">0</span><span class="s"> &amp;&amp; </span>(flip += <i>"x"</i>);
</code><code id="L3127"><span class="ln">3127</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="L3128"><span class="ln">3128</span> s.flip<span class="s"> = </span>flip;
</code><code id="L3129"><span class="ln">3129</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="L3130"><span class="ln">3130</span> <b>if</b> (fillpos<span class="s"> || </span>_.fillsize) {
</code><code id="L3131"><span class="ln">3131</span> <b>var</b> fill<span class="s"> = </span>o.getElementsByTagName(fillString);
</code><code id="L3132"><span class="ln">3132</span> fill<span class="s"> = </span>fill<span class="s"> &amp;&amp; </span>fill[<span class="d">0</span>];
</code><code id="L3133"><span class="ln">3133</span> o.removeChild(fill);
</code><code id="L3134"><span class="ln">3134</span> <b>if</b> (fillpos) {
</code><code id="L3135"><span class="ln">3135</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="L3136"><span class="ln">3136</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="L3137"><span class="ln">3137</span> }
</code><code id="L3138"><span class="ln">3138</span> <b>if</b> (_.fillsize) {
</code><code id="L3139"><span class="ln">3139</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="L3140"><span class="ln">3140</span> }
</code><code id="L3141"><span class="ln">3141</span> o.appendChild(fill);
</code><code id="L3142"><span class="ln">3142</span> }
</code><code id="L3143"><span class="ln">3143</span> s.visibility<span class="s"> = </span><i>"visible"</i>;
</code><code id="L3144"><span class="ln">3144</span> };
</code><code id="L3145"><span class="ln">3145</span> R.toString<span class="s"> = </span><b>function</b> () {
</code><code id="L3146"><span class="ln">3146</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="L3147"><span class="ln">3147</span> };
</code><code id="L3148"><span class="ln">3148</span> addArrow<span class="s"> = </span><b>function</b> (o, value, isEnd) {
</code><code id="L3149"><span class="ln">3149</span> <b>var</b> values<span class="s"> = </span>Str(value).toLowerCase().split(<i>"-"</i>),
</code><code id="L3150"><span class="ln">3150</span> se<span class="s"> = </span>isEnd ? <i>"end"</i> : <i>"start"</i>,
</code><code id="L3151"><span class="ln">3151</span> i<span class="s"> = </span>values.length,
</code><code id="L3152"><span class="ln">3152</span> type<span class="s"> = </span><i>"classic"</i>,
</code><code id="L3153"><span class="ln">3153</span> w<span class="s"> = </span><i>"medium"</i>,
</code><code id="L3154"><span class="ln">3154</span> h<span class="s"> = </span><i>"medium"</i>;
</code><code id="L3155"><span class="ln">3155</span> <b>while</b> (i--) {
</code><code id="L3156"><span class="ln">3156</span> <b>switch</b> (values[i]) {
</code><code id="L3157"><span class="ln">3157</span> <b>case</b> <i>"block"</i>:
</code><code id="L3158"><span class="ln">3158</span> <b>case</b> <i>"classic"</i>:
</code><code id="L3159"><span class="ln">3159</span> <b>case</b> <i>"oval"</i>:
</code><code id="L3160"><span class="ln">3160</span> <b>case</b> <i>"diamond"</i>:
</code><code id="L3161"><span class="ln">3161</span> <b>case</b> <i>"open"</i>:
</code><code id="L3162"><span class="ln">3162</span> <b>case</b> <i>"none"</i>:
</code><code id="L3163"><span class="ln">3163</span> type<span class="s"> = </span>values[i];
</code><code id="L3164"><span class="ln">3164</span> <b>break</b>;
</code><code id="L3165"><span class="ln">3165</span> <b>case</b> <i>"wide"</i>:
</code><code id="L3166"><span class="ln">3166</span> <b>case</b> <i>"narrow"</i>: h<span class="s"> = </span>values[i]; <b>break</b>;
</code><code id="L3167"><span class="ln">3167</span> <b>case</b> <i>"<b>long</b>"</i>:
</code><code id="L3168"><span class="ln">3168</span> <b>case</b> <i>"<b>short</b>"</i>: w<span class="s"> = </span>values[i]; <b>break</b>;
</code><code id="L3169"><span class="ln">3169</span> }
</code><code id="L3170"><span class="ln">3170</span> }
</code><code id="L3171"><span class="ln">3171</span> <b>var</b> stroke<span class="s"> = </span>o.node.getElementsByTagName(<i>"stroke"</i>)[<span class="d">0</span>];
</code><code id="L3172"><span class="ln">3172</span> stroke[se<span class="s"> + </span><i>"arrow"</i>]<span class="s"> = </span>type;
</code><code id="L3173"><span class="ln">3173</span> stroke[se<span class="s"> + </span><i>"arrowlength"</i>]<span class="s"> = </span>w;
</code><code id="L3174"><span class="ln">3174</span> stroke[se<span class="s"> + </span><i>"arrowwidth"</i>]<span class="s"> = </span>h;
</code><code id="L3175"><span class="ln">3175</span> };
</code><code id="L3176"><span class="ln">3176</span> setFillAndStroke<span class="s"> = </span><b>function</b> (o, params) {
</code><code id="L3177"><span class="ln">3177</span> o.paper.canvas.style.display<span class="s"> = </span><i>"none"</i>;
</code><code id="L3178"><span class="ln">3178</span> o.attrs<span class="s"> = </span>o.attrs<span class="s"> || </span>{};
</code><code id="L3179"><span class="ln">3179</span> <b>var</b> node<span class="s"> = </span>o.node,
</code><code id="L3180"><span class="ln">3180</span> a<span class="s"> = </span>o.attrs,
</code><code id="L3181"><span class="ln">3181</span> s<span class="s"> = </span>node.style,
</code><code id="L3182"><span class="ln">3182</span> xy,
</code><code id="L3183"><span class="ln">3183</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="L3184"><span class="ln">3184</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="L3185"><span class="ln">3185</span> res<span class="s"> = </span>o;
</code><code id="L3186"><span class="ln">3186</span>
</code><code id="L3187"><span class="ln">3187</span>
</code><code id="L3188"><span class="ln">3188</span> <b>for</b> (<b>var</b> par <b>in</b> params) <b>if</b> (params[has](par)) {
</code><code id="L3189"><span class="ln">3189</span> a[par]<span class="s"> = </span>params[par];
</code><code id="L3190"><span class="ln">3190</span> }
</code><code id="L3191"><span class="ln">3191</span> <b>if</b> (newpath) {
</code><code id="L3192"><span class="ln">3192</span> a.path<span class="s"> = </span>getPath[o.type](o);
</code><code id="L3193"><span class="ln">3193</span> o._.dirty<span class="s"> = </span><span class="d">1</span>;
</code><code id="L3194"><span class="ln">3194</span> }
</code><code id="L3195"><span class="ln">3195</span> params.href<span class="s"> &amp;&amp; </span>(node.href<span class="s"> = </span>params.href);
</code><code id="L3196"><span class="ln">3196</span> params.title<span class="s"> &amp;&amp; </span>(node.title<span class="s"> = </span>params.title);
</code><code id="L3197"><span class="ln">3197</span> params.target<span class="s"> &amp;&amp; </span>(node.target<span class="s"> = </span>params.target);
</code><code id="L3198"><span class="ln">3198</span> params.cursor<span class="s"> &amp;&amp; </span>(s.cursor<span class="s"> = </span>params.cursor);
</code><code id="L3199"><span class="ln">3199</span> <i>"blur"</i> <b>in</b> params<span class="s"> &amp;&amp; </span>o.blur(params.blur);
</code><code id="L3200"><span class="ln">3200</span> <i>"transform"</i> <b>in</b> params<span class="s"> &amp;&amp; </span>o.transform(params.transform);
</code><code id="L3201"><span class="ln">3201</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="L3202"><span class="ln">3202</span> node.path<span class="s"> = </span>path2vml(a.path);
</code><code id="L3203"><span class="ln">3203</span> }
</code><code id="L3204"><span class="ln">3204</span> <b>if</b> (isOval) {
</code><code id="L3205"><span class="ln">3205</span> <b>var</b> cx<span class="s"> = </span>a.cx,
</code><code id="L3206"><span class="ln">3206</span> cy<span class="s"> = </span>a.cy,
</code><code id="L3207"><span class="ln">3207</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="L3208"><span class="ln">3208</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="L3209"><span class="ln">3209</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="L3210"><span class="ln">3210</span> }
</code><code id="L3211"><span class="ln">3211</span> <b>if</b> (<i>"clip-rect"</i> <b>in</b> params) {
</code><code id="L3212"><span class="ln">3212</span> <b>var</b> rect<span class="s"> = </span>Str(params[<i>"clip-rect"</i>]).split(separator);
</code><code id="L3213"><span class="ln">3213</span> <b>if</b> (rect.length<span class="s"> == </span><span class="d">4</span>) {
</code><code id="L3214"><span class="ln">3214</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="L3215"><span class="ln">3215</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="L3216"><span class="ln">3216</span> <b>var</b> div<span class="s"> = </span>node.clipRect<span class="s"> || </span>g.doc.createElement(<i>"div"</i>),
</code><code id="L3217"><span class="ln">3217</span> dstyle<span class="s"> = </span>div.style,
</code><code id="L3218"><span class="ln">3218</span> group<span class="s"> = </span>node.parentNode;
</code><code id="L3219"><span class="ln">3219</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="L3220"><span class="ln">3220</span> <b>if</b> (!node.clipRect) {
</code><code id="L3221"><span class="ln">3221</span> dstyle.position<span class="s"> = </span><i>"absolute"</i>;
</code><code id="L3222"><span class="ln">3222</span> dstyle.top<span class="s"> = </span><span class="d">0</span>;
</code><code id="L3223"><span class="ln">3223</span> dstyle.left<span class="s"> = </span><span class="d">0</span>;
</code><code id="L3224"><span class="ln">3224</span> dstyle.width<span class="s"> = </span>o.paper.width<span class="s"> + </span><i>"px"</i>;
</code><code id="L3225"><span class="ln">3225</span> dstyle.height<span class="s"> = </span>o.paper.height<span class="s"> + </span><i>"px"</i>;
</code><code id="L3226"><span class="ln">3226</span> group.parentNode.insertBefore(div, group);
</code><code id="L3227"><span class="ln">3227</span> div.appendChild(group);
</code><code id="L3228"><span class="ln">3228</span> node.clipRect<span class="s"> = </span>div;
</code><code id="L3229"><span class="ln">3229</span> }
</code><code id="L3230"><span class="ln">3230</span> }
</code><code id="L3231"><span class="ln">3231</span> <b>if</b> (!params[<i>"clip-rect"</i>]) {
</code><code id="L3232"><span class="ln">3232</span> node.clipRect<span class="s"> &amp;&amp; </span>(node.clipRect.style.clip<span class="s"> = </span>E);
</code><code id="L3233"><span class="ln">3233</span> }
</code><code id="L3234"><span class="ln">3234</span> }
</code><code id="L3235"><span class="ln">3235</span> <b>if</b> (o.textpath) {
</code><code id="L3236"><span class="ln">3236</span> <b>var</b> textpathStyle<span class="s"> = </span>o.textpath.style;
</code><code id="L3237"><span class="ln">3237</span> params.font<span class="s"> &amp;&amp; </span>(textpathStyle.font<span class="s"> = </span>params.font);
</code><code id="L3238"><span class="ln">3238</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="L3239"><span class="ln">3239</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="L3240"><span class="ln">3240</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="L3241"><span class="ln">3241</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="L3242"><span class="ln">3242</span> }
</code><code id="L3243"><span class="ln">3243</span> <b>if</b> (<i>"arrow-start"</i> <b>in</b> params) {
</code><code id="L3244"><span class="ln">3244</span> addArrow(res, params[<i>"arrow-start"</i>]);
</code><code id="L3245"><span class="ln">3245</span> }
</code><code id="L3246"><span class="ln">3246</span> <b>if</b> (<i>"arrow-end"</i> <b>in</b> params) {
</code><code id="L3247"><span class="ln">3247</span> addArrow(res, params[<i>"arrow-end"</i>], <span class="d">1</span>);
</code><code id="L3248"><span class="ln">3248</span> }
</code><code id="L3249"><span class="ln">3249</span> <b>if</b> (params.opacity != <b>null</b><span class="s"> || </span>
</code><code id="L3250"><span class="ln">3250</span> params[<i>"stroke-width"</i>] != <b>null</b> ||
</code><code id="L3251"><span class="ln">3251</span> params.fill != <b>null</b> ||
</code><code id="L3252"><span class="ln">3252</span> params.src != <b>null</b> ||
</code><code id="L3253"><span class="ln">3253</span> params.stroke != <b>null</b> ||
</code><code id="L3254"><span class="ln">3254</span> params[<i>"stroke-width"</i>] != <b>null</b> ||
</code><code id="L3255"><span class="ln">3255</span> params[<i>"stroke-opacity"</i>] != <b>null</b> ||
</code><code id="L3256"><span class="ln">3256</span> params[<i>"fill-opacity"</i>] != <b>null</b> ||
</code><code id="L3257"><span class="ln">3257</span> params[<i>"stroke-dasharray"</i>] != <b>null</b> ||
</code><code id="L3258"><span class="ln">3258</span> params[<i>"stroke-miterlimit"</i>] != <b>null</b> ||
</code><code id="L3259"><span class="ln">3259</span> params[<i>"stroke-linejoin"</i>] != <b>null</b> ||
</code><code id="L3260"><span class="ln">3260</span> params[<i>"stroke-linecap"</i>] != <b>null</b>) {
</code><code id="L3261"><span class="ln">3261</span> <b>var</b> fill<span class="s"> = </span>node.getElementsByTagName(fillString),
</code><code id="L3262"><span class="ln">3262</span> newfill<span class="s"> = </span><b>false</b>;
</code><code id="L3263"><span class="ln">3263</span> fill<span class="s"> = </span>fill<span class="s"> &amp;&amp; </span>fill[<span class="d">0</span>];
</code><code id="L3264"><span class="ln">3264</span> !fill<span class="s"> &amp;&amp; </span>(newfill<span class="s"> = </span>fill<span class="s"> = </span>createNode(fillString));
</code><code id="L3265"><span class="ln">3265</span> <b>if</b> (o.type<span class="s"> == </span><i>"image"</i><span class="s"> &amp;&amp; </span>params.src) {
</code><code id="L3266"><span class="ln">3266</span> fill.src<span class="s"> = </span>params.src;
</code><code id="L3267"><span class="ln">3267</span> }
</code><code id="L3268"><span class="ln">3268</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="L3269"><span class="ln">3269</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="L3270"><span class="ln">3270</span> opacity<span class="s"> = </span>mmin(mmax(opacity, <span class="d">0</span>), <span class="d">1</span>);
</code><code id="L3271"><span class="ln">3271</span> fill.opacity<span class="s"> = </span>opacity;
</code><code id="L3272"><span class="ln">3272</span> }
</code><code id="L3273"><span class="ln">3273</span> params.fill<span class="s"> &amp;&amp; </span>(fill.on<span class="s"> = </span><b>true</b>);
</code><code id="L3274"><span class="ln">3274</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="L3275"><span class="ln">3275</span> fill.on<span class="s"> = </span><b>false</b>;
</code><code id="L3276"><span class="ln">3276</span> }
</code><code id="L3277"><span class="ln">3277</span> <b>if</b> (fill.on<span class="s"> &amp;&amp; </span>params.fill) {
</code><code id="L3278"><span class="ln">3278</span> <b>var</b> isURL<span class="s"> = </span>params.fill.match(ISURL);
</code><code id="L3279"><span class="ln">3279</span> <b>if</b> (isURL) {
</code><code id="L3280"><span class="ln">3280</span> fill.parentNode<span class="s"> == </span>node<span class="s"> &amp;&amp; </span>node.removeChild(fill);
</code><code id="L3281"><span class="ln">3281</span> fill.rotate<span class="s"> = </span><b>true</b>;
</code><code id="L3282"><span class="ln">3282</span> fill.src<span class="s"> = </span>isURL[<span class="d">1</span>];
</code><code id="L3283"><span class="ln">3283</span> fill.type<span class="s"> = </span><i>"tile"</i>;
</code><code id="L3284"><span class="ln">3284</span> <b>var</b> bbox<span class="s"> = </span>o.getBBox(<span class="d">1</span>);
</code><code id="L3285"><span class="ln">3285</span> fill.position<span class="s"> = </span>bbox.x<span class="s"> + </span>S<span class="s"> + </span>bbox.y;
</code><code id="L3286"><span class="ln">3286</span> o._.fillpos<span class="s"> = </span>[bbox.x, bbox.y];
</code><code id="L3287"><span class="ln">3287</span>
</code><code id="L3288"><span class="ln">3288</span> preload(isURL[<span class="d">1</span>], <b>function</b> () {
</code><code id="L3289"><span class="ln">3289</span> o._.fillsize<span class="s"> = </span>[<b>this</b>.offsetWidth, <b>this</b>.offsetHeight];
</code><code id="L3290"><span class="ln">3290</span> });
</code><code id="L3291"><span class="ln">3291</span> } <b>else</b> {
</code><code id="L3292"><span class="ln">3292</span> fill.color<span class="s"> = </span>R.getRGB(params.fill).hex;
</code><code id="L3293"><span class="ln">3293</span> fill.src<span class="s"> = </span>E;
</code><code id="L3294"><span class="ln">3294</span> fill.type<span class="s"> = </span><i>"solid"</i>;
</code><code id="L3295"><span class="ln">3295</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="L3296"><span class="ln">3296</span> a.fill<span class="s"> = </span><i>"none"</i>;
</code><code id="L3297"><span class="ln">3297</span> a.gradient<span class="s"> = </span>params.fill;
</code><code id="L3298"><span class="ln">3298</span> fill.rotate<span class="s"> = </span><b>false</b>;
</code><code id="L3299"><span class="ln">3299</span> }
</code><code id="L3300"><span class="ln">3300</span> }
</code><code id="L3301"><span class="ln">3301</span> }
</code><code id="L3302"><span class="ln">3302</span> node.appendChild(fill);
</code><code id="L3303"><span class="ln">3303</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="L3304"><span class="ln">3304</span> newstroke<span class="s"> = </span><b>false</b>;
</code><code id="L3305"><span class="ln">3305</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="L3306"><span class="ln">3306</span> <b>if</b> ((params.stroke<span class="s"> &amp;&amp; </span>params.stroke != <i>"none"</i>) ||
</code><code id="L3307"><span class="ln">3307</span> params[<i>"stroke-width"</i>] ||
</code><code id="L3308"><span class="ln">3308</span> params[<i>"stroke-opacity"</i>] != <b>null</b> ||
</code><code id="L3309"><span class="ln">3309</span> params[<i>"stroke-dasharray"</i>] ||
</code><code id="L3310"><span class="ln">3310</span> params[<i>"stroke-miterlimit"</i>] ||
</code><code id="L3311"><span class="ln">3311</span> params[<i>"stroke-linejoin"</i>] ||
</code><code id="L3312"><span class="ln">3312</span> params[<i>"stroke-linecap"</i>]) {
</code><code id="L3313"><span class="ln">3313</span> stroke.on<span class="s"> = </span><b>true</b>;
</code><code id="L3314"><span class="ln">3314</span> }
</code><code id="L3315"><span class="ln">3315</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="L3316"><span class="ln">3316</span> <b>var</b> strokeColor<span class="s"> = </span>R.getRGB(params.stroke);
</code><code id="L3317"><span class="ln">3317</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="L3318"><span class="ln">3318</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="L3319"><span class="ln">3319</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="L3320"><span class="ln">3320</span> opacity<span class="s"> = </span>mmin(mmax(opacity, <span class="d">0</span>), <span class="d">1</span>);
</code><code id="L3321"><span class="ln">3321</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="L3322"><span class="ln">3322</span> params[<i>"stroke-width"</i>]<span class="s"> &amp;&amp; </span>(stroke.weight<span class="s"> = </span>width);
</code><code id="L3323"><span class="ln">3323</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="L3324"><span class="ln">3324</span> stroke.opacity<span class="s"> = </span>opacity;
</code><code id="L3325"><span class="ln">3325</span>
</code><code id="L3326"><span class="ln">3326</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="L3327"><span class="ln">3327</span> stroke.miterlimit<span class="s"> = </span>params[<i>"stroke-miterlimit"</i>]<span class="s"> || </span><span class="d">8</span>;
</code><code id="L3328"><span class="ln">3328</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="L3329"><span class="ln">3329</span> <b>if</b> (params[<i>"stroke-dasharray"</i>]) {
</code><code id="L3330"><span class="ln">3330</span> <b>var</b> dasharray<span class="s"> = </span>{
</code><code id="L3331"><span class="ln">3331</span> <i>"-"</i>: <i>"shortdash"</i>,
</code><code id="L3332"><span class="ln">3332</span> <i>"."</i>: <i>"shortdot"</i>,
</code><code id="L3333"><span class="ln">3333</span> <i>"-."</i>: <i>"shortdashdot"</i>,
</code><code id="L3334"><span class="ln">3334</span> <i>"-.."</i>: <i>"shortdashdotdot"</i>,
</code><code id="L3335"><span class="ln">3335</span> <i>". "</i>: <i>"dot"</i>,
</code><code id="L3336"><span class="ln">3336</span> <i>"- "</i>: <i>"dash"</i>,
</code><code id="L3337"><span class="ln">3337</span> <i>"--"</i>: <i>"longdash"</i>,
</code><code id="L3338"><span class="ln">3338</span> <i>"- ."</i>: <i>"dashdot"</i>,
</code><code id="L3339"><span class="ln">3339</span> <i>"--."</i>: <i>"longdashdot"</i>,
</code><code id="L3340"><span class="ln">3340</span> <i>"--.."</i>: <i>"longdashdotdot"</i>
</code><code id="L3341"><span class="ln">3341</span> };
</code><code id="L3342"><span class="ln">3342</span> stroke.dashstyle<span class="s"> = </span>dasharray[has](params[<i>"stroke-dasharray"</i>]) ? dasharray[params[<i>"stroke-dasharray"</i>]] : E;
</code><code id="L3343"><span class="ln">3343</span> }
</code><code id="L3344"><span class="ln">3344</span> newstroke<span class="s"> &amp;&amp; </span>node.appendChild(stroke);
</code><code id="L3345"><span class="ln">3345</span> }
</code><code id="L3346"><span class="ln">3346</span> <b>if</b> (res.type<span class="s"> == </span><i>"text"</i>) {
</code><code id="L3347"><span class="ln">3347</span> res.paper.canvas.style.display<span class="s"> = </span>E;
</code><code id="L3348"><span class="ln">3348</span> <b>var</b> span<span class="s"> = </span>res.paper.span,
</code><code id="L3349"><span class="ln">3349</span> m<span class="s"> = </span><span class="d">100</span>,
</code><code id="L3350"><span class="ln">3350</span> fontSize<span class="s"> = </span>a.font<span class="s"> &amp;&amp; </span>a.font.match(/\d+(?:\.\d*)?(?=px)/);
</code><code id="L3351"><span class="ln">3351</span> s<span class="s"> = </span>span.style;
</code><code id="L3352"><span class="ln">3352</span> a.font<span class="s"> &amp;&amp; </span>(s.font<span class="s"> = </span>a.font);
</code><code id="L3353"><span class="ln">3353</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="L3354"><span class="ln">3354</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="L3355"><span class="ln">3355</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="L3356"><span class="ln">3356</span> fontSize<span class="s"> = </span>toFloat(fontSize ? fontSize[<span class="d">0</span>] : a[<i>"font-size"</i>]);
</code><code id="L3357"><span class="ln">3357</span> s.fontSize<span class="s"> = </span>fontSize<span class="s"> * </span>m<span class="s"> + </span><i>"px"</i>;
</code><code id="L3358"><span class="ln">3358</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="L3359"><span class="ln">3359</span> <b>var</b> brect<span class="s"> = </span>span.getBoundingClientRect();
</code><code id="L3360"><span class="ln">3360</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="L3361"><span class="ln">3361</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="L3362"><span class="ln">3362</span> res.paper.canvas.style.display<span class="s"> = </span><i>"none"</i>;
</code><code id="L3363"><span class="ln">3363</span> res.X<span class="s"> = </span>a.x;
</code><code id="L3364"><span class="ln">3364</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="L3365"><span class="ln">3365</span>
</code><code id="L3366"><span class="ln">3366</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="L3367"><span class="ln">3367</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="L3368"><span class="ln">3368</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="L3369"><span class="ln">3369</span> res._.dirty<span class="s"> = </span><span class="d">1</span>;
</code><code id="L3370"><span class="ln">3370</span> <b>break</b>;
</code><code id="L3371"><span class="ln">3371</span> }
</code><code id="L3372"><span class="ln">3372</span>
</code><code id="L3373"><span class="ln">3373</span> <span class="c">// text-anchor emulation</span>
</code><code id="L3374"><span class="ln">3374</span> <b>switch</b> (a[<i>"text-anchor"</i>]) {
</code><code id="L3375"><span class="ln">3375</span> <b>case</b> <i>"start"</i>:
</code><code id="L3376"><span class="ln">3376</span> res.textpath.style[<i>"v-text-align"</i>]<span class="s"> = </span><i>"left"</i>;
</code><code id="L3377"><span class="ln">3377</span> res.bbx<span class="s"> = </span>res.W<span class="s"> / </span><span class="d">2</span>;
</code><code id="L3378"><span class="ln">3378</span> <b>break</b>;
</code><code id="L3379"><span class="ln">3379</span> <b>case</b> <i>"end"</i>:
</code><code id="L3380"><span class="ln">3380</span> res.textpath.style[<i>"v-text-align"</i>]<span class="s"> = </span><i>"right"</i>;
</code><code id="L3381"><span class="ln">3381</span> res.bbx<span class="s"> = </span>-res.W<span class="s"> / </span><span class="d">2</span>;
</code><code id="L3382"><span class="ln">3382</span> <b>break</b>;
</code><code id="L3383"><span class="ln">3383</span> <b>default</b>:
</code><code id="L3384"><span class="ln">3384</span> res.textpath.style[<i>"v-text-align"</i>]<span class="s"> = </span><i>"center"</i>;
</code><code id="L3385"><span class="ln">3385</span> res.bbx<span class="s"> = </span><span class="d">0</span>;
</code><code id="L3386"><span class="ln">3386</span> <b>break</b>;
</code><code id="L3387"><span class="ln">3387</span> }
</code><code id="L3388"><span class="ln">3388</span> res.textpath.style[<i>"v-text-kern"</i>]<span class="s"> = </span><b>true</b>;
</code><code id="L3389"><span class="ln">3389</span> }
</code><code id="L3390"><span class="ln">3390</span> res.paper.canvas.style.display<span class="s"> = </span>E;
</code><code id="L3391"><span class="ln">3391</span> };
</code><code id="L3392"><span class="ln">3392</span> addGradientFill<span class="s"> = </span><b>function</b> (o, gradient, fill) {
</code><code id="L3393"><span class="ln">3393</span> o.attrs<span class="s"> = </span>o.attrs<span class="s"> || </span>{};
</code><code id="L3394"><span class="ln">3394</span> <b>var</b> attrs<span class="s"> = </span>o.attrs,
</code><code id="L3395"><span class="ln">3395</span> type<span class="s"> = </span><i>"linear"</i>,
</code><code id="L3396"><span class="ln">3396</span> fxfy<span class="s"> = </span><i>"<span class="d">.5</span> <span class="d">.5</span>"</i>;
</code><code id="L3397"><span class="ln">3397</span> o.attrs.gradient<span class="s"> = </span>gradient;
</code><code id="L3398"><span class="ln">3398</span> gradient<span class="s"> = </span>Str(gradient).replace(radial_gradient, <b>function</b> (all, fx, fy) {
</code><code id="L3399"><span class="ln">3399</span> type<span class="s"> = </span><i>"radial"</i>;
</code><code id="L3400"><span class="ln">3400</span> <b>if</b> (fx<span class="s"> &amp;&amp; </span>fy) {
</code><code id="L3401"><span class="ln">3401</span> fx<span class="s"> = </span>toFloat(fx);
</code><code id="L3402"><span class="ln">3402</span> fy<span class="s"> = </span>toFloat(fy);
</code><code id="L3403"><span class="ln">3403</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="L3404"><span class="ln">3404</span> fxfy<span class="s"> = </span>fx<span class="s"> + </span>S<span class="s"> + </span>fy;
</code><code id="L3405"><span class="ln">3405</span> }
</code><code id="L3406"><span class="ln">3406</span> <b>return</b> E;
</code><code id="L3407"><span class="ln">3407</span> });
</code><code id="L3408"><span class="ln">3408</span> gradient<span class="s"> = </span>gradient.split(/\s*\-\s*/);
</code><code id="L3409"><span class="ln">3409</span> <b>if</b> (type<span class="s"> == </span><i>"linear"</i>) {
</code><code id="L3410"><span class="ln">3410</span> <b>var</b> angle<span class="s"> = </span>gradient.shift();
</code><code id="L3411"><span class="ln">3411</span> angle<span class="s"> = </span>-toFloat(angle);
</code><code id="L3412"><span class="ln">3412</span> <b>if</b> (isNaN(angle)) {
</code><code id="L3413"><span class="ln">3413</span> <b>return</b> <b>null</b>;
</code><code id="L3414"><span class="ln">3414</span> }
</code><code id="L3415"><span class="ln">3415</span> }
</code><code id="L3416"><span class="ln">3416</span> <b>var</b> dots<span class="s"> = </span>parseDots(gradient);
</code><code id="L3417"><span class="ln">3417</span> <b>if</b> (!dots) {
</code><code id="L3418"><span class="ln">3418</span> <b>return</b> <b>null</b>;
</code><code id="L3419"><span class="ln">3419</span> }
</code><code id="L3420"><span class="ln">3420</span> o<span class="s"> = </span>o.shape<span class="s"> || </span>o.node;
</code><code id="L3421"><span class="ln">3421</span> <b>if</b> (dots.length) {
</code><code id="L3422"><span class="ln">3422</span> o.removeChild(fill);
</code><code id="L3423"><span class="ln">3423</span> fill.on<span class="s"> = </span><b>true</b>;
</code><code id="L3424"><span class="ln">3424</span> fill.method<span class="s"> = </span><i>"none"</i>;
</code><code id="L3425"><span class="ln">3425</span> fill.color<span class="s"> = </span>dots[<span class="d">0</span>].color;
</code><code id="L3426"><span class="ln">3426</span> fill.color2<span class="s"> = </span>dots[dots.length<span class="s"> - </span><span class="d">1</span>].color;
</code><code id="L3427"><span class="ln">3427</span> <b>var</b> clrs<span class="s"> = </span>[];
</code><code id="L3428"><span class="ln">3428</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="L3429"><span class="ln">3429</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="L3430"><span class="ln">3430</span> }
</code><code id="L3431"><span class="ln">3431</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="L3432"><span class="ln">3432</span> <b>if</b> (type<span class="s"> == </span><i>"radial"</i>) {
</code><code id="L3433"><span class="ln">3433</span> fill.type<span class="s"> = </span><i>"gradientTitle"</i>;
</code><code id="L3434"><span class="ln">3434</span> fill.focus<span class="s"> = </span><i>"<span class="d">100</span>%"</i>;
</code><code id="L3435"><span class="ln">3435</span> fill.focussize<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span>"</i>;
</code><code id="L3436"><span class="ln">3436</span> fill.focusposition<span class="s"> = </span>fxfy;
</code><code id="L3437"><span class="ln">3437</span> fill.angle<span class="s"> = </span><span class="d">0</span>;
</code><code id="L3438"><span class="ln">3438</span> } <b>else</b> {
</code><code id="L3439"><span class="ln">3439</span> <span class="c">// fill.rotate= <b>true</b>;</span>
</code><code id="L3440"><span class="ln">3440</span> fill.type<span class="s"> = </span><i>"gradient"</i>;
</code><code id="L3441"><span class="ln">3441</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="L3442"><span class="ln">3442</span> }
</code><code id="L3443"><span class="ln">3443</span> o.appendChild(fill);
</code><code id="L3444"><span class="ln">3444</span> <span class="c">// alert(fill.outerHTML);</span>
</code><code id="L3445"><span class="ln">3445</span> }
</code><code id="L3446"><span class="ln">3446</span> <b>return</b> <span class="d">1</span>;
</code><code id="L3447"><span class="ln">3447</span> };
</code><code id="L3448"><span class="ln">3448</span> Element<span class="s"> = </span><b>function</b> (node, vml) {
</code><code id="L3449"><span class="ln">3449</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="L3450"><span class="ln">3450</span> node.raphael<span class="s"> = </span><b>true</b>;
</code><code id="L3451"><span class="ln">3451</span> <b>this</b>.id<span class="s"> = </span>R._oid++;
</code><code id="L3452"><span class="ln">3452</span> node.raphaelid<span class="s"> = </span><b>this</b>.id;
</code><code id="L3453"><span class="ln">3453</span> <b>this</b>.X<span class="s"> = </span><span class="d">0</span>;
</code><code id="L3454"><span class="ln">3454</span> <b>this</b>.Y<span class="s"> = </span><span class="d">0</span>;
</code><code id="L3455"><span class="ln">3455</span> <b>this</b>.attrs<span class="s"> = </span>{};
</code><code id="L3456"><span class="ln">3456</span> <b>this</b>.paper<span class="s"> = </span>vml;
</code><code id="L3457"><span class="ln">3457</span> <b>this</b>.matrix<span class="s"> = </span><b>new</b> Matrix;
</code><code id="L3458"><span class="ln">3458</span> <b>this</b>._<span class="s"> = </span>{
</code><code id="L3459"><span class="ln">3459</span> transform: [],
</code><code id="L3460"><span class="ln">3460</span> sx: <span class="d">1</span>,
</code><code id="L3461"><span class="ln">3461</span> sy: <span class="d">1</span>,
</code><code id="L3462"><span class="ln">3462</span> dx: <span class="d">0</span>,
</code><code id="L3463"><span class="ln">3463</span> dy: <span class="d">0</span>,
</code><code id="L3464"><span class="ln">3464</span> deg: <span class="d">0</span>,
</code><code id="L3465"><span class="ln">3465</span> dirty: <span class="d">1</span>,
</code><code id="L3466"><span class="ln">3466</span> dirtyT: <span class="d">1</span>
</code><code id="L3467"><span class="ln">3467</span> };
</code><code id="L3468"><span class="ln">3468</span> !vml.bottom<span class="s"> &amp;&amp; </span>(vml.bottom<span class="s"> = </span><b>this</b>);
</code><code id="L3469"><span class="ln">3469</span> <b>this</b>.prev<span class="s"> = </span>vml.top;
</code><code id="L3470"><span class="ln">3470</span> vml.top<span class="s"> &amp;&amp; </span>(vml.top.next<span class="s"> = </span><b>this</b>);
</code><code id="L3471"><span class="ln">3471</span> vml.top<span class="s"> = </span><b>this</b>;
</code><code id="L3472"><span class="ln">3472</span> <b>this</b>.next<span class="s"> = </span><b>null</b>;
</code><code id="L3473"><span class="ln">3473</span> };
</code><code id="L3474"><span class="ln">3474</span> elproto<span class="s"> = </span>Element.prototype;
</code><code id="L3475"><span class="ln">3475</span> elproto.transform<span class="s"> = </span><b>function</b> (tstr) {
</code><code id="L3476"><span class="ln">3476</span> <b>if</b> (tstr<span class="s"> == </span><b>null</b>) {
</code><code id="L3477"><span class="ln">3477</span> <b>return</b> <b>this</b>._.transform;
</code><code id="L3478"><span class="ln">3478</span> }
</code><code id="L3479"><span class="ln">3479</span> extractTransform(<b>this</b>, tstr);
</code><code id="L3480"><span class="ln">3480</span> <b>var</b> matrix<span class="s"> = </span><b>this</b>.matrix.clone(),
</code><code id="L3481"><span class="ln">3481</span> skew<span class="s"> = </span><b>this</b>.skew;
</code><code id="L3482"><span class="ln">3482</span> matrix.translate(-<span class="d">.5</span>, -<span class="d">.5</span>);
</code><code id="L3483"><span class="ln">3483</span> <b>if</b> (<b>this</b>.type<span class="s"> == </span><i>"image"</i>) {
</code><code id="L3484"><span class="ln">3484</span> <b>if</b> (Str(tstr).indexOf(<i>"m"</i>)<span class="s"> + </span><span class="d">1</span>) {
</code><code id="L3485"><span class="ln">3485</span> <b>this</b>.node.style.filter<span class="s"> = </span>matrix.toFilter();
</code><code id="L3486"><span class="ln">3486</span> <b>var</b> bb<span class="s"> = </span><b>this</b>.getBBox(),
</code><code id="L3487"><span class="ln">3487</span> bbt<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>),
</code><code id="L3488"><span class="ln">3488</span> im<span class="s"> = </span>matrix.invert(),
</code><code id="L3489"><span class="ln">3489</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="L3490"><span class="ln">3490</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="L3491"><span class="ln">3491</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="L3492"><span class="ln">3492</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="L3493"><span class="ln">3493</span> } <b>else</b> {
</code><code id="L3494"><span class="ln">3494</span> <b>this</b>.node.style.filter<span class="s"> = </span>E;
</code><code id="L3495"><span class="ln">3495</span> setCoords(<b>this</b>);
</code><code id="L3496"><span class="ln">3496</span> }
</code><code id="L3497"><span class="ln">3497</span> } <b>else</b> {
</code><code id="L3498"><span class="ln">3498</span> <span class="c">// o<span class="s"> = </span><b>this</b>.node,</span>
</code><code id="L3499"><span class="ln">3499</span> <span class="c">// _<span class="s"> = </span><b>this</b>._,</span>
</code><code id="L3500"><span class="ln">3500</span> <span class="c">// fillpos<span class="s"> = </span>_.fillpos,</span>
</code><code id="L3501"><span class="ln">3501</span> <span class="c">// deg,</span>
</code><code id="L3502"><span class="ln">3502</span> <span class="c">// matrix<span class="s"> = </span><b>this</b>.matrix;</span>
</code><code id="L3503"><span class="ln">3503</span> <span class="c">// fill<span class="s"> = </span>o.getElementsByTagName(fillString)[<span class="d">0</span>],</span>
</code><code id="L3504"><span class="ln">3504</span> <span class="c">// angle<span class="s"> = </span>fill.angle;</span>
</code><code id="L3505"><span class="ln">3505</span>
</code><code id="L3506"><span class="ln">3506</span> <b>this</b>.node.style.filter<span class="s"> = </span>E;
</code><code id="L3507"><span class="ln">3507</span> skew.matrix<span class="s"> = </span>matrix;
</code><code id="L3508"><span class="ln">3508</span> skew.offset<span class="s"> = </span>matrix.offset();
</code><code id="L3509"><span class="ln">3509</span>
</code><code id="L3510"><span class="ln">3510</span> <span class="c">// <b>if</b> (<span class="d">0</span>&amp;&amp;angle) {</span>
</code><code id="L3511"><span class="ln">3511</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="L3512"><span class="ln">3512</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="L3513"><span class="ln">3513</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="L3514"><span class="ln">3514</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="L3515"><span class="ln">3515</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="L3516"><span class="ln">3516</span> <span class="c">// mx<span class="s"> = </span>matrix.x(dx, dy),</span>
</code><code id="L3517"><span class="ln">3517</span> <span class="c">// my<span class="s"> = </span>matrix.y(dx, dy);</span>
</code><code id="L3518"><span class="ln">3518</span> <span class="c">// angle<span class="s"> = </span>R.angle(zx, zy, mx, my);</span>
</code><code id="L3519"><span class="ln">3519</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="L3520"><span class="ln">3520</span> <span class="c">// }</span>
</code><code id="L3521"><span class="ln">3521</span> }
</code><code id="L3522"><span class="ln">3522</span> <b>return</b> <b>this</b>;
</code><code id="L3523"><span class="ln">3523</span> };
</code><code id="L3524"><span class="ln">3524</span> elproto.rotate<span class="s"> = </span><b>function</b> (deg, cx, cy) {
</code><code id="L3525"><span class="ln">3525</span> <b>if</b> (<b>this</b>.removed) {
</code><code id="L3526"><span class="ln">3526</span> <b>return</b> <b>this</b>;
</code><code id="L3527"><span class="ln">3527</span> }
</code><code id="L3528"><span class="ln">3528</span> <b>if</b> (deg<span class="s"> == </span><b>null</b>) {
</code><code id="L3529"><span class="ln">3529</span> <b>return</b>;
</code><code id="L3530"><span class="ln">3530</span> }
</code><code id="L3531"><span class="ln">3531</span> deg<span class="s"> = </span>Str(deg).split(separator);
</code><code id="L3532"><span class="ln">3532</span> <b>if</b> (deg.length<span class="s"> - </span><span class="d">1</span>) {
</code><code id="L3533"><span class="ln">3533</span> cx<span class="s"> = </span>toFloat(deg[<span class="d">1</span>]);
</code><code id="L3534"><span class="ln">3534</span> cy<span class="s"> = </span>toFloat(deg[<span class="d">2</span>]);
</code><code id="L3535"><span class="ln">3535</span> }
</code><code id="L3536"><span class="ln">3536</span> deg<span class="s"> = </span>toFloat(deg[<span class="d">0</span>]);
</code><code id="L3537"><span class="ln">3537</span> (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
</code><code id="L3538"><span class="ln">3538</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="L3539"><span class="ln">3539</span> <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
</code><code id="L3540"><span class="ln">3540</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="L3541"><span class="ln">3541</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="L3542"><span class="ln">3542</span> }
</code><code id="L3543"><span class="ln">3543</span> <b>this</b>._.dirtyT<span class="s"> = </span><span class="d">1</span>;
</code><code id="L3544"><span class="ln">3544</span> <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"r"</i>, deg, cx, cy]]));
</code><code id="L3545"><span class="ln">3545</span> <b>return</b> <b>this</b>;
</code><code id="L3546"><span class="ln">3546</span> };
</code><code id="L3547"><span class="ln">3547</span> elproto.translate<span class="s"> = </span><b>function</b> (dx, dy) {
</code><code id="L3548"><span class="ln">3548</span> <b>if</b> (<b>this</b>.removed) {
</code><code id="L3549"><span class="ln">3549</span> <b>return</b> <b>this</b>;
</code><code id="L3550"><span class="ln">3550</span> }
</code><code id="L3551"><span class="ln">3551</span> dx<span class="s"> = </span>Str(dx).split(separator);
</code><code id="L3552"><span class="ln">3552</span> <b>if</b> (dx.length<span class="s"> - </span><span class="d">1</span>) {
</code><code id="L3553"><span class="ln">3553</span> dy<span class="s"> = </span>toFloat(dx[<span class="d">1</span>]);
</code><code id="L3554"><span class="ln">3554</span> }
</code><code id="L3555"><span class="ln">3555</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="L3556"><span class="ln">3556</span> dy<span class="s"> = </span>+dy<span class="s"> || </span><span class="d">0</span>;
</code><code id="L3557"><span class="ln">3557</span> <b>if</b> (<b>this</b>._.bbox) {
</code><code id="L3558"><span class="ln">3558</span> <b>this</b>._.bbox.x += dx;
</code><code id="L3559"><span class="ln">3559</span> <b>this</b>._.bbox.y += dy;
</code><code id="L3560"><span class="ln">3560</span> }
</code><code id="L3561"><span class="ln">3561</span> <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"t"</i>, dx, dy]]));
</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.scale<span class="s"> = </span><b>function</b> (sx, sy, cx, cy) {
</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> <b>this</b>;
</code><code id="L3567"><span class="ln">3567</span> }
</code><code id="L3568"><span class="ln">3568</span> sx<span class="s"> = </span>Str(sx).split(separator);
</code><code id="L3569"><span class="ln">3569</span> <b>if</b> (sx.length<span class="s"> - </span><span class="d">1</span>) {
</code><code id="L3570"><span class="ln">3570</span> sy<span class="s"> = </span>toFloat(sx[<span class="d">1</span>]);
</code><code id="L3571"><span class="ln">3571</span> cx<span class="s"> = </span>toFloat(sx[<span class="d">2</span>]);
</code><code id="L3572"><span class="ln">3572</span> cy<span class="s"> = </span>toFloat(sx[<span class="d">3</span>]);
</code><code id="L3573"><span class="ln">3573</span> isNaN(cx)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span><b>null</b>);
</code><code id="L3574"><span class="ln">3574</span> isNaN(cy)<span class="s"> &amp;&amp; </span>(cy<span class="s"> = </span><b>null</b>);
</code><code id="L3575"><span class="ln">3575</span> }
</code><code id="L3576"><span class="ln">3576</span> sx<span class="s"> = </span>toFloat(sx[<span class="d">0</span>]);
</code><code id="L3577"><span class="ln">3577</span> (sy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(sy<span class="s"> = </span>sx);
</code><code id="L3578"><span class="ln">3578</span> (cy<span class="s"> == </span><b>null</b>)<span class="s"> &amp;&amp; </span>(cx<span class="s"> = </span>cy);
</code><code id="L3579"><span class="ln">3579</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="L3580"><span class="ln">3580</span> <b>var</b> bbox<span class="s"> = </span><b>this</b>.getBBox(<span class="d">1</span>);
</code><code id="L3581"><span class="ln">3581</span> }
</code><code id="L3582"><span class="ln">3582</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="L3583"><span class="ln">3583</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="L3584"><span class="ln">3584</span>
</code><code id="L3585"><span class="ln">3585</span> <b>this</b>.transform(<b>this</b>._.transform.concat([[<i>"s"</i>, sx, sy, cx, cy]]));
</code><code id="L3586"><span class="ln">3586</span> <b>this</b>._.dirtyT<span class="s"> = </span><span class="d">1</span>;
</code><code id="L3587"><span class="ln">3587</span> <b>return</b> <b>this</b>;
</code><code id="L3588"><span class="ln">3588</span> };
</code><code id="L3589"><span class="ln">3589</span> elproto.hide<span class="s"> = </span><b>function</b> () {
</code><code id="L3590"><span class="ln">3590</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="L3591"><span class="ln">3591</span> <b>return</b> <b>this</b>;
</code><code id="L3592"><span class="ln">3592</span> };
</code><code id="L3593"><span class="ln">3593</span> elproto.show<span class="s"> = </span><b>function</b> () {
</code><code id="L3594"><span class="ln">3594</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="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> elproto._getBBox<span class="s"> = </span><b>function</b> () {
</code><code id="L3598"><span class="ln">3598</span> <b>if</b> (<b>this</b>.removed) {
</code><code id="L3599"><span class="ln">3599</span> <b>return</b> {};
</code><code id="L3600"><span class="ln">3600</span> }
</code><code id="L3601"><span class="ln">3601</span> <b>if</b> (<b>this</b>.type<span class="s"> == </span><i>"text"</i>) {
</code><code id="L3602"><span class="ln">3602</span> <b>return</b> {
</code><code id="L3603"><span class="ln">3603</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="L3604"><span class="ln">3604</span> y: <b>this</b>.Y<span class="s"> - </span><b>this</b>.H,
</code><code id="L3605"><span class="ln">3605</span> width: <b>this</b>.W,
</code><code id="L3606"><span class="ln">3606</span> height: <b>this</b>.H
</code><code id="L3607"><span class="ln">3607</span> };
</code><code id="L3608"><span class="ln">3608</span> } <b>else</b> {
</code><code id="L3609"><span class="ln">3609</span> <b>return</b> pathDimensions(<b>this</b>.attrs.path);
</code><code id="L3610"><span class="ln">3610</span> }
</code><code id="L3611"><span class="ln">3611</span> };
</code><code id="L3612"><span class="ln">3612</span> elproto.remove<span class="s"> = </span><b>function</b> () {
</code><code id="L3613"><span class="ln">3613</span> <b>if</b> (<b>this</b>.removed) {
</code><code id="L3614"><span class="ln">3614</span> <b>return</b>;
</code><code id="L3615"><span class="ln">3615</span> }
</code><code id="L3616"><span class="ln">3616</span> eve.unbind(<i>"*.*."</i><span class="s"> + </span><b>this</b>.id);
</code><code id="L3617"><span class="ln">3617</span> tear(<b>this</b>, <b>this</b>.paper);
</code><code id="L3618"><span class="ln">3618</span> <b>this</b>.node.parentNode.removeChild(<b>this</b>.node);
</code><code id="L3619"><span class="ln">3619</span> <b>this</b>.shape<span class="s"> &amp;&amp; </span><b>this</b>.shape.parentNode.removeChild(<b>this</b>.shape);
</code><code id="L3620"><span class="ln">3620</span> <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
</code><code id="L3621"><span class="ln">3621</span> <b>delete</b> <b>this</b>[i];
</code><code id="L3622"><span class="ln">3622</span> }
</code><code id="L3623"><span class="ln">3623</span> <b>this</b>.removed<span class="s"> = </span><b>true</b>;
</code><code id="L3624"><span class="ln">3624</span> };
</code><code id="L3625"><span class="ln">3625</span> elproto.attr<span class="s"> = </span><b>function</b> (name, value) {
</code><code id="L3626"><span class="ln">3626</span> <b>if</b> (<b>this</b>.removed) {
</code><code id="L3627"><span class="ln">3627</span> <b>return</b> <b>this</b>;
</code><code id="L3628"><span class="ln">3628</span> }
</code><code id="L3629"><span class="ln">3629</span> <b>if</b> (name<span class="s"> == </span><b>null</b>) {
</code><code id="L3630"><span class="ln">3630</span> <b>var</b> res<span class="s"> = </span>{};
</code><code id="L3631"><span class="ln">3631</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="L3632"><span class="ln">3632</span> res[i]<span class="s"> = </span><b>this</b>.attrs[i];
</code><code id="L3633"><span class="ln">3633</span> }
</code><code id="L3634"><span class="ln">3634</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="L3635"><span class="ln">3635</span> <b>return</b> res;
</code><code id="L3636"><span class="ln">3636</span> }
</code><code id="L3637"><span class="ln">3637</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="L3638"><span class="ln">3638</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="L3639"><span class="ln">3639</span> <b>return</b> <b>this</b>.attrs.gradient;
</code><code id="L3640"><span class="ln">3640</span> }
</code><code id="L3641"><span class="ln">3641</span> <b>if</b> (name <b>in</b> <b>this</b>.attrs) {
</code><code id="L3642"><span class="ln">3642</span> <b>return</b> <b>this</b>.attrs[name];
</code><code id="L3643"><span class="ln">3643</span> } <b>else</b> <b>if</b> (R.is(<b>this</b>.paper.customAttributes[name], <i>"<b>function</b>"</i>)) {
</code><code id="L3644"><span class="ln">3644</span> <b>return</b> <b>this</b>.paper.customAttributes[name].def;
</code><code id="L3645"><span class="ln">3645</span> } <b>else</b> {
</code><code id="L3646"><span class="ln">3646</span> <b>return</b> availableAttrs[name];
</code><code id="L3647"><span class="ln">3647</span> }
</code><code id="L3648"><span class="ln">3648</span> }
</code><code id="L3649"><span class="ln">3649</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="L3650"><span class="ln">3650</span> <b>var</b> ii, values<span class="s"> = </span>{};
</code><code id="L3651"><span class="ln">3651</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="L3652"><span class="ln">3652</span> values[name[i]]<span class="s"> = </span><b>this</b>.attr(name[i]);
</code><code id="L3653"><span class="ln">3653</span> }
</code><code id="L3654"><span class="ln">3654</span> <b>return</b> values;
</code><code id="L3655"><span class="ln">3655</span> }
</code><code id="L3656"><span class="ln">3656</span> <b>var</b> params;
</code><code id="L3657"><span class="ln">3657</span> <b>if</b> (value != <b>null</b>) {
</code><code id="L3658"><span class="ln">3658</span> params<span class="s"> = </span>{};
</code><code id="L3659"><span class="ln">3659</span> params[name]<span class="s"> = </span>value;
</code><code id="L3660"><span class="ln">3660</span> }
</code><code id="L3661"><span class="ln">3661</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="L3662"><span class="ln">3662</span> <b>for</b> (<b>var</b> key <b>in</b> params) {
</code><code id="L3663"><span class="ln">3663</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="L3664"><span class="ln">3664</span> }
</code><code id="L3665"><span class="ln">3665</span> <b>if</b> (params) {
</code><code id="L3666"><span class="ln">3666</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="L3667"><span class="ln">3667</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="L3668"><span class="ln">3668</span> <b>this</b>.attrs[key]<span class="s"> = </span>params[key];
</code><code id="L3669"><span class="ln">3669</span> <b>for</b> (<b>var</b> subkey <b>in</b> par) <b>if</b> (par[has](subkey)) {
</code><code id="L3670"><span class="ln">3670</span> params[subkey]<span class="s"> = </span>par[subkey];
</code><code id="L3671"><span class="ln">3671</span> }
</code><code id="L3672"><span class="ln">3672</span> }
</code><code id="L3673"><span class="ln">3673</span> <span class="c">// <b>this</b>.paper.canvas.style.display<span class="s"> = </span><i>"none"</i>;</span>
</code><code id="L3674"><span class="ln">3674</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="L3675"><span class="ln">3675</span> <b>this</b>.textpath.string<span class="s"> = </span>params.text;
</code><code id="L3676"><span class="ln">3676</span> }
</code><code id="L3677"><span class="ln">3677</span> setFillAndStroke(<b>this</b>, params);
</code><code id="L3678"><span class="ln">3678</span> <span class="c">// <b>this</b>.paper.canvas.style.display<span class="s"> = </span>E;</span>
</code><code id="L3679"><span class="ln">3679</span> }
</code><code id="L3680"><span class="ln">3680</span> <b>return</b> <b>this</b>;
</code><code id="L3681"><span class="ln">3681</span> };
</code><code id="L3682"><span class="ln">3682</span> elproto.toFront<span class="s"> = </span><b>function</b> () {
</code><code id="L3683"><span class="ln">3683</span> !<b>this</b>.removed<span class="s"> &amp;&amp; </span><b>this</b>.node.parentNode.appendChild(<b>this</b>.node);
</code><code id="L3684"><span class="ln">3684</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="L3685"><span class="ln">3685</span> <b>return</b> <b>this</b>;
</code><code id="L3686"><span class="ln">3686</span> };
</code><code id="L3687"><span class="ln">3687</span> elproto.toBack<span class="s"> = </span><b>function</b> () {
</code><code id="L3688"><span class="ln">3688</span> <b>if</b> (<b>this</b>.removed) {
</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> <b>if</b> (<b>this</b>.node.parentNode.firstChild != <b>this</b>.node) {
</code><code id="L3692"><span class="ln">3692</span> <b>this</b>.node.parentNode.insertBefore(<b>this</b>.node, <b>this</b>.node.parentNode.firstChild);
</code><code id="L3693"><span class="ln">3693</span> toback(<b>this</b>, <b>this</b>.paper);
</code><code id="L3694"><span class="ln">3694</span> }
</code><code id="L3695"><span class="ln">3695</span> <b>return</b> <b>this</b>;
</code><code id="L3696"><span class="ln">3696</span> };
</code><code id="L3697"><span class="ln">3697</span> elproto.insertAfter<span class="s"> = </span><b>function</b> (element) {
</code><code id="L3698"><span class="ln">3698</span> <b>if</b> (<b>this</b>.removed) {
</code><code id="L3699"><span class="ln">3699</span> <b>return</b> <b>this</b>;
</code><code id="L3700"><span class="ln">3700</span> }
</code><code id="L3701"><span class="ln">3701</span> <b>if</b> (element.constructor<span class="s"> == </span>Set) {
</code><code id="L3702"><span class="ln">3702</span> element<span class="s"> = </span>element[element.length<span class="s"> - </span><span class="d">1</span>];
</code><code id="L3703"><span class="ln">3703</span> }
</code><code id="L3704"><span class="ln">3704</span> <b>if</b> (element.node.nextSibling) {
</code><code id="L3705"><span class="ln">3705</span> element.node.parentNode.insertBefore(<b>this</b>.node, element.node.nextSibling);
</code><code id="L3706"><span class="ln">3706</span> } <b>else</b> {
</code><code id="L3707"><span class="ln">3707</span> element.node.parentNode.appendChild(<b>this</b>.node);
</code><code id="L3708"><span class="ln">3708</span> }
</code><code id="L3709"><span class="ln">3709</span> insertafter(<b>this</b>, element, <b>this</b>.paper);
</code><code id="L3710"><span class="ln">3710</span> <b>return</b> <b>this</b>;
</code><code id="L3711"><span class="ln">3711</span> };
</code><code id="L3712"><span class="ln">3712</span> elproto.insertBefore<span class="s"> = </span><b>function</b> (element) {
</code><code id="L3713"><span class="ln">3713</span> <b>if</b> (<b>this</b>.removed) {
</code><code id="L3714"><span class="ln">3714</span> <b>return</b> <b>this</b>;
</code><code id="L3715"><span class="ln">3715</span> }
</code><code id="L3716"><span class="ln">3716</span> <b>if</b> (element.constructor<span class="s"> == </span>Set) {
</code><code id="L3717"><span class="ln">3717</span> element<span class="s"> = </span>element[<span class="d">0</span>];
</code><code id="L3718"><span class="ln">3718</span> }
</code><code id="L3719"><span class="ln">3719</span> element.node.parentNode.insertBefore(<b>this</b>.node, element.node);
</code><code id="L3720"><span class="ln">3720</span> insertbefore(<b>this</b>, element, <b>this</b>.paper);
</code><code id="L3721"><span class="ln">3721</span> <b>return</b> <b>this</b>;
</code><code id="L3722"><span class="ln">3722</span> };
</code><code id="L3723"><span class="ln">3723</span> elproto.blur<span class="s"> = </span><b>function</b> (size) {
</code><code id="L3724"><span class="ln">3724</span> <b>var</b> s<span class="s"> = </span><b>this</b>.node.runtimeStyle,
</code><code id="L3725"><span class="ln">3725</span> f<span class="s"> = </span>s.filter;
</code><code id="L3726"><span class="ln">3726</span> f<span class="s"> = </span>f.replace(blurregexp, E);
</code><code id="L3727"><span class="ln">3727</span> <b>if</b> (+size !== <span class="d">0</span>) {
</code><code id="L3728"><span class="ln">3728</span> <b>this</b>.attrs.blur<span class="s"> = </span>size;
</code><code id="L3729"><span class="ln">3729</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="L3730"><span class="ln">3730</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="L3731"><span class="ln">3731</span> } <b>else</b> {
</code><code id="L3732"><span class="ln">3732</span> s.filter<span class="s"> = </span>f;
</code><code id="L3733"><span class="ln">3733</span> s.margin<span class="s"> = </span><span class="d">0</span>;
</code><code id="L3734"><span class="ln">3734</span> <b>delete</b> <b>this</b>.attrs.blur;
</code><code id="L3735"><span class="ln">3735</span> }
</code><code id="L3736"><span class="ln">3736</span> };
</code><code id="L3737"><span class="ln">3737</span>
</code><code id="L3738"><span class="ln">3738</span> thePath<span class="s"> = </span><b>function</b> (pathString, vml) {
</code><code id="L3739"><span class="ln">3739</span> <b>var</b> el<span class="s"> = </span>createNode(<i>"shape"</i>);
</code><code id="L3740"><span class="ln">3740</span> el.style.cssText<span class="s"> = </span>cssDot;
</code><code id="L3741"><span class="ln">3741</span> el.coordsize<span class="s"> = </span>zoom<span class="s"> + </span>S<span class="s"> + </span>zoom;
</code><code id="L3742"><span class="ln">3742</span> el.coordorigin<span class="s"> = </span>vml.coordorigin;
</code><code id="L3743"><span class="ln">3743</span> <b>var</b> p<span class="s"> = </span><b>new</b> Element(el, vml),
</code><code id="L3744"><span class="ln">3744</span> attr<span class="s"> = </span>{fill: <i>"none"</i>, stroke: <i>"#<span class="d">000</span>"</i>};
</code><code id="L3745"><span class="ln">3745</span> pathString<span class="s"> &amp;&amp; </span>(attr.path<span class="s"> = </span>pathString);
</code><code id="L3746"><span class="ln">3746</span> p.type<span class="s"> = </span><i>"path"</i>;
</code><code id="L3747"><span class="ln">3747</span> p.path<span class="s"> = </span>[];
</code><code id="L3748"><span class="ln">3748</span> p.Path<span class="s"> = </span>E;
</code><code id="L3749"><span class="ln">3749</span> setFillAndStroke(p, attr);
</code><code id="L3750"><span class="ln">3750</span> vml.canvas.appendChild(el);
</code><code id="L3751"><span class="ln">3751</span> <b>var</b> skew<span class="s"> = </span>createNode(<i>"skew"</i>);
</code><code id="L3752"><span class="ln">3752</span> skew.on<span class="s"> = </span><b>true</b>;
</code><code id="L3753"><span class="ln">3753</span> el.appendChild(skew);
</code><code id="L3754"><span class="ln">3754</span> p.skew<span class="s"> = </span>skew;
</code><code id="L3755"><span class="ln">3755</span> p.transform(E);
</code><code id="L3756"><span class="ln">3756</span> <b>return</b> p;
</code><code id="L3757"><span class="ln">3757</span> };
</code><code id="L3758"><span class="ln">3758</span> theRect<span class="s"> = </span><b>function</b> (vml, x, y, w, h, r) {
</code><code id="L3759"><span class="ln">3759</span> <b>var</b> path<span class="s"> = </span>rectPath(x, y, w, h, r),
</code><code id="L3760"><span class="ln">3760</span> res<span class="s"> = </span>vml.path(path),
</code><code id="L3761"><span class="ln">3761</span> a<span class="s"> = </span>res.attrs;
</code><code id="L3762"><span class="ln">3762</span> res.X<span class="s"> = </span>a.x<span class="s"> = </span>x;
</code><code id="L3763"><span class="ln">3763</span> res.Y<span class="s"> = </span>a.y<span class="s"> = </span>y;
</code><code id="L3764"><span class="ln">3764</span> res.W<span class="s"> = </span>a.width<span class="s"> = </span>w;
</code><code id="L3765"><span class="ln">3765</span> res.H<span class="s"> = </span>a.height<span class="s"> = </span>h;
</code><code id="L3766"><span class="ln">3766</span> a.r<span class="s"> = </span>r;
</code><code id="L3767"><span class="ln">3767</span> a.path<span class="s"> = </span>path;
</code><code id="L3768"><span class="ln">3768</span> res.type<span class="s"> = </span><i>"rect"</i>;
</code><code id="L3769"><span class="ln">3769</span> <b>return</b> res;
</code><code id="L3770"><span class="ln">3770</span> };
</code><code id="L3771"><span class="ln">3771</span> theEllipse<span class="s"> = </span><b>function</b> (vml, x, y, rx, ry) {
</code><code id="L3772"><span class="ln">3772</span> <b>var</b> res<span class="s"> = </span>vml.path(),
</code><code id="L3773"><span class="ln">3773</span> a<span class="s"> = </span>res.attrs;
</code><code id="L3774"><span class="ln">3774</span> res.X<span class="s"> = </span>x<span class="s"> - </span>rx;
</code><code id="L3775"><span class="ln">3775</span> res.Y<span class="s"> = </span>y<span class="s"> - </span>ry;
</code><code id="L3776"><span class="ln">3776</span> res.W<span class="s"> = </span>rx<span class="s"> * </span><span class="d">2</span>;
</code><code id="L3777"><span class="ln">3777</span> res.H<span class="s"> = </span>ry<span class="s"> * </span><span class="d">2</span>;
</code><code id="L3778"><span class="ln">3778</span> res.type<span class="s"> = </span><i>"ellipse"</i>;
</code><code id="L3779"><span class="ln">3779</span> setFillAndStroke(res, {
</code><code id="L3780"><span class="ln">3780</span> cx: x,
</code><code id="L3781"><span class="ln">3781</span> cy: y,
</code><code id="L3782"><span class="ln">3782</span> rx: rx,
</code><code id="L3783"><span class="ln">3783</span> ry: ry
</code><code id="L3784"><span class="ln">3784</span> });
</code><code id="L3785"><span class="ln">3785</span> <b>return</b> res;
</code><code id="L3786"><span class="ln">3786</span> };
</code><code id="L3787"><span class="ln">3787</span> theCircle<span class="s"> = </span><b>function</b> (vml, x, y, r) {
</code><code id="L3788"><span class="ln">3788</span> <b>var</b> res<span class="s"> = </span>vml.path(),
</code><code id="L3789"><span class="ln">3789</span> a<span class="s"> = </span>res.attrs;
</code><code id="L3790"><span class="ln">3790</span> res.X<span class="s"> = </span>x<span class="s"> - </span>r;
</code><code id="L3791"><span class="ln">3791</span> res.Y<span class="s"> = </span>y<span class="s"> - </span>r;
</code><code id="L3792"><span class="ln">3792</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="L3793"><span class="ln">3793</span> res.type<span class="s"> = </span><i>"circle"</i>;
</code><code id="L3794"><span class="ln">3794</span> setFillAndStroke(res, {
</code><code id="L3795"><span class="ln">3795</span> cx: x,
</code><code id="L3796"><span class="ln">3796</span> cy: y,
</code><code id="L3797"><span class="ln">3797</span> r: r
</code><code id="L3798"><span class="ln">3798</span> });
</code><code id="L3799"><span class="ln">3799</span> <b>return</b> res;
</code><code id="L3800"><span class="ln">3800</span> };
</code><code id="L3801"><span class="ln">3801</span> theImage<span class="s"> = </span><b>function</b> (vml, src, x, y, w, h) {
</code><code id="L3802"><span class="ln">3802</span> <b>var</b> path<span class="s"> = </span>rectPath(x, y, w, h),
</code><code id="L3803"><span class="ln">3803</span> res<span class="s"> = </span>vml.path(path).attr({stroke: <i>"none"</i>}),
</code><code id="L3804"><span class="ln">3804</span> a<span class="s"> = </span>res.attrs,
</code><code id="L3805"><span class="ln">3805</span> node<span class="s"> = </span>res.node,
</code><code id="L3806"><span class="ln">3806</span> fill<span class="s"> = </span>node.getElementsByTagName(fillString)[<span class="d">0</span>];
</code><code id="L3807"><span class="ln">3807</span> a.src<span class="s"> = </span>src;
</code><code id="L3808"><span class="ln">3808</span> res.X<span class="s"> = </span>a.x<span class="s"> = </span>x;
</code><code id="L3809"><span class="ln">3809</span> res.Y<span class="s"> = </span>a.y<span class="s"> = </span>y;
</code><code id="L3810"><span class="ln">3810</span> res.W<span class="s"> = </span>a.width<span class="s"> = </span>w;
</code><code id="L3811"><span class="ln">3811</span> res.H<span class="s"> = </span>a.height<span class="s"> = </span>h;
</code><code id="L3812"><span class="ln">3812</span> a.path<span class="s"> = </span>path;
</code><code id="L3813"><span class="ln">3813</span> res.type<span class="s"> = </span><i>"image"</i>;
</code><code id="L3814"><span class="ln">3814</span> fill.parentNode<span class="s"> == </span>node<span class="s"> &amp;&amp; </span>node.removeChild(fill);
</code><code id="L3815"><span class="ln">3815</span> fill.rotate<span class="s"> = </span><b>true</b>;
</code><code id="L3816"><span class="ln">3816</span> fill.src<span class="s"> = </span>src;
</code><code id="L3817"><span class="ln">3817</span> fill.type<span class="s"> = </span><i>"tile"</i>;
</code><code id="L3818"><span class="ln">3818</span> res._.fillpos<span class="s"> = </span>[x, y];
</code><code id="L3819"><span class="ln">3819</span> res._.fillsize<span class="s"> = </span>[w, h];
</code><code id="L3820"><span class="ln">3820</span> node.appendChild(fill);
</code><code id="L3821"><span class="ln">3821</span> setCoords(res);
</code><code id="L3822"><span class="ln">3822</span> <b>return</b> res;
</code><code id="L3823"><span class="ln">3823</span> };
</code><code id="L3824"><span class="ln">3824</span> theText<span class="s"> = </span><b>function</b> (vml, x, y, text) {
</code><code id="L3825"><span class="ln">3825</span> <b>var</b> el<span class="s"> = </span>createNode(<i>"shape"</i>),
</code><code id="L3826"><span class="ln">3826</span> path<span class="s"> = </span>createNode(<i>"path"</i>),
</code><code id="L3827"><span class="ln">3827</span> o<span class="s"> = </span>createNode(<i>"textpath"</i>);
</code><code id="L3828"><span class="ln">3828</span> x<span class="s"> = </span>x<span class="s"> || </span><span class="d">0</span>;
</code><code id="L3829"><span class="ln">3829</span> y<span class="s"> = </span>y<span class="s"> || </span><span class="d">0</span>;
</code><code id="L3830"><span class="ln">3830</span> text<span class="s"> = </span>text<span class="s"> || </span><i>""</i>;
</code><code id="L3831"><span class="ln">3831</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="L3832"><span class="ln">3832</span> path.textpathok<span class="s"> = </span><b>true</b>;
</code><code id="L3833"><span class="ln">3833</span> o.string<span class="s"> = </span>Str(text);
</code><code id="L3834"><span class="ln">3834</span> o.on<span class="s"> = </span><b>true</b>;
</code><code id="L3835"><span class="ln">3835</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="L3836"><span class="ln">3836</span> el.coordsize<span class="s"> = </span>zoom<span class="s"> + </span>S<span class="s"> + </span>zoom;
</code><code id="L3837"><span class="ln">3837</span> el.coordorigin<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span>"</i>;
</code><code id="L3838"><span class="ln">3838</span> <b>var</b> p<span class="s"> = </span><b>new</b> Element(el, vml),
</code><code id="L3839"><span class="ln">3839</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="L3840"><span class="ln">3840</span> p.shape<span class="s"> = </span>el;
</code><code id="L3841"><span class="ln">3841</span> p.path<span class="s"> = </span>path;
</code><code id="L3842"><span class="ln">3842</span> p.textpath<span class="s"> = </span>o;
</code><code id="L3843"><span class="ln">3843</span> p.type<span class="s"> = </span><i>"text"</i>;
</code><code id="L3844"><span class="ln">3844</span> p.attrs.text<span class="s"> = </span>Str(text);
</code><code id="L3845"><span class="ln">3845</span> p.attrs.x<span class="s"> = </span>x;
</code><code id="L3846"><span class="ln">3846</span> p.attrs.y<span class="s"> = </span>y;
</code><code id="L3847"><span class="ln">3847</span> p.attrs.w<span class="s"> = </span><span class="d">1</span>;
</code><code id="L3848"><span class="ln">3848</span> p.attrs.h<span class="s"> = </span><span class="d">1</span>;
</code><code id="L3849"><span class="ln">3849</span> setFillAndStroke(p, attr);
</code><code id="L3850"><span class="ln">3850</span> el.appendChild(o);
</code><code id="L3851"><span class="ln">3851</span> el.appendChild(path);
</code><code id="L3852"><span class="ln">3852</span> vml.canvas.appendChild(el);
</code><code id="L3853"><span class="ln">3853</span> <b>var</b> skew<span class="s"> = </span>createNode(<i>"skew"</i>);
</code><code id="L3854"><span class="ln">3854</span> skew.on<span class="s"> = </span><b>true</b>;
</code><code id="L3855"><span class="ln">3855</span> el.appendChild(skew);
</code><code id="L3856"><span class="ln">3856</span> p.skew<span class="s"> = </span>skew;
</code><code id="L3857"><span class="ln">3857</span> p.transform(E);
</code><code id="L3858"><span class="ln">3858</span> <b>return</b> p;
</code><code id="L3859"><span class="ln">3859</span> };
</code><code id="L3860"><span class="ln">3860</span> setSize<span class="s"> = </span><b>function</b> (width, height) {
</code><code id="L3861"><span class="ln">3861</span> <b>var</b> cs<span class="s"> = </span><b>this</b>.canvas.style;
</code><code id="L3862"><span class="ln">3862</span> <b>this</b>.width<span class="s"> = </span>width;
</code><code id="L3863"><span class="ln">3863</span> <b>this</b>.height<span class="s"> = </span>height;
</code><code id="L3864"><span class="ln">3864</span> width<span class="s"> == </span>+width<span class="s"> &amp;&amp; </span>(width += <i>"px"</i>);
</code><code id="L3865"><span class="ln">3865</span> height<span class="s"> == </span>+height<span class="s"> &amp;&amp; </span>(height += <i>"px"</i>);
</code><code id="L3866"><span class="ln">3866</span> cs.width<span class="s"> = </span>width;
</code><code id="L3867"><span class="ln">3867</span> cs.height<span class="s"> = </span>height;
</code><code id="L3868"><span class="ln">3868</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="L3869"><span class="ln">3869</span> <b>if</b> (<b>this</b>._viewBox) {
</code><code id="L3870"><span class="ln">3870</span> setViewBox.apply(<b>this</b>, <b>this</b>._viewBox);
</code><code id="L3871"><span class="ln">3871</span> }
</code><code id="L3872"><span class="ln">3872</span> <b>return</b> <b>this</b>;
</code><code id="L3873"><span class="ln">3873</span> };
</code><code id="L3874"><span class="ln">3874</span> setViewBox<span class="s"> = </span><b>function</b> (x, y, w, h, fit) {
</code><code id="L3875"><span class="ln">3875</span> eve(<i>"setViewBox"</i>, <b>this</b>, <b>this</b>._viewBox, [x, y, w, h, fit]);
</code><code id="L3876"><span class="ln">3876</span> <b>var</b> width<span class="s"> = </span><b>this</b>.width,
</code><code id="L3877"><span class="ln">3877</span> height<span class="s"> = </span><b>this</b>.height,
</code><code id="L3878"><span class="ln">3878</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="L3879"><span class="ln">3879</span> H, W;
</code><code id="L3880"><span class="ln">3880</span> <b>if</b> (fit) {
</code><code id="L3881"><span class="ln">3881</span> H<span class="s"> = </span>height<span class="s"> / </span>h;
</code><code id="L3882"><span class="ln">3882</span> W<span class="s"> = </span>width<span class="s"> / </span>w;
</code><code id="L3883"><span class="ln">3883</span> <b>if</b> (w<span class="s"> * </span>H &lt; width) {
</code><code id="L3884"><span class="ln">3884</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="L3885"><span class="ln">3885</span> }
</code><code id="L3886"><span class="ln">3886</span> <b>if</b> (h<span class="s"> * </span>W &lt; height) {
</code><code id="L3887"><span class="ln">3887</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="L3888"><span class="ln">3888</span> }
</code><code id="L3889"><span class="ln">3889</span> }
</code><code id="L3890"><span class="ln">3890</span> <b>this</b>._viewBox<span class="s"> = </span>[x, y, w, h, !!fit];
</code><code id="L3891"><span class="ln">3891</span> <b>this</b>.forEach(<b>function</b> (el) {
</code><code id="L3892"><span class="ln">3892</span> el.transform(<i>"..."</i>);
</code><code id="L3893"><span class="ln">3893</span> });
</code><code id="L3894"><span class="ln">3894</span> <b>return</b> <b>this</b>;
</code><code id="L3895"><span class="ln">3895</span> };
</code><code id="L3896"><span class="ln">3896</span> <b>var</b> createNode,
</code><code id="L3897"><span class="ln">3897</span> initWin<span class="s"> = </span><b>function</b> (win) {
</code><code id="L3898"><span class="ln">3898</span> <b>var</b> doc<span class="s"> = </span>win.document;
</code><code id="L3899"><span class="ln">3899</span> doc.createStyleSheet().addRule(<i>".rvml"</i>, <i>"behavior:url(#<b>default</b>#VML)"</i>);
</code><code id="L3900"><span class="ln">3900</span> <b>try</b> {
</code><code id="L3901"><span class="ln">3901</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="L3902"><span class="ln">3902</span> createNode<span class="s"> = </span><b>function</b> (tagName) {
</code><code id="L3903"><span class="ln">3903</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="L3904"><span class="ln">3904</span> };
</code><code id="L3905"><span class="ln">3905</span> } <b>catch</b> (e) {
</code><code id="L3906"><span class="ln">3906</span> createNode<span class="s"> = </span><b>function</b> (tagName) {
</code><code id="L3907"><span class="ln">3907</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="L3908"><span class="ln">3908</span> };
</code><code id="L3909"><span class="ln">3909</span> }
</code><code id="L3910"><span class="ln">3910</span> };
</code><code id="L3911"><span class="ln">3911</span> initWin(g.win);
</code><code id="L3912"><span class="ln">3912</span> create<span class="s"> = </span><b>function</b> () {
</code><code id="L3913"><span class="ln">3913</span> <b>var</b> con<span class="s"> = </span>getContainer[apply](<span class="d">0</span>, arguments),
</code><code id="L3914"><span class="ln">3914</span> container<span class="s"> = </span>con.container,
</code><code id="L3915"><span class="ln">3915</span> height<span class="s"> = </span>con.height,
</code><code id="L3916"><span class="ln">3916</span> s,
</code><code id="L3917"><span class="ln">3917</span> width<span class="s"> = </span>con.width,
</code><code id="L3918"><span class="ln">3918</span> x<span class="s"> = </span>con.x,
</code><code id="L3919"><span class="ln">3919</span> y<span class="s"> = </span>con.y;
</code><code id="L3920"><span class="ln">3920</span> <b>if</b> (!container) {
</code><code id="L3921"><span class="ln">3921</span> <b>throw</b> <b>new</b> Error(<i>"VML container not found."</i>);
</code><code id="L3922"><span class="ln">3922</span> }
</code><code id="L3923"><span class="ln">3923</span> <b>var</b> res<span class="s"> = </span><b>new</b> Paper,
</code><code id="L3924"><span class="ln">3924</span> c<span class="s"> = </span>res.canvas<span class="s"> = </span>g.doc.createElement(<i>"div"</i>),
</code><code id="L3925"><span class="ln">3925</span> cs<span class="s"> = </span>c.style;
</code><code id="L3926"><span class="ln">3926</span> x<span class="s"> = </span>x<span class="s"> || </span><span class="d">0</span>;
</code><code id="L3927"><span class="ln">3927</span> y<span class="s"> = </span>y<span class="s"> || </span><span class="d">0</span>;
</code><code id="L3928"><span class="ln">3928</span> width<span class="s"> = </span>width<span class="s"> || </span><span class="d">512</span>;
</code><code id="L3929"><span class="ln">3929</span> height<span class="s"> = </span>height<span class="s"> || </span><span class="d">342</span>;
</code><code id="L3930"><span class="ln">3930</span> res.width<span class="s"> = </span>width;
</code><code id="L3931"><span class="ln">3931</span> res.height<span class="s"> = </span>height;
</code><code id="L3932"><span class="ln">3932</span> width<span class="s"> == </span>+width<span class="s"> &amp;&amp; </span>(width += <i>"px"</i>);
</code><code id="L3933"><span class="ln">3933</span> height<span class="s"> == </span>+height<span class="s"> &amp;&amp; </span>(height += <i>"px"</i>);
</code><code id="L3934"><span class="ln">3934</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="L3935"><span class="ln">3935</span> res.coordorigin<span class="s"> = </span><i>"<span class="d">0</span> <span class="d">0</span>"</i>;
</code><code id="L3936"><span class="ln">3936</span> res.span<span class="s"> = </span>g.doc.createElement(<i>"span"</i>);
</code><code id="L3937"><span class="ln">3937</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="L3938"><span class="ln">3938</span> c.appendChild(res.span);
</code><code id="L3939"><span class="ln">3939</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="L3940"><span class="ln">3940</span> <b>if</b> (container<span class="s"> == </span><span class="d">1</span>) {
</code><code id="L3941"><span class="ln">3941</span> g.doc.body.appendChild(c);
</code><code id="L3942"><span class="ln">3942</span> cs.left<span class="s"> = </span>x<span class="s"> + </span><i>"px"</i>;
</code><code id="L3943"><span class="ln">3943</span> cs.top<span class="s"> = </span>y<span class="s"> + </span><i>"px"</i>;
</code><code id="L3944"><span class="ln">3944</span> cs.position<span class="s"> = </span><i>"absolute"</i>;
</code><code id="L3945"><span class="ln">3945</span> } <b>else</b> {
</code><code id="L3946"><span class="ln">3946</span> <b>if</b> (container.firstChild) {
</code><code id="L3947"><span class="ln">3947</span> container.insertBefore(c, container.firstChild);
</code><code id="L3948"><span class="ln">3948</span> } <b>else</b> {
</code><code id="L3949"><span class="ln">3949</span> container.appendChild(c);
</code><code id="L3950"><span class="ln">3950</span> }
</code><code id="L3951"><span class="ln">3951</span> }
</code><code id="L3952"><span class="ln">3952</span> plugins.call(res, res, R.fn);
</code><code id="L3953"><span class="ln">3953</span> res.renderfix<span class="s"> = </span>fun;
</code><code id="L3954"><span class="ln">3954</span> <b>return</b> res;
</code><code id="L3955"><span class="ln">3955</span> };
</code><code id="L3956"><span class="ln">3956</span> paperproto.clear<span class="s"> = </span><b>function</b> () {
</code><code id="L3957"><span class="ln">3957</span> eve(<i>"clear"</i>, <b>this</b>);
</code><code id="L3958"><span class="ln">3958</span> <b>this</b>.canvas.innerHTML<span class="s"> = </span>E;
</code><code id="L3959"><span class="ln">3959</span> <b>this</b>.span<span class="s"> = </span>g.doc.createElement(<i>"span"</i>);
</code><code id="L3960"><span class="ln">3960</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="L3961"><span class="ln">3961</span> <b>this</b>.canvas.appendChild(<b>this</b>.span);
</code><code id="L3962"><span class="ln">3962</span> <b>this</b>.bottom<span class="s"> = </span><b>this</b>.top<span class="s"> = </span><b>null</b>;
</code><code id="L3963"><span class="ln">3963</span> };
</code><code id="L3964"><span class="ln">3964</span> paperproto.remove<span class="s"> = </span><b>function</b> () {
</code><code id="L3965"><span class="ln">3965</span> eve(<i>"remove"</i>, <b>this</b>);
</code><code id="L3966"><span class="ln">3966</span> <b>this</b>.canvas.parentNode.removeChild(<b>this</b>.canvas);
</code><code id="L3967"><span class="ln">3967</span> <b>for</b> (<b>var</b> i <b>in</b> <b>this</b>) {
</code><code id="L3968"><span class="ln">3968</span> <b>this</b>[i]<span class="s"> = </span>removed(i);
</code><code id="L3969"><span class="ln">3969</span> }
</code><code id="L3970"><span class="ln">3970</span> <b>return</b> <b>true</b>;
</code><code id="L3971"><span class="ln">3971</span> };
</code><code id="L3972"><span class="ln">3972</span> }
</code><code id="L3973"><span class="ln">3973</span>
</code><code id="L3974"><span class="ln">3974</span> <span class="c">// WebKit rendering bug workaround method</span>
</code><code id="L3975"><span class="ln">3975</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="L3976"><span class="ln">3976</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="L3977"><span class="ln">3977</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="L3978"><span class="ln">3978</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L3979"><span class="ln">3979</span><span class="c"> <span class="s"> * </span>Paper.safari
</span></code><code id="L3980"><span class="ln">3980</span><span class="c"> [ method ]
</span></code><code id="L3981"><span class="ln">3981</span><span class="c"> **
</span></code><code id="L3982"><span class="ln">3982</span><span class="c"> <span class="s"> * </span>There is an inconvenient rendering bug <b>in</b> Safari (WebKit):
</span></code><code id="L3983"><span class="ln">3983</span><span class="c"> <span class="s"> * </span>sometimes the rendering should be forced.
</span></code><code id="L3984"><span class="ln">3984</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="L3985"><span class="ln">3985</span><span class="c"> \*/</span>
</code><code id="L3986"><span class="ln">3986</span> paperproto.safari<span class="s"> = </span><b>function</b> () {
</code><code id="L3987"><span class="ln">3987</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="L3988"><span class="ln">3988</span> setTimeout(<b>function</b> () {rect.remove();});
</code><code id="L3989"><span class="ln">3989</span> };
</code><code id="L3990"><span class="ln">3990</span> } <b>else</b> {
</code><code id="L3991"><span class="ln">3991</span> paperproto.safari<span class="s"> = </span>fun;
</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> <span class="c">// Events</span>
</code><code id="L3995"><span class="ln">3995</span> <b>var</b> preventDefault<span class="s"> = </span><b>function</b> () {
</code><code id="L3996"><span class="ln">3996</span> <b>this</b>.returnValue<span class="s"> = </span><b>false</b>;
</code><code id="L3997"><span class="ln">3997</span> },
</code><code id="L3998"><span class="ln">3998</span> preventTouch<span class="s"> = </span><b>function</b> () {
</code><code id="L3999"><span class="ln">3999</span> <b>return</b> <b>this</b>.originalEvent.preventDefault();
</code><code id="L4000"><span class="ln">4000</span> },
</code><code id="L4001"><span class="ln">4001</span> stopPropagation<span class="s"> = </span><b>function</b> () {
</code><code id="L4002"><span class="ln">4002</span> <b>this</b>.cancelBubble<span class="s"> = </span><b>true</b>;
</code><code id="L4003"><span class="ln">4003</span> },
</code><code id="L4004"><span class="ln">4004</span> stopTouch<span class="s"> = </span><b>function</b> () {
</code><code id="L4005"><span class="ln">4005</span> <b>return</b> <b>this</b>.originalEvent.stopPropagation();
</code><code id="L4006"><span class="ln">4006</span> },
</code><code id="L4007"><span class="ln">4007</span> addEvent<span class="s"> = </span>(<b>function</b> () {
</code><code id="L4008"><span class="ln">4008</span> <b>if</b> (g.doc.addEventListener) {
</code><code id="L4009"><span class="ln">4009</span> <b>return</b> <b>function</b> (obj, type, fn, element) {
</code><code id="L4010"><span class="ln">4010</span> <b>var</b> realName<span class="s"> = </span>supportsTouch<span class="s"> &amp;&amp; </span>touchMap[type] ? touchMap[type] : type;
</code><code id="L4011"><span class="ln">4011</span> <b>var</b> f<span class="s"> = </span><b>function</b> (e) {
</code><code id="L4012"><span class="ln">4012</span> <b>if</b> (supportsTouch<span class="s"> &amp;&amp; </span>touchMap[has](type)) {
</code><code id="L4013"><span class="ln">4013</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="L4014"><span class="ln">4014</span> <b>if</b> (e.targetTouches[i].target<span class="s"> == </span>obj) {
</code><code id="L4015"><span class="ln">4015</span> <b>var</b> olde<span class="s"> = </span>e;
</code><code id="L4016"><span class="ln">4016</span> e<span class="s"> = </span>e.targetTouches[i];
</code><code id="L4017"><span class="ln">4017</span> e.originalEvent<span class="s"> = </span>olde;
</code><code id="L4018"><span class="ln">4018</span> e.preventDefault<span class="s"> = </span>preventTouch;
</code><code id="L4019"><span class="ln">4019</span> e.stopPropagation<span class="s"> = </span>stopTouch;
</code><code id="L4020"><span class="ln">4020</span> <b>break</b>;
</code><code id="L4021"><span class="ln">4021</span> }
</code><code id="L4022"><span class="ln">4022</span> }
</code><code id="L4023"><span class="ln">4023</span> }
</code><code id="L4024"><span class="ln">4024</span> <b>return</b> fn.call(element, e);
</code><code id="L4025"><span class="ln">4025</span> };
</code><code id="L4026"><span class="ln">4026</span> obj.addEventListener(realName, f, <b>false</b>);
</code><code id="L4027"><span class="ln">4027</span> <b>return</b> <b>function</b> () {
</code><code id="L4028"><span class="ln">4028</span> obj.removeEventListener(realName, f, <b>false</b>);
</code><code id="L4029"><span class="ln">4029</span> <b>return</b> <b>true</b>;
</code><code id="L4030"><span class="ln">4030</span> };
</code><code id="L4031"><span class="ln">4031</span> };
</code><code id="L4032"><span class="ln">4032</span> } <b>else</b> <b>if</b> (g.doc.attachEvent) {
</code><code id="L4033"><span class="ln">4033</span> <b>return</b> <b>function</b> (obj, type, fn, element) {
</code><code id="L4034"><span class="ln">4034</span> <b>var</b> f<span class="s"> = </span><b>function</b> (e) {
</code><code id="L4035"><span class="ln">4035</span> e<span class="s"> = </span>e<span class="s"> || </span>g.win.event;
</code><code id="L4036"><span class="ln">4036</span> e.preventDefault<span class="s"> = </span>e.preventDefault<span class="s"> || </span>preventDefault;
</code><code id="L4037"><span class="ln">4037</span> e.stopPropagation<span class="s"> = </span>e.stopPropagation<span class="s"> || </span>stopPropagation;
</code><code id="L4038"><span class="ln">4038</span> <b>return</b> fn.call(element, e);
</code><code id="L4039"><span class="ln">4039</span> };
</code><code id="L4040"><span class="ln">4040</span> obj.attachEvent(<i>"on"</i><span class="s"> + </span>type, f);
</code><code id="L4041"><span class="ln">4041</span> <b>var</b> detacher<span class="s"> = </span><b>function</b> () {
</code><code id="L4042"><span class="ln">4042</span> obj.detachEvent(<i>"on"</i><span class="s"> + </span>type, f);
</code><code id="L4043"><span class="ln">4043</span> <b>return</b> <b>true</b>;
</code><code id="L4044"><span class="ln">4044</span> };
</code><code id="L4045"><span class="ln">4045</span> <b>return</b> detacher;
</code><code id="L4046"><span class="ln">4046</span> };
</code><code id="L4047"><span class="ln">4047</span> }
</code><code id="L4048"><span class="ln">4048</span> })(),
</code><code id="L4049"><span class="ln">4049</span> drag<span class="s"> = </span>[],
</code><code id="L4050"><span class="ln">4050</span> dragMove<span class="s"> = </span><b>function</b> (e) {
</code><code id="L4051"><span class="ln">4051</span> <b>var</b> x<span class="s"> = </span>e.clientX,
</code><code id="L4052"><span class="ln">4052</span> y<span class="s"> = </span>e.clientY,
</code><code id="L4053"><span class="ln">4053</span> scrollY<span class="s"> = </span>g.doc.documentElement.scrollTop<span class="s"> || </span>g.doc.body.scrollTop,
</code><code id="L4054"><span class="ln">4054</span> scrollX<span class="s"> = </span>g.doc.documentElement.scrollLeft<span class="s"> || </span>g.doc.body.scrollLeft,
</code><code id="L4055"><span class="ln">4055</span> dragi,
</code><code id="L4056"><span class="ln">4056</span> j<span class="s"> = </span>drag.length;
</code><code id="L4057"><span class="ln">4057</span> <b>while</b> (j--) {
</code><code id="L4058"><span class="ln">4058</span> dragi<span class="s"> = </span>drag[j];
</code><code id="L4059"><span class="ln">4059</span> <b>if</b> (supportsTouch) {
</code><code id="L4060"><span class="ln">4060</span> <b>var</b> i<span class="s"> = </span>e.touches.length,
</code><code id="L4061"><span class="ln">4061</span> touch;
</code><code id="L4062"><span class="ln">4062</span> <b>while</b> (i--) {
</code><code id="L4063"><span class="ln">4063</span> touch<span class="s"> = </span>e.touches[i];
</code><code id="L4064"><span class="ln">4064</span> <b>if</b> (touch.identifier<span class="s"> == </span>dragi.el._drag.id) {
</code><code id="L4065"><span class="ln">4065</span> x<span class="s"> = </span>touch.clientX;
</code><code id="L4066"><span class="ln">4066</span> y<span class="s"> = </span>touch.clientY;
</code><code id="L4067"><span class="ln">4067</span> (e.originalEvent ? e.originalEvent : e).preventDefault();
</code><code id="L4068"><span class="ln">4068</span> <b>break</b>;
</code><code id="L4069"><span class="ln">4069</span> }
</code><code id="L4070"><span class="ln">4070</span> }
</code><code id="L4071"><span class="ln">4071</span> } <b>else</b> {
</code><code id="L4072"><span class="ln">4072</span> e.preventDefault();
</code><code id="L4073"><span class="ln">4073</span> }
</code><code id="L4074"><span class="ln">4074</span> <b>var</b> node<span class="s"> = </span>dragi.el.node,
</code><code id="L4075"><span class="ln">4075</span> o,
</code><code id="L4076"><span class="ln">4076</span> next<span class="s"> = </span>node.nextSibling,
</code><code id="L4077"><span class="ln">4077</span> parent<span class="s"> = </span>node.parentNode,
</code><code id="L4078"><span class="ln">4078</span> display<span class="s"> = </span>node.style.display;
</code><code id="L4079"><span class="ln">4079</span> g.win.opera<span class="s"> &amp;&amp; </span>parent.removeChild(node);
</code><code id="L4080"><span class="ln">4080</span> node.style.display<span class="s"> = </span><i>"none"</i>;
</code><code id="L4081"><span class="ln">4081</span> o<span class="s"> = </span>dragi.el.paper.getElementByPoint(x, y);
</code><code id="L4082"><span class="ln">4082</span> node.style.display<span class="s"> = </span>display;
</code><code id="L4083"><span class="ln">4083</span> g.win.opera<span class="s"> &amp;&amp; </span>(next ? parent.insertBefore(node, next) : parent.appendChild(node));
</code><code id="L4084"><span class="ln">4084</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="L4085"><span class="ln">4085</span> x += scrollX;
</code><code id="L4086"><span class="ln">4086</span> y += scrollY;
</code><code id="L4087"><span class="ln">4087</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="L4088"><span class="ln">4088</span> }
</code><code id="L4089"><span class="ln">4089</span> },
</code><code id="L4090"><span class="ln">4090</span> dragUp<span class="s"> = </span><b>function</b> (e) {
</code><code id="L4091"><span class="ln">4091</span> R.unmousemove(dragMove).unmouseup(dragUp);
</code><code id="L4092"><span class="ln">4092</span> <b>var</b> i<span class="s"> = </span>drag.length,
</code><code id="L4093"><span class="ln">4093</span> dragi;
</code><code id="L4094"><span class="ln">4094</span> <b>while</b> (i--) {
</code><code id="L4095"><span class="ln">4095</span> dragi<span class="s"> = </span>drag[i];
</code><code id="L4096"><span class="ln">4096</span> dragi.el._drag<span class="s"> = </span>{};
</code><code id="L4097"><span class="ln">4097</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="L4098"><span class="ln">4098</span> }
</code><code id="L4099"><span class="ln">4099</span> drag<span class="s"> = </span>[];
</code><code id="L4100"><span class="ln">4100</span> };
</code><code id="L4101"><span class="ln">4101</span> <b>for</b> (<b>var</b> i<span class="s"> = </span>events.length; i--;) {
</code><code id="L4102"><span class="ln">4102</span> (<b>function</b> (eventName) {
</code><code id="L4103"><span class="ln">4103</span> R[eventName]<span class="s"> = </span>Element.prototype[eventName]<span class="s"> = </span><b>function</b> (fn, scope) {
</code><code id="L4104"><span class="ln">4104</span> <b>if</b> (R.is(fn, <i>"<b>function</b>"</i>)) {
</code><code id="L4105"><span class="ln">4105</span> <b>this</b>.events<span class="s"> = </span><b>this</b>.events<span class="s"> || </span>[];
</code><code id="L4106"><span class="ln">4106</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="L4107"><span class="ln">4107</span> }
</code><code id="L4108"><span class="ln">4108</span> <b>return</b> <b>this</b>;
</code><code id="L4109"><span class="ln">4109</span> };
</code><code id="L4110"><span class="ln">4110</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="L4111"><span class="ln">4111</span> <b>var</b> events<span class="s"> = </span><b>this</b>.events,
</code><code id="L4112"><span class="ln">4112</span> l<span class="s"> = </span>events.length;
</code><code id="L4113"><span class="ln">4113</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="L4114"><span class="ln">4114</span> events[l].unbind();
</code><code id="L4115"><span class="ln">4115</span> events.splice(l, <span class="d">1</span>);
</code><code id="L4116"><span class="ln">4116</span> !events.length<span class="s"> &amp;&amp; </span><b>delete</b> <b>this</b>.events;
</code><code id="L4117"><span class="ln">4117</span> <b>return</b> <b>this</b>;
</code><code id="L4118"><span class="ln">4118</span> }
</code><code id="L4119"><span class="ln">4119</span> <b>return</b> <b>this</b>;
</code><code id="L4120"><span class="ln">4120</span> };
</code><code id="L4121"><span class="ln">4121</span> })(events[i]);
</code><code id="L4122"><span class="ln">4122</span> }
</code><code id="L4123"><span class="ln">4123</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4124"><span class="ln">4124</span><span class="c"> <span class="s"> * </span>Element.hover
</span></code><code id="L4125"><span class="ln">4125</span><span class="c"> [ method ]
</span></code><code id="L4126"><span class="ln">4126</span><span class="c"> **
</span></code><code id="L4127"><span class="ln">4127</span><span class="c"> <span class="s"> * </span>Adds event handlers <b>for</b> hover <b>for</b> the element.
</span></code><code id="L4128"><span class="ln">4128</span><span class="c"> > Parameters
</span></code><code id="L4129"><span class="ln">4129</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="L4130"><span class="ln">4130</span><span class="c"> <span class="s"> - </span>f_out (<b>function</b>) handler <b>for</b> hover out
</span></code><code id="L4131"><span class="ln">4131</span><span class="c"> <span class="s"> - </span>icontext (object) #optional context <b>for</b> hover <b>in</b> handler
</span></code><code id="L4132"><span class="ln">4132</span><span class="c"> <span class="s"> - </span>ocontext (object) #optional context <b>for</b> hover out handler
</span></code><code id="L4133"><span class="ln">4133</span><span class="c"> <span class="s"> = </span>(object) @Element
</span></code><code id="L4134"><span class="ln">4134</span><span class="c"> \*/</span>
</code><code id="L4135"><span class="ln">4135</span> elproto.hover<span class="s"> = </span><b>function</b> (f_in, f_out, scope_in, scope_out) {
</code><code id="L4136"><span class="ln">4136</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="L4137"><span class="ln">4137</span> };
</code><code id="L4138"><span class="ln">4138</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4139"><span class="ln">4139</span><span class="c"> <span class="s"> * </span>Element.unhover
</span></code><code id="L4140"><span class="ln">4140</span><span class="c"> [ method ]
</span></code><code id="L4141"><span class="ln">4141</span><span class="c"> **
</span></code><code id="L4142"><span class="ln">4142</span><span class="c"> <span class="s"> * </span>Removes event handlers <b>for</b> hover <b>for</b> the element.
</span></code><code id="L4143"><span class="ln">4143</span><span class="c"> > Parameters
</span></code><code id="L4144"><span class="ln">4144</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="L4145"><span class="ln">4145</span><span class="c"> <span class="s"> - </span>f_out (<b>function</b>) handler <b>for</b> hover out
</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.unhover<span class="s"> = </span><b>function</b> (f_in, f_out) {
</code><code id="L4149"><span class="ln">4149</span> <b>return</b> <b>this</b>.unmouseover(f_in).unmouseout(f_out);
</code><code id="L4150"><span class="ln">4150</span> };
</code><code id="L4151"><span class="ln">4151</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4152"><span class="ln">4152</span><span class="c"> <span class="s"> * </span>Element.drag
</span></code><code id="L4153"><span class="ln">4153</span><span class="c"> [ method ]
</span></code><code id="L4154"><span class="ln">4154</span><span class="c"> **
</span></code><code id="L4155"><span class="ln">4155</span><span class="c"> <span class="s"> * </span>Adds event handlers <b>for</b> drag of the element.
</span></code><code id="L4156"><span class="ln">4156</span><span class="c"> > Parameters
</span></code><code id="L4157"><span class="ln">4157</span><span class="c"> <span class="s"> - </span>onmove (<b>function</b>) handler <b>for</b> moving
</span></code><code id="L4158"><span class="ln">4158</span><span class="c"> <span class="s"> - </span>onstart (<b>function</b>) handler <b>for</b> drag start
</span></code><code id="L4159"><span class="ln">4159</span><span class="c"> <span class="s"> - </span>onend (<b>function</b>) handler <b>for</b> drag end
</span></code><code id="L4160"><span class="ln">4160</span><span class="c"> <span class="s"> - </span>mcontext (object) #optional context <b>for</b> moving handler
</span></code><code id="L4161"><span class="ln">4161</span><span class="c"> <span class="s"> - </span>scontext (object) #optional context <b>for</b> drag start handler
</span></code><code id="L4162"><span class="ln">4162</span><span class="c"> <span class="s"> - </span>econtext (object) #optional context <b>for</b> drag end handler
</span></code><code id="L4163"><span class="ln">4163</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="L4164"><span class="ln">4164</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="L4165"><span class="ln">4165</span><span class="c"> <span class="s"> * </span>`drag.over.&lt;id>` will be fired as well.
</span></code><code id="L4166"><span class="ln">4166</span><span class="c"> *
</span></code><code id="L4167"><span class="ln">4167</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="L4168"><span class="ln">4168</span><span class="c"> o x (number) x position of the mouse
</span></code><code id="L4169"><span class="ln">4169</span><span class="c"> o y (number) y position of the mouse
</span></code><code id="L4170"><span class="ln">4170</span><span class="c"> o event (object) DOM event object
</span></code><code id="L4171"><span class="ln">4171</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="L4172"><span class="ln">4172</span><span class="c"> o dx (number) shift by x from the start point
</span></code><code id="L4173"><span class="ln">4173</span><span class="c"> o dy (number) shift by y from the start point
</span></code><code id="L4174"><span class="ln">4174</span><span class="c"> o x (number) x position of the mouse
</span></code><code id="L4175"><span class="ln">4175</span><span class="c"> o y (number) y position of the mouse
</span></code><code id="L4176"><span class="ln">4176</span><span class="c"> o event (object) DOM event object
</span></code><code id="L4177"><span class="ln">4177</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="L4178"><span class="ln">4178</span><span class="c"> o event (object) DOM event object
</span></code><code id="L4179"><span class="ln">4179</span><span class="c"> <span class="s"> = </span>(object) @Element
</span></code><code id="L4180"><span class="ln">4180</span><span class="c"> \*/</span>
</code><code id="L4181"><span class="ln">4181</span> elproto.drag<span class="s"> = </span><b>function</b> (onmove, onstart, onend, move_scope, start_scope, end_scope) {
</code><code id="L4182"><span class="ln">4182</span> <b>function</b> start(e) {
</code><code id="L4183"><span class="ln">4183</span> (e.originalEvent<span class="s"> || </span>e).preventDefault();
</code><code id="L4184"><span class="ln">4184</span> <b>var</b> scrollY<span class="s"> = </span>g.doc.documentElement.scrollTop<span class="s"> || </span>g.doc.body.scrollTop,
</code><code id="L4185"><span class="ln">4185</span> scrollX<span class="s"> = </span>g.doc.documentElement.scrollLeft<span class="s"> || </span>g.doc.body.scrollLeft;
</code><code id="L4186"><span class="ln">4186</span> <b>this</b>._drag.x<span class="s"> = </span>e.clientX<span class="s"> + </span>scrollX;
</code><code id="L4187"><span class="ln">4187</span> <b>this</b>._drag.y<span class="s"> = </span>e.clientY<span class="s"> + </span>scrollY;
</code><code id="L4188"><span class="ln">4188</span> <b>this</b>._drag.id<span class="s"> = </span>e.identifier;
</code><code id="L4189"><span class="ln">4189</span> !drag.length<span class="s"> &amp;&amp; </span>R.mousemove(dragMove).mouseup(dragUp);
</code><code id="L4190"><span class="ln">4190</span> drag.push({el: <b>this</b>, move_scope: move_scope, start_scope: start_scope, end_scope: end_scope});
</code><code id="L4191"><span class="ln">4191</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="L4192"><span class="ln">4192</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="L4193"><span class="ln">4193</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="L4194"><span class="ln">4194</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="L4195"><span class="ln">4195</span> }
</code><code id="L4196"><span class="ln">4196</span> <b>this</b>._drag<span class="s"> = </span>{};
</code><code id="L4197"><span class="ln">4197</span> <b>this</b>.mousedown(start);
</code><code id="L4198"><span class="ln">4198</span> <b>return</b> <b>this</b>;
</code><code id="L4199"><span class="ln">4199</span> };
</code><code id="L4200"><span class="ln">4200</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4201"><span class="ln">4201</span><span class="c"> <span class="s"> * </span>Element.onDragOver
</span></code><code id="L4202"><span class="ln">4202</span><span class="c"> [ method ]
</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>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="L4205"><span class="ln">4205</span><span class="c"> > Parameters
</span></code><code id="L4206"><span class="ln">4206</span><span class="c"> <span class="s"> - </span>f (<b>function</b>) handler <b>for</b> event
</span></code><code id="L4207"><span class="ln">4207</span><span class="c"> \*/</span>
</code><code id="L4208"><span class="ln">4208</span> elproto.onDragOver<span class="s"> = </span><b>function</b> (f) {
</code><code id="L4209"><span class="ln">4209</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="L4210"><span class="ln">4210</span> };
</code><code id="L4211"><span class="ln">4211</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4212"><span class="ln">4212</span><span class="c"> <span class="s"> * </span>Element.undrag
</span></code><code id="L4213"><span class="ln">4213</span><span class="c"> [ method ]
</span></code><code id="L4214"><span class="ln">4214</span><span class="c"> **
</span></code><code id="L4215"><span class="ln">4215</span><span class="c"> <span class="s"> * </span>Removes all drag event handlers from given element.
</span></code><code id="L4216"><span class="ln">4216</span><span class="c"> \*/</span>
</code><code id="L4217"><span class="ln">4217</span> elproto.undrag<span class="s"> = </span><b>function</b> () {
</code><code id="L4218"><span class="ln">4218</span> <b>var</b> i<span class="s"> = </span>drag.length;
</code><code id="L4219"><span class="ln">4219</span> <b>while</b> (i--) <b>if</b> (drag[i].el<span class="s"> == </span><b>this</b>) {
</code><code id="L4220"><span class="ln">4220</span> R.unmousedown(drag[i].start);
</code><code id="L4221"><span class="ln">4221</span> drag.splice(i++, <span class="d">1</span>);
</code><code id="L4222"><span class="ln">4222</span> eve.unbind(<i>"drag.*."</i><span class="s"> + </span><b>this</b>.id);
</code><code id="L4223"><span class="ln">4223</span> }
</code><code id="L4224"><span class="ln">4224</span> !drag.length<span class="s"> &amp;&amp; </span>R.unmousemove(dragMove).unmouseup(dragUp);
</code><code id="L4225"><span class="ln">4225</span> };
</code><code id="L4226"><span class="ln">4226</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4227"><span class="ln">4227</span><span class="c"> <span class="s"> * </span>Paper.circle
</span></code><code id="L4228"><span class="ln">4228</span><span class="c"> [ method ]
</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"> <span class="s"> * </span>Draws a circle.
</span></code><code id="L4231"><span class="ln">4231</span><span class="c"> **
</span></code><code id="L4232"><span class="ln">4232</span><span class="c"> > Parameters
</span></code><code id="L4233"><span class="ln">4233</span><span class="c"> **
</span></code><code id="L4234"><span class="ln">4234</span><span class="c"> <span class="s"> - </span>x (number) x coordinate of the centre
</span></code><code id="L4235"><span class="ln">4235</span><span class="c"> <span class="s"> - </span>y (number) y coordinate of the centre
</span></code><code id="L4236"><span class="ln">4236</span><span class="c"> <span class="s"> - </span>r (number) radius
</span></code><code id="L4237"><span class="ln">4237</span><span class="c"> <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “circle”
</span></code><code id="L4238"><span class="ln">4238</span><span class="c"> **
</span></code><code id="L4239"><span class="ln">4239</span><span class="c"> > Usage
</span></code><code id="L4240"><span class="ln">4240</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="L4241"><span class="ln">4241</span><span class="c"> \*/</span>
</code><code id="L4242"><span class="ln">4242</span> paperproto.circle<span class="s"> = </span><b>function</b> (x, y, r) {
</code><code id="L4243"><span class="ln">4243</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="L4244"><span class="ln">4244</span> };
</code><code id="L4245"><span class="ln">4245</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4246"><span class="ln">4246</span><span class="c"> <span class="s"> * </span>Paper.rect
</span></code><code id="L4247"><span class="ln">4247</span><span class="c"> [ method ]
</span></code><code id="L4248"><span class="ln">4248</span><span class="c"> *
</span></code><code id="L4249"><span class="ln">4249</span><span class="c"> <span class="s"> * </span>Draws a rectangle.
</span></code><code id="L4250"><span class="ln">4250</span><span class="c"> **
</span></code><code id="L4251"><span class="ln">4251</span><span class="c"> > Parameters
</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"> <span class="s"> - </span>x (number) x coordinate of the top left corner
</span></code><code id="L4254"><span class="ln">4254</span><span class="c"> <span class="s"> - </span>y (number) y coordinate of the top left corner
</span></code><code id="L4255"><span class="ln">4255</span><span class="c"> <span class="s"> - </span>width (number) width
</span></code><code id="L4256"><span class="ln">4256</span><span class="c"> <span class="s"> - </span>height (number) height
</span></code><code id="L4257"><span class="ln">4257</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="L4258"><span class="ln">4258</span><span class="c"> <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “rect”
</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"> > Usage
</span></code><code id="L4261"><span class="ln">4261</span><span class="c"> <span class="s"> | </span><span class="c">// regular rectangle</span>
</span></code><code id="L4262"><span class="ln">4262</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="L4263"><span class="ln">4263</span><span class="c"> <span class="s"> | </span><span class="c">// rectangle <b>with</b> rounded corners</span>
</span></code><code id="L4264"><span class="ln">4264</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="L4265"><span class="ln">4265</span><span class="c"> \*/</span>
</code><code id="L4266"><span class="ln">4266</span> paperproto.rect<span class="s"> = </span><b>function</b> (x, y, w, h, r) {
</code><code id="L4267"><span class="ln">4267</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="L4268"><span class="ln">4268</span> };
</code><code id="L4269"><span class="ln">4269</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4270"><span class="ln">4270</span><span class="c"> <span class="s"> * </span>Paper.ellipse
</span></code><code id="L4271"><span class="ln">4271</span><span class="c"> [ method ]
</span></code><code id="L4272"><span class="ln">4272</span><span class="c"> **
</span></code><code id="L4273"><span class="ln">4273</span><span class="c"> <span class="s"> * </span>Draws an ellipse.
</span></code><code id="L4274"><span class="ln">4274</span><span class="c"> **
</span></code><code id="L4275"><span class="ln">4275</span><span class="c"> > Parameters
</span></code><code id="L4276"><span class="ln">4276</span><span class="c"> **
</span></code><code id="L4277"><span class="ln">4277</span><span class="c"> <span class="s"> - </span>x (number) x coordinate of the centre
</span></code><code id="L4278"><span class="ln">4278</span><span class="c"> <span class="s"> - </span>y (number) y coordinate of the centre
</span></code><code id="L4279"><span class="ln">4279</span><span class="c"> <span class="s"> - </span>rx (number) horizontal radius
</span></code><code id="L4280"><span class="ln">4280</span><span class="c"> <span class="s"> - </span>ry (number) vertical radius
</span></code><code id="L4281"><span class="ln">4281</span><span class="c"> <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “ellipse”
</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"> > Usage
</span></code><code id="L4284"><span class="ln">4284</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="L4285"><span class="ln">4285</span><span class="c"> \*/</span>
</code><code id="L4286"><span class="ln">4286</span> paperproto.ellipse<span class="s"> = </span><b>function</b> (x, y, rx, ry) {
</code><code id="L4287"><span class="ln">4287</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="L4288"><span class="ln">4288</span> };
</code><code id="L4289"><span class="ln">4289</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4290"><span class="ln">4290</span><span class="c"> <span class="s"> * </span>Paper.path
</span></code><code id="L4291"><span class="ln">4291</span><span class="c"> [ method ]
</span></code><code id="L4292"><span class="ln">4292</span><span class="c"> **
</span></code><code id="L4293"><span class="ln">4293</span><span class="c"> <span class="s"> * </span>Creates a path element by given path data string.
</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"> > Parameters
</span></code><code id="L4296"><span class="ln">4296</span><span class="c"> **
</span></code><code id="L4297"><span class="ln">4297</span><span class="c"> <span class="s"> - </span>pathString (string) path data <b>in</b> SVG path string format.
</span></code><code id="L4298"><span class="ln">4298</span><span class="c"> <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “ellipse”
</span></code><code id="L4299"><span class="ln">4299</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="L4300"><span class="ln">4300</span><span class="c"> **
</span></code><code id="L4301"><span class="ln">4301</span><span class="c"> > Usage
</span></code><code id="L4302"><span class="ln">4302</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="L4303"><span class="ln">4303</span><span class="c"> <span class="s"> | </span><span class="c">// draw a diagonal line:</span>
</span></code><code id="L4304"><span class="ln">4304</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="L4305"><span class="ln">4305</span><span class="c"> \*/</span>
</code><code id="L4306"><span class="ln">4306</span> paperproto.path<span class="s"> = </span><b>function</b> (pathString) {
</code><code id="L4307"><span class="ln">4307</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="L4308"><span class="ln">4308</span> <b>return</b> thePath(R.format[apply](R, arguments), <b>this</b>);
</code><code id="L4309"><span class="ln">4309</span> };
</code><code id="L4310"><span class="ln">4310</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4311"><span class="ln">4311</span><span class="c"> <span class="s"> * </span>Paper.image
</span></code><code id="L4312"><span class="ln">4312</span><span class="c"> [ method ]
</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"> <span class="s"> * </span>Embeds an image into the surface.
</span></code><code id="L4315"><span class="ln">4315</span><span class="c"> **
</span></code><code id="L4316"><span class="ln">4316</span><span class="c"> > Parameters
</span></code><code id="L4317"><span class="ln">4317</span><span class="c"> **
</span></code><code id="L4318"><span class="ln">4318</span><span class="c"> <span class="s"> - </span>src (string) URI of the source image
</span></code><code id="L4319"><span class="ln">4319</span><span class="c"> <span class="s"> - </span>x (number) x coordinate position
</span></code><code id="L4320"><span class="ln">4320</span><span class="c"> <span class="s"> - </span>y (number) y coordinate position
</span></code><code id="L4321"><span class="ln">4321</span><span class="c"> <span class="s"> - </span>width (number) width of the image
</span></code><code id="L4322"><span class="ln">4322</span><span class="c"> <span class="s"> - </span>height (number) height of the image
</span></code><code id="L4323"><span class="ln">4323</span><span class="c"> <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “image”
</span></code><code id="L4324"><span class="ln">4324</span><span class="c"> **
</span></code><code id="L4325"><span class="ln">4325</span><span class="c"> > Usage
</span></code><code id="L4326"><span class="ln">4326</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="L4327"><span class="ln">4327</span><span class="c"> \*/</span>
</code><code id="L4328"><span class="ln">4328</span> paperproto.image<span class="s"> = </span><b>function</b> (src, x, y, w, h) {
</code><code id="L4329"><span class="ln">4329</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="L4330"><span class="ln">4330</span> };
</code><code id="L4331"><span class="ln">4331</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4332"><span class="ln">4332</span><span class="c"> <span class="s"> * </span>Paper.text
</span></code><code id="L4333"><span class="ln">4333</span><span class="c"> [ method ]
</span></code><code id="L4334"><span class="ln">4334</span><span class="c"> **
</span></code><code id="L4335"><span class="ln">4335</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="L4336"><span class="ln">4336</span><span class="c"> **
</span></code><code id="L4337"><span class="ln">4337</span><span class="c"> > Parameters
</span></code><code id="L4338"><span class="ln">4338</span><span class="c"> **
</span></code><code id="L4339"><span class="ln">4339</span><span class="c"> <span class="s"> - </span>x (number) x coordinate position
</span></code><code id="L4340"><span class="ln">4340</span><span class="c"> <span class="s"> - </span>y (number) y coordinate position
</span></code><code id="L4341"><span class="ln">4341</span><span class="c"> <span class="s"> - </span>text (string) The text string to draw
</span></code><code id="L4342"><span class="ln">4342</span><span class="c"> <span class="s"> = </span>(object) Raphaël element object <b>with</b> type “text”
</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"> > Usage
</span></code><code id="L4345"><span class="ln">4345</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="L4346"><span class="ln">4346</span><span class="c"> \*/</span>
</code><code id="L4347"><span class="ln">4347</span> paperproto.text<span class="s"> = </span><b>function</b> (x, y, text) {
</code><code id="L4348"><span class="ln">4348</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="L4349"><span class="ln">4349</span> };
</code><code id="L4350"><span class="ln">4350</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4351"><span class="ln">4351</span><span class="c"> <span class="s"> * </span>Paper.set
</span></code><code id="L4352"><span class="ln">4352</span><span class="c"> [ method ]
</span></code><code id="L4353"><span class="ln">4353</span><span class="c"> **
</span></code><code id="L4354"><span class="ln">4354</span><span class="c"> <span class="s"> * </span>Creates array-like object to keep and operate several elements at once.
</span></code><code id="L4355"><span class="ln">4355</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="L4356"><span class="ln">4356</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="L4357"><span class="ln">4357</span><span class="c"> <span class="s"> = </span>(object) array-like object that represents set of elements
</span></code><code id="L4358"><span class="ln">4358</span><span class="c"> **
</span></code><code id="L4359"><span class="ln">4359</span><span class="c"> > Usage
</span></code><code id="L4360"><span class="ln">4360</span><span class="c"> <span class="s"> | </span><b>var</b> st<span class="s"> = </span>paper.set();
</span></code><code id="L4361"><span class="ln">4361</span><span class="c"> <span class="s"> | </span>st.push(
</span></code><code id="L4362"><span class="ln">4362</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="L4363"><span class="ln">4363</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="L4364"><span class="ln">4364</span><span class="c"> <span class="s"> | </span>);
</span></code><code id="L4365"><span class="ln">4365</span><span class="c"> <span class="s"> | </span>st.attr({fill: <i>"red"</i>});
</span></code><code id="L4366"><span class="ln">4366</span><span class="c"> \*/</span>
</code><code id="L4367"><span class="ln">4367</span> paperproto.set<span class="s"> = </span><b>function</b> (itemsArray) {
</code><code id="L4368"><span class="ln">4368</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="L4369"><span class="ln">4369</span> <b>return</b> <b>new</b> Set(itemsArray);
</code><code id="L4370"><span class="ln">4370</span> };
</code><code id="L4371"><span class="ln">4371</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4372"><span class="ln">4372</span><span class="c"> <span class="s"> * </span>Paper.setSize
</span></code><code id="L4373"><span class="ln">4373</span><span class="c"> [ method ]
</span></code><code id="L4374"><span class="ln">4374</span><span class="c"> **
</span></code><code id="L4375"><span class="ln">4375</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="L4376"><span class="ln">4376</span><span class="c"> **
</span></code><code id="L4377"><span class="ln">4377</span><span class="c"> > Parameters
</span></code><code id="L4378"><span class="ln">4378</span><span class="c"> **
</span></code><code id="L4379"><span class="ln">4379</span><span class="c"> <span class="s"> - </span>width (number) <b>new</b> width of the canvas
</span></code><code id="L4380"><span class="ln">4380</span><span class="c"> <span class="s"> - </span>height (number) <b>new</b> height of the canvas
</span></code><code id="L4381"><span class="ln">4381</span><span class="c"> > Usage
</span></code><code id="L4382"><span class="ln">4382</span><span class="c"> <span class="s"> | </span><b>var</b> st<span class="s"> = </span>paper.set();
</span></code><code id="L4383"><span class="ln">4383</span><span class="c"> <span class="s"> | </span>st.push(
</span></code><code id="L4384"><span class="ln">4384</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="L4385"><span class="ln">4385</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="L4386"><span class="ln">4386</span><span class="c"> <span class="s"> | </span>);
</span></code><code id="L4387"><span class="ln">4387</span><span class="c"> <span class="s"> | </span>st.attr({fill: <i>"red"</i>});
</span></code><code id="L4388"><span class="ln">4388</span><span class="c"> \*/</span>
</code><code id="L4389"><span class="ln">4389</span> paperproto.setSize<span class="s"> = </span>setSize;
</code><code id="L4390"><span class="ln">4390</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4391"><span class="ln">4391</span><span class="c"> <span class="s"> * </span>Paper.setViewBox
</span></code><code id="L4392"><span class="ln">4392</span><span class="c"> [ method ]
</span></code><code id="L4393"><span class="ln">4393</span><span class="c"> **
</span></code><code id="L4394"><span class="ln">4394</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="L4395"><span class="ln">4395</span><span class="c"> <span class="s"> * </span>specifying <b>new</b> boundaries.
</span></code><code id="L4396"><span class="ln">4396</span><span class="c"> **
</span></code><code id="L4397"><span class="ln">4397</span><span class="c"> > Parameters
</span></code><code id="L4398"><span class="ln">4398</span><span class="c"> **
</span></code><code id="L4399"><span class="ln">4399</span><span class="c"> x, y, w, h, fit
</span></code><code id="L4400"><span class="ln">4400</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="L4401"><span class="ln">4401</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="L4402"><span class="ln">4402</span><span class="c"> <span class="s"> - </span>w (number) <b>new</b> width of the canvas
</span></code><code id="L4403"><span class="ln">4403</span><span class="c"> <span class="s"> - </span>h (number) <b>new</b> height of the canvas
</span></code><code id="L4404"><span class="ln">4404</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="L4405"><span class="ln">4405</span><span class="c"> \*/</span>
</code><code id="L4406"><span class="ln">4406</span> paperproto.setViewBox<span class="s"> = </span>setViewBox;
</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.top
</span></code><code id="L4409"><span class="ln">4409</span><span class="c"> [ property ]
</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>Points to the topmost element on the paper
</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="c">/*\</span>
</span></code><code id="L4414"><span class="ln">4414</span><span class="c"> <span class="s"> * </span>Paper.bottom
</span></code><code id="L4415"><span class="ln">4415</span><span class="c"> [ property ]
</span></code><code id="L4416"><span class="ln">4416</span><span class="c"> **
</span></code><code id="L4417"><span class="ln">4417</span><span class="c"> <span class="s"> * </span>Points to the bottom element on the paper
</span></code><code id="L4418"><span class="ln">4418</span><span class="c"> \*/</span>
</code><code id="L4419"><span class="ln">4419</span> paperproto.top<span class="s"> = </span>paperproto.bottom<span class="s"> = </span><b>null</b>;
</code><code id="L4420"><span class="ln">4420</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4421"><span class="ln">4421</span><span class="c"> <span class="s"> * </span>Paper.raphael
</span></code><code id="L4422"><span class="ln">4422</span><span class="c"> [ property ]
</span></code><code id="L4423"><span class="ln">4423</span><span class="c"> **
</span></code><code id="L4424"><span class="ln">4424</span><span class="c"> <span class="s"> * </span>Points to the @Raphael object/<b>function</b>
</span></code><code id="L4425"><span class="ln">4425</span><span class="c"> \*/</span>
</code><code id="L4426"><span class="ln">4426</span> paperproto.raphael<span class="s"> = </span>R;
</code><code id="L4427"><span class="ln">4427</span> <b>var</b> getOffset<span class="s"> = </span><b>function</b> (elem) {
</code><code id="L4428"><span class="ln">4428</span> <b>var</b> box<span class="s"> = </span>elem.getBoundingClientRect(),
</code><code id="L4429"><span class="ln">4429</span> doc<span class="s"> = </span>elem.ownerDocument,
</code><code id="L4430"><span class="ln">4430</span> body<span class="s"> = </span>doc.body,
</code><code id="L4431"><span class="ln">4431</span> docElem<span class="s"> = </span>doc.documentElement,
</code><code id="L4432"><span class="ln">4432</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="L4433"><span class="ln">4433</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="L4434"><span class="ln">4434</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="L4435"><span class="ln">4435</span> <b>return</b> {
</code><code id="L4436"><span class="ln">4436</span> y: top,
</code><code id="L4437"><span class="ln">4437</span> x: left
</code><code id="L4438"><span class="ln">4438</span> };
</code><code id="L4439"><span class="ln">4439</span> };
</code><code id="L4440"><span class="ln">4440</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4441"><span class="ln">4441</span><span class="c"> <span class="s"> * </span>Paper.getElementByPoint
</span></code><code id="L4442"><span class="ln">4442</span><span class="c"> [ method ]
</span></code><code id="L4443"><span class="ln">4443</span><span class="c"> **
</span></code><code id="L4444"><span class="ln">4444</span><span class="c"> <span class="s"> * </span>Returns you topmost element under given point.
</span></code><code id="L4445"><span class="ln">4445</span><span class="c"> **
</span></code><code id="L4446"><span class="ln">4446</span><span class="c"> <span class="s"> = </span>(object) Raphaël element object
</span></code><code id="L4447"><span class="ln">4447</span><span class="c"> > Parameters
</span></code><code id="L4448"><span class="ln">4448</span><span class="c"> **
</span></code><code id="L4449"><span class="ln">4449</span><span class="c"> <span class="s"> - </span>x (number) x coordinate from the top left corner of the window
</span></code><code id="L4450"><span class="ln">4450</span><span class="c"> <span class="s"> - </span>y (number) y coordinate from the top left corner of the window
</span></code><code id="L4451"><span class="ln">4451</span><span class="c"> > Usage
</span></code><code id="L4452"><span class="ln">4452</span><span class="c"> <span class="s"> | </span>paper.getElementByPoint(mouseX, mouseY).attr({stroke: <i>"#f00"</i>});
</span></code><code id="L4453"><span class="ln">4453</span><span class="c"> \*/</span>
</code><code id="L4454"><span class="ln">4454</span> paperproto.getElementByPoint<span class="s"> = </span><b>function</b> (x, y) {
</code><code id="L4455"><span class="ln">4455</span> <b>var</b> paper<span class="s"> = </span><b>this</b>,
</code><code id="L4456"><span class="ln">4456</span> svg<span class="s"> = </span>paper.canvas,
</code><code id="L4457"><span class="ln">4457</span> target<span class="s"> = </span>g.doc.elementFromPoint(x, y);
</code><code id="L4458"><span class="ln">4458</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="L4459"><span class="ln">4459</span> <b>var</b> so<span class="s"> = </span>getOffset(svg),
</code><code id="L4460"><span class="ln">4460</span> sr<span class="s"> = </span>svg.createSVGRect();
</code><code id="L4461"><span class="ln">4461</span> sr.x<span class="s"> = </span>x<span class="s"> - </span>so.x;
</code><code id="L4462"><span class="ln">4462</span> sr.y<span class="s"> = </span>y<span class="s"> - </span>so.y;
</code><code id="L4463"><span class="ln">4463</span> sr.width<span class="s"> = </span>sr.height<span class="s"> = </span><span class="d">1</span>;
</code><code id="L4464"><span class="ln">4464</span> <b>var</b> hits<span class="s"> = </span>svg.getIntersectionList(sr, <b>null</b>);
</code><code id="L4465"><span class="ln">4465</span> <b>if</b> (hits.length) {
</code><code id="L4466"><span class="ln">4466</span> target<span class="s"> = </span>hits[hits.length<span class="s"> - </span><span class="d">1</span>];
</code><code id="L4467"><span class="ln">4467</span> }
</code><code id="L4468"><span class="ln">4468</span> }
</code><code id="L4469"><span class="ln">4469</span> <b>if</b> (!target) {
</code><code id="L4470"><span class="ln">4470</span> <b>return</b> <b>null</b>;
</code><code id="L4471"><span class="ln">4471</span> }
</code><code id="L4472"><span class="ln">4472</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="L4473"><span class="ln">4473</span> target<span class="s"> = </span>target.parentNode;
</code><code id="L4474"><span class="ln">4474</span> }
</code><code id="L4475"><span class="ln">4475</span> target<span class="s"> == </span>paper.canvas.parentNode<span class="s"> &amp;&amp; </span>(target<span class="s"> = </span>svg);
</code><code id="L4476"><span class="ln">4476</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="L4477"><span class="ln">4477</span> <b>return</b> target;
</code><code id="L4478"><span class="ln">4478</span> };
</code><code id="L4479"><span class="ln">4479</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4480"><span class="ln">4480</span><span class="c"> <span class="s"> * </span>Paper.getById
</span></code><code id="L4481"><span class="ln">4481</span><span class="c"> [ method ]
</span></code><code id="L4482"><span class="ln">4482</span><span class="c"> **
</span></code><code id="L4483"><span class="ln">4483</span><span class="c"> <span class="s"> * </span>Returns you element by its internal ID.
</span></code><code id="L4484"><span class="ln">4484</span><span class="c"> **
</span></code><code id="L4485"><span class="ln">4485</span><span class="c"> > Parameters
</span></code><code id="L4486"><span class="ln">4486</span><span class="c"> **
</span></code><code id="L4487"><span class="ln">4487</span><span class="c"> <span class="s"> - </span>id (number) id
</span></code><code id="L4488"><span class="ln">4488</span><span class="c"> <span class="s"> = </span>(object) Raphaël element object
</span></code><code id="L4489"><span class="ln">4489</span><span class="c"> \*/</span>
</code><code id="L4490"><span class="ln">4490</span> paperproto.getById<span class="s"> = </span><b>function</b> (id) {
</code><code id="L4491"><span class="ln">4491</span> <b>var</b> bot<span class="s"> = </span><b>this</b>.bottom;
</code><code id="L4492"><span class="ln">4492</span> <b>while</b> (bot) {
</code><code id="L4493"><span class="ln">4493</span> <b>if</b> (bot.id<span class="s"> == </span>id) {
</code><code id="L4494"><span class="ln">4494</span> <b>return</b> bot;
</code><code id="L4495"><span class="ln">4495</span> }
</code><code id="L4496"><span class="ln">4496</span> bot<span class="s"> = </span>bot.next;
</code><code id="L4497"><span class="ln">4497</span> }
</code><code id="L4498"><span class="ln">4498</span> <b>return</b> <b>null</b>;
</code><code id="L4499"><span class="ln">4499</span> };
</code><code id="L4500"><span class="ln">4500</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4501"><span class="ln">4501</span><span class="c"> <span class="s"> * </span>Paper.forEach
</span></code><code id="L4502"><span class="ln">4502</span><span class="c"> [ method ]
</span></code><code id="L4503"><span class="ln">4503</span><span class="c"> **
</span></code><code id="L4504"><span class="ln">4504</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="L4505"><span class="ln">4505</span><span class="c"> *
</span></code><code id="L4506"><span class="ln">4506</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="L4507"><span class="ln">4507</span><span class="c"> **
</span></code><code id="L4508"><span class="ln">4508</span><span class="c"> > Parameters
</span></code><code id="L4509"><span class="ln">4509</span><span class="c"> **
</span></code><code id="L4510"><span class="ln">4510</span><span class="c"> <span class="s"> - </span>callback (<b>function</b>) <b>function</b> to run
</span></code><code id="L4511"><span class="ln">4511</span><span class="c"> <span class="s"> - </span>thisArg (object) context object <b>for</b> the callback
</span></code><code id="L4512"><span class="ln">4512</span><span class="c"> <span class="s"> = </span>(object) Paper object
</span></code><code id="L4513"><span class="ln">4513</span><span class="c"> \*/</span>
</code><code id="L4514"><span class="ln">4514</span> paperproto.forEach<span class="s"> = </span><b>function</b> (callback, thisArg) {
</code><code id="L4515"><span class="ln">4515</span> <b>var</b> bot<span class="s"> = </span><b>this</b>.bottom;
</code><code id="L4516"><span class="ln">4516</span> <b>while</b> (bot) {
</code><code id="L4517"><span class="ln">4517</span> <b>if</b> (callback.call(thisArg, bot)<span class="s"> === </span><b>false</b>) {
</code><code id="L4518"><span class="ln">4518</span> <b>return</b> <b>this</b>;
</code><code id="L4519"><span class="ln">4519</span> }
</code><code id="L4520"><span class="ln">4520</span> bot<span class="s"> = </span>bot.next;
</code><code id="L4521"><span class="ln">4521</span> }
</code><code id="L4522"><span class="ln">4522</span> <b>return</b> <b>this</b>;
</code><code id="L4523"><span class="ln">4523</span> };
</code><code id="L4524"><span class="ln">4524</span> <b>function</b> x_y() {
</code><code id="L4525"><span class="ln">4525</span> <b>return</b> <b>this</b>.x<span class="s"> + </span>S<span class="s"> + </span><b>this</b>.y;
</code><code id="L4526"><span class="ln">4526</span> }
</code><code id="L4527"><span class="ln">4527</span> <b>function</b> x_y_w_h() {
</code><code id="L4528"><span class="ln">4528</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="L4529"><span class="ln">4529</span> }
</code><code id="L4530"><span class="ln">4530</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4531"><span class="ln">4531</span><span class="c"> <span class="s"> * </span>Element.getBBox
</span></code><code id="L4532"><span class="ln">4532</span><span class="c"> [ method ]
</span></code><code id="L4533"><span class="ln">4533</span><span class="c"> **
</span></code><code id="L4534"><span class="ln">4534</span><span class="c"> <span class="s"> * </span>Return bounding box <b>for</b> a given element
</span></code><code id="L4535"><span class="ln">4535</span><span class="c"> **
</span></code><code id="L4536"><span class="ln">4536</span><span class="c"> > Parameters
</span></code><code id="L4537"><span class="ln">4537</span><span class="c"> **
</span></code><code id="L4538"><span class="ln">4538</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="L4539"><span class="ln">4539</span><span class="c"> <span class="s"> = </span>(object) Bounding box object:
</span></code><code id="L4540"><span class="ln">4540</span><span class="c"> o {
</span></code><code id="L4541"><span class="ln">4541</span><span class="c"> o x: (number) top left corner x
</span></code><code id="L4542"><span class="ln">4542</span><span class="c"> o y: (number) top left corner y
</span></code><code id="L4543"><span class="ln">4543</span><span class="c"> o width: (number) width
</span></code><code id="L4544"><span class="ln">4544</span><span class="c"> o height: (number) height
</span></code><code id="L4545"><span class="ln">4545</span><span class="c"> o }
</span></code><code id="L4546"><span class="ln">4546</span><span class="c"> \*/</span>
</code><code id="L4547"><span class="ln">4547</span> elproto.getBBox<span class="s"> = </span><b>function</b> (isWithoutTransform) {
</code><code id="L4548"><span class="ln">4548</span> <b>if</b> (<b>this</b>.removed) {
</code><code id="L4549"><span class="ln">4549</span> <b>return</b> {};
</code><code id="L4550"><span class="ln">4550</span> }
</code><code id="L4551"><span class="ln">4551</span> <b>var</b> _<span class="s"> = </span><b>this</b>._;
</code><code id="L4552"><span class="ln">4552</span> <b>if</b> (isWithoutTransform) {
</code><code id="L4553"><span class="ln">4553</span> <b>if</b> (_.dirty<span class="s"> || </span>!_.bboxwt) {
</code><code id="L4554"><span class="ln">4554</span> <b>this</b>.realPath<span class="s"> = </span>getPath[<b>this</b>.type](<b>this</b>);
</code><code id="L4555"><span class="ln">4555</span> _.bboxwt<span class="s"> = </span>pathDimensions(<b>this</b>.realPath);
</code><code id="L4556"><span class="ln">4556</span> _.bboxwt.toString<span class="s"> = </span>x_y_w_h;
</code><code id="L4557"><span class="ln">4557</span> _.dirty<span class="s"> = </span><span class="d">0</span>;
</code><code id="L4558"><span class="ln">4558</span> }
</code><code id="L4559"><span class="ln">4559</span> <b>return</b> _.bboxwt;
</code><code id="L4560"><span class="ln">4560</span> }
</code><code id="L4561"><span class="ln">4561</span> <b>if</b> (_.dirty<span class="s"> || </span>_.dirtyT<span class="s"> || </span>!_.bbox) {
</code><code id="L4562"><span class="ln">4562</span> <b>if</b> (_.dirty<span class="s"> || </span>!<b>this</b>.realPath) {
</code><code id="L4563"><span class="ln">4563</span> _.bboxwt<span class="s"> = </span><span class="d">0</span>;
</code><code id="L4564"><span class="ln">4564</span> <b>this</b>.realPath<span class="s"> = </span>getPath[<b>this</b>.type](<b>this</b>);
</code><code id="L4565"><span class="ln">4565</span> }
</code><code id="L4566"><span class="ln">4566</span> _.bbox<span class="s"> = </span>pathDimensions(mapPath(<b>this</b>.realPath, <b>this</b>.matrix));
</code><code id="L4567"><span class="ln">4567</span> _.bbox.toString<span class="s"> = </span>x_y_w_h;
</code><code id="L4568"><span class="ln">4568</span> _.dirty<span class="s"> = </span>_.dirtyT<span class="s"> = </span><span class="d">0</span>;
</code><code id="L4569"><span class="ln">4569</span> }
</code><code id="L4570"><span class="ln">4570</span> <b>return</b> _.bbox;
</code><code id="L4571"><span class="ln">4571</span> };
</code><code id="L4572"><span class="ln">4572</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4573"><span class="ln">4573</span><span class="c"> <span class="s"> * </span>Element.clone
</span></code><code id="L4574"><span class="ln">4574</span><span class="c"> [ method ]
</span></code><code id="L4575"><span class="ln">4575</span><span class="c"> **
</span></code><code id="L4576"><span class="ln">4576</span><span class="c"> <span class="s"> = </span>(object) clone of a given element
</span></code><code id="L4577"><span class="ln">4577</span><span class="c"> **
</span></code><code id="L4578"><span class="ln">4578</span><span class="c"> \*/</span>
</code><code id="L4579"><span class="ln">4579</span> elproto.clone<span class="s"> = </span><b>function</b> () {
</code><code id="L4580"><span class="ln">4580</span> <b>if</b> (<b>this</b>.removed) {
</code><code id="L4581"><span class="ln">4581</span> <b>return</b> <b>null</b>;
</code><code id="L4582"><span class="ln">4582</span> }
</code><code id="L4583"><span class="ln">4583</span> <b>var</b> attr<span class="s"> = </span><b>this</b>.attr();
</code><code id="L4584"><span class="ln">4584</span> <b>delete</b> attr.scale;
</code><code id="L4585"><span class="ln">4585</span> <b>delete</b> attr.translation;
</code><code id="L4586"><span class="ln">4586</span> <b>return</b> <b>this</b>.paper[<b>this</b>.type]().attr(attr);
</code><code id="L4587"><span class="ln">4587</span> };
</code><code id="L4588"><span class="ln">4588</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4589"><span class="ln">4589</span><span class="c"> <span class="s"> * </span>Element.glow
</span></code><code id="L4590"><span class="ln">4590</span><span class="c"> [ method ]
</span></code><code id="L4591"><span class="ln">4591</span><span class="c"> **
</span></code><code id="L4592"><span class="ln">4592</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="L4593"><span class="ln">4593</span><span class="c"> *
</span></code><code id="L4594"><span class="ln">4594</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="L4595"><span class="ln">4595</span><span class="c"> **
</span></code><code id="L4596"><span class="ln">4596</span><span class="c"> > Parameters
</span></code><code id="L4597"><span class="ln">4597</span><span class="c"> **
</span></code><code id="L4598"><span class="ln">4598</span><span class="c"> <span class="s"> - </span>glow (object) #optional parameters object <b>with</b> all properties optional:
</span></code><code id="L4599"><span class="ln">4599</span><span class="c"> o {
</span></code><code id="L4600"><span class="ln">4600</span><span class="c"> o width (number) size of the glow, <b>default</b> is `<span class="d">10</span>`
</span></code><code id="L4601"><span class="ln">4601</span><span class="c"> o fill (<b>boolean</b>) will it be filled, <b>default</b> is `<b>false</b>`
</span></code><code id="L4602"><span class="ln">4602</span><span class="c"> o opacity: opacity, <b>default</b> is `<span class="d">0.5</span>`
</span></code><code id="L4603"><span class="ln">4603</span><span class="c"> o offsetx: horizontal offset, <b>default</b> is `<span class="d">0</span>`
</span></code><code id="L4604"><span class="ln">4604</span><span class="c"> o offsety: vertical offset, <b>default</b> is `<span class="d">0</span>`
</span></code><code id="L4605"><span class="ln">4605</span><span class="c"> o color: glow colour, <b>default</b> is `black`
</span></code><code id="L4606"><span class="ln">4606</span><span class="c"> o }
</span></code><code id="L4607"><span class="ln">4607</span><span class="c"> <span class="s"> = </span>(object) @Paper.set of elements that represents glow
</span></code><code id="L4608"><span class="ln">4608</span><span class="c"> \*/</span>
</code><code id="L4609"><span class="ln">4609</span> elproto.glow<span class="s"> = </span><b>function</b> (glow) {
</code><code id="L4610"><span class="ln">4610</span> <b>if</b> (<b>this</b>.type<span class="s"> == </span><i>"text"</i>) {
</code><code id="L4611"><span class="ln">4611</span> <b>return</b> <b>null</b>;
</code><code id="L4612"><span class="ln">4612</span> }
</code><code id="L4613"><span class="ln">4613</span> glow<span class="s"> = </span>glow<span class="s"> || </span>{};
</code><code id="L4614"><span class="ln">4614</span> <b>var</b> s<span class="s"> = </span>{
</code><code id="L4615"><span class="ln">4615</span> width: (glow.width<span class="s"> || </span><span class="d">10</span>)<span class="s"> + </span>(+<b>this</b>.attr(<i>"stroke-width"</i>)<span class="s"> || </span><span class="d">1</span>),
</code><code id="L4616"><span class="ln">4616</span> fill: glow.fill<span class="s"> || </span><b>false</b>,
</code><code id="L4617"><span class="ln">4617</span> opacity: glow.opacity<span class="s"> || </span><span class="d">.5</span>,
</code><code id="L4618"><span class="ln">4618</span> offsetx: glow.offsetx<span class="s"> || </span><span class="d">0</span>,
</code><code id="L4619"><span class="ln">4619</span> offsety: glow.offsety<span class="s"> || </span><span class="d">0</span>,
</code><code id="L4620"><span class="ln">4620</span> color: glow.color<span class="s"> || </span><i>"#<span class="d">000</span>"</i>
</code><code id="L4621"><span class="ln">4621</span> },
</code><code id="L4622"><span class="ln">4622</span> c<span class="s"> = </span>s.width<span class="s"> / </span><span class="d">2</span>,
</code><code id="L4623"><span class="ln">4623</span> r<span class="s"> = </span><b>this</b>.paper,
</code><code id="L4624"><span class="ln">4624</span> out<span class="s"> = </span>r.set(),
</code><code id="L4625"><span class="ln">4625</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="L4626"><span class="ln">4626</span> path<span class="s"> = </span><b>this</b>.matrix ? mapPath(path, <b>this</b>.matrix) : path;
</code><code id="L4627"><span class="ln">4627</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="L4628"><span class="ln">4628</span> out.push(r.path(path).attr({
</code><code id="L4629"><span class="ln">4629</span> stroke: s.color,
</code><code id="L4630"><span class="ln">4630</span> fill: s.fill ? s.color : <i>"none"</i>,
</code><code id="L4631"><span class="ln">4631</span> <i>"stroke-linejoin"</i>: <i>"round"</i>,
</code><code id="L4632"><span class="ln">4632</span> <i>"stroke-linecap"</i>: <i>"round"</i>,
</code><code id="L4633"><span class="ln">4633</span> <i>"stroke-width"</i>: +(s.width<span class="s"> / </span>c<span class="s"> * </span>i).toFixed(<span class="d">3</span>),
</code><code id="L4634"><span class="ln">4634</span> opacity: +(s.opacity<span class="s"> / </span>c).toFixed(<span class="d">3</span>)
</code><code id="L4635"><span class="ln">4635</span> }));
</code><code id="L4636"><span class="ln">4636</span> }
</code><code id="L4637"><span class="ln">4637</span> <b>return</b> out.insertBefore(<b>this</b>).translate(s.offsetx, s.offsety);
</code><code id="L4638"><span class="ln">4638</span> };
</code><code id="L4639"><span class="ln">4639</span> <b>var</b> curveslengths<span class="s"> = </span>{},
</code><code id="L4640"><span class="ln">4640</span> getPointAtSegmentLength<span class="s"> = </span><b>function</b> (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, length) {
</code><code id="L4641"><span class="ln">4641</span> <b>var</b> len<span class="s"> = </span><span class="d">0</span>,
</code><code id="L4642"><span class="ln">4642</span> precision<span class="s"> = </span><span class="d">100</span>,
</code><code id="L4643"><span class="ln">4643</span> name<span class="s"> = </span>[p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y].join(),
</code><code id="L4644"><span class="ln">4644</span> cache<span class="s"> = </span>curveslengths[name],
</code><code id="L4645"><span class="ln">4645</span> old, dot;
</code><code id="L4646"><span class="ln">4646</span> !cache<span class="s"> &amp;&amp; </span>(curveslengths[name]<span class="s"> = </span>cache<span class="s"> = </span>{data: []});
</code><code id="L4647"><span class="ln">4647</span> cache.timer<span class="s"> &amp;&amp; </span>clearTimeout(cache.timer);
</code><code id="L4648"><span class="ln">4648</span> cache.timer<span class="s"> = </span>setTimeout(<b>function</b> () {<b>delete</b> curveslengths[name];}, <span class="d">2e3</span>);
</code><code id="L4649"><span class="ln">4649</span> <b>if</b> (length != <b>null</b><span class="s"> &amp;&amp; </span>!cache.precision) {
</code><code id="L4650"><span class="ln">4650</span> <b>var</b> total<span class="s"> = </span>getPointAtSegmentLength(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y);
</code><code id="L4651"><span class="ln">4651</span> cache.precision<span class="s"> = </span>~~total<span class="s"> * </span><span class="d">10</span>;
</code><code id="L4652"><span class="ln">4652</span> cache.data<span class="s"> = </span>[];
</code><code id="L4653"><span class="ln">4653</span> }
</code><code id="L4654"><span class="ln">4654</span> precision<span class="s"> = </span>cache.precision<span class="s"> || </span>precision;
</code><code id="L4655"><span class="ln">4655</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="L4656"><span class="ln">4656</span> <b>if</b> (cache.data[i<span class="s"> * </span>precision]) {
</code><code id="L4657"><span class="ln">4657</span> dot<span class="s"> = </span>cache.data[i<span class="s"> * </span>precision];
</code><code id="L4658"><span class="ln">4658</span> } <b>else</b> {
</code><code id="L4659"><span class="ln">4659</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="L4660"><span class="ln">4660</span> cache.data[i<span class="s"> * </span>precision]<span class="s"> = </span>dot;
</code><code id="L4661"><span class="ln">4661</span> }
</code><code id="L4662"><span class="ln">4662</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="L4663"><span class="ln">4663</span> <b>if</b> (length != <b>null</b><span class="s"> &amp;&amp; </span>len >= length) {
</code><code id="L4664"><span class="ln">4664</span> <b>return</b> dot;
</code><code id="L4665"><span class="ln">4665</span> }
</code><code id="L4666"><span class="ln">4666</span> old<span class="s"> = </span>dot;
</code><code id="L4667"><span class="ln">4667</span> }
</code><code id="L4668"><span class="ln">4668</span> <b>if</b> (length<span class="s"> == </span><b>null</b>) {
</code><code id="L4669"><span class="ln">4669</span> <b>return</b> len;
</code><code id="L4670"><span class="ln">4670</span> }
</code><code id="L4671"><span class="ln">4671</span> },
</code><code id="L4672"><span class="ln">4672</span> getLengthFactory<span class="s"> = </span><b>function</b> (istotal, subpath) {
</code><code id="L4673"><span class="ln">4673</span> <b>return</b> <b>function</b> (path, length, onlystart) {
</code><code id="L4674"><span class="ln">4674</span> path<span class="s"> = </span>path2curve(path);
</code><code id="L4675"><span class="ln">4675</span> <b>var</b> x, y, p, l, sp<span class="s"> = </span><i>""</i>, subpaths<span class="s"> = </span>{}, point,
</code><code id="L4676"><span class="ln">4676</span> len<span class="s"> = </span><span class="d">0</span>;
</code><code id="L4677"><span class="ln">4677</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="L4678"><span class="ln">4678</span> p<span class="s"> = </span>path[i];
</code><code id="L4679"><span class="ln">4679</span> <b>if</b> (p[<span class="d">0</span>]<span class="s"> == </span><i>"M"</i>) {
</code><code id="L4680"><span class="ln">4680</span> x<span class="s"> = </span>+p[<span class="d">1</span>];
</code><code id="L4681"><span class="ln">4681</span> y<span class="s"> = </span>+p[<span class="d">2</span>];
</code><code id="L4682"><span class="ln">4682</span> } <b>else</b> {
</code><code id="L4683"><span class="ln">4683</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="L4684"><span class="ln">4684</span> <b>if</b> (len<span class="s"> + </span>l > length) {
</code><code id="L4685"><span class="ln">4685</span> <b>if</b> (subpath<span class="s"> &amp;&amp; </span>!subpaths.start) {
</code><code id="L4686"><span class="ln">4686</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="L4687"><span class="ln">4687</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="L4688"><span class="ln">4688</span> <b>if</b> (onlystart) {<b>return</b> sp;}
</code><code id="L4689"><span class="ln">4689</span> subpaths.start<span class="s"> = </span>sp;
</code><code id="L4690"><span class="ln">4690</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="L4691"><span class="ln">4691</span> len += l;
</code><code id="L4692"><span class="ln">4692</span> x<span class="s"> = </span>+p[<span class="d">5</span>];
</code><code id="L4693"><span class="ln">4693</span> y<span class="s"> = </span>+p[<span class="d">6</span>];
</code><code id="L4694"><span class="ln">4694</span> <b>continue</b>;
</code><code id="L4695"><span class="ln">4695</span> }
</code><code id="L4696"><span class="ln">4696</span> <b>if</b> (!istotal<span class="s"> &amp;&amp; </span>!subpath) {
</code><code id="L4697"><span class="ln">4697</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="L4698"><span class="ln">4698</span> <b>return</b> {x: point.x, y: point.y, alpha: point.alpha};
</code><code id="L4699"><span class="ln">4699</span> }
</code><code id="L4700"><span class="ln">4700</span> }
</code><code id="L4701"><span class="ln">4701</span> len += l;
</code><code id="L4702"><span class="ln">4702</span> x<span class="s"> = </span>+p[<span class="d">5</span>];
</code><code id="L4703"><span class="ln">4703</span> y<span class="s"> = </span>+p[<span class="d">6</span>];
</code><code id="L4704"><span class="ln">4704</span> }
</code><code id="L4705"><span class="ln">4705</span> sp += p.shift()<span class="s"> + </span>p;
</code><code id="L4706"><span class="ln">4706</span> }
</code><code id="L4707"><span class="ln">4707</span> subpaths.end<span class="s"> = </span>sp;
</code><code id="L4708"><span class="ln">4708</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="L4709"><span class="ln">4709</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="L4710"><span class="ln">4710</span> <b>return</b> point;
</code><code id="L4711"><span class="ln">4711</span> };
</code><code id="L4712"><span class="ln">4712</span> };
</code><code id="L4713"><span class="ln">4713</span> <b>var</b> getTotalLength<span class="s"> = </span>getLengthFactory(<span class="d">1</span>),
</code><code id="L4714"><span class="ln">4714</span> getPointAtLength<span class="s"> = </span>getLengthFactory(),
</code><code id="L4715"><span class="ln">4715</span> getSubpathsAtLength<span class="s"> = </span>getLengthFactory(<span class="d">0</span>, <span class="d">1</span>);
</code><code id="L4716"><span class="ln">4716</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4717"><span class="ln">4717</span><span class="c"> <span class="s"> * </span>Raphael.getTotalLength
</span></code><code id="L4718"><span class="ln">4718</span><span class="c"> [ method ]
</span></code><code id="L4719"><span class="ln">4719</span><span class="c"> **
</span></code><code id="L4720"><span class="ln">4720</span><span class="c"> <span class="s"> * </span>Returns length of the given path <b>in</b> pixels.
</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"> > Parameters
</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>path (string) SVG path string.
</span></code><code id="L4725"><span class="ln">4725</span><span class="c"> **
</span></code><code id="L4726"><span class="ln">4726</span><span class="c"> <span class="s"> = </span>(number) length.
</span></code><code id="L4727"><span class="ln">4727</span><span class="c"> \*/</span>
</code><code id="L4728"><span class="ln">4728</span> R.getTotalLength<span class="s"> = </span>getTotalLength;
</code><code id="L4729"><span class="ln">4729</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4730"><span class="ln">4730</span><span class="c"> <span class="s"> * </span>Raphael.getPointAtLength
</span></code><code id="L4731"><span class="ln">4731</span><span class="c"> [ method ]
</span></code><code id="L4732"><span class="ln">4732</span><span class="c"> **
</span></code><code id="L4733"><span class="ln">4733</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="L4734"><span class="ln">4734</span><span class="c"> **
</span></code><code id="L4735"><span class="ln">4735</span><span class="c"> > Parameters
</span></code><code id="L4736"><span class="ln">4736</span><span class="c"> **
</span></code><code id="L4737"><span class="ln">4737</span><span class="c"> <span class="s"> - </span>path (string) SVG path string
</span></code><code id="L4738"><span class="ln">4738</span><span class="c"> <span class="s"> - </span>length (number)
</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"> <span class="s"> = </span>(object) representation of the point:
</span></code><code id="L4741"><span class="ln">4741</span><span class="c"> o {
</span></code><code id="L4742"><span class="ln">4742</span><span class="c"> o x: (number) x coordinate
</span></code><code id="L4743"><span class="ln">4743</span><span class="c"> o y: (number) y coordinate
</span></code><code id="L4744"><span class="ln">4744</span><span class="c"> o alpha: (number) angle of derivative
</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"> \*/</span>
</code><code id="L4747"><span class="ln">4747</span> R.getPointAtLength<span class="s"> = </span>getPointAtLength;
</code><code id="L4748"><span class="ln">4748</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4749"><span class="ln">4749</span><span class="c"> <span class="s"> * </span>Raphael.getSubpath
</span></code><code id="L4750"><span class="ln">4750</span><span class="c"> [ method ]
</span></code><code id="L4751"><span class="ln">4751</span><span class="c"> **
</span></code><code id="L4752"><span class="ln">4752</span><span class="c"> <span class="s"> * </span>Return subpath of a given path from given length to given length.
</span></code><code id="L4753"><span class="ln">4753</span><span class="c"> **
</span></code><code id="L4754"><span class="ln">4754</span><span class="c"> > Parameters
</span></code><code id="L4755"><span class="ln">4755</span><span class="c"> **
</span></code><code id="L4756"><span class="ln">4756</span><span class="c"> <span class="s"> - </span>path (string) SVG path string
</span></code><code id="L4757"><span class="ln">4757</span><span class="c"> <span class="s"> - </span>from (number) position of the start of the segment
</span></code><code id="L4758"><span class="ln">4758</span><span class="c"> <span class="s"> - </span>to (number) position of the end of the segment
</span></code><code id="L4759"><span class="ln">4759</span><span class="c"> **
</span></code><code id="L4760"><span class="ln">4760</span><span class="c"> <span class="s"> = </span>(string) pathstring <b>for</b> the segment
</span></code><code id="L4761"><span class="ln">4761</span><span class="c"> \*/</span>
</code><code id="L4762"><span class="ln">4762</span> R.getSubpath<span class="s"> = </span><b>function</b> (path, from, to) {
</code><code id="L4763"><span class="ln">4763</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="L4764"><span class="ln">4764</span> <b>return</b> getSubpathsAtLength(path, from).end;
</code><code id="L4765"><span class="ln">4765</span> }
</code><code id="L4766"><span class="ln">4766</span> <b>var</b> a<span class="s"> = </span>getSubpathsAtLength(path, to, <span class="d">1</span>);
</code><code id="L4767"><span class="ln">4767</span> <b>return</b> from ? getSubpathsAtLength(a, from).end : a;
</code><code id="L4768"><span class="ln">4768</span> };
</code><code id="L4769"><span class="ln">4769</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4770"><span class="ln">4770</span><span class="c"> <span class="s"> * </span>Element.getTotalLength
</span></code><code id="L4771"><span class="ln">4771</span><span class="c"> [ method ]
</span></code><code id="L4772"><span class="ln">4772</span><span class="c"> **
</span></code><code id="L4773"><span class="ln">4773</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="L4774"><span class="ln">4774</span><span class="c"> <span class="s"> = </span>(number) length.
</span></code><code id="L4775"><span class="ln">4775</span><span class="c"> \*/</span>
</code><code id="L4776"><span class="ln">4776</span> elproto.getTotalLength<span class="s"> = </span><b>function</b> () {
</code><code id="L4777"><span class="ln">4777</span> <b>if</b> (<b>this</b>.type != <i>"path"</i>) {<b>return</b>;}
</code><code id="L4778"><span class="ln">4778</span> <b>if</b> (<b>this</b>.node.getTotalLength) {
</code><code id="L4779"><span class="ln">4779</span> <b>return</b> <b>this</b>.node.getTotalLength();
</code><code id="L4780"><span class="ln">4780</span> }
</code><code id="L4781"><span class="ln">4781</span> <b>return</b> getTotalLength(<b>this</b>.attrs.path);
</code><code id="L4782"><span class="ln">4782</span> };
</code><code id="L4783"><span class="ln">4783</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4784"><span class="ln">4784</span><span class="c"> <span class="s"> * </span>Element.getPointAtLength
</span></code><code id="L4785"><span class="ln">4785</span><span class="c"> [ method ]
</span></code><code id="L4786"><span class="ln">4786</span><span class="c"> **
</span></code><code id="L4787"><span class="ln">4787</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="L4788"><span class="ln">4788</span><span class="c"> **
</span></code><code id="L4789"><span class="ln">4789</span><span class="c"> > Parameters
</span></code><code id="L4790"><span class="ln">4790</span><span class="c"> **
</span></code><code id="L4791"><span class="ln">4791</span><span class="c"> <span class="s"> - </span>length (number)
</span></code><code id="L4792"><span class="ln">4792</span><span class="c"> **
</span></code><code id="L4793"><span class="ln">4793</span><span class="c"> <span class="s"> = </span>(object) representation of the point:
</span></code><code id="L4794"><span class="ln">4794</span><span class="c"> o {
</span></code><code id="L4795"><span class="ln">4795</span><span class="c"> o x: (number) x coordinate
</span></code><code id="L4796"><span class="ln">4796</span><span class="c"> o y: (number) y coordinate
</span></code><code id="L4797"><span class="ln">4797</span><span class="c"> o alpha: (number) angle of derivative
</span></code><code id="L4798"><span class="ln">4798</span><span class="c"> o }
</span></code><code id="L4799"><span class="ln">4799</span><span class="c"> \*/</span>
</code><code id="L4800"><span class="ln">4800</span> elproto.getPointAtLength<span class="s"> = </span><b>function</b> (length) {
</code><code id="L4801"><span class="ln">4801</span> <b>if</b> (<b>this</b>.type != <i>"path"</i>) {<b>return</b>;}
</code><code id="L4802"><span class="ln">4802</span> <b>return</b> getPointAtLength(<b>this</b>.attrs.path, length);
</code><code id="L4803"><span class="ln">4803</span> };
</code><code id="L4804"><span class="ln">4804</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4805"><span class="ln">4805</span><span class="c"> <span class="s"> * </span>Element.getSubpath
</span></code><code id="L4806"><span class="ln">4806</span><span class="c"> [ method ]
</span></code><code id="L4807"><span class="ln">4807</span><span class="c"> **
</span></code><code id="L4808"><span class="ln">4808</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="L4809"><span class="ln">4809</span><span class="c"> **
</span></code><code id="L4810"><span class="ln">4810</span><span class="c"> > Parameters
</span></code><code id="L4811"><span class="ln">4811</span><span class="c"> **
</span></code><code id="L4812"><span class="ln">4812</span><span class="c"> <span class="s"> - </span>from (number) position of the start of the segment
</span></code><code id="L4813"><span class="ln">4813</span><span class="c"> <span class="s"> - </span>to (number) position of the end of the segment
</span></code><code id="L4814"><span class="ln">4814</span><span class="c"> **
</span></code><code id="L4815"><span class="ln">4815</span><span class="c"> <span class="s"> = </span>(string) pathstring <b>for</b> the segment
</span></code><code id="L4816"><span class="ln">4816</span><span class="c"> \*/</span>
</code><code id="L4817"><span class="ln">4817</span> elproto.getSubpath<span class="s"> = </span><b>function</b> (from, to) {
</code><code id="L4818"><span class="ln">4818</span> <b>if</b> (<b>this</b>.type != <i>"path"</i>) {<b>return</b>;}
</code><code id="L4819"><span class="ln">4819</span> <b>return</b> R.getSubpath(<b>this</b>.attrs.path, from, to);
</code><code id="L4820"><span class="ln">4820</span> };
</code><code id="L4821"><span class="ln">4821</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L4822"><span class="ln">4822</span><span class="c"> <span class="s"> * </span>Raphael.easing_formulas
</span></code><code id="L4823"><span class="ln">4823</span><span class="c"> [ property ]
</span></code><code id="L4824"><span class="ln">4824</span><span class="c"> **
</span></code><code id="L4825"><span class="ln">4825</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="L4826"><span class="ln">4826</span><span class="c"> # &lt;ul>
</span></code><code id="L4827"><span class="ln">4827</span><span class="c"> # &lt;li>“linear”&lt;/li>
</span></code><code id="L4828"><span class="ln">4828</span><span class="c"> # &lt;li>“&lt;” or “easeIn” or “ease-<b>in</b>”&lt;/li>
</span></code><code id="L4829"><span class="ln">4829</span><span class="c"> # &lt;li>“>” or “easeOut” or “ease-out”&lt;/li>
</span></code><code id="L4830"><span class="ln">4830</span><span class="c"> # &lt;li>“&lt;>” or “easeInOut” or “ease-<b>in</b>-out”&lt;/li>
</span></code><code id="L4831"><span class="ln">4831</span><span class="c"> # &lt;li>“backIn” or “back-<b>in</b>”&lt;/li>
</span></code><code id="L4832"><span class="ln">4832</span><span class="c"> # &lt;li>“backOut” or “back-out”&lt;/li>
</span></code><code id="L4833"><span class="ln">4833</span><span class="c"> # &lt;li>“elastic”&lt;/li>
</span></code><code id="L4834"><span class="ln">4834</span><span class="c"> # &lt;li>“bounce”&lt;/li>
</span></code><code id="L4835"><span class="ln">4835</span><span class="c"> # &lt;/ul>
</span></code><code id="L4836"><span class="ln">4836</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="L4837"><span class="ln">4837</span><span class="c"> \*/</span>
</code><code id="L4838"><span class="ln">4838</span> <b>var</b> ef<span class="s"> = </span>R.easing_formulas<span class="s"> = </span>{
</code><code id="L4839"><span class="ln">4839</span> linear: <b>function</b> (n) {
</code><code id="L4840"><span class="ln">4840</span> <b>return</b> n;
</code><code id="L4841"><span class="ln">4841</span> },
</code><code id="L4842"><span class="ln">4842</span> <i>"&lt;"</i>: <b>function</b> (n) {
</code><code id="L4843"><span class="ln">4843</span> <b>return</b> pow(n, <span class="d">1.7</span>);
</code><code id="L4844"><span class="ln">4844</span> },
</code><code id="L4845"><span class="ln">4845</span> <i>">"</i>: <b>function</b> (n) {
</code><code id="L4846"><span class="ln">4846</span> <b>return</b> pow(n, <span class="d">.48</span>);
</code><code id="L4847"><span class="ln">4847</span> },
</code><code id="L4848"><span class="ln">4848</span> <i>"&lt;>"</i>: <b>function</b> (n) {
</code><code id="L4849"><span class="ln">4849</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="L4850"><span class="ln">4850</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="L4851"><span class="ln">4851</span> x<span class="s"> = </span>Q<span class="s"> - </span>q,
</code><code id="L4852"><span class="ln">4852</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="L4853"><span class="ln">4853</span> y<span class="s"> = </span>-Q<span class="s"> - </span>q,
</code><code id="L4854"><span class="ln">4854</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="L4855"><span class="ln">4855</span> t<span class="s"> = </span>X<span class="s"> + </span>Y<span class="s"> + </span><span class="d">.5</span>;
</code><code id="L4856"><span class="ln">4856</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="L4857"><span class="ln">4857</span> },
</code><code id="L4858"><span class="ln">4858</span> backIn: <b>function</b> (n) {
</code><code id="L4859"><span class="ln">4859</span> <b>var</b> s<span class="s"> = </span><span class="d">1.70158</span>;
</code><code id="L4860"><span class="ln">4860</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="L4861"><span class="ln">4861</span> },
</code><code id="L4862"><span class="ln">4862</span> backOut: <b>function</b> (n) {
</code><code id="L4863"><span class="ln">4863</span> n<span class="s"> = </span>n<span class="s"> - </span><span class="d">1</span>;
</code><code id="L4864"><span class="ln">4864</span> <b>var</b> s<span class="s"> = </span><span class="d">1.70158</span>;
</code><code id="L4865"><span class="ln">4865</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="L4866"><span class="ln">4866</span> },
</code><code id="L4867"><span class="ln">4867</span> elastic: <b>function</b> (n) {
</code><code id="L4868"><span class="ln">4868</span> <b>if</b> (n<span class="s"> == </span>!!n) {
</code><code id="L4869"><span class="ln">4869</span> <b>return</b> n;
</code><code id="L4870"><span class="ln">4870</span> }
</code><code id="L4871"><span class="ln">4871</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="L4872"><span class="ln">4872</span> },
</code><code id="L4873"><span class="ln">4873</span> bounce: <b>function</b> (n) {
</code><code id="L4874"><span class="ln">4874</span> <b>var</b> s<span class="s"> = </span><span class="d">7.5625</span>,
</code><code id="L4875"><span class="ln">4875</span> p<span class="s"> = </span><span class="d">2.75</span>,
</code><code id="L4876"><span class="ln">4876</span> l;
</code><code id="L4877"><span class="ln">4877</span> <b>if</b> (n &lt; (<span class="d">1</span><span class="s"> / </span>p)) {
</code><code id="L4878"><span class="ln">4878</span> l<span class="s"> = </span>s<span class="s"> * </span>n<span class="s"> * </span>n;
</code><code id="L4879"><span class="ln">4879</span> } <b>else</b> {
</code><code id="L4880"><span class="ln">4880</span> <b>if</b> (n &lt; (<span class="d">2</span><span class="s"> / </span>p)) {
</code><code id="L4881"><span class="ln">4881</span> n -= (<span class="d">1.5</span><span class="s"> / </span>p);
</code><code id="L4882"><span class="ln">4882</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="L4883"><span class="ln">4883</span> } <b>else</b> {
</code><code id="L4884"><span class="ln">4884</span> <b>if</b> (n &lt; (<span class="d">2.5</span><span class="s"> / </span>p)) {
</code><code id="L4885"><span class="ln">4885</span> n -= (<span class="d">2.25</span><span class="s"> / </span>p);
</code><code id="L4886"><span class="ln">4886</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="L4887"><span class="ln">4887</span> } <b>else</b> {
</code><code id="L4888"><span class="ln">4888</span> n -= (<span class="d">2.625</span><span class="s"> / </span>p);
</code><code id="L4889"><span class="ln">4889</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="L4890"><span class="ln">4890</span> }
</code><code id="L4891"><span class="ln">4891</span> }
</code><code id="L4892"><span class="ln">4892</span> }
</code><code id="L4893"><span class="ln">4893</span> <b>return</b> l;
</code><code id="L4894"><span class="ln">4894</span> }
</code><code id="L4895"><span class="ln">4895</span> };
</code><code id="L4896"><span class="ln">4896</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="L4897"><span class="ln">4897</span> ef.easeOut<span class="s"> = </span>ef[<i>"ease-out"</i>]<span class="s"> = </span>ef[<i>">"</i>];
</code><code id="L4898"><span class="ln">4898</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="L4899"><span class="ln">4899</span> ef[<i>"back-<b>in</b>"</i>]<span class="s"> = </span>ef.backIn;
</code><code id="L4900"><span class="ln">4900</span> ef[<i>"back-out"</i>]<span class="s"> = </span>ef.backOut;
</code><code id="L4901"><span class="ln">4901</span>
</code><code id="L4902"><span class="ln">4902</span> <b>var</b> animationElements<span class="s"> = </span>[],
</code><code id="L4903"><span class="ln">4903</span> requestAnimFrame<span class="s"> = </span>window.requestAnimationFrame ||
</code><code id="L4904"><span class="ln">4904</span> window.webkitRequestAnimationFrame ||
</code><code id="L4905"><span class="ln">4905</span> window.mozRequestAnimationFrame ||
</code><code id="L4906"><span class="ln">4906</span> window.oRequestAnimationFrame ||
</code><code id="L4907"><span class="ln">4907</span> window.msRequestAnimationFrame ||
</code><code id="L4908"><span class="ln">4908</span> <b>function</b> (callback) {
</code><code id="L4909"><span class="ln">4909</span> setTimeout(callback, <span class="d">16</span>);
</code><code id="L4910"><span class="ln">4910</span> },
</code><code id="L4911"><span class="ln">4911</span> animation<span class="s"> = </span><b>function</b> () {
</code><code id="L4912"><span class="ln">4912</span> <b>var</b> Now<span class="s"> = </span>+<b>new</b> Date,
</code><code id="L4913"><span class="ln">4913</span> l<span class="s"> = </span><span class="d">0</span>;
</code><code id="L4914"><span class="ln">4914</span> <b>for</b> (; l &lt; animationElements.length; l++) {
</code><code id="L4915"><span class="ln">4915</span> <b>var</b> e<span class="s"> = </span>animationElements[l];
</code><code id="L4916"><span class="ln">4916</span> <b>if</b> (e.el.removed<span class="s"> || </span>e.paused) {
</code><code id="L4917"><span class="ln">4917</span> <b>continue</b>;
</code><code id="L4918"><span class="ln">4918</span> }
</code><code id="L4919"><span class="ln">4919</span> <b>var</b> time<span class="s"> = </span>Now<span class="s"> - </span>e.start,
</code><code id="L4920"><span class="ln">4920</span> ms<span class="s"> = </span>e.ms,
</code><code id="L4921"><span class="ln">4921</span> easing<span class="s"> = </span>e.easing,
</code><code id="L4922"><span class="ln">4922</span> from<span class="s"> = </span>e.from,
</code><code id="L4923"><span class="ln">4923</span> diff<span class="s"> = </span>e.diff,
</code><code id="L4924"><span class="ln">4924</span> to<span class="s"> = </span>e.to,
</code><code id="L4925"><span class="ln">4925</span> t<span class="s"> = </span>e.t,
</code><code id="L4926"><span class="ln">4926</span> that<span class="s"> = </span>e.el,
</code><code id="L4927"><span class="ln">4927</span> set<span class="s"> = </span>{},
</code><code id="L4928"><span class="ln">4928</span> now;
</code><code id="L4929"><span class="ln">4929</span> <b>if</b> (e.initstatus) {
</code><code id="L4930"><span class="ln">4930</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="L4931"><span class="ln">4931</span> e.status<span class="s"> = </span>e.initstatus;
</code><code id="L4932"><span class="ln">4932</span> <b>delete</b> e.initstatus;
</code><code id="L4933"><span class="ln">4933</span> e.stop<span class="s"> &amp;&amp; </span>animationElements.splice(l--, <span class="d">1</span>);
</code><code id="L4934"><span class="ln">4934</span> } <b>else</b> {
</code><code id="L4935"><span class="ln">4935</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="L4936"><span class="ln">4936</span> }
</code><code id="L4937"><span class="ln">4937</span> <b>if</b> (time &lt; <span class="d">0</span>) {
</code><code id="L4938"><span class="ln">4938</span> <b>continue</b>;
</code><code id="L4939"><span class="ln">4939</span> }
</code><code id="L4940"><span class="ln">4940</span> <b>if</b> (time &lt; ms) {
</code><code id="L4941"><span class="ln">4941</span> <b>var</b> pos<span class="s"> = </span>easing(time<span class="s"> / </span>ms);
</code><code id="L4942"><span class="ln">4942</span> <b>for</b> (<b>var</b> attr <b>in</b> from) <b>if</b> (from[has](attr)) {
</code><code id="L4943"><span class="ln">4943</span> <b>switch</b> (availableAnimAttrs[attr]) {
</code><code id="L4944"><span class="ln">4944</span> <b>case</b> nu:
</code><code id="L4945"><span class="ln">4945</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="L4946"><span class="ln">4946</span> <b>break</b>;
</code><code id="L4947"><span class="ln">4947</span> <b>case</b> <i>"colour"</i>:
</code><code id="L4948"><span class="ln">4948</span> now<span class="s"> = </span><i>"rgb("</i><span class="s"> + </span>[
</code><code id="L4949"><span class="ln">4949</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="L4950"><span class="ln">4950</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="L4951"><span class="ln">4951</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="L4952"><span class="ln">4952</span> ].join(<i>","</i>)<span class="s"> + </span><i>")"</i>;
</code><code id="L4953"><span class="ln">4953</span> <b>break</b>;
</code><code id="L4954"><span class="ln">4954</span> <b>case</b> <i>"path"</i>:
</code><code id="L4955"><span class="ln">4955</span> now<span class="s"> = </span>[];
</code><code id="L4956"><span class="ln">4956</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="L4957"><span class="ln">4957</span> now[i]<span class="s"> = </span>[from[attr][i][<span class="d">0</span>]];
</code><code id="L4958"><span class="ln">4958</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="L4959"><span class="ln">4959</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="L4960"><span class="ln">4960</span> }
</code><code id="L4961"><span class="ln">4961</span> now[i]<span class="s"> = </span>now[i].join(S);
</code><code id="L4962"><span class="ln">4962</span> }
</code><code id="L4963"><span class="ln">4963</span> now<span class="s"> = </span>now.join(S);
</code><code id="L4964"><span class="ln">4964</span> <b>break</b>;
</code><code id="L4965"><span class="ln">4965</span> <b>case</b> <i>"transform"</i>:
</code><code id="L4966"><span class="ln">4966</span> <b>if</b> (diff[attr].real) {
</code><code id="L4967"><span class="ln">4967</span> now<span class="s"> = </span>[];
</code><code id="L4968"><span class="ln">4968</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="L4969"><span class="ln">4969</span> now[i]<span class="s"> = </span>[from[attr][i][<span class="d">0</span>]];
</code><code id="L4970"><span class="ln">4970</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="L4971"><span class="ln">4971</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="L4972"><span class="ln">4972</span> }
</code><code id="L4973"><span class="ln">4973</span> }
</code><code id="L4974"><span class="ln">4974</span> } <b>else</b> {
</code><code id="L4975"><span class="ln">4975</span> <b>var</b> get<span class="s"> = </span><b>function</b> (i) {
</code><code id="L4976"><span class="ln">4976</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="L4977"><span class="ln">4977</span> };
</code><code id="L4978"><span class="ln">4978</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="L4979"><span class="ln">4979</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="L4980"><span class="ln">4980</span> }
</code><code id="L4981"><span class="ln">4981</span> <b>break</b>;
</code><code id="L4982"><span class="ln">4982</span> <b>case</b> <i>"csv"</i>:
</code><code id="L4983"><span class="ln">4983</span> <b>if</b> (attr<span class="s"> == </span><i>"clip-rect"</i>) {
</code><code id="L4984"><span class="ln">4984</span> now<span class="s"> = </span>[];
</code><code id="L4985"><span class="ln">4985</span> i<span class="s"> = </span><span class="d">4</span>;
</code><code id="L4986"><span class="ln">4986</span> <b>while</b> (i--) {
</code><code id="L4987"><span class="ln">4987</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="L4988"><span class="ln">4988</span> }
</code><code id="L4989"><span class="ln">4989</span> }
</code><code id="L4990"><span class="ln">4990</span> <b>break</b>;
</code><code id="L4991"><span class="ln">4991</span> <b>default</b>:
</code><code id="L4992"><span class="ln">4992</span> <b>var</b> from2<span class="s"> = </span>[].concat(from[attr]);
</code><code id="L4993"><span class="ln">4993</span> now<span class="s"> = </span>[];
</code><code id="L4994"><span class="ln">4994</span> i<span class="s"> = </span>that.paper.customAttributes[attr].length;
</code><code id="L4995"><span class="ln">4995</span> <b>while</b> (i--) {
</code><code id="L4996"><span class="ln">4996</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="L4997"><span class="ln">4997</span> }
</code><code id="L4998"><span class="ln">4998</span> <b>break</b>;
</code><code id="L4999"><span class="ln">4999</span> }
</code><code id="L5000"><span class="ln">5000</span> set[attr]<span class="s"> = </span>now;
</code><code id="L5001"><span class="ln">5001</span> }
</code><code id="L5002"><span class="ln">5002</span> that.attr(set);
</code><code id="L5003"><span class="ln">5003</span> (<b>function</b> (id, that, anim) {
</code><code id="L5004"><span class="ln">5004</span> setTimeout(<b>function</b> () {
</code><code id="L5005"><span class="ln">5005</span> eve(<i>"anim.frame."</i><span class="s"> + </span>id, that, anim);
</code><code id="L5006"><span class="ln">5006</span> });
</code><code id="L5007"><span class="ln">5007</span> })(that.id, that, e.anim);
</code><code id="L5008"><span class="ln">5008</span> } <b>else</b> {
</code><code id="L5009"><span class="ln">5009</span> (<b>function</b>(f, el, a) {
</code><code id="L5010"><span class="ln">5010</span> setTimeout(<b>function</b>() {
</code><code id="L5011"><span class="ln">5011</span> eve(<i>"anim.finish."</i><span class="s"> + </span>el.id, el, a);
</code><code id="L5012"><span class="ln">5012</span> R.is(f, <i>"<b>function</b>"</i>)<span class="s"> &amp;&amp; </span>f.call(el);
</code><code id="L5013"><span class="ln">5013</span> });
</code><code id="L5014"><span class="ln">5014</span> })(e.callback, that, e.anim);
</code><code id="L5015"><span class="ln">5015</span> console.log(e.repeat);
</code><code id="L5016"><span class="ln">5016</span> <b>if</b> (--e.repeat) {
</code><code id="L5017"><span class="ln">5017</span> that.attr(e.origin);
</code><code id="L5018"><span class="ln">5018</span> e.start<span class="s"> = </span>Now;
</code><code id="L5019"><span class="ln">5019</span> } <b>else</b> {
</code><code id="L5020"><span class="ln">5020</span> that.attr(to);
</code><code id="L5021"><span class="ln">5021</span> animationElements.splice(l--, <span class="d">1</span>);
</code><code id="L5022"><span class="ln">5022</span> }
</code><code id="L5023"><span class="ln">5023</span> <b>if</b> (e.next<span class="s"> &amp;&amp; </span>!e.stop) {
</code><code id="L5024"><span class="ln">5024</span> runAnimation(e.anim, e.el, e.next, <b>null</b>, e.totalOrigin);
</code><code id="L5025"><span class="ln">5025</span> }
</code><code id="L5026"><span class="ln">5026</span> }
</code><code id="L5027"><span class="ln">5027</span> }
</code><code id="L5028"><span class="ln">5028</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="L5029"><span class="ln">5029</span> animationElements.length<span class="s"> &amp;&amp; </span>requestAnimFrame(animation);
</code><code id="L5030"><span class="ln">5030</span> },
</code><code id="L5031"><span class="ln">5031</span> upto255<span class="s"> = </span><b>function</b> (color) {
</code><code id="L5032"><span class="ln">5032</span> <b>return</b> mmax(mmin(color, <span class="d">255</span>), <span class="d">0</span>);
</code><code id="L5033"><span class="ln">5033</span> };
</code><code id="L5034"><span class="ln">5034</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5035"><span class="ln">5035</span><span class="c"> <span class="s"> * </span>Element.animateWith
</span></code><code id="L5036"><span class="ln">5036</span><span class="c"> [ method ]
</span></code><code id="L5037"><span class="ln">5037</span><span class="c"> **
</span></code><code id="L5038"><span class="ln">5038</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="L5039"><span class="ln">5039</span><span class="c"> **
</span></code><code id="L5040"><span class="ln">5040</span><span class="c"> > Parameters
</span></code><code id="L5041"><span class="ln">5041</span><span class="c"> **
</span></code><code id="L5042"><span class="ln">5042</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="L5043"><span class="ln">5043</span><span class="c"> <span class="s"> - </span>ms (number) number of milliseconds <b>for</b> animation to run
</span></code><code id="L5044"><span class="ln">5044</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="L5045"><span class="ln">5045</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="L5046"><span class="ln">5046</span><span class="c"> <span class="s"> * </span>or
</span></code><code id="L5047"><span class="ln">5047</span><span class="c"> <span class="s"> - </span>animation (object) animation object, see @Raphael.animation
</span></code><code id="L5048"><span class="ln">5048</span><span class="c"> **
</span></code><code id="L5049"><span class="ln">5049</span><span class="c"> <span class="s"> = </span>(object) original element
</span></code><code id="L5050"><span class="ln">5050</span><span class="c"> \*/</span>
</code><code id="L5051"><span class="ln">5051</span> elproto.animateWith<span class="s"> = </span><b>function</b> (element, params, ms, easing, callback) {
</code><code id="L5052"><span class="ln">5052</span> <b>this</b>.animate(params, ms, easing, callback);
</code><code id="L5053"><span class="ln">5053</span> <b>var</b> start, el;
</code><code id="L5054"><span class="ln">5054</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="L5055"><span class="ln">5055</span> el<span class="s"> = </span>animationElements[i];
</code><code id="L5056"><span class="ln">5056</span> <b>if</b> (el.el.id<span class="s"> == </span>element.id) {
</code><code id="L5057"><span class="ln">5057</span> start<span class="s"> = </span>el.timestamp;
</code><code id="L5058"><span class="ln">5058</span> } <b>else</b> <b>if</b> (el.el.id<span class="s"> == </span><b>this</b>.id) {
</code><code id="L5059"><span class="ln">5059</span> el.start<span class="s"> = </span>start;
</code><code id="L5060"><span class="ln">5060</span> }
</code><code id="L5061"><span class="ln">5061</span> }
</code><code id="L5062"><span class="ln">5062</span> <b>return</b> <b>this</b>.animate(params, ms, easing, callback);
</code><code id="L5063"><span class="ln">5063</span> };
</code><code id="L5064"><span class="ln">5064</span> <b>function</b> CubicBezierAtTime(t, p1x, p1y, p2x, p2y, duration) {
</code><code id="L5065"><span class="ln">5065</span> <b>var</b> cx<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>p1x,
</code><code id="L5066"><span class="ln">5066</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="L5067"><span class="ln">5067</span> ax<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>cx<span class="s"> - </span>bx,
</code><code id="L5068"><span class="ln">5068</span> cy<span class="s"> = </span><span class="d">3</span><span class="s"> * </span>p1y,
</code><code id="L5069"><span class="ln">5069</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="L5070"><span class="ln">5070</span> ay<span class="s"> = </span><span class="d">1</span><span class="s"> - </span>cy<span class="s"> - </span>by;
</code><code id="L5071"><span class="ln">5071</span> <b>function</b> sampleCurveX(t) {
</code><code id="L5072"><span class="ln">5072</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="L5073"><span class="ln">5073</span> }
</code><code id="L5074"><span class="ln">5074</span> <b>function</b> solve(x, epsilon) {
</code><code id="L5075"><span class="ln">5075</span> <b>var</b> t<span class="s"> = </span>solveCurveX(x, epsilon);
</code><code id="L5076"><span class="ln">5076</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="L5077"><span class="ln">5077</span> }
</code><code id="L5078"><span class="ln">5078</span> <b>function</b> solveCurveX(x, epsilon) {
</code><code id="L5079"><span class="ln">5079</span> <b>var</b> t0, t1, t2, x2, d2, i;
</code><code id="L5080"><span class="ln">5080</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="L5081"><span class="ln">5081</span> x2<span class="s"> = </span>sampleCurveX(t2)<span class="s"> - </span>x;
</code><code id="L5082"><span class="ln">5082</span> <b>if</b> (abs(x2) &lt; epsilon) {
</code><code id="L5083"><span class="ln">5083</span> <b>return</b> t2;
</code><code id="L5084"><span class="ln">5084</span> }
</code><code id="L5085"><span class="ln">5085</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="L5086"><span class="ln">5086</span> <b>if</b> (abs(d2) &lt; <span class="d">1e-6</span>) {
</code><code id="L5087"><span class="ln">5087</span> <b>break</b>;
</code><code id="L5088"><span class="ln">5088</span> }
</code><code id="L5089"><span class="ln">5089</span> t2<span class="s"> = </span>t2<span class="s"> - </span>x2<span class="s"> / </span>d2;
</code><code id="L5090"><span class="ln">5090</span> }
</code><code id="L5091"><span class="ln">5091</span> t0<span class="s"> = </span><span class="d">0</span>;
</code><code id="L5092"><span class="ln">5092</span> t1<span class="s"> = </span><span class="d">1</span>;
</code><code id="L5093"><span class="ln">5093</span> t2<span class="s"> = </span>x;
</code><code id="L5094"><span class="ln">5094</span> <b>if</b> (t2 &lt; t0) {
</code><code id="L5095"><span class="ln">5095</span> <b>return</b> t0;
</code><code id="L5096"><span class="ln">5096</span> }
</code><code id="L5097"><span class="ln">5097</span> <b>if</b> (t2 > t1) {
</code><code id="L5098"><span class="ln">5098</span> <b>return</b> t1;
</code><code id="L5099"><span class="ln">5099</span> }
</code><code id="L5100"><span class="ln">5100</span> <b>while</b> (t0 &lt; t1) {
</code><code id="L5101"><span class="ln">5101</span> x2<span class="s"> = </span>sampleCurveX(t2);
</code><code id="L5102"><span class="ln">5102</span> <b>if</b> (abs(x2<span class="s"> - </span>x) &lt; epsilon) {
</code><code id="L5103"><span class="ln">5103</span> <b>return</b> t2;
</code><code id="L5104"><span class="ln">5104</span> }
</code><code id="L5105"><span class="ln">5105</span> <b>if</b> (x > x2) {
</code><code id="L5106"><span class="ln">5106</span> t0<span class="s"> = </span>t2;
</code><code id="L5107"><span class="ln">5107</span> } <b>else</b> {
</code><code id="L5108"><span class="ln">5108</span> t1<span class="s"> = </span>t2;
</code><code id="L5109"><span class="ln">5109</span> }
</code><code id="L5110"><span class="ln">5110</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="L5111"><span class="ln">5111</span> }
</code><code id="L5112"><span class="ln">5112</span> <b>return</b> t2;
</code><code id="L5113"><span class="ln">5113</span> }
</code><code id="L5114"><span class="ln">5114</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="L5115"><span class="ln">5115</span> }
</code><code id="L5116"><span class="ln">5116</span> elproto.onAnimation<span class="s"> = </span><b>function</b> (f) {
</code><code id="L5117"><span class="ln">5117</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="L5118"><span class="ln">5118</span> <b>return</b> <b>this</b>;
</code><code id="L5119"><span class="ln">5119</span> };
</code><code id="L5120"><span class="ln">5120</span> <b>function</b> Animation(anim, ms) {
</code><code id="L5121"><span class="ln">5121</span> <b>var</b> percents<span class="s"> = </span>[];
</code><code id="L5122"><span class="ln">5122</span> <b>this</b>.anim<span class="s"> = </span>anim;
</code><code id="L5123"><span class="ln">5123</span> <b>this</b>.ms<span class="s"> = </span>ms;
</code><code id="L5124"><span class="ln">5124</span> <b>this</b>.times<span class="s"> = </span><span class="d">1</span>;
</code><code id="L5125"><span class="ln">5125</span> <b>if</b> (<b>this</b>.anim) {
</code><code id="L5126"><span class="ln">5126</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="L5127"><span class="ln">5127</span> percents.push(+attr);
</code><code id="L5128"><span class="ln">5128</span> }
</code><code id="L5129"><span class="ln">5129</span> percents.sort(sortByNumber);
</code><code id="L5130"><span class="ln">5130</span> }
</code><code id="L5131"><span class="ln">5131</span> <b>this</b>.top<span class="s"> = </span>percents[percents.length<span class="s"> - </span><span class="d">1</span>];
</code><code id="L5132"><span class="ln">5132</span> <b>this</b>.percents<span class="s"> = </span>percents;
</code><code id="L5133"><span class="ln">5133</span> }
</code><code id="L5134"><span class="ln">5134</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5135"><span class="ln">5135</span><span class="c"> <span class="s"> * </span>Animation.delay
</span></code><code id="L5136"><span class="ln">5136</span><span class="c"> [ method ]
</span></code><code id="L5137"><span class="ln">5137</span><span class="c"> **
</span></code><code id="L5138"><span class="ln">5138</span><span class="c"> <span class="s"> * </span>Creates a copy of existing animation object <b>with</b> given delay.
</span></code><code id="L5139"><span class="ln">5139</span><span class="c"> **
</span></code><code id="L5140"><span class="ln">5140</span><span class="c"> > Parameters
</span></code><code id="L5141"><span class="ln">5141</span><span class="c"> **
</span></code><code id="L5142"><span class="ln">5142</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="L5143"><span class="ln">5143</span><span class="c"> **
</span></code><code id="L5144"><span class="ln">5144</span><span class="c"> <span class="s"> = </span>(object) <b>new</b> altered Animation object
</span></code><code id="L5145"><span class="ln">5145</span><span class="c"> \*/</span>
</code><code id="L5146"><span class="ln">5146</span> Animation.prototype.delay<span class="s"> = </span><b>function</b> (delay) {
</code><code id="L5147"><span class="ln">5147</span> <b>var</b> a<span class="s"> = </span><b>new</b> Animation(<b>this</b>.anim, <b>this</b>.ms);
</code><code id="L5148"><span class="ln">5148</span> a.times<span class="s"> = </span><b>this</b>.times;
</code><code id="L5149"><span class="ln">5149</span> a.del<span class="s"> = </span>+delay<span class="s"> || </span><span class="d">0</span>;
</code><code id="L5150"><span class="ln">5150</span> <b>return</b> a;
</code><code id="L5151"><span class="ln">5151</span> };
</code><code id="L5152"><span class="ln">5152</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5153"><span class="ln">5153</span><span class="c"> <span class="s"> * </span>Animation.repeat
</span></code><code id="L5154"><span class="ln">5154</span><span class="c"> [ method ]
</span></code><code id="L5155"><span class="ln">5155</span><span class="c"> **
</span></code><code id="L5156"><span class="ln">5156</span><span class="c"> <span class="s"> * </span>Creates a copy of existing animation object <b>with</b> given repetition.
</span></code><code id="L5157"><span class="ln">5157</span><span class="c"> **
</span></code><code id="L5158"><span class="ln">5158</span><span class="c"> > Parameters
</span></code><code id="L5159"><span class="ln">5159</span><span class="c"> **
</span></code><code id="L5160"><span class="ln">5160</span><span class="c"> <span class="s"> - </span>repeat (number) number iterations of animation. For infinite animation pass `Infinity`
</span></code><code id="L5161"><span class="ln">5161</span><span class="c"> **
</span></code><code id="L5162"><span class="ln">5162</span><span class="c"> <span class="s"> = </span>(object) <b>new</b> altered Animation object
</span></code><code id="L5163"><span class="ln">5163</span><span class="c"> \*/</span>
</code><code id="L5164"><span class="ln">5164</span> Animation.prototype.repeat<span class="s"> = </span><b>function</b> (times) {
</code><code id="L5165"><span class="ln">5165</span> <b>var</b> a<span class="s"> = </span><b>new</b> Animation(<b>this</b>.anim, <b>this</b>.ms);
</code><code id="L5166"><span class="ln">5166</span> a.del<span class="s"> = </span><b>this</b>.del;
</code><code id="L5167"><span class="ln">5167</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="L5168"><span class="ln">5168</span> <b>return</b> a;
</code><code id="L5169"><span class="ln">5169</span> };
</code><code id="L5170"><span class="ln">5170</span> <b>function</b> runAnimation(anim, element, percent, status, totalOrigin) {
</code><code id="L5171"><span class="ln">5171</span> percent<span class="s"> = </span>toFloat(percent);
</code><code id="L5172"><span class="ln">5172</span> <b>var</b> params,
</code><code id="L5173"><span class="ln">5173</span> isInAnim,
</code><code id="L5174"><span class="ln">5174</span> isInAnimSet,
</code><code id="L5175"><span class="ln">5175</span> percents<span class="s"> = </span>[],
</code><code id="L5176"><span class="ln">5176</span> next,
</code><code id="L5177"><span class="ln">5177</span> prev,
</code><code id="L5178"><span class="ln">5178</span> timestamp,
</code><code id="L5179"><span class="ln">5179</span> ms<span class="s"> = </span>anim.ms,
</code><code id="L5180"><span class="ln">5180</span> from<span class="s"> = </span>{},
</code><code id="L5181"><span class="ln">5181</span> to<span class="s"> = </span>{},
</code><code id="L5182"><span class="ln">5182</span> diff<span class="s"> = </span>{};
</code><code id="L5183"><span class="ln">5183</span> <b>if</b> (status) {
</code><code id="L5184"><span class="ln">5184</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="L5185"><span class="ln">5185</span> <b>var</b> e<span class="s"> = </span>animationElements[i];
</code><code id="L5186"><span class="ln">5186</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="L5187"><span class="ln">5187</span> <b>if</b> (e.percent != percent) {
</code><code id="L5188"><span class="ln">5188</span> animationElements.splice(i, <span class="d">1</span>);
</code><code id="L5189"><span class="ln">5189</span> isInAnimSet<span class="s"> = </span><span class="d">1</span>;
</code><code id="L5190"><span class="ln">5190</span> } <b>else</b> {
</code><code id="L5191"><span class="ln">5191</span> isInAnim<span class="s"> = </span>e;
</code><code id="L5192"><span class="ln">5192</span> }
</code><code id="L5193"><span class="ln">5193</span> element.attr(e.totalOrigin);
</code><code id="L5194"><span class="ln">5194</span> <b>break</b>;
</code><code id="L5195"><span class="ln">5195</span> }
</code><code id="L5196"><span class="ln">5196</span> }
</code><code id="L5197"><span class="ln">5197</span> } <b>else</b> {
</code><code id="L5198"><span class="ln">5198</span> status<span class="s"> = </span>+to; <span class="c">// NaN</span>
</code><code id="L5199"><span class="ln">5199</span> }
</code><code id="L5200"><span class="ln">5200</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="L5201"><span class="ln">5201</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="L5202"><span class="ln">5202</span> percent<span class="s"> = </span>anim.percents[i];
</code><code id="L5203"><span class="ln">5203</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="L5204"><span class="ln">5204</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="L5205"><span class="ln">5205</span> next<span class="s"> = </span>anim.percents[i<span class="s"> + </span><span class="d">1</span>];
</code><code id="L5206"><span class="ln">5206</span> params<span class="s"> = </span>anim.anim[percent];
</code><code id="L5207"><span class="ln">5207</span> <b>break</b>;
</code><code id="L5208"><span class="ln">5208</span> } <b>else</b> <b>if</b> (status) {
</code><code id="L5209"><span class="ln">5209</span> element.attr(anim.anim[anim.percents[i]]);
</code><code id="L5210"><span class="ln">5210</span> }
</code><code id="L5211"><span class="ln">5211</span> }
</code><code id="L5212"><span class="ln">5212</span> <b>if</b> (!params) {
</code><code id="L5213"><span class="ln">5213</span> <b>return</b>;
</code><code id="L5214"><span class="ln">5214</span> }
</code><code id="L5215"><span class="ln">5215</span> <b>if</b> (!isInAnim) {
</code><code id="L5216"><span class="ln">5216</span> <b>for</b> (attr <b>in</b> params) <b>if</b> (params[has](attr)) {
</code><code id="L5217"><span class="ln">5217</span> <b>if</b> (availableAnimAttrs[has](attr)<span class="s"> || </span>element.paper.customAttributes[has](attr)) {
</code><code id="L5218"><span class="ln">5218</span> from[attr]<span class="s"> = </span>element.attr(attr);
</code><code id="L5219"><span class="ln">5219</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="L5220"><span class="ln">5220</span> to[attr]<span class="s"> = </span>params[attr];
</code><code id="L5221"><span class="ln">5221</span> <b>switch</b> (availableAnimAttrs[attr]) {
</code><code id="L5222"><span class="ln">5222</span> <b>case</b> nu:
</code><code id="L5223"><span class="ln">5223</span> diff[attr]<span class="s"> = </span>(to[attr]<span class="s"> - </span>from[attr])<span class="s"> / </span>ms;
</code><code id="L5224"><span class="ln">5224</span> <b>break</b>;
</code><code id="L5225"><span class="ln">5225</span> <b>case</b> <i>"colour"</i>:
</code><code id="L5226"><span class="ln">5226</span> from[attr]<span class="s"> = </span>R.getRGB(from[attr]);
</code><code id="L5227"><span class="ln">5227</span> <b>var</b> toColour<span class="s"> = </span>R.getRGB(to[attr]);
</code><code id="L5228"><span class="ln">5228</span> diff[attr]<span class="s"> = </span>{
</code><code id="L5229"><span class="ln">5229</span> r: (toColour.r<span class="s"> - </span>from[attr].r)<span class="s"> / </span>ms,
</code><code id="L5230"><span class="ln">5230</span> g: (toColour.g<span class="s"> - </span>from[attr].g)<span class="s"> / </span>ms,
</code><code id="L5231"><span class="ln">5231</span> b: (toColour.b<span class="s"> - </span>from[attr].b)<span class="s"> / </span>ms
</code><code id="L5232"><span class="ln">5232</span> };
</code><code id="L5233"><span class="ln">5233</span> <b>break</b>;
</code><code id="L5234"><span class="ln">5234</span> <b>case</b> <i>"path"</i>:
</code><code id="L5235"><span class="ln">5235</span> <b>var</b> pathes<span class="s"> = </span>path2curve(from[attr], to[attr]),
</code><code id="L5236"><span class="ln">5236</span> toPath<span class="s"> = </span>pathes[<span class="d">1</span>];
</code><code id="L5237"><span class="ln">5237</span> from[attr]<span class="s"> = </span>pathes[<span class="d">0</span>];
</code><code id="L5238"><span class="ln">5238</span> diff[attr]<span class="s"> = </span>[];
</code><code id="L5239"><span class="ln">5239</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="L5240"><span class="ln">5240</span> diff[attr][i]<span class="s"> = </span>[<span class="d">0</span>];
</code><code id="L5241"><span class="ln">5241</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="L5242"><span class="ln">5242</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="L5243"><span class="ln">5243</span> }
</code><code id="L5244"><span class="ln">5244</span> }
</code><code id="L5245"><span class="ln">5245</span> <b>break</b>;
</code><code id="L5246"><span class="ln">5246</span> <b>case</b> <i>"transform"</i>:
</code><code id="L5247"><span class="ln">5247</span> <b>var</b> _<span class="s"> = </span>element._,
</code><code id="L5248"><span class="ln">5248</span> eq<span class="s"> = </span>equaliseTransform(_[attr], to[attr]);
</code><code id="L5249"><span class="ln">5249</span> <b>if</b> (eq) {
</code><code id="L5250"><span class="ln">5250</span> from[attr]<span class="s"> = </span>eq.from;
</code><code id="L5251"><span class="ln">5251</span> to[attr]<span class="s"> = </span>eq.to;
</code><code id="L5252"><span class="ln">5252</span> diff[attr]<span class="s"> = </span>[];
</code><code id="L5253"><span class="ln">5253</span> diff[attr].real<span class="s"> = </span><b>true</b>;
</code><code id="L5254"><span class="ln">5254</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="L5255"><span class="ln">5255</span> diff[attr][i]<span class="s"> = </span>[from[attr][i][<span class="d">0</span>]];
</code><code id="L5256"><span class="ln">5256</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="L5257"><span class="ln">5257</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="L5258"><span class="ln">5258</span> }
</code><code id="L5259"><span class="ln">5259</span> }
</code><code id="L5260"><span class="ln">5260</span> } <b>else</b> {
</code><code id="L5261"><span class="ln">5261</span> <b>var</b> m<span class="s"> = </span>(element.matrix<span class="s"> || </span><b>new</b> Matrix).m,
</code><code id="L5262"><span class="ln">5262</span> to2<span class="s"> = </span>{_:{transform: _.transform}, getBBox: <b>function</b> () { <b>return</b> element.getBBox(); }};
</code><code id="L5263"><span class="ln">5263</span> from[attr]<span class="s"> = </span>[
</code><code id="L5264"><span class="ln">5264</span> m[<span class="d">0</span>][<span class="d">0</span>],
</code><code id="L5265"><span class="ln">5265</span> m[<span class="d">1</span>][<span class="d">0</span>],
</code><code id="L5266"><span class="ln">5266</span> m[<span class="d">0</span>][<span class="d">1</span>],
</code><code id="L5267"><span class="ln">5267</span> m[<span class="d">1</span>][<span class="d">1</span>],
</code><code id="L5268"><span class="ln">5268</span> m[<span class="d">0</span>][<span class="d">2</span>],
</code><code id="L5269"><span class="ln">5269</span> m[<span class="d">1</span>][<span class="d">2</span>]
</code><code id="L5270"><span class="ln">5270</span> ];
</code><code id="L5271"><span class="ln">5271</span> extractTransform(to2, to[attr]);
</code><code id="L5272"><span class="ln">5272</span> to[attr]<span class="s"> = </span>to2._.transform;
</code><code id="L5273"><span class="ln">5273</span> diff[attr]<span class="s"> = </span>[
</code><code id="L5274"><span class="ln">5274</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="L5275"><span class="ln">5275</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="L5276"><span class="ln">5276</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="L5277"><span class="ln">5277</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="L5278"><span class="ln">5278</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="L5279"><span class="ln">5279</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="L5280"><span class="ln">5280</span> ];
</code><code id="L5281"><span class="ln">5281</span> <span class="c">// from[attr]<span class="s"> = </span>[_.sx, _.sy, _.deg, _.dx, _.dy];</span>
</code><code id="L5282"><span class="ln">5282</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="L5283"><span class="ln">5283</span> <span class="c">// extractTransform(to2, to[attr]);</span>
</code><code id="L5284"><span class="ln">5284</span> <span class="c">// diff[attr]<span class="s"> = </span>[</span>
</code><code id="L5285"><span class="ln">5285</span> <span class="c">// (to2._.sx<span class="s"> - </span>_.sx)<span class="s"> / </span>ms,</span>
</code><code id="L5286"><span class="ln">5286</span> <span class="c">// (to2._.sy<span class="s"> - </span>_.sy)<span class="s"> / </span>ms,</span>
</code><code id="L5287"><span class="ln">5287</span> <span class="c">// (to2._.deg<span class="s"> - </span>_.deg)<span class="s"> / </span>ms,</span>
</code><code id="L5288"><span class="ln">5288</span> <span class="c">// (to2._.dx<span class="s"> - </span>_.dx)<span class="s"> / </span>ms,</span>
</code><code id="L5289"><span class="ln">5289</span> <span class="c">// (to2._.dy<span class="s"> - </span>_.dy)<span class="s"> / </span>ms</span>
</code><code id="L5290"><span class="ln">5290</span> <span class="c">// ];</span>
</code><code id="L5291"><span class="ln">5291</span> }
</code><code id="L5292"><span class="ln">5292</span> <b>break</b>;
</code><code id="L5293"><span class="ln">5293</span> <b>case</b> <i>"csv"</i>:
</code><code id="L5294"><span class="ln">5294</span> <b>var</b> values<span class="s"> = </span>Str(params[attr]).split(separator),
</code><code id="L5295"><span class="ln">5295</span> from2<span class="s"> = </span>Str(from[attr]).split(separator);
</code><code id="L5296"><span class="ln">5296</span> <b>if</b> (attr<span class="s"> == </span><i>"clip-rect"</i>) {
</code><code id="L5297"><span class="ln">5297</span> from[attr]<span class="s"> = </span>from2;
</code><code id="L5298"><span class="ln">5298</span> diff[attr]<span class="s"> = </span>[];
</code><code id="L5299"><span class="ln">5299</span> i<span class="s"> = </span>from2.length;
</code><code id="L5300"><span class="ln">5300</span> <b>while</b> (i--) {
</code><code id="L5301"><span class="ln">5301</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="L5302"><span class="ln">5302</span> }
</code><code id="L5303"><span class="ln">5303</span> }
</code><code id="L5304"><span class="ln">5304</span> to[attr]<span class="s"> = </span>values;
</code><code id="L5305"><span class="ln">5305</span> <b>break</b>;
</code><code id="L5306"><span class="ln">5306</span> <b>default</b>:
</code><code id="L5307"><span class="ln">5307</span> values<span class="s"> = </span>[].concat(params[attr]);
</code><code id="L5308"><span class="ln">5308</span> from2<span class="s"> = </span>[].concat(from[attr]);
</code><code id="L5309"><span class="ln">5309</span> diff[attr]<span class="s"> = </span>[];
</code><code id="L5310"><span class="ln">5310</span> i<span class="s"> = </span>element.paper.customAttributes[attr].length;
</code><code id="L5311"><span class="ln">5311</span> <b>while</b> (i--) {
</code><code id="L5312"><span class="ln">5312</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="L5313"><span class="ln">5313</span> }
</code><code id="L5314"><span class="ln">5314</span> <b>break</b>;
</code><code id="L5315"><span class="ln">5315</span> }
</code><code id="L5316"><span class="ln">5316</span> }
</code><code id="L5317"><span class="ln">5317</span> }
</code><code id="L5318"><span class="ln">5318</span> <b>var</b> easing<span class="s"> = </span>params.easing,
</code><code id="L5319"><span class="ln">5319</span> easyeasy<span class="s"> = </span>R.easing_formulas[easing];
</code><code id="L5320"><span class="ln">5320</span> <b>if</b> (!easyeasy) {
</code><code id="L5321"><span class="ln">5321</span> easyeasy<span class="s"> = </span>Str(easing).match(bezierrg);
</code><code id="L5322"><span class="ln">5322</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="L5323"><span class="ln">5323</span> <b>var</b> curve<span class="s"> = </span>easyeasy;
</code><code id="L5324"><span class="ln">5324</span> easyeasy<span class="s"> = </span><b>function</b> (t) {
</code><code id="L5325"><span class="ln">5325</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="L5326"><span class="ln">5326</span> };
</code><code id="L5327"><span class="ln">5327</span> } <b>else</b> {
</code><code id="L5328"><span class="ln">5328</span> easyeasy<span class="s"> = </span>pipe;
</code><code id="L5329"><span class="ln">5329</span> }
</code><code id="L5330"><span class="ln">5330</span> }
</code><code id="L5331"><span class="ln">5331</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="L5332"><span class="ln">5332</span> e<span class="s"> = </span>{
</code><code id="L5333"><span class="ln">5333</span> anim: anim,
</code><code id="L5334"><span class="ln">5334</span> percent: percent,
</code><code id="L5335"><span class="ln">5335</span> timestamp: timestamp,
</code><code id="L5336"><span class="ln">5336</span> start: timestamp<span class="s"> + </span>(anim.del<span class="s"> || </span><span class="d">0</span>),
</code><code id="L5337"><span class="ln">5337</span> status: <span class="d">0</span>,
</code><code id="L5338"><span class="ln">5338</span> initstatus: status<span class="s"> || </span><span class="d">0</span>,
</code><code id="L5339"><span class="ln">5339</span> stop: <b>false</b>,
</code><code id="L5340"><span class="ln">5340</span> ms: ms,
</code><code id="L5341"><span class="ln">5341</span> easing: easyeasy,
</code><code id="L5342"><span class="ln">5342</span> from: from,
</code><code id="L5343"><span class="ln">5343</span> diff: diff,
</code><code id="L5344"><span class="ln">5344</span> to: to,
</code><code id="L5345"><span class="ln">5345</span> el: element,
</code><code id="L5346"><span class="ln">5346</span> callback: params.callback,
</code><code id="L5347"><span class="ln">5347</span> prev: prev,
</code><code id="L5348"><span class="ln">5348</span> next: next,
</code><code id="L5349"><span class="ln">5349</span> repeat: anim.times,
</code><code id="L5350"><span class="ln">5350</span> origin: element.attr(),
</code><code id="L5351"><span class="ln">5351</span> totalOrigin: totalOrigin
</code><code id="L5352"><span class="ln">5352</span> };
</code><code id="L5353"><span class="ln">5353</span> animationElements.push(e);
</code><code id="L5354"><span class="ln">5354</span> <b>if</b> (status<span class="s"> &amp;&amp; </span>!isInAnim) {
</code><code id="L5355"><span class="ln">5355</span> e.stop<span class="s"> = </span><b>true</b>;
</code><code id="L5356"><span class="ln">5356</span> e.start<span class="s"> = </span><b>new</b> Date<span class="s"> - </span>ms<span class="s"> * </span>status;
</code><code id="L5357"><span class="ln">5357</span> <b>if</b> (animationElements.length<span class="s"> == </span><span class="d">1</span>) {
</code><code id="L5358"><span class="ln">5358</span> <b>return</b> animation();
</code><code id="L5359"><span class="ln">5359</span> }
</code><code id="L5360"><span class="ln">5360</span> }
</code><code id="L5361"><span class="ln">5361</span> animationElements.length<span class="s"> == </span><span class="d">1</span><span class="s"> &amp;&amp; </span>requestAnimFrame(animation);
</code><code id="L5362"><span class="ln">5362</span> } <b>else</b> {
</code><code id="L5363"><span class="ln">5363</span> isInAnim.initstatus<span class="s"> = </span>status;
</code><code id="L5364"><span class="ln">5364</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="L5365"><span class="ln">5365</span> }
</code><code id="L5366"><span class="ln">5366</span> eve(<i>"anim.start."</i><span class="s"> + </span>element.id, element, anim);
</code><code id="L5367"><span class="ln">5367</span> }
</code><code id="L5368"><span class="ln">5368</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5369"><span class="ln">5369</span><span class="c"> <span class="s"> * </span>Raphael.animation
</span></code><code id="L5370"><span class="ln">5370</span><span class="c"> [ method ]
</span></code><code id="L5371"><span class="ln">5371</span><span class="c"> **
</span></code><code id="L5372"><span class="ln">5372</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="L5373"><span class="ln">5373</span><span class="c"> <span class="s"> * </span>See also @Animation.delay and @Animation.repeat methods.
</span></code><code id="L5374"><span class="ln">5374</span><span class="c"> **
</span></code><code id="L5375"><span class="ln">5375</span><span class="c"> > Parameters
</span></code><code id="L5376"><span class="ln">5376</span><span class="c"> **
</span></code><code id="L5377"><span class="ln">5377</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="L5378"><span class="ln">5378</span><span class="c"> <span class="s"> - </span>ms (number) number of milliseconds <b>for</b> animation to run
</span></code><code id="L5379"><span class="ln">5379</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="L5380"><span class="ln">5380</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="L5381"><span class="ln">5381</span><span class="c"> **
</span></code><code id="L5382"><span class="ln">5382</span><span class="c"> <span class="s"> = </span>(object) @Animation
</span></code><code id="L5383"><span class="ln">5383</span><span class="c"> \*/</span>
</code><code id="L5384"><span class="ln">5384</span> R.animation<span class="s"> = </span><b>function</b> (params, ms, easing, callback) {
</code><code id="L5385"><span class="ln">5385</span> <b>if</b> (R.is(easing, <i>"<b>function</b>"</i>)<span class="s"> || </span>!easing) {
</code><code id="L5386"><span class="ln">5386</span> callback<span class="s"> = </span>callback<span class="s"> || </span>easing<span class="s"> || </span><b>null</b>;
</code><code id="L5387"><span class="ln">5387</span> easing<span class="s"> = </span><b>null</b>;
</code><code id="L5388"><span class="ln">5388</span> }
</code><code id="L5389"><span class="ln">5389</span> params<span class="s"> = </span>Object(params);
</code><code id="L5390"><span class="ln">5390</span> ms<span class="s"> = </span>+ms<span class="s"> || </span><span class="d">0</span>;
</code><code id="L5391"><span class="ln">5391</span> <b>var</b> p<span class="s"> = </span>{},
</code><code id="L5392"><span class="ln">5392</span> json,
</code><code id="L5393"><span class="ln">5393</span> attr;
</code><code id="L5394"><span class="ln">5394</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="L5395"><span class="ln">5395</span> json<span class="s"> = </span><b>true</b>;
</code><code id="L5396"><span class="ln">5396</span> p[attr]<span class="s"> = </span>params[attr];
</code><code id="L5397"><span class="ln">5397</span> }
</code><code id="L5398"><span class="ln">5398</span> <b>if</b> (!json) {
</code><code id="L5399"><span class="ln">5399</span> <b>return</b> <b>new</b> Animation(params, ms);
</code><code id="L5400"><span class="ln">5400</span> } <b>else</b> {
</code><code id="L5401"><span class="ln">5401</span> easing<span class="s"> &amp;&amp; </span>(p.easing<span class="s"> = </span>easing);
</code><code id="L5402"><span class="ln">5402</span> callback<span class="s"> &amp;&amp; </span>(p.callback<span class="s"> = </span>callback);
</code><code id="L5403"><span class="ln">5403</span> <b>return</b> <b>new</b> Animation({<span class="d">100</span>: p}, ms);
</code><code id="L5404"><span class="ln">5404</span> }
</code><code id="L5405"><span class="ln">5405</span> };
</code><code id="L5406"><span class="ln">5406</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5407"><span class="ln">5407</span><span class="c"> <span class="s"> * </span>Element.animate
</span></code><code id="L5408"><span class="ln">5408</span><span class="c"> [ method ]
</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>Creates and starts animation <b>for</b> given element.
</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"> > Parameters
</span></code><code id="L5413"><span class="ln">5413</span><span class="c"> **
</span></code><code id="L5414"><span class="ln">5414</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="L5415"><span class="ln">5415</span><span class="c"> <span class="s"> - </span>ms (number) number of milliseconds <b>for</b> animation to run
</span></code><code id="L5416"><span class="ln">5416</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="L5417"><span class="ln">5417</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="L5418"><span class="ln">5418</span><span class="c"> <span class="s"> * </span>or
</span></code><code id="L5419"><span class="ln">5419</span><span class="c"> <span class="s"> - </span>animation (object) animation object, see @Raphael.animation
</span></code><code id="L5420"><span class="ln">5420</span><span class="c"> **
</span></code><code id="L5421"><span class="ln">5421</span><span class="c"> <span class="s"> = </span>(object) original element
</span></code><code id="L5422"><span class="ln">5422</span><span class="c"> \*/</span>
</code><code id="L5423"><span class="ln">5423</span> elproto.animate<span class="s"> = </span><b>function</b> (params, ms, easing, callback) {
</code><code id="L5424"><span class="ln">5424</span> <b>var</b> element<span class="s"> = </span><b>this</b>;
</code><code id="L5425"><span class="ln">5425</span> <b>if</b> (element.removed) {
</code><code id="L5426"><span class="ln">5426</span> callback<span class="s"> &amp;&amp; </span>callback.call(element);
</code><code id="L5427"><span class="ln">5427</span> <b>return</b> element;
</code><code id="L5428"><span class="ln">5428</span> }
</code><code id="L5429"><span class="ln">5429</span> <b>var</b> anim<span class="s"> = </span>params <b>instanceof</b> Animation ? params : R.animation(params, ms, easing, callback);
</code><code id="L5430"><span class="ln">5430</span> runAnimation(anim, element, anim.percents[<span class="d">0</span>], <b>null</b>, element.attr());
</code><code id="L5431"><span class="ln">5431</span> <b>return</b> element;
</code><code id="L5432"><span class="ln">5432</span> };
</code><code id="L5433"><span class="ln">5433</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5434"><span class="ln">5434</span><span class="c"> <span class="s"> * </span>Element.setTime
</span></code><code id="L5435"><span class="ln">5435</span><span class="c"> [ method ]
</span></code><code id="L5436"><span class="ln">5436</span><span class="c"> **
</span></code><code id="L5437"><span class="ln">5437</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="L5438"><span class="ln">5438</span><span class="c"> **
</span></code><code id="L5439"><span class="ln">5439</span><span class="c"> > Parameters
</span></code><code id="L5440"><span class="ln">5440</span><span class="c"> **
</span></code><code id="L5441"><span class="ln">5441</span><span class="c"> <span class="s"> - </span>anim (object) animation object
</span></code><code id="L5442"><span class="ln">5442</span><span class="c"> <span class="s"> - </span>value (number) number of milliseconds from the beginning of the animation
</span></code><code id="L5443"><span class="ln">5443</span><span class="c"> **
</span></code><code id="L5444"><span class="ln">5444</span><span class="c"> <span class="s"> = </span>(object) original element <b>if</b> `value` is specified
</span></code><code id="L5445"><span class="ln">5445</span><span class="c"> <span class="s"> * </span>Note, that during animation following events are triggered:
</span></code><code id="L5446"><span class="ln">5446</span><span class="c"> *
</span></code><code id="L5447"><span class="ln">5447</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="L5448"><span class="ln">5448</span><span class="c"> \*/</span>
</code><code id="L5449"><span class="ln">5449</span> elproto.setTime<span class="s"> = </span><b>function</b> (anim, value) {
</code><code id="L5450"><span class="ln">5450</span> <b>if</b> (anim<span class="s"> &amp;&amp; </span>value != <b>null</b>) {
</code><code id="L5451"><span class="ln">5451</span> <b>this</b>.status(anim, mmin(value, anim.ms)<span class="s"> / </span>anim.ms);
</code><code id="L5452"><span class="ln">5452</span> }
</code><code id="L5453"><span class="ln">5453</span> <b>return</b> <b>this</b>;
</code><code id="L5454"><span class="ln">5454</span> };
</code><code id="L5455"><span class="ln">5455</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5456"><span class="ln">5456</span><span class="c"> <span class="s"> * </span>Element.status
</span></code><code id="L5457"><span class="ln">5457</span><span class="c"> [ method ]
</span></code><code id="L5458"><span class="ln">5458</span><span class="c"> **
</span></code><code id="L5459"><span class="ln">5459</span><span class="c"> <span class="s"> * </span>Gets or sets the status of animation of the element.
</span></code><code id="L5460"><span class="ln">5460</span><span class="c"> **
</span></code><code id="L5461"><span class="ln">5461</span><span class="c"> > Parameters
</span></code><code id="L5462"><span class="ln">5462</span><span class="c"> **
</span></code><code id="L5463"><span class="ln">5463</span><span class="c"> <span class="s"> - </span>anim (object) #optional animation object
</span></code><code id="L5464"><span class="ln">5464</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="L5465"><span class="ln">5465</span><span class="c"> **
</span></code><code id="L5466"><span class="ln">5466</span><span class="c"> <span class="s"> = </span>(number) status
</span></code><code id="L5467"><span class="ln">5467</span><span class="c"> <span class="s"> * </span>or
</span></code><code id="L5468"><span class="ln">5468</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="L5469"><span class="ln">5469</span><span class="c"> o {
</span></code><code id="L5470"><span class="ln">5470</span><span class="c"> o anim: (object) animation object
</span></code><code id="L5471"><span class="ln">5471</span><span class="c"> o status: (number) status
</span></code><code id="L5472"><span class="ln">5472</span><span class="c"> o }
</span></code><code id="L5473"><span class="ln">5473</span><span class="c"> <span class="s"> * </span>or
</span></code><code id="L5474"><span class="ln">5474</span><span class="c"> <span class="s"> = </span>(object) original element <b>if</b> `value` is specified
</span></code><code id="L5475"><span class="ln">5475</span><span class="c"> \*/</span>
</code><code id="L5476"><span class="ln">5476</span> elproto.status<span class="s"> = </span><b>function</b> (anim, value) {
</code><code id="L5477"><span class="ln">5477</span> <b>var</b> out<span class="s"> = </span>[],
</code><code id="L5478"><span class="ln">5478</span> i<span class="s"> = </span><span class="d">0</span>,
</code><code id="L5479"><span class="ln">5479</span> len,
</code><code id="L5480"><span class="ln">5480</span> e;
</code><code id="L5481"><span class="ln">5481</span> <b>if</b> (value != <b>null</b>) {
</code><code id="L5482"><span class="ln">5482</span> runAnimation(anim, <b>this</b>, -<span class="d">1</span>, mmin(value, <span class="d">1</span>));
</code><code id="L5483"><span class="ln">5483</span> <b>return</b> <b>this</b>;
</code><code id="L5484"><span class="ln">5484</span> } <b>else</b> {
</code><code id="L5485"><span class="ln">5485</span> len<span class="s"> = </span>animationElements.length;
</code><code id="L5486"><span class="ln">5486</span> <b>for</b> (; i &lt; len; i++) {
</code><code id="L5487"><span class="ln">5487</span> e<span class="s"> = </span>animationElements[i];
</code><code id="L5488"><span class="ln">5488</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="L5489"><span class="ln">5489</span> <b>if</b> (anim) {
</code><code id="L5490"><span class="ln">5490</span> <b>return</b> e.status;
</code><code id="L5491"><span class="ln">5491</span> }
</code><code id="L5492"><span class="ln">5492</span> out.push({anim: e.anim, status: e.status});
</code><code id="L5493"><span class="ln">5493</span> }
</code><code id="L5494"><span class="ln">5494</span> }
</code><code id="L5495"><span class="ln">5495</span> <b>if</b> (anim) {
</code><code id="L5496"><span class="ln">5496</span> <b>return</b> <span class="d">0</span>;
</code><code id="L5497"><span class="ln">5497</span> }
</code><code id="L5498"><span class="ln">5498</span> <b>return</b> out;
</code><code id="L5499"><span class="ln">5499</span> }
</code><code id="L5500"><span class="ln">5500</span> };
</code><code id="L5501"><span class="ln">5501</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5502"><span class="ln">5502</span><span class="c"> <span class="s"> * </span>Element.pause
</span></code><code id="L5503"><span class="ln">5503</span><span class="c"> [ method ]
</span></code><code id="L5504"><span class="ln">5504</span><span class="c"> **
</span></code><code id="L5505"><span class="ln">5505</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="L5506"><span class="ln">5506</span><span class="c"> **
</span></code><code id="L5507"><span class="ln">5507</span><span class="c"> > Parameters
</span></code><code id="L5508"><span class="ln">5508</span><span class="c"> **
</span></code><code id="L5509"><span class="ln">5509</span><span class="c"> <span class="s"> - </span>anim (object) #optional animation object
</span></code><code id="L5510"><span class="ln">5510</span><span class="c"> **
</span></code><code id="L5511"><span class="ln">5511</span><span class="c"> <span class="s"> = </span>(object) original element
</span></code><code id="L5512"><span class="ln">5512</span><span class="c"> \*/</span>
</code><code id="L5513"><span class="ln">5513</span> elproto.pause<span class="s"> = </span><b>function</b> (anim) {
</code><code id="L5514"><span class="ln">5514</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="L5515"><span class="ln">5515</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="L5516"><span class="ln">5516</span> animationElements[i].paused<span class="s"> = </span><b>true</b>;
</code><code id="L5517"><span class="ln">5517</span> }
</code><code id="L5518"><span class="ln">5518</span> }
</code><code id="L5519"><span class="ln">5519</span> <b>return</b> <b>this</b>;
</code><code id="L5520"><span class="ln">5520</span> };
</code><code id="L5521"><span class="ln">5521</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5522"><span class="ln">5522</span><span class="c"> <span class="s"> * </span>Element.resume
</span></code><code id="L5523"><span class="ln">5523</span><span class="c"> [ method ]
</span></code><code id="L5524"><span class="ln">5524</span><span class="c"> **
</span></code><code id="L5525"><span class="ln">5525</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="L5526"><span class="ln">5526</span><span class="c"> **
</span></code><code id="L5527"><span class="ln">5527</span><span class="c"> > Parameters
</span></code><code id="L5528"><span class="ln">5528</span><span class="c"> **
</span></code><code id="L5529"><span class="ln">5529</span><span class="c"> <span class="s"> - </span>anim (object) #optional animation object
</span></code><code id="L5530"><span class="ln">5530</span><span class="c"> **
</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> elproto.resume<span class="s"> = </span><b>function</b> (anim) {
</code><code id="L5534"><span class="ln">5534</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="L5535"><span class="ln">5535</span> <b>var</b> e<span class="s"> = </span>animationElements[i];
</code><code id="L5536"><span class="ln">5536</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="L5537"><span class="ln">5537</span> <b>delete</b> e.paused;
</code><code id="L5538"><span class="ln">5538</span> <b>this</b>.status(e.anim, e.status);
</code><code id="L5539"><span class="ln">5539</span> }
</code><code id="L5540"><span class="ln">5540</span> }
</code><code id="L5541"><span class="ln">5541</span> <b>return</b> <b>this</b>;
</code><code id="L5542"><span class="ln">5542</span> };
</code><code id="L5543"><span class="ln">5543</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5544"><span class="ln">5544</span><span class="c"> <span class="s"> * </span>Element.stop
</span></code><code id="L5545"><span class="ln">5545</span><span class="c"> [ method ]
</span></code><code id="L5546"><span class="ln">5546</span><span class="c"> **
</span></code><code id="L5547"><span class="ln">5547</span><span class="c"> <span class="s"> * </span>Stops animation of the element.
</span></code><code id="L5548"><span class="ln">5548</span><span class="c"> **
</span></code><code id="L5549"><span class="ln">5549</span><span class="c"> > Parameters
</span></code><code id="L5550"><span class="ln">5550</span><span class="c"> **
</span></code><code id="L5551"><span class="ln">5551</span><span class="c"> <span class="s"> - </span>anim (object) #optional animation object
</span></code><code id="L5552"><span class="ln">5552</span><span class="c"> **
</span></code><code id="L5553"><span class="ln">5553</span><span class="c"> <span class="s"> = </span>(object) original element
</span></code><code id="L5554"><span class="ln">5554</span><span class="c"> \*/</span>
</code><code id="L5555"><span class="ln">5555</span> elproto.stop<span class="s"> = </span><b>function</b> (anim) {
</code><code id="L5556"><span class="ln">5556</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="L5557"><span class="ln">5557</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="L5558"><span class="ln">5558</span> animationElements.splice(i--, <span class="d">1</span>);
</code><code id="L5559"><span class="ln">5559</span> }
</code><code id="L5560"><span class="ln">5560</span> }
</code><code id="L5561"><span class="ln">5561</span> <b>return</b> <b>this</b>;
</code><code id="L5562"><span class="ln">5562</span> };
</code><code id="L5563"><span class="ln">5563</span> elproto.toString<span class="s"> = </span><b>function</b> () {
</code><code id="L5564"><span class="ln">5564</span> <b>return</b> <i>"Rapha\xebl\u2019s object"</i>;
</code><code id="L5565"><span class="ln">5565</span> };
</code><code id="L5566"><span class="ln">5566</span>
</code><code id="L5567"><span class="ln">5567</span> <span class="c">// Set</span>
</code><code id="L5568"><span class="ln">5568</span> <b>var</b> Set<span class="s"> = </span><b>function</b> (items) {
</code><code id="L5569"><span class="ln">5569</span> <b>this</b>.items<span class="s"> = </span>[];
</code><code id="L5570"><span class="ln">5570</span> <b>this</b>.length<span class="s"> = </span><span class="d">0</span>;
</code><code id="L5571"><span class="ln">5571</span> <b>this</b>.type<span class="s"> = </span><i>"set"</i>;
</code><code id="L5572"><span class="ln">5572</span> <b>if</b> (items) {
</code><code id="L5573"><span class="ln">5573</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="L5574"><span class="ln">5574</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="L5575"><span class="ln">5575</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="L5576"><span class="ln">5576</span> <b>this</b>.length++;
</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> }
</code><code id="L5580"><span class="ln">5580</span> },
</code><code id="L5581"><span class="ln">5581</span> setproto<span class="s"> = </span>Set.prototype;
</code><code id="L5582"><span class="ln">5582</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5583"><span class="ln">5583</span><span class="c"> <span class="s"> * </span>Set.push
</span></code><code id="L5584"><span class="ln">5584</span><span class="c"> [ method ]
</span></code><code id="L5585"><span class="ln">5585</span><span class="c"> **
</span></code><code id="L5586"><span class="ln">5586</span><span class="c"> <span class="s"> * </span>Adds each argument to the current set.
</span></code><code id="L5587"><span class="ln">5587</span><span class="c"> <span class="s"> = </span>(object) original element
</span></code><code id="L5588"><span class="ln">5588</span><span class="c"> \*/</span>
</code><code id="L5589"><span class="ln">5589</span> setproto.push<span class="s"> = </span><b>function</b> () {
</code><code id="L5590"><span class="ln">5590</span> <b>var</b> item,
</code><code id="L5591"><span class="ln">5591</span> len;
</code><code id="L5592"><span class="ln">5592</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="L5593"><span class="ln">5593</span> item<span class="s"> = </span>arguments[i];
</code><code id="L5594"><span class="ln">5594</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="L5595"><span class="ln">5595</span> len<span class="s"> = </span><b>this</b>.items.length;
</code><code id="L5596"><span class="ln">5596</span> <b>this</b>[len]<span class="s"> = </span><b>this</b>.items[len]<span class="s"> = </span>item;
</code><code id="L5597"><span class="ln">5597</span> <b>this</b>.length++;
</code><code id="L5598"><span class="ln">5598</span> }
</code><code id="L5599"><span class="ln">5599</span> }
</code><code id="L5600"><span class="ln">5600</span> <b>return</b> <b>this</b>;
</code><code id="L5601"><span class="ln">5601</span> };
</code><code id="L5602"><span class="ln">5602</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5603"><span class="ln">5603</span><span class="c"> <span class="s"> * </span>Set.pop
</span></code><code id="L5604"><span class="ln">5604</span><span class="c"> [ method ]
</span></code><code id="L5605"><span class="ln">5605</span><span class="c"> **
</span></code><code id="L5606"><span class="ln">5606</span><span class="c"> <span class="s"> * </span>Removes last element and returns it.
</span></code><code id="L5607"><span class="ln">5607</span><span class="c"> <span class="s"> = </span>(object) element
</span></code><code id="L5608"><span class="ln">5608</span><span class="c"> \*/</span>
</code><code id="L5609"><span class="ln">5609</span> setproto.pop<span class="s"> = </span><b>function</b> () {
</code><code id="L5610"><span class="ln">5610</span> <b>this</b>.length<span class="s"> &amp;&amp; </span><b>delete</b> <b>this</b>[<b>this</b>.length--];
</code><code id="L5611"><span class="ln">5611</span> <b>return</b> <b>this</b>.items.pop();
</code><code id="L5612"><span class="ln">5612</span> };
</code><code id="L5613"><span class="ln">5613</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5614"><span class="ln">5614</span><span class="c"> <span class="s"> * </span>Set.forEach
</span></code><code id="L5615"><span class="ln">5615</span><span class="c"> [ method ]
</span></code><code id="L5616"><span class="ln">5616</span><span class="c"> **
</span></code><code id="L5617"><span class="ln">5617</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="L5618"><span class="ln">5618</span><span class="c"> *
</span></code><code id="L5619"><span class="ln">5619</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="L5620"><span class="ln">5620</span><span class="c"> **
</span></code><code id="L5621"><span class="ln">5621</span><span class="c"> > Parameters
</span></code><code id="L5622"><span class="ln">5622</span><span class="c"> **
</span></code><code id="L5623"><span class="ln">5623</span><span class="c"> <span class="s"> - </span>callback (<b>function</b>) <b>function</b> to run
</span></code><code id="L5624"><span class="ln">5624</span><span class="c"> <span class="s"> - </span>thisArg (object) context object <b>for</b> the callback
</span></code><code id="L5625"><span class="ln">5625</span><span class="c"> <span class="s"> = </span>(object) Set object
</span></code><code id="L5626"><span class="ln">5626</span><span class="c"> \*/</span>
</code><code id="L5627"><span class="ln">5627</span> setproto.forEach<span class="s"> = </span><b>function</b> (callback, thisArg) {
</code><code id="L5628"><span class="ln">5628</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="L5629"><span class="ln">5629</span> <b>if</b> (callback.call(thisArg, <b>this</b>.items[i])<span class="s"> === </span><b>false</b>) {
</code><code id="L5630"><span class="ln">5630</span> <b>return</b> <b>this</b>;
</code><code id="L5631"><span class="ln">5631</span> }
</code><code id="L5632"><span class="ln">5632</span> }
</code><code id="L5633"><span class="ln">5633</span> <b>return</b> <b>this</b>;
</code><code id="L5634"><span class="ln">5634</span> };
</code><code id="L5635"><span class="ln">5635</span> <b>for</b> (<b>var</b> method <b>in</b> elproto) <b>if</b> (elproto[has](method)) {
</code><code id="L5636"><span class="ln">5636</span> setproto[method]<span class="s"> = </span>(<b>function</b> (methodname) {
</code><code id="L5637"><span class="ln">5637</span> <b>return</b> <b>function</b> () {
</code><code id="L5638"><span class="ln">5638</span> <b>var</b> arg<span class="s"> = </span>arguments;
</code><code id="L5639"><span class="ln">5639</span> <b>return</b> <b>this</b>.forEach(<b>function</b> (el) {
</code><code id="L5640"><span class="ln">5640</span> el[methodname][apply](el, arg);
</code><code id="L5641"><span class="ln">5641</span> });
</code><code id="L5642"><span class="ln">5642</span> };
</code><code id="L5643"><span class="ln">5643</span> })(method);
</code><code id="L5644"><span class="ln">5644</span> }
</code><code id="L5645"><span class="ln">5645</span> setproto.attr<span class="s"> = </span><b>function</b> (name, value) {
</code><code id="L5646"><span class="ln">5646</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="L5647"><span class="ln">5647</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="L5648"><span class="ln">5648</span> <b>this</b>.items[j].attr(name[j]);
</code><code id="L5649"><span class="ln">5649</span> }
</code><code id="L5650"><span class="ln">5650</span> } <b>else</b> {
</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> <b>this</b>.items[i].attr(name, value);
</code><code id="L5653"><span class="ln">5653</span> }
</code><code id="L5654"><span class="ln">5654</span> }
</code><code id="L5655"><span class="ln">5655</span> <b>return</b> <b>this</b>;
</code><code id="L5656"><span class="ln">5656</span> };
</code><code id="L5657"><span class="ln">5657</span> setproto.animate<span class="s"> = </span><b>function</b> (params, ms, easing, callback) {
</code><code id="L5658"><span class="ln">5658</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="L5659"><span class="ln">5659</span> <b>var</b> len<span class="s"> = </span><b>this</b>.items.length,
</code><code id="L5660"><span class="ln">5660</span> i<span class="s"> = </span>len,
</code><code id="L5661"><span class="ln">5661</span> item,
</code><code id="L5662"><span class="ln">5662</span> set<span class="s"> = </span><b>this</b>,
</code><code id="L5663"><span class="ln">5663</span> collector;
</code><code id="L5664"><span class="ln">5664</span> callback<span class="s"> &amp;&amp; </span>(collector<span class="s"> = </span><b>function</b> () {
</code><code id="L5665"><span class="ln">5665</span> !--len<span class="s"> &amp;&amp; </span>callback.call(set);
</code><code id="L5666"><span class="ln">5666</span> });
</code><code id="L5667"><span class="ln">5667</span> easing<span class="s"> = </span>R.is(easing, string) ? easing : collector;
</code><code id="L5668"><span class="ln">5668</span> <b>var</b> anim<span class="s"> = </span>params <b>instanceof</b> Animation ? params : R.animation(params, ms, easing, collector);
</code><code id="L5669"><span class="ln">5669</span> item<span class="s"> = </span><b>this</b>.items[--i].animate(anim);
</code><code id="L5670"><span class="ln">5670</span> <b>while</b> (i--) {
</code><code id="L5671"><span class="ln">5671</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="L5672"><span class="ln">5672</span> }
</code><code id="L5673"><span class="ln">5673</span> <b>return</b> <b>this</b>;
</code><code id="L5674"><span class="ln">5674</span> };
</code><code id="L5675"><span class="ln">5675</span> setproto.insertAfter<span class="s"> = </span><b>function</b> (el) {
</code><code id="L5676"><span class="ln">5676</span> <b>var</b> i<span class="s"> = </span><b>this</b>.items.length;
</code><code id="L5677"><span class="ln">5677</span> <b>while</b> (i--) {
</code><code id="L5678"><span class="ln">5678</span> <b>this</b>.items[i].insertAfter(el);
</code><code id="L5679"><span class="ln">5679</span> }
</code><code id="L5680"><span class="ln">5680</span> <b>return</b> <b>this</b>;
</code><code id="L5681"><span class="ln">5681</span> };
</code><code id="L5682"><span class="ln">5682</span> setproto.getBBox<span class="s"> = </span><b>function</b> () {
</code><code id="L5683"><span class="ln">5683</span> <b>var</b> x<span class="s"> = </span>[],
</code><code id="L5684"><span class="ln">5684</span> y<span class="s"> = </span>[],
</code><code id="L5685"><span class="ln">5685</span> w<span class="s"> = </span>[],
</code><code id="L5686"><span class="ln">5686</span> h<span class="s"> = </span>[];
</code><code id="L5687"><span class="ln">5687</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="L5688"><span class="ln">5688</span> <b>var</b> box<span class="s"> = </span><b>this</b>.items[i].getBBox();
</code><code id="L5689"><span class="ln">5689</span> x.push(box.x);
</code><code id="L5690"><span class="ln">5690</span> y.push(box.y);
</code><code id="L5691"><span class="ln">5691</span> w.push(box.x<span class="s"> + </span>box.width);
</code><code id="L5692"><span class="ln">5692</span> h.push(box.y<span class="s"> + </span>box.height);
</code><code id="L5693"><span class="ln">5693</span> }
</code><code id="L5694"><span class="ln">5694</span> x<span class="s"> = </span>mmin[apply](<span class="d">0</span>, x);
</code><code id="L5695"><span class="ln">5695</span> y<span class="s"> = </span>mmin[apply](<span class="d">0</span>, y);
</code><code id="L5696"><span class="ln">5696</span> <b>return</b> {
</code><code id="L5697"><span class="ln">5697</span> x: x,
</code><code id="L5698"><span class="ln">5698</span> y: y,
</code><code id="L5699"><span class="ln">5699</span> width: mmax[apply](<span class="d">0</span>, w)<span class="s"> - </span>x,
</code><code id="L5700"><span class="ln">5700</span> height: mmax[apply](<span class="d">0</span>, h)<span class="s"> - </span>y
</code><code id="L5701"><span class="ln">5701</span> };
</code><code id="L5702"><span class="ln">5702</span> };
</code><code id="L5703"><span class="ln">5703</span> setproto.clone<span class="s"> = </span><b>function</b> (s) {
</code><code id="L5704"><span class="ln">5704</span> s<span class="s"> = </span><b>new</b> Set;
</code><code id="L5705"><span class="ln">5705</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="L5706"><span class="ln">5706</span> s.push(<b>this</b>.items[i].clone());
</code><code id="L5707"><span class="ln">5707</span> }
</code><code id="L5708"><span class="ln">5708</span> <b>return</b> s;
</code><code id="L5709"><span class="ln">5709</span> };
</code><code id="L5710"><span class="ln">5710</span> setproto.toString<span class="s"> = </span><b>function</b> () {
</code><code id="L5711"><span class="ln">5711</span> <b>return</b> <i>"Rapha\xebl\u2018s set"</i>;
</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> R.registerFont<span class="s"> = </span><b>function</b> (font) {
</code><code id="L5715"><span class="ln">5715</span> <b>if</b> (!font.face) {
</code><code id="L5716"><span class="ln">5716</span> <b>return</b> font;
</code><code id="L5717"><span class="ln">5717</span> }
</code><code id="L5718"><span class="ln">5718</span> <b>this</b>.fonts<span class="s"> = </span><b>this</b>.fonts<span class="s"> || </span>{};
</code><code id="L5719"><span class="ln">5719</span> <b>var</b> fontcopy<span class="s"> = </span>{
</code><code id="L5720"><span class="ln">5720</span> w: font.w,
</code><code id="L5721"><span class="ln">5721</span> face: {},
</code><code id="L5722"><span class="ln">5722</span> glyphs: {}
</code><code id="L5723"><span class="ln">5723</span> },
</code><code id="L5724"><span class="ln">5724</span> family<span class="s"> = </span>font.face[<i>"font-family"</i>];
</code><code id="L5725"><span class="ln">5725</span> <b>for</b> (<b>var</b> prop <b>in</b> font.face) <b>if</b> (font.face[has](prop)) {
</code><code id="L5726"><span class="ln">5726</span> fontcopy.face[prop]<span class="s"> = </span>font.face[prop];
</code><code id="L5727"><span class="ln">5727</span> }
</code><code id="L5728"><span class="ln">5728</span> <b>if</b> (<b>this</b>.fonts[family]) {
</code><code id="L5729"><span class="ln">5729</span> <b>this</b>.fonts[family].push(fontcopy);
</code><code id="L5730"><span class="ln">5730</span> } <b>else</b> {
</code><code id="L5731"><span class="ln">5731</span> <b>this</b>.fonts[family]<span class="s"> = </span>[fontcopy];
</code><code id="L5732"><span class="ln">5732</span> }
</code><code id="L5733"><span class="ln">5733</span> <b>if</b> (!font.svg) {
</code><code id="L5734"><span class="ln">5734</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="L5735"><span class="ln">5735</span> <b>for</b> (<b>var</b> glyph <b>in</b> font.glyphs) <b>if</b> (font.glyphs[has](glyph)) {
</code><code id="L5736"><span class="ln">5736</span> <b>var</b> path<span class="s"> = </span>font.glyphs[glyph];
</code><code id="L5737"><span class="ln">5737</span> fontcopy.glyphs[glyph]<span class="s"> = </span>{
</code><code id="L5738"><span class="ln">5738</span> w: path.w,
</code><code id="L5739"><span class="ln">5739</span> k: {},
</code><code id="L5740"><span class="ln">5740</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="L5741"><span class="ln">5741</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="L5742"><span class="ln">5742</span> })<span class="s"> + </span><i>"z"</i>
</code><code id="L5743"><span class="ln">5743</span> };
</code><code id="L5744"><span class="ln">5744</span> <b>if</b> (path.k) {
</code><code id="L5745"><span class="ln">5745</span> <b>for</b> (<b>var</b> k <b>in</b> path.k) <b>if</b> (path[has](k)) {
</code><code id="L5746"><span class="ln">5746</span> fontcopy.glyphs[glyph].k[k]<span class="s"> = </span>path.k[k];
</code><code id="L5747"><span class="ln">5747</span> }
</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> }
</code><code id="L5751"><span class="ln">5751</span> <b>return</b> font;
</code><code id="L5752"><span class="ln">5752</span> };
</code><code id="L5753"><span class="ln">5753</span> paperproto.getFont<span class="s"> = </span><b>function</b> (family, weight, style, stretch) {
</code><code id="L5754"><span class="ln">5754</span> stretch<span class="s"> = </span>stretch<span class="s"> || </span><i>"normal"</i>;
</code><code id="L5755"><span class="ln">5755</span> style<span class="s"> = </span>style<span class="s"> || </span><i>"normal"</i>;
</code><code id="L5756"><span class="ln">5756</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="L5757"><span class="ln">5757</span> <b>if</b> (!R.fonts) {
</code><code id="L5758"><span class="ln">5758</span> <b>return</b>;
</code><code id="L5759"><span class="ln">5759</span> }
</code><code id="L5760"><span class="ln">5760</span> <b>var</b> font<span class="s"> = </span>R.fonts[family];
</code><code id="L5761"><span class="ln">5761</span> <b>if</b> (!font) {
</code><code id="L5762"><span class="ln">5762</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="L5763"><span class="ln">5763</span> <b>for</b> (<b>var</b> fontName <b>in</b> R.fonts) <b>if</b> (R.fonts[has](fontName)) {
</code><code id="L5764"><span class="ln">5764</span> <b>if</b> (name.test(fontName)) {
</code><code id="L5765"><span class="ln">5765</span> font<span class="s"> = </span>R.fonts[fontName];
</code><code id="L5766"><span class="ln">5766</span> <b>break</b>;
</code><code id="L5767"><span class="ln">5767</span> }
</code><code id="L5768"><span class="ln">5768</span> }
</code><code id="L5769"><span class="ln">5769</span> }
</code><code id="L5770"><span class="ln">5770</span> <b>var</b> thefont;
</code><code id="L5771"><span class="ln">5771</span> <b>if</b> (font) {
</code><code id="L5772"><span class="ln">5772</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="L5773"><span class="ln">5773</span> thefont<span class="s"> = </span>font[i];
</code><code id="L5774"><span class="ln">5774</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="L5775"><span class="ln">5775</span> <b>break</b>;
</code><code id="L5776"><span class="ln">5776</span> }
</code><code id="L5777"><span class="ln">5777</span> }
</code><code id="L5778"><span class="ln">5778</span> }
</code><code id="L5779"><span class="ln">5779</span> <b>return</b> thefont;
</code><code id="L5780"><span class="ln">5780</span> };
</code><code id="L5781"><span class="ln">5781</span> paperproto.print<span class="s"> = </span><b>function</b> (x, y, string, font, size, origin, letter_spacing) {
</code><code id="L5782"><span class="ln">5782</span> origin<span class="s"> = </span>origin<span class="s"> || </span><i>"middle"</i>; <span class="c">// baseline|middle</span>
</code><code id="L5783"><span class="ln">5783</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="L5784"><span class="ln">5784</span> <b>var</b> out<span class="s"> = </span><b>this</b>.set(),
</code><code id="L5785"><span class="ln">5785</span> letters<span class="s"> = </span>Str(string).split(E),
</code><code id="L5786"><span class="ln">5786</span> shift<span class="s"> = </span><span class="d">0</span>,
</code><code id="L5787"><span class="ln">5787</span> path<span class="s"> = </span>E,
</code><code id="L5788"><span class="ln">5788</span> scale;
</code><code id="L5789"><span class="ln">5789</span> R.is(font, string)<span class="s"> &amp;&amp; </span>(font<span class="s"> = </span><b>this</b>.getFont(font));
</code><code id="L5790"><span class="ln">5790</span> <b>if</b> (font) {
</code><code id="L5791"><span class="ln">5791</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="L5792"><span class="ln">5792</span> <b>var</b> bb<span class="s"> = </span>font.face.bbox.split(separator),
</code><code id="L5793"><span class="ln">5793</span> top<span class="s"> = </span>+bb[<span class="d">0</span>],
</code><code id="L5794"><span class="ln">5794</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="L5795"><span class="ln">5795</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="L5796"><span class="ln">5796</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="L5797"><span class="ln">5797</span> curr<span class="s"> = </span>font.glyphs[letters[i]];
</code><code id="L5798"><span class="ln">5798</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="L5799"><span class="ln">5799</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="L5800"><span class="ln">5800</span> }
</code><code id="L5801"><span class="ln">5801</span> out.scale(scale, scale, top, height).translate(x<span class="s"> - </span>top, y<span class="s"> - </span>height);
</code><code id="L5802"><span class="ln">5802</span> }
</code><code id="L5803"><span class="ln">5803</span> <b>return</b> out;
</code><code id="L5804"><span class="ln">5804</span> };
</code><code id="L5805"><span class="ln">5805</span>
</code><code id="L5806"><span class="ln">5806</span> R.format<span class="s"> = </span><b>function</b> (token, params) {
</code><code id="L5807"><span class="ln">5807</span> <b>var</b> args<span class="s"> = </span>R.is(params, array) ? [<span class="d">0</span>][concat](params) : arguments;
</code><code id="L5808"><span class="ln">5808</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="L5809"><span class="ln">5809</span> <b>return</b> args[++i]<span class="s"> == </span><b>null</b> ? E : args[i];
</code><code id="L5810"><span class="ln">5810</span> }));
</code><code id="L5811"><span class="ln">5811</span> <b>return</b> token<span class="s"> || </span>E;
</code><code id="L5812"><span class="ln">5812</span> };
</code><code id="L5813"><span class="ln">5813</span> R.ninja<span class="s"> = </span><b>function</b> () {
</code><code id="L5814"><span class="ln">5814</span> oldRaphael.was ? (g.win.Raphael<span class="s"> = </span>oldRaphael.is) : <b>delete</b> Raphael;
</code><code id="L5815"><span class="ln">5815</span> <b>return</b> R;
</code><code id="L5816"><span class="ln">5816</span> };
</code><code id="L5817"><span class="ln">5817</span><span class="c"> <span class="c">/*\</span>
</span></code><code id="L5818"><span class="ln">5818</span><span class="c"> <span class="s"> * </span>Raphael.el
</span></code><code id="L5819"><span class="ln">5819</span><span class="c"> [ property (object) ]
</span></code><code id="L5820"><span class="ln">5820</span><span class="c"> **
</span></code><code id="L5821"><span class="ln">5821</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="L5822"><span class="ln">5822</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="L5823"><span class="ln">5823</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="L5824"><span class="ln">5824</span><span class="c"> > Usage
</span></code><code id="L5825"><span class="ln">5825</span><span class="c"> <span class="s"> | </span>Raphael.el.red<span class="s"> = </span><b>function</b> () {
</span></code><code id="L5826"><span class="ln">5826</span><span class="c"> <span class="s"> | </span> <b>this</b>.attr({fill: <i>"#f00"</i>});
</span></code><code id="L5827"><span class="ln">5827</span><span class="c"> <span class="s"> | </span>};
</span></code><code id="L5828"><span class="ln">5828</span><span class="c"> <span class="s"> | </span><span class="c">// then use it</span>
</span></code><code id="L5829"><span class="ln">5829</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="L5830"><span class="ln">5830</span><span class="c"> \*/</span>
</code><code id="L5831"><span class="ln">5831</span> R.el<span class="s"> = </span>elproto;
</code><code id="L5832"><span class="ln">5832</span> R.st<span class="s"> = </span>setproto;
</code><code id="L5833"><span class="ln">5833</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="L5834"><span class="ln">5834</span> (<b>function</b> (doc, loaded, f) {
</code><code id="L5835"><span class="ln">5835</span> <b>if</b> (doc.readyState<span class="s"> == </span><b>null</b><span class="s"> &amp;&amp; </span>doc.addEventListener){
</code><code id="L5836"><span class="ln">5836</span> doc.addEventListener(loaded, f<span class="s"> = </span><b>function</b> () {
</code><code id="L5837"><span class="ln">5837</span> doc.removeEventListener(loaded, f, <b>false</b>);
</code><code id="L5838"><span class="ln">5838</span> doc.readyState<span class="s"> = </span><i>"complete"</i>;
</code><code id="L5839"><span class="ln">5839</span> }, <b>false</b>);
</code><code id="L5840"><span class="ln">5840</span> doc.readyState<span class="s"> = </span><i>"loading"</i>;
</code><code id="L5841"><span class="ln">5841</span> }
</code><code id="L5842"><span class="ln">5842</span> <b>function</b> isLoaded() {
</code><code id="L5843"><span class="ln">5843</span> (/<b>in</b>/).test(doc.readyState) ? setTimeout(isLoaded, <span class="d">9</span>) : eve(<i>"DOMload"</i>);
</code><code id="L5844"><span class="ln">5844</span> }
</code><code id="L5845"><span class="ln">5845</span> isLoaded();
</code><code id="L5846"><span class="ln">5846</span> })(document, <i>"DOMContentLoaded"</i>);
</code><code id="L5847"><span class="ln">5847</span>
</code><code id="L5848"><span class="ln">5848</span> oldRaphael.was ? (g.win.Raphael<span class="s"> = </span>R) : (Raphael<span class="s"> = </span>R);
</code><code id="L5849"><span class="ln">5849</span>
</code><code id="L5850"><span class="ln">5850</span><span class="c"> /*
</span></code><code id="L5851"><span class="ln">5851</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="L5852"><span class="ln">5852</span><span class="c"> *
</span></code><code id="L5853"><span class="ln">5853</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="L5854"><span class="ln">5854</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="L5855"><span class="ln">5855</span><span class="c"> */</span>
</code><code id="L5856"><span class="ln">5856</span>
</code><code id="L5857"><span class="ln">5857</span> <b>var</b> eve<span class="s"> = </span>R.eve<span class="s"> = </span>(<b>function</b> () {
</code><code id="L5858"><span class="ln">5858</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="L5859"><span class="ln">5859</span> has<span class="s"> = </span><i>"hasOwnProperty"</i>,
</code><code id="L5860"><span class="ln">5860</span> separator<span class="s"> = </span>/[\.\/]/,
</code><code id="L5861"><span class="ln">5861</span> wildcard<span class="s"> = </span><i>"*"</i>,
</code><code id="L5862"><span class="ln">5862</span> events<span class="s"> = </span>{n: {}},
</code><code id="L5863"><span class="ln">5863</span> eve<span class="s"> = </span><b>function</b> (name, scope) {
</code><code id="L5864"><span class="ln">5864</span> <b>var</b> e<span class="s"> = </span>events,
</code><code id="L5865"><span class="ln">5865</span> args<span class="s"> = </span>Array.prototype.slice.call(arguments, <span class="d">2</span>),
</code><code id="L5866"><span class="ln">5866</span> listeners<span class="s"> = </span>eve.listeners(name),
</code><code id="L5867"><span class="ln">5867</span> errors<span class="s"> = </span>[];
</code><code id="L5868"><span class="ln">5868</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="L5869"><span class="ln">5869</span> <b>try</b> {
</code><code id="L5870"><span class="ln">5870</span> listeners[i].apply(scope, args);
</code><code id="L5871"><span class="ln">5871</span> } <b>catch</b> (ex) {
</code><code id="L5872"><span class="ln">5872</span> errors.push({error: ex<span class="s"> &amp;&amp; </span>ex.message<span class="s"> || </span>ex, func: listeners[i]});
</code><code id="L5873"><span class="ln">5873</span> }
</code><code id="L5874"><span class="ln">5874</span> }
</code><code id="L5875"><span class="ln">5875</span> <b>if</b> (errors.length) {
</code><code id="L5876"><span class="ln">5876</span> <b>return</b> errors;
</code><code id="L5877"><span class="ln">5877</span> }
</code><code id="L5878"><span class="ln">5878</span> };
</code><code id="L5879"><span class="ln">5879</span> eve.listeners<span class="s"> = </span><b>function</b> (name) {
</code><code id="L5880"><span class="ln">5880</span> <b>var</b> names<span class="s"> = </span>name.split(separator),
</code><code id="L5881"><span class="ln">5881</span> e<span class="s"> = </span>events,
</code><code id="L5882"><span class="ln">5882</span> item,
</code><code id="L5883"><span class="ln">5883</span> items,
</code><code id="L5884"><span class="ln">5884</span> k,
</code><code id="L5885"><span class="ln">5885</span> i,
</code><code id="L5886"><span class="ln">5886</span> ii,
</code><code id="L5887"><span class="ln">5887</span> j,
</code><code id="L5888"><span class="ln">5888</span> jj,
</code><code id="L5889"><span class="ln">5889</span> nes,
</code><code id="L5890"><span class="ln">5890</span> es<span class="s"> = </span>[e],
</code><code id="L5891"><span class="ln">5891</span> out<span class="s"> = </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>names.length; i &lt; ii; i++) {
</code><code id="L5893"><span class="ln">5893</span> nes<span class="s"> = </span>[];
</code><code id="L5894"><span class="ln">5894</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="L5895"><span class="ln">5895</span> e<span class="s"> = </span>es[j].n;
</code><code id="L5896"><span class="ln">5896</span> items<span class="s"> = </span>[e[names[i]], e[wildcard]];
</code><code id="L5897"><span class="ln">5897</span> k<span class="s"> = </span><span class="d">2</span>;
</code><code id="L5898"><span class="ln">5898</span> <b>while</b> (k--) {
</code><code id="L5899"><span class="ln">5899</span> item<span class="s"> = </span>items[k];
</code><code id="L5900"><span class="ln">5900</span> <b>if</b> (item) {
</code><code id="L5901"><span class="ln">5901</span> nes.push(item);
</code><code id="L5902"><span class="ln">5902</span> out<span class="s"> = </span>out.concat(item.f<span class="s"> || </span>[]);
</code><code id="L5903"><span class="ln">5903</span> }
</code><code id="L5904"><span class="ln">5904</span> }
</code><code id="L5905"><span class="ln">5905</span> }
</code><code id="L5906"><span class="ln">5906</span> es<span class="s"> = </span>nes;
</code><code id="L5907"><span class="ln">5907</span> }
</code><code id="L5908"><span class="ln">5908</span> <b>return</b> out;
</code><code id="L5909"><span class="ln">5909</span> };
</code><code id="L5910"><span class="ln">5910</span> eve.on<span class="s"> = </span><b>function</b> (name, f) {
</code><code id="L5911"><span class="ln">5911</span> <b>var</b> names<span class="s"> = </span>name.split(separator),
</code><code id="L5912"><span class="ln">5912</span> e<span class="s"> = </span>events;
</code><code id="L5913"><span class="ln">5913</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="L5914"><span class="ln">5914</span> e<span class="s"> = </span>e.n;
</code><code id="L5915"><span class="ln">5915</span> !e[names[i]]<span class="s"> &amp;&amp; </span>(e[names[i]]<span class="s"> = </span>{n: {}});
</code><code id="L5916"><span class="ln">5916</span> e<span class="s"> = </span>e[names[i]];
</code><code id="L5917"><span class="ln">5917</span> }
</code><code id="L5918"><span class="ln">5918</span> e.f<span class="s"> = </span>e.f<span class="s"> || </span>[];
</code><code id="L5919"><span class="ln">5919</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="L5920"><span class="ln">5920</span> <b>return</b> <b>false</b>;
</code><code id="L5921"><span class="ln">5921</span> }
</code><code id="L5922"><span class="ln">5922</span> e.f.push(f);
</code><code id="L5923"><span class="ln">5923</span> };
</code><code id="L5924"><span class="ln">5924</span> eve.unbind<span class="s"> = </span><b>function</b> (name, f) {
</code><code id="L5925"><span class="ln">5925</span> <b>var</b> names<span class="s"> = </span>name.split(separator),
</code><code id="L5926"><span class="ln">5926</span> e,
</code><code id="L5927"><span class="ln">5927</span> key,
</code><code id="L5928"><span class="ln">5928</span> splice,
</code><code id="L5929"><span class="ln">5929</span> cur<span class="s"> = </span>[events];
</code><code id="L5930"><span class="ln">5930</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="L5931"><span class="ln">5931</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="L5932"><span class="ln">5932</span> splice<span class="s"> = </span>[j, <span class="d">1</span>];
</code><code id="L5933"><span class="ln">5933</span> e<span class="s"> = </span>cur[j].n;
</code><code id="L5934"><span class="ln">5934</span> <b>if</b> (names[i] != wildcard) {
</code><code id="L5935"><span class="ln">5935</span> <b>if</b> (e[names[i]]) {
</code><code id="L5936"><span class="ln">5936</span> splice.push(e[names[i]]);
</code><code id="L5937"><span class="ln">5937</span> }
</code><code id="L5938"><span class="ln">5938</span> } <b>else</b> {
</code><code id="L5939"><span class="ln">5939</span> <b>for</b> (key <b>in</b> e) <b>if</b> (e[has](key)) {
</code><code id="L5940"><span class="ln">5940</span> splice.push(e[key]);
</code><code id="L5941"><span class="ln">5941</span> }
</code><code id="L5942"><span class="ln">5942</span> }
</code><code id="L5943"><span class="ln">5943</span> cur.splice.apply(cur, splice);
</code><code id="L5944"><span class="ln">5944</span> }
</code><code id="L5945"><span class="ln">5945</span> }
</code><code id="L5946"><span class="ln">5946</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="L5947"><span class="ln">5947</span> e<span class="s"> = </span>cur[i];
</code><code id="L5948"><span class="ln">5948</span> <b>while</b> (e.n) {
</code><code id="L5949"><span class="ln">5949</span> <b>if</b> (f) {
</code><code id="L5950"><span class="ln">5950</span> <b>if</b> (e.f) {
</code><code id="L5951"><span class="ln">5951</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="L5952"><span class="ln">5952</span> e.f.splice(i, <span class="d">1</span>);
</code><code id="L5953"><span class="ln">5953</span> <b>break</b>;
</code><code id="L5954"><span class="ln">5954</span> }
</code><code id="L5955"><span class="ln">5955</span> !e.f.length<span class="s"> &amp;&amp; </span><b>delete</b> e.f;
</code><code id="L5956"><span class="ln">5956</span> }
</code><code id="L5957"><span class="ln">5957</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="L5958"><span class="ln">5958</span> <b>var</b> funcs<span class="s"> = </span>e.n[key].f;
</code><code id="L5959"><span class="ln">5959</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="L5960"><span class="ln">5960</span> funcs.splice(i, <span class="d">1</span>);
</code><code id="L5961"><span class="ln">5961</span> <b>break</b>;
</code><code id="L5962"><span class="ln">5962</span> }
</code><code id="L5963"><span class="ln">5963</span> !funcs.length<span class="s"> &amp;&amp; </span><b>delete</b> e.n[key].f;
</code><code id="L5964"><span class="ln">5964</span> }
</code><code id="L5965"><span class="ln">5965</span> } <b>else</b> {
</code><code id="L5966"><span class="ln">5966</span> <b>delete</b> e.f;
</code><code id="L5967"><span class="ln">5967</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="L5968"><span class="ln">5968</span> <b>delete</b> e.n[key].f;
</code><code id="L5969"><span class="ln">5969</span> }
</code><code id="L5970"><span class="ln">5970</span> }
</code><code id="L5971"><span class="ln">5971</span> e<span class="s"> = </span>e.n;
</code><code id="L5972"><span class="ln">5972</span> }
</code><code id="L5973"><span class="ln">5973</span> }
</code><code id="L5974"><span class="ln">5974</span> <b>return</b> <b>true</b>;
</code><code id="L5975"><span class="ln">5975</span> };
</code><code id="L5976"><span class="ln">5976</span> eve.version<span class="s"> = </span>version;
</code><code id="L5977"><span class="ln">5977</span> eve.toString<span class="s"> = </span><b>function</b> () {
</code><code id="L5978"><span class="ln">5978</span> <b>return</b> <i>"You are running Eve "</i><span class="s"> + </span>version;
</code><code id="L5979"><span class="ln">5979</span> };
</code><code id="L5980"><span class="ln">5980</span> <b>return</b> eve;
</code><code id="L5981"><span class="ln">5981</span> })();
</code><code id="L5982"><span class="ln">5982</span>})();
</code></body></html>
Reference in New Issue View Git Blame Copy Permalink