zcy
/
snap.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix bug #14 + expand doc re colors a little

master
Dmitry Baranovskiy 2013-09-16 16:55:33 +10:00
parent 14915f68a8
commit 6ec65ce19a
6 changed files with 118 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

134
dist/reference.html vendored
View File

@ -31,10 +31,10 @@
</div>
</header>
<div id="content" class="max-width"><article id="Element" class="Element-section"><header><h2 id="Element" class="undefined">Element<a href="#Element" title="Link to this section" class="dr-hash">&#x2693;</a></h2></header>
<section><div class="extra" id="Element-extra"></div></section></article><article id="Element.add" class="Element-add-section"><header><h3 id="Element.add" class="dr-method">Element.add()<a href="#Element.add" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1566 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1566">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element-extra"></div></section></article><article id="Element.add" class="Element-add-section"><header><h3 id="Element.add" class="dr-method">Element.add()<a href="#Element.add" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1577 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1577">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.add-extra"></div><div class="dr-method"><p>See <a href="#Element.append" class="dr-link">Element.append</a>.
</p>
</div></section></article><article id="Element.after" class="Element-after-section"><header><h3 id="Element.after" class="dr-method">Element.after(el)<a href="#Element.after" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1619 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1619">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.after" class="Element-after-section"><header><h3 id="Element.after" class="dr-method">Element.after(el)<a href="#Element.after" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1630 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1630">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.after-extra"></div><div class="dr-method"><p>Inserts given element after the current one.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -42,7 +42,7 @@
<span class="dr-description">element to insert</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">parent</span></p>
</div></section></article><article id="Element.animate" class="Element-animate-section"><header><h3 id="Element.animate" class="dr-method">Element.animate(attrs, ms, [easing], [callback])<a href="#Element.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2035 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2035">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.animate" class="Element-animate-section"><header><h3 id="Element.animate" class="dr-method">Element.animate(attrs, ms, [easing], [callback])<a href="#Element.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2046 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2046">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.animate-extra"></div><div class="dr-method"><p>Animate given attributes of the element.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">attrs</span>
@ -61,7 +61,7 @@
<span class="dr-description">&#160;</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the element</span></p>
</div></section></article><article id="Element.append" class="Element-append-section"><header><h3 id="Element.append" class="dr-method">Element.append(el)<a href="#Element.append" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1560 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1560">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.append" class="Element-append-section"><header><h3 id="Element.append" class="dr-method">Element.append(el)<a href="#Element.append" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1571 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1571">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.append-extra"></div><div class="dr-method"><p>Appends given element to current one.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -69,7 +69,7 @@
<span class="dr-description">element to append</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">parent</span></p>
</div></section></article><article id="Element.asPX" class="Element-asPX-section"><header><h3 id="Element.asPX" class="dr-method">Element.asPX(attr, [value])<a href="#Element.asPX" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1707 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1707">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.asPX" class="Element-asPX-section"><header><h3 id="Element.asPX" class="dr-method">Element.asPX(attr, [value])<a href="#Element.asPX" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1718 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1718">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.asPX-extra"></div><div class="dr-method"><p>Return given attribute of the element as a <code>px</code> value. (Not %, em, etc)
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">attr</span>
@ -81,7 +81,7 @@
<span class="dr-description">attribute value</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">result of query selection</span></p>
</div></section></article><article id="Element.attr" class="Element-attr-section"><header><h3 id="Element.attr" class="dr-method">Element.attr(…)<a href="#Element.attr" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1411 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1411">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.attr" class="Element-attr-section"><header><h3 id="Element.attr" class="dr-method">Element.attr(…)<a href="#Element.attr" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1422 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1422">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.attr-extra"></div><div class="dr-method"><p>Gets or sets given attributes of the element
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">params</span>
@ -106,7 +106,7 @@
});
console.log(el.attr("fill")); // “#fc0”
</code></pre></section>
</div></section></article><article id="Element.before" class="Element-before-section"><header><h3 id="Element.before" class="dr-method">Element.before(el)<a href="#Element.before" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1603 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1603">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.before" class="Element-before-section"><header><h3 id="Element.before" class="dr-method">Element.before(el)<a href="#Element.before" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1614 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1614">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.before-extra"></div><div class="dr-method"><p>Inserts given element before the current one.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -122,11 +122,11 @@ console.log(el.attr("fill")); // “#fc0”
<span class="dr-description">handler for the event</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.clone" class="Element-clone-section"><header><h3 id="Element.clone" class="dr-method">Element.clone()<a href="#Element.clone" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1749 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1749">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.clone" class="Element-clone-section"><header><h3 id="Element.clone" class="dr-method">Element.clone()<a href="#Element.clone" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1760 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1760">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.clone-extra"></div><div class="dr-method"><p>Creates clone of the element and inserts it after the element.
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the clone</span></p>
</div></section></article><article id="Element.data" class="Element-data-section"><header><h3 id="Element.data" class="dr-method">Element.data(key, [value])<a href="#Element.data" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2106 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2106">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.data" class="Element-data-section"><header><h3 id="Element.data" class="dr-method">Element.data(key, [value])<a href="#Element.data" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2117 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2117">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.data-extra"></div><div class="dr-method"><p>Adds or retrieves given value asociated with given key.
See also <a href="#Element.removeData" class="dr-link">Element.removeData</a>
</p>
@ -254,7 +254,7 @@ See also <a href="#Element.removeData" class="dr-link">Element.removeData</a>
<ol class="dr-json"><li><span class="dr-json-key">event</span><span class="dr-type"><em class="dr-type-object">object</em></span><span class="dr-json-description">DOM event object</span>
</ol>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.getBBox" class="Element-getBBox-section"><header><h3 id="Element.getBBox" class="dr-method">Element.getBBox()<a href="#Element.getBBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1458 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1458">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.getBBox" class="Element-getBBox-section"><header><h3 id="Element.getBBox" class="dr-method">Element.getBBox()<a href="#Element.getBBox" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1469 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1469">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.getBBox-extra"></div><div class="dr-method"><p>Returns bounding box descriptor for the given element.
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">bounding box descriptor:</span></p>
@ -320,7 +320,7 @@ See also <a href="#Element.removeData" class="dr-link">Element.removeData</a>
<span class="dr-description">context for hover out handler</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.inAnim" class="Element-inAnim-section"><header><h3 id="Element.inAnim" class="dr-method">Element.inAnim()<a href="#Element.inAnim" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1957 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1957">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.inAnim" class="Element-inAnim-section"><header><h3 id="Element.inAnim" class="dr-method">Element.inAnim()<a href="#Element.inAnim" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1968 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1968">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.inAnim-extra"></div><div class="dr-method"><p>Returns an array of animations element currently in
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">in format</span></p>
@ -329,11 +329,11 @@ See also <a href="#Element.removeData" class="dr-link">Element.removeData</a>
<li><span class="dr-json-key">status</span><span class="dr-type"><em class="dr-type-function">function</em></span><span class="dr-json-description">gets or sets the status of the animation,</span>
<li><span class="dr-json-key">stop</span><span class="dr-type"><em class="dr-type-function">function</em></span><span class="dr-json-description">stops the animation</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Element.innerSVG" class="Element-innerSVG-section"><header><h3 id="Element.innerSVG" class="dr-method">Element.innerSVG()<a href="#Element.innerSVG" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2154 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2154">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.innerSVG" class="Element-innerSVG-section"><header><h3 id="Element.innerSVG" class="dr-method">Element.innerSVG()<a href="#Element.innerSVG" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2165 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2165">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.innerSVG-extra"></div><div class="dr-method"><p>Returns SVG code of the element. Equivalent to <code>innerHTML</code> in HTML context.
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">SVG code of the element.</span></p>
</div></section></article><article id="Element.insertAfter" class="Element-insertAfter-section"><header><h3 id="Element.insertAfter" class="dr-method">Element.insertAfter(el)<a href="#Element.insertAfter" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1649 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1649">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.insertAfter" class="Element-insertAfter-section"><header><h3 id="Element.insertAfter" class="dr-method">Element.insertAfter(el)<a href="#Element.insertAfter" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1660 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1660">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.insertAfter-extra"></div><div class="dr-method"><p>Inserts the element after the given one.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -341,7 +341,7 @@ See also <a href="#Element.removeData" class="dr-link">Element.removeData</a>
<span class="dr-description">element next to whom insert to</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">parent</span></p>
</div></section></article><article id="Element.insertBefore" class="Element-insertBefore-section"><header><h3 id="Element.insertBefore" class="dr-method">Element.insertBefore(el)<a href="#Element.insertBefore" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1634 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1634">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.insertBefore" class="Element-insertBefore-section"><header><h3 id="Element.insertBefore" class="dr-method">Element.insertBefore(el)<a href="#Element.insertBefore" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1645 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1645">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.insertBefore-extra"></div><div class="dr-method"><p>Inserts the element after the given one.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -349,7 +349,7 @@ See also <a href="#Element.removeData" class="dr-link">Element.removeData</a>
<span class="dr-description">element next to whom insert to</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">parent</span></p>
</div></section></article><article id="Element.marker" class="Element-marker-section"><header><h3 id="Element.marker" class="dr-method">Element.marker(x, y, width, height, refX, refY)<a href="#Element.marker" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1882 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1882">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.marker" class="Element-marker-section"><header><h3 id="Element.marker" class="dr-method">Element.marker(x, y, width, height, refX, refY)<a href="#Element.marker" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1893 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1893">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.marker-extra"></div><div class="dr-method"><p>Creates <code>&lt;marker&gt;</code> element from the current element.
To create a marker you have to specify the bounding rect and reference point:
</p>
@ -415,11 +415,11 @@ To create a marker you have to specify the bounding rect and reference point:
<span class="dr-description">handler for the event</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.parent" class="Element-parent-section"><header><h3 id="Element.parent" class="dr-method">Element.parent()<a href="#Element.parent" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1548 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1548">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.parent" class="Element-parent-section"><header><h3 id="Element.parent" class="dr-method">Element.parent()<a href="#Element.parent" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1559 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1559">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.parent-extra"></div><div class="dr-method"><p>Returns parent of the element
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">parent</span></p>
</div></section></article><article id="Element.pattern" class="Element-pattern-section"><header><h3 id="Element.pattern" class="dr-method">Element.pattern(x, y, width, height)<a href="#Element.pattern" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1843 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1843">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.pattern" class="Element-pattern-section"><header><h3 id="Element.pattern" class="dr-method">Element.pattern(x, y, width, height)<a href="#Element.pattern" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1854 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1854">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.pattern-extra"></div><div class="dr-method"><p>Creates <code>&lt;pattern&gt;</code> element from the current element.
To create a pattern you have to specify the pattern rect:
</p>
@ -449,7 +449,7 @@ c.attr({
fill: p
});
</code></pre></section>
</div></section></article><article id="Element.prepend" class="Element-prepend-section"><header><h3 id="Element.prepend" class="dr-method">Element.prepend(el)<a href="#Element.prepend" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1588 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1588">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.prepend" class="Element-prepend-section"><header><h3 id="Element.prepend" class="dr-method">Element.prepend(el)<a href="#Element.prepend" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1599 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1599">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.prepend-extra"></div><div class="dr-method"><p>Prepends given element to current one.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">el</span>
@ -457,11 +457,11 @@ c.attr({
<span class="dr-description">element to prepend</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">parent</span></p>
</div></section></article><article id="Element.remove" class="Element-remove-section"><header><h3 id="Element.remove" class="dr-method">Element.remove()<a href="#Element.remove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1662 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1662">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.remove" class="Element-remove-section"><header><h3 id="Element.remove" class="dr-method">Element.remove()<a href="#Element.remove" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1673 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1673">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.remove-extra"></div><div class="dr-method"><p>Removes element from the DOM
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">removed element</span></p>
</div></section></article><article id="Element.removeData" class="Element-removeData-section"><header><h3 id="Element.removeData" class="dr-method">Element.removeData([key])<a href="#Element.removeData" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2131 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2131">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.removeData" class="Element-removeData-section"><header><h3 id="Element.removeData" class="dr-method">Element.removeData([key])<a href="#Element.removeData" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2142 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2142">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.removeData-extra"></div><div class="dr-method"><p>Removes value associated with an element by given key.
If key is not provided, removes all the data of the element.
</p>
@ -471,7 +471,7 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">key</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.select" class="Element-select-section"><header><h3 id="Element.select" class="dr-method">Element.select(query)<a href="#Element.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1677 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1677">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.select" class="Element-select-section"><header><h3 id="Element.select" class="dr-method">Element.select(query)<a href="#Element.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1688 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1688">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.select-extra"></div><div class="dr-method"><p>Applies CSS selector with the element as a parent and returns the result as an <a href="#Element" class="dr-link">Element</a>.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">query</span>
@ -479,7 +479,7 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">CSS selector</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">result of query selection</span></p>
</div></section></article><article id="Element.selectAll" class="Element-selectAll-section"><header><h3 id="Element.selectAll" class="dr-method">Element.selectAll(query)<a href="#Element.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1689 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1689">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.selectAll" class="Element-selectAll-section"><header><h3 id="Element.selectAll" class="dr-method">Element.selectAll(query)<a href="#Element.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1700 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1700">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.selectAll-extra"></div><div class="dr-method"><p>Applies CSS selector with the element as a parent and returns the result as a set or array of elements.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">query</span>
@ -487,11 +487,11 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">CSS selector</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Set">Set</em> <em class="dr-type-array">array</em> <span class="dr-description">result of query selection</span></p>
</div></section></article><article id="Element.stop" class="Element-stop-section"><header><h3 id="Element.stop" class="dr-method">Element.stop()<a href="#Element.stop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2016 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2016">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.stop" class="Element-stop-section"><header><h3 id="Element.stop" class="dr-method">Element.stop()<a href="#Element.stop" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2027 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2027">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.stop-extra"></div><div class="dr-method"><p>Stops all the animations of the current element.
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description">the element</span></p>
</div></section></article><article id="Element.toString" class="Element-toString-section"><header><h3 id="Element.toString" class="dr-method">Element.toString()<a href="#Element.toString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2822 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2822">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.toString" class="Element-toString-section"><header><h3 id="Element.toString" class="dr-method">Element.toString()<a href="#Element.toString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2833 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2833">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.toString-extra"></div><div class="dr-method"><p>Returns SVG code of the element. Equivalent to <code>outerHTML</code> in HTML context.
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">SVG code of the element.</span></p>
@ -530,7 +530,7 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">handler for the event</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.transform" class="Element-transform-section"><header><h3 id="Element.transform" class="dr-method">Element.transform(tstr)<a href="#Element.transform" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1506 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1506">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.transform" class="Element-transform-section"><header><h3 id="Element.transform" class="dr-method">Element.transform(tstr)<a href="#Element.transform" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1517 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1517">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.transform-extra"></div><div class="dr-method"><p>Gets or sets transformation of the element
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">tstr</span>
@ -651,15 +651,15 @@ If key is not provided, removes all the data of the element.
<span class="dr-description">handler for the event</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Element" class="dr-link">Element</a></span></p>
</div></section></article><article id="Element.use" class="Element-use-section"><header><h3 id="Element.use" class="dr-method">Element.use()<a href="#Element.use" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1721 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1721">&#x27ad;</a></h3></header>
</div></section></article><article id="Element.use" class="Element-use-section"><header><h3 id="Element.use" class="dr-method">Element.use()<a href="#Element.use" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1732 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1732">&#x27ad;</a></h3></header>
<section><div class="extra" id="Element.use-extra"></div><div class="dr-method"><p>Creates <code>&lt;use&gt;</code> element linked to the current element.
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description"><code>&lt;use&gt;</code> element</span></p>
</div></section></article><article id="Fragment" class="Fragment-section"><header><h2 id="Fragment" class="undefined">Fragment<a href="#Fragment" title="Link to this section" class="dr-hash">&#x2693;</a></h2></header>
<section><div class="extra" id="Fragment-extra"></div></section></article><article id="Fragment.select" class="Fragment-select-section"><header><h3 id="Fragment.select" class="dr-method">Fragment.select()<a href="#Fragment.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2223 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2223">&#x27ad;</a></h3></header>
<section><div class="extra" id="Fragment-extra"></div></section></article><article id="Fragment.select" class="Fragment-select-section"><header><h3 id="Fragment.select" class="dr-method">Fragment.select()<a href="#Fragment.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2234 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2234">&#x27ad;</a></h3></header>
<section><div class="extra" id="Fragment.select-extra"></div><div class="dr-method"><p>See <a href="#Element.select" class="dr-link">Element.select</a>
</p>
</div></section></article><article id="Fragment.selectAll" class="Fragment-selectAll-section"><header><h3 id="Fragment.selectAll" class="dr-method">Fragment.selectAll()<a href="#Fragment.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2230 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2230">&#x27ad;</a></h3></header>
</div></section></article><article id="Fragment.selectAll" class="Fragment-selectAll-section"><header><h3 id="Fragment.selectAll" class="dr-method">Fragment.selectAll()<a href="#Fragment.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2241 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2241">&#x27ad;</a></h3></header>
<section><div class="extra" id="Fragment.selectAll-extra"></div><div class="dr-method"><p>See <a href="#Element.selectAll" class="dr-link">Element.selectAll</a>
</p>
</div></section></article><article id="Matrix" class="Matrix-section"><header><h2 id="Matrix" class="undefined">Matrix<a href="#Matrix" title="Link to this section" class="dr-hash">&#x2693;</a></h2></header>
@ -777,7 +777,7 @@ If key is not provided, removes all the data of the element.
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">y</span></p>
</div></section></article><article id="Paper" class="Paper-section"><header><h2 id="Paper" class="undefined">Paper<a href="#Paper" title="Link to this section" class="dr-hash">&#x2693;</a></h2></header>
<section><div class="extra" id="Paper-extra"></div></section></article><article id="Paper.circle" class="Paper-circle-section"><header><h3 id="Paper.circle" class="dr-method">Paper.circle(x, y, r)<a href="#Paper.circle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2392 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2392">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper-extra"></div></section></article><article id="Paper.circle" class="Paper-circle-section"><header><h3 id="Paper.circle" class="dr-method">Paper.circle(x, y, r)<a href="#Paper.circle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2403 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2403">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.circle-extra"></div><div class="dr-method"><p>Draws a circle.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -793,7 +793,7 @@ If key is not provided, removes all the data of the element.
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Element object with type “circle”</span></p>
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c = paper.circle(50, 50, 40);
</code></pre></section>
</div></section></article><article id="Paper.el" class="Paper-el-section"><header><h3 id="Paper.el" class="dr-method">Paper.el(name, attr)<a href="#Paper.el" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2332 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2332">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.el" class="Paper-el-section"><header><h3 id="Paper.el" class="dr-method">Paper.el(name, attr)<a href="#Paper.el" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2343 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2343">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.el-extra"></div><div class="dr-method"><p>Creates element on paper with a given name and no attributes.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">name</span>
@ -811,7 +811,7 @@ var c = paper.el("circle").attr({
r: 10
});
</code></pre></section>
</div></section></article><article id="Paper.ellipse" class="Paper-ellipse-section"><header><h3 id="Paper.ellipse" class="dr-method">Paper.ellipse(x, y, rx, ry)<a href="#Paper.ellipse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2480 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2480">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.ellipse" class="Paper-ellipse-section"><header><h3 id="Paper.ellipse" class="dr-method">Paper.ellipse(x, y, rx, ry)<a href="#Paper.ellipse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2491 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2491">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.ellipse-extra"></div><div class="dr-method"><p>Draws an ellipse.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -845,7 +845,7 @@ var c = paper.el("circle").attr({
filter: f
});
</code></pre></section>
</div></section></article><article id="Paper.g" class="Paper-g-section"><header><h3 id="Paper.g" class="dr-method">Paper.g([varargs])<a href="#Paper.g" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2554 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2554">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.g" class="Paper-g-section"><header><h3 id="Paper.g" class="dr-method">Paper.g([varargs])<a href="#Paper.g" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2565 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2565">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.g-extra"></div><div class="dr-method"><p>Makes a group element.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param optional">varargs</span>
@ -865,7 +865,7 @@ var c = paper.el("circle").attr({
g = paper.g();
g.add(c2, c1);
</code></pre></section>
</div></section></article><article id="Paper.gradient" class="Paper-gradient-section"><header><h3 id="Paper.gradient" class="dr-method">Paper.gradient(gradient)<a href="#Paper.gradient" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2714 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2714">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.gradient" class="Paper-gradient-section"><header><h3 id="Paper.gradient" class="dr-method">Paper.gradient(gradient)<a href="#Paper.gradient" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2725 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2725">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.gradient-extra"></div><div class="dr-method"><p>Creates a gradient element.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">gradient</span>
@ -903,10 +903,10 @@ through red at 25% to white.
});
</code></pre></section>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Element object with type “gradient”</span></p>
</div></section></article><article id="Paper.group" class="Paper-group-section"><header><h3 id="Paper.group" class="dr-method">Paper.group()<a href="#Paper.group" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2560 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2560">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.group" class="Paper-group-section"><header><h3 id="Paper.group" class="dr-method">Paper.group()<a href="#Paper.group" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2571 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2571">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.group-extra"></div><div class="dr-method"><p>See <a href="#Paper.g" class="dr-link">Paper.g</a>
</p>
</div></section></article><article id="Paper.image" class="Paper-image-section"><header><h3 id="Paper.image" class="dr-method">Paper.image(src, x, y, width, height)<a href="#Paper.image" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2437 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2437">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.image" class="Paper-image-section"><header><h3 id="Paper.image" class="dr-method">Paper.image(src, x, y, width, height)<a href="#Paper.image" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2448 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2448">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.image-extra"></div><div class="dr-method"><p>Embeds an image into the surface.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">src</span>
@ -949,7 +949,7 @@ through red at 25% to white.
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Element object with type “image”</span></p>
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var c = paper.image("apple.png", 10, 10, 80, 80);
</code></pre></section>
</div></section></article><article id="Paper.line" class="Paper-line-section"><header><h3 id="Paper.line" class="dr-method">Paper.line(x1, y1, x2, y2)<a href="#Paper.line" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2616 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2616">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.line" class="Paper-line-section"><header><h3 id="Paper.line" class="dr-method">Paper.line(x1, y1, x2, y2)<a href="#Paper.line" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2627 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2627">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.line-extra"></div><div class="dr-method"><p>Draws a line.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x1</span>
@ -968,7 +968,7 @@ through red at 25% to white.
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">Element object with type “line”</span></p>
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var t1 = paper.line(50, 50, 100, 100);
</code></pre></section>
</div></section></article><article id="Paper.path" class="Paper-path-section"><header><h3 id="Paper.path" class="dr-method">Paper.path([pathString])<a href="#Paper.path" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2524 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2524">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.path" class="Paper-path-section"><header><h3 id="Paper.path" class="dr-method">Paper.path([pathString])<a href="#Paper.path" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2535 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2535">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.path-extra"></div><div class="dr-method"><p>Creates a path element by given path data string.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param optional">pathString</span>
@ -1003,10 +1003,10 @@ Note: there is a special case when path consist of just three commands: “M10,1
// draw a diagonal line:
// move to 10,10, line to 90,90
</code></pre></section>
</div></section></article><article id="Paper.polygon" class="Paper-polygon-section"><header><h3 id="Paper.polygon" class="dr-method">Paper.polygon()<a href="#Paper.polygon" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2665 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2665">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.polygon" class="Paper-polygon-section"><header><h3 id="Paper.polygon" class="dr-method">Paper.polygon()<a href="#Paper.polygon" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2676 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2676">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.polygon-extra"></div><div class="dr-method"><p>Draws a polygon. See <a href="#Paper.polyline" class="dr-link">Paper.polyline</a>
</p>
</div></section></article><article id="Paper.polyline" class="Paper-polyline-section"><header><h3 id="Paper.polyline" class="dr-method">Paper.polyline(…)<a href="#Paper.polyline" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2645 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2645">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.polyline" class="Paper-polyline-section"><header><h3 id="Paper.polyline" class="dr-method">Paper.polyline(…)<a href="#Paper.polyline" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2656 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2656">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.polyline-extra"></div><div class="dr-method"><p>Draws a polyline.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">points</span>
@ -1023,7 +1023,7 @@ Note: there is a special case when path consist of just three commands: “M10,1
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var p1 = paper.polyline([10, 10, 100, 100]);
var p2 = paper.polyline(10, 10, 100, 100);
</code></pre></section>
</div></section></article><article id="Paper.rect" class="Paper-rect-section"><header><h3 id="Paper.rect" class="dr-method">Paper.rect(x, y, width, height, [rx], [ry])<a href="#Paper.rect" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2355 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2355">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.rect" class="Paper-rect-section"><header><h3 id="Paper.rect" class="dr-method">Paper.rect(x, y, width, height, [rx], [ry])<a href="#Paper.rect" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2366 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2366">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.rect-extra"></div><div class="dr-method"><p></p>
<p>Draws a rectangle.
</p>
@ -1054,7 +1054,7 @@ var c = paper.rect(10, 10, 50, 50);
// rectangle with rounded corners
var c = paper.rect(40, 40, 50, 50, 10);
</code></pre></section>
</div></section></article><article id="Paper.text" class="Paper-text-section"><header><h3 id="Paper.text" class="dr-method">Paper.text(x, y, text)<a href="#Paper.text" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2588 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2588">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.text" class="Paper-text-section"><header><h3 id="Paper.text" class="dr-method">Paper.text(x, y, text)<a href="#Paper.text" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2599 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2599">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.text-extra"></div><div class="dr-method"><p>Draws a text string.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">x</span>
@ -1071,7 +1071,7 @@ var c = paper.rect(40, 40, 50, 50, 10);
<h3>Usage</h3><section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var t1 = paper.text(50, 50, "Savage");
var t2 = paper.text(50, 50, ["S","a","v","a","g","e"]);
</code></pre></section>
</div></section></article><article id="Paper.toString" class="Paper-toString-section"><header><h3 id="Paper.toString" class="dr-method">Paper.toString()<a href="#Paper.toString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2822 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2822">&#x27ad;</a></h3></header>
</div></section></article><article id="Paper.toString" class="Paper-toString-section"><header><h3 id="Paper.toString" class="dr-method">Paper.toString()<a href="#Paper.toString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2833 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2833">&#x27ad;</a></h3></header>
<section><div class="extra" id="Paper.toString-extra"></div><div class="dr-method"><p>Returns SVG code of the element. Equivalent to <code>outerHTML</code> in HTML context.
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">SVG code of the element.</span></p>
@ -1109,7 +1109,7 @@ Returns matrix based on given parameters.
<span class="dr-description">&#160;</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description"><a href="#Matrix" class="dr-link">Matrix</a></span></p>
</div></section></article><article id="Savage.ajax" class="Savage-ajax-section"><header><h3 id="Savage.ajax" class="dr-method">Savage.ajax(…)<a href="#Savage.ajax" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2854 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2854">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.ajax" class="Savage-ajax-section"><header><h3 id="Savage.ajax" class="dr-method">Savage.ajax(…)<a href="#Savage.ajax" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2865 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2865">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.ajax-extra"></div><div class="dr-method"><p>Simple implementation of Ajax.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">url</span>
@ -1140,7 +1140,7 @@ Returns matrix based on given parameters.
<span class="dr-description">scope of callback</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-XMLHttpRequest">XMLHttpRequest</em> <span class="dr-description">XMLHttpRequest (just in case)</span></p>
</div></section></article><article id="Savage.animate" class="Savage-animate-section"><header><h3 id="Savage.animate" class="dr-method">Savage.animate(from, to, setter, ms, [easing], [callback])<a href="#Savage.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1998 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1998">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.animate" class="Savage-animate-section"><header><h3 id="Savage.animate" class="dr-method">Savage.animate(from, to, setter, ms, [easing], [callback])<a href="#Savage.animate" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2009 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2009">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.animate-extra"></div><div class="dr-method"><p>Runs generic animation of one number into another with a caring function.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">from</span>
@ -1172,7 +1172,7 @@ Returns matrix based on given parameters.
<li><span class="dr-json-key">status</span><span class="dr-type"><em class="dr-type-function">function</em></span><span class="dr-json-description">gets or sets the status of the animation,</span>
<li><span class="dr-json-key">stop</span><span class="dr-type"><em class="dr-type-function">function</em></span><span class="dr-json-description">stops the animation</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Savage.animation" class="Savage-animation-section"><header><h3 id="Savage.animation" class="dr-method">Savage.animation(attr, ms, [easing], [callback])<a href="#Savage.animation" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1940 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1940">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.animation" class="Savage-animation-section"><header><h3 id="Savage.animation" class="dr-method">Savage.animation(attr, ms, [easing], [callback])<a href="#Savage.animation" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1951 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1951">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.animation-extra"></div><div class="dr-method"><p>Creates animation object.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">attr</span>
@ -1191,7 +1191,7 @@ Returns matrix based on given parameters.
<span class="dr-description">callback</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">animation object</span></p>
</div></section></article><article id="Savage.color" class="Savage-color-section"><header><h3 id="Savage.color" class="dr-method">Savage.color(clr)<a href="#Savage.color" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 809 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L809">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.color" class="Savage-color-section"><header><h3 id="Savage.color" class="dr-method">Savage.color(clr)<a href="#Savage.color" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 820 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L820">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.color-extra"></div><div class="dr-method"><p>Parses the color string and returns object with all values for the given color.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">clr</span>
@ -1337,7 +1337,7 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
}
}));
</code></pre></section>
</div></section></article><article id="Savage.fragment" class="Savage-fragment-section"><header><h3 id="Savage.fragment" class="dr-method">Savage.fragment(varargs)<a href="#Savage.fragment" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2240 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2240">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.fragment" class="Savage-fragment-section"><header><h3 id="Savage.fragment" class="dr-method">Savage.fragment(varargs)<a href="#Savage.fragment" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2251 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2251">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.fragment-extra"></div><div class="dr-method"><p>Creates DOM fragment from given list of elements or strings
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">varargs</span>
@ -1345,7 +1345,7 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
<span class="dr-description">SVG string</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Fragment">Fragment</em> <span class="dr-description">the <a href="#Fragment" class="dr-link">Fragment</a></span></p>
</div></section></article><article id="Savage.getRGB" class="Savage-getRGB-section"><header><h3 id="Savage.getRGB" class="dr-method">Savage.getRGB(colour)<a href="#Savage.getRGB" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 612 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L612">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.getRGB" class="Savage-getRGB-section"><header><h3 id="Savage.getRGB" class="dr-method">Savage.getRGB(colour)<a href="#Savage.getRGB" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 619 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L619">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.getRGB-extra"></div><div class="dr-method"><p>Parses colour string as RGB object
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">colour</span>
@ -1357,12 +1357,20 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
<li>#••• — shortened HTML colour: (“<code>#000</code>”, “<code>#fc0</code>”, etc)</li>
<li>#•••••• — full length HTML colour: (“<code>#000000</code>”, “<code>#bd2300</code>”)</li>
<li>rgb(•••, •••, •••) — red, green and blue channels values: (“<code>rgb(200,&nbsp;100,&nbsp;0)</code>”)</li>
<li>rgba(•••, •••, •••, •••) — also with opacity</li>
<li>rgb(•••%, •••%, •••%) — same as above, but in %: (“<code>rgb(100%,&nbsp;175%,&nbsp;0%)</code>”)</li>
<li>rgba(•••%, •••%, •••%, •••%) — also with opacity</li>
<li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“<code>hsb(0.5,&nbsp;0.25,&nbsp;1)</code>”)</li>
<li>hsba(•••, •••, •••, •••) — also with opacity</li>
<li>hsb(•••%, •••%, •••%) — same as above, but in %</li>
<li>hsl(•••, •••, •••) — same as hsb</li>
<li>hsl(•••%, •••%, •••%) — same as hsb</li>
<li>hsba(•••%, •••%, •••%, •••%) — also with opacity</li>
<li>hsl(•••, •••, •••) — hue, saturation and luminosity values: (“<code>hsb(0.5,&nbsp;0.25,&nbsp;0.5)</code>”)</li>
<li>hsla(•••, •••, •••, •••) — also with opacity</li>
<li>hsl(•••%, •••%, •••%) — same as above, but in %</li>
<li>hsla(•••%, •••%, •••%, •••%) — also with opacity</li>
</ul>
<p>Note that <code>%</code> can be used any time: <code>rgb(20%, 255, 50%)</code>.
</p>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-object">object</em> <span class="dr-description">RGB object in format:</span></p>
<ol class="dr-json"><li>{<ol class="dr-json"><li><span class="dr-json-key">r</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">red,</span>
<li><span class="dr-json-key">g</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">green,</span>
@ -1370,7 +1378,7 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
<li><span class="dr-json-key">hex</span><span class="dr-type"><em class="dr-type-string">string</em></span><span class="dr-json-description">color in HTML/CSS format: #••••••,</span>
<li><span class="dr-json-key">error</span><span class="dr-type"><em class="dr-type-boolean">boolean</em></span><span class="dr-json-description">true if string cant be parsed</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Savage.hsb" class="Savage-hsb-section"><header><h3 id="Savage.hsb" class="dr-method">Savage.hsb(h, s, b)<a href="#Savage.hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 696 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L696">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.hsb" class="Savage-hsb-section"><header><h3 id="Savage.hsb" class="dr-method">Savage.hsb(h, s, b)<a href="#Savage.hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 707 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L707">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.hsb-extra"></div><div class="dr-method"><p>Converts HSB values to hex representation of the colour.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">h</span>
@ -1384,7 +1392,7 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
<span class="dr-description">value or brightness</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the colour.</span></p>
</div></section></article><article id="Savage.hsb2rgb" class="Savage-hsb2rgb-section"><header><h3 id="Savage.hsb2rgb" class="dr-method">Savage.hsb2rgb(h, s, v)<a href="#Savage.hsb2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 861 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L861">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.hsb2rgb" class="Savage-hsb2rgb-section"><header><h3 id="Savage.hsb2rgb" class="dr-method">Savage.hsb2rgb(h, s, v)<a href="#Savage.hsb2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 872 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L872">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.hsb2rgb-extra"></div><div class="dr-method"><p>Converts HSB values to RGB object.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">h</span>
@ -1403,7 +1411,7 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
<li><span class="dr-json-key">b</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">blue,</span>
<li><span class="dr-json-key">hex</span><span class="dr-type"><em class="dr-type-string">string</em></span><span class="dr-json-description">color in HTML/CSS format: #••••••</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Savage.hsl" class="Savage-hsl-section"><header><h3 id="Savage.hsl" class="dr-method">Savage.hsl(h, s, l)<a href="#Savage.hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 709 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L709">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.hsl" class="Savage-hsl-section"><header><h3 id="Savage.hsl" class="dr-method">Savage.hsl(h, s, l)<a href="#Savage.hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 720 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L720">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.hsl-extra"></div><div class="dr-method"><p>Converts HSL values to hex representation of the colour.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">h</span>
@ -1417,7 +1425,7 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
<span class="dr-description">luminosity</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the colour.</span></p>
</div></section></article><article id="Savage.hsl2rgb" class="Savage-hsl2rgb-section"><header><h3 id="Savage.hsl2rgb" class="dr-method">Savage.hsl2rgb(h, s, l)<a href="#Savage.hsl2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 897 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L897">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.hsl2rgb" class="Savage-hsl2rgb-section"><header><h3 id="Savage.hsl2rgb" class="dr-method">Savage.hsl2rgb(h, s, l)<a href="#Savage.hsl2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 908 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L908">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.hsl2rgb-extra"></div><div class="dr-method"><p>Converts HSL values to RGB object.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">h</span>
@ -1447,7 +1455,7 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
<span class="dr-description">name of the type, i.e. “string”, “function”, “number”, etc.</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-boolean">boolean</em> <span class="dr-description">is given value is of given type</span></p>
</div></section></article><article id="Savage.load" class="Savage-load-section"><header><h3 id="Savage.load" class="dr-method">Savage.load(url, callback, [scope])<a href="#Savage.load" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2900 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2900">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.load" class="Savage-load-section"><header><h3 id="Savage.load" class="dr-method">Savage.load(url, callback, [scope])<a href="#Savage.load" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2911 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2911">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.load-extra"></div><div class="dr-method"><p>Loads external SVG file as a <a href="#Fragment" class="dr-link">Fragment</a>. For more advanced AJAX see <a href="#Savage.ajax" class="dr-link">Savage.ajax</a>.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">url</span>
@ -1461,7 +1469,7 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
<span class="dr-type"><em class="dr-type-object">object</em></span>
<span class="dr-description">scope of callback</span></li>
</ol></div>
</div></section></article><article id="Savage.parse" class="Savage-parse-section"><header><h3 id="Savage.parse" class="dr-method">Savage.parse(svg)<a href="#Savage.parse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2192 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2192">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.parse" class="Savage-parse-section"><header><h3 id="Savage.parse" class="dr-method">Savage.parse(svg)<a href="#Savage.parse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 2203 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L2203">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.parse-extra"></div><div class="dr-method"><p>Parses SVG fragment and converts it into <a href="#Fragment" class="dr-link">Fragment</a>.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">svg</span>
@ -1469,7 +1477,7 @@ paper.path(Savage.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width
<span class="dr-description">SVG string</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Fragment">Fragment</em> <span class="dr-description">the fragment</span></p>
</div></section></article><article id="Savage.parsePathString" class="Savage-parsePathString-section"><header><h3 id="Savage.parsePathString" class="dr-method">Savage.parsePathString(pathString)<a href="#Savage.parsePathString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1002 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1002">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.parsePathString" class="Savage-parsePathString-section"><header><h3 id="Savage.parsePathString" class="dr-method">Savage.parsePathString(pathString)<a href="#Savage.parsePathString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1013 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1013">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.parsePathString-extra"></div><div class="dr-method"><p>Utility method
Parses given path string into an array of arrays of path segments.
</p>
@ -1478,7 +1486,7 @@ Parses given path string into an array of arrays of path segments.
<span class="dr-description">path string or array of segments (in the last case it will be returned straight away)</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-array">array</em> <span class="dr-description">array of segments.</span></p>
</div></section></article><article id="Savage.parseTransformString" class="Savage-parseTransformString-section"><header><h3 id="Savage.parseTransformString" class="dr-method">Savage.parseTransformString(TString)<a href="#Savage.parseTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1055 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1055">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.parseTransformString" class="Savage-parseTransformString-section"><header><h3 id="Savage.parseTransformString" class="dr-method">Savage.parseTransformString(TString)<a href="#Savage.parseTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1066 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1066">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.parseTransformString-extra"></div><div class="dr-method"><p>Utility method
Parses given path string into an array of transformations.
</p>
@ -1736,7 +1744,7 @@ Converts path coordinates into relative values.
<span class="dr-description">angle in degrees</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-number">number</em> <span class="dr-description">angle in radians.</span></p>
</div></section></article><article id="Savage.rgb" class="Savage-rgb-section"><header><h3 id="Savage.rgb" class="dr-method">Savage.rgb(r, g, b)<a href="#Savage.rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 722 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L722">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.rgb" class="Savage-rgb-section"><header><h3 id="Savage.rgb" class="dr-method">Savage.rgb(r, g, b)<a href="#Savage.rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 733 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L733">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.rgb-extra"></div><div class="dr-method"><p>Converts RGB values to hex representation of the colour.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">r</span>
@ -1750,7 +1758,7 @@ Converts path coordinates into relative values.
<span class="dr-description">blue</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-string">string</em> <span class="dr-description">hex representation of the colour.</span></p>
</div></section></article><article id="Savage.rgb2hsb" class="Savage-rgb2hsb-section"><header><h3 id="Savage.rgb2hsb" class="dr-method">Savage.rgb2hsb(r, g, b)<a href="#Savage.rgb2hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 936 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L936">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.rgb2hsb" class="Savage-rgb2hsb-section"><header><h3 id="Savage.rgb2hsb" class="dr-method">Savage.rgb2hsb(r, g, b)<a href="#Savage.rgb2hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 947 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L947">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.rgb2hsb-extra"></div><div class="dr-method"><p>Converts RGB values to HSB object.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">r</span>
@ -1768,7 +1776,7 @@ Converts path coordinates into relative values.
<li><span class="dr-json-key">s</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">saturation</span>
<li><span class="dr-json-key">b</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">brightness</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Savage.rgb2hsl" class="Savage-rgb2hsl-section"><header><h3 id="Savage.rgb2hsl" class="dr-method">Savage.rgb2hsl(r, g, b)<a href="#Savage.rgb2hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 969 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L969">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.rgb2hsl" class="Savage-rgb2hsl-section"><header><h3 id="Savage.rgb2hsl" class="dr-method">Savage.rgb2hsl(r, g, b)<a href="#Savage.rgb2hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 980 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L980">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.rgb2hsl-extra"></div><div class="dr-method"><p>Converts RGB values to HSL object.
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">r</span>
@ -1786,7 +1794,7 @@ Converts path coordinates into relative values.
<li><span class="dr-json-key">s</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">saturation</span>
<li><span class="dr-json-key">l</span><span class="dr-type"><em class="dr-type-number">number</em></span><span class="dr-json-description">luminosity</span>
</ol></li><li>}</li></ol>
</div></section></article><article id="Savage.select" class="Savage-select-section"><header><h3 id="Savage.select" class="dr-method">Savage.select(query)<a href="#Savage.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1305 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1305">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.select" class="Savage-select-section"><header><h3 id="Savage.select" class="dr-method">Savage.select(query)<a href="#Savage.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1316 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1316">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.select-extra"></div><div class="dr-method"><p>Wraps DOM element specified by CSS selector as <a href="#Element" class="dr-link">Element</a>
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">query</span>
@ -1794,7 +1802,7 @@ Converts path coordinates into relative values.
<span class="dr-description">CSS selector of the element</span></li>
</ol></div>
<p class="dr-returns"><strong class="dr-title">Returns:</strong> <em class="dr-type-Element">Element</em> <span class="dr-description"></span></p>
</div></section></article><article id="Savage.selectAll" class="Savage-selectAll-section"><header><h3 id="Savage.selectAll" class="dr-method">Savage.selectAll(query)<a href="#Savage.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1316 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1316">&#x27ad;</a></h3></header>
</div></section></article><article id="Savage.selectAll" class="Savage-selectAll-section"><header><h3 id="Savage.selectAll" class="dr-method">Savage.selectAll(query)<a href="#Savage.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1327 in the source" href="https://github.com/adobe-webplatform/savage/blob/master/src/svg.js#L1327">&#x27ad;</a></h3></header>
<section><div class="extra" id="Savage.selectAll-extra"></div><div class="dr-method"><p>Wraps DOM elements specified by CSS selector as set or array of <a href="#Element" class="dr-link">Element</a>
</p>
<div class="topcoat-list__container"><h3 class="topcoat-list__header">Parameters</h3><ol class="topcoat-list"><li class="topcoat-list__item"><span class="dr-param">query</span>

4
dist/savage-min.js vendored
View File

File diff suppressed because one or more lines are too long

24
dist/savage.js vendored
View File

@ -28,7 +28,7 @@
// See the License for the specific language governing permissions and
// limitations under the License.
//
// build: 2013-09-13
// build: 2013-09-16
// Copyright (c) 2013 Adobe Systems Incorporated. All rights reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
@ -1147,7 +1147,7 @@ var has = "hasOwnProperty",
S = " ",
objectToString = Object.prototype.toString,
ISURL = /^url\(['"]?([^\)]+?)['"]?\)$/i,
colourRegExp = /^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|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,
colourRegExp = /^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|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,
isnan = {"NaN": 1, "Infinity": 1, "-Infinity": 1},
bezierrg = /^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/,
reURLValue = /^url\(#?([^)]+)\)$/,
@ -1731,11 +1731,11 @@ Savage.getRGB = cacher(function (colour) {
if (rgb[5]) {
values = rgb[5].split(commaSpaces);
red = toFloat(values[0]);
values[0].slice(-1) == "%" && (red *= 2.55);
values[0].slice(-1) == "%" && (red /= 100);
green = toFloat(values[1]);
values[1].slice(-1) == "%" && (green *= 2.55);
values[1].slice(-1) == "%" && (green /= 100);
blue = toFloat(values[2]);
values[2].slice(-1) == "%" && (blue *= 2.55);
values[2].slice(-1) == "%" && (blue /= 100);
(values[0].slice(-3) == "deg" || values[0].slice(-1) == "\xb0") && (red /= 360);
rgb[1].toLowerCase().slice(0, 4) == "hsba" && (opacity = toFloat(values[3]));
values[3] && values[3].slice(-1) == "%" && (opacity /= 100);
@ -1744,16 +1744,20 @@ Savage.getRGB = cacher(function (colour) {
if (rgb[6]) {
values = rgb[6].split(commaSpaces);
red = toFloat(values[0]);
values[0].slice(-1) == "%" && (red *= 2.55);
values[0].slice(-1) == "%" && (red /= 100);
green = toFloat(values[1]);
values[1].slice(-1) == "%" && (green *= 2.55);
values[1].slice(-1) == "%" && (green /= 100);
blue = toFloat(values[2]);
values[2].slice(-1) == "%" && (blue *= 2.55);
values[2].slice(-1) == "%" && (blue /= 100);
(values[0].slice(-3) == "deg" || values[0].slice(-1) == "\xb0") && (red /= 360);
rgb[1].toLowerCase().slice(0, 4) == "hsla" && (opacity = toFloat(values[3]));
values[3] && values[3].slice(-1) == "%" && (opacity /= 100);
return Savage.hsl2rgb(red, green, blue, opacity);
}
red = mmin(math.round(red), 255);
green = mmin(math.round(green), 255);
blue = mmin(math.round(blue), 255);
opacity = mmin(mmax(opacity, 0), 1);
rgb = {r: red, g: green, b: blue, toString: rgbtoString};
rgb.hex = "#" + (16777216 | blue | (green << 8) | (red << 16)).toString(16).slice(1);
rgb.opacity = is(opacity, "finite") ? opacity : 1;
@ -5840,7 +5844,7 @@ Savage.plugin(function (Savage, Element, Paper, glob) {
};
Savage._.box = box;
/*\
* Savage.findDotsAtSegment
* Savage.path.findDotsAtSegment
[ method ]
**
* Utility method
@ -5973,7 +5977,7 @@ Savage.plugin(function (Savage, Element, Paper, glob) {
\*/
Savage.path.isPointInside = isPointInsidePath;
/*\
* Savage.pathBBox
* Savage.path.getBBox
[ method ]
**
* Utility method

29
src/svg.js
View File

@ -69,7 +69,7 @@ var has = "hasOwnProperty",
S = " ",
objectToString = Object.prototype.toString,
ISURL = /^url\(['"]?([^\)]+?)['"]?\)$/i,
colourRegExp = /^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|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,
colourRegExp = /^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|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,
isnan = {"NaN": 1, "Infinity": 1, "-Infinity": 1},
bezierrg = /^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/,
reURLValue = /^url\(#?([^)]+)\)$/,
@ -594,12 +594,19 @@ Savage.Matrix = Matrix;
# <li>#••• — shortened HTML colour: (“<code>#000</code>”, “<code>#fc0</code>”, etc)</li>
# <li>#•••••• — full length HTML colour: (“<code>#000000</code>”, “<code>#bd2300</code>”)</li>
# <li>rgb(•••, •••, •••) — red, green and blue channels values: (“<code>rgb(200,&nbsp;100,&nbsp;0)</code>”)</li>
# <li>rgba(•••, •••, •••, •••) — also with opacity</li>
# <li>rgb(•••%, •••%, •••%) — same as above, but in %: (“<code>rgb(100%,&nbsp;175%,&nbsp;0%)</code>”)</li>
# <li>rgba(•••%, •••%, •••%, •••%) — also with opacity</li>
# <li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“<code>hsb(0.5,&nbsp;0.25,&nbsp;1)</code>”)</li>
# <li>hsba(•••, •••, •••, •••) — also with opacity</li>
# <li>hsb(•••%, •••%, •••%) — same as above, but in %</li>
# <li>hsl(•••, •••, •••) — same as hsb</li>
# <li>hsl(•••%, •••%, •••%) — same as hsb</li>
# <li>hsba(•••%, •••%, •••%, •••%) — also with opacity</li>
# <li>hsl(•••, •••, •••) — hue, saturation and luminosity values: (“<code>hsb(0.5,&nbsp;0.25,&nbsp;0.5)</code>”)</li>
# <li>hsla(•••, •••, •••, •••) — also with opacity</li>
# <li>hsl(•••%, •••%, •••%) — same as above, but in %</li>
# <li>hsla(•••%, •••%, •••%, •••%) — also with opacity</li>
# </ul>
* Note that `%` can be used any time: `rgb(20%, 255, 50%)`.
= (object) RGB object in format:
o {
o r (number) red,
@ -653,11 +660,11 @@ Savage.getRGB = cacher(function (colour) {
if (rgb[5]) {
values = rgb[5].split(commaSpaces);
red = toFloat(values[0]);
values[0].slice(-1) == "%" && (red *= 2.55);
values[0].slice(-1) == "%" && (red /= 100);
green = toFloat(values[1]);
values[1].slice(-1) == "%" && (green *= 2.55);
values[1].slice(-1) == "%" && (green /= 100);
blue = toFloat(values[2]);
values[2].slice(-1) == "%" && (blue *= 2.55);
values[2].slice(-1) == "%" && (blue /= 100);
(values[0].slice(-3) == "deg" || values[0].slice(-1) == "\xb0") && (red /= 360);
rgb[1].toLowerCase().slice(0, 4) == "hsba" && (opacity = toFloat(values[3]));
values[3] && values[3].slice(-1) == "%" && (opacity /= 100);
@ -666,16 +673,20 @@ Savage.getRGB = cacher(function (colour) {
if (rgb[6]) {
values = rgb[6].split(commaSpaces);
red = toFloat(values[0]);
values[0].slice(-1) == "%" && (red *= 2.55);
values[0].slice(-1) == "%" && (red /= 100);
green = toFloat(values[1]);
values[1].slice(-1) == "%" && (green *= 2.55);
values[1].slice(-1) == "%" && (green /= 100);
blue = toFloat(values[2]);
values[2].slice(-1) == "%" && (blue *= 2.55);
values[2].slice(-1) == "%" && (blue /= 100);
(values[0].slice(-3) == "deg" || values[0].slice(-1) == "\xb0") && (red /= 360);
rgb[1].toLowerCase().slice(0, 4) == "hsla" && (opacity = toFloat(values[3]));
values[3] && values[3].slice(-1) == "%" && (opacity /= 100);
return Savage.hsl2rgb(red, green, blue, opacity);
}
red = mmin(math.round(red), 255);
green = mmin(math.round(green), 255);
blue = mmin(math.round(blue), 255);
opacity = mmin(mmax(opacity, 0), 1);
rgb = {r: red, g: green, b: blue, toString: rgbtoString};
rgb.hex = "#" + (16777216 | blue | (green << 8) | (red << 16)).toString(16).slice(1);
rgb.opacity = is(opacity, "finite") ? opacity : 1;

18
test/colors.js
View File

@ -24,7 +24,7 @@ describe("Colours", function () {
expect(c.l).to.be(.5);
});
it("parses HSL - %", function () {
var c = Savage.color("hsl(48%, 100%, 50%)");
var c = Savage.color("hsl(13.33%, 100%, 50%)");
expect(c.hex).to.be("#ffcc00");
expect(c.h.toFixed(3)).to.be("0.133");
expect(c.s).to.be(1);
@ -38,7 +38,7 @@ describe("Colours", function () {
expect(c.v).to.be(1);
});
it("parses HSB - %", function () {
var c = Savage.color("hsb(48%, 100%, 100%)");
var c = Savage.color("hsb(13.33%, 100%, 100%)");
expect(c.hex).to.be("#ffcc00");
expect(c.h.toFixed(3)).to.be("0.133");
expect(c.s).to.be(1);
@ -91,9 +91,9 @@ describe("Colours", function () {
expectRGB("rgb(255, 204, 0)");
expectRGB("rgb(100%, 80%, 0%)");
expectRGB("hsb(0.1333, 1, 1)");
expectRGB("hsb(48%, 100%, 100%)");
expectRGB("hsb(13.33%, 100%, 100%)");
expectRGB("hsl(0.1333, 1, .5)");
expectRGB("hsl(48%, 100%, 50%)");
expectRGB("hsl(13.33%, 100%, 50%)");
expectRGB("rgba(255, 204, 0, .75)");
expectRGB("hsla(0.1333, 1, .5, .5)");
expectRGB("hsba(0.1333, 1, 1, .5)");
@ -104,15 +104,15 @@ describe("Colours", function () {
expect(c.b).to.be(255);
expect(c.error).to.not.be(true);
c = Savage.getRGB("foobar");
expect(c.error).to.be(true);
expect(!!c.error).to.be(true);
c = Savage.getRGB("#zzz");
expect(c.error).to.be(true);
expect(!!c.error).to.be(true);
c = Savage.getRGB("rgb(255)");
expect(c.error).to.be(true);
expect(!!c.error).to.be(true);
c = Savage.getRGB("hsl(0, 0, 0");
expect(c.error).to.be(true);
expect(!!c.error).to.be(true);
c = Savage.getRGB("rab(0, 0, 0)");
expect(c.error).to.be(true);
expect(!!c.error).to.be(true);
});
it("creates hsb", function() {
var str = Savage.hsb(0.13333, 1, 1);

4
test/savage-tests.js
View File

@ -393,9 +393,9 @@ describe("Savage methods", function () {
expect(Savage.snapTo(grid, 199, 1)).to.be(200);
expect(Savage.snapTo(grid, 299, 100)).to.be(200);
});
it("Savage.pathBBox", function() {
it("Savage.path.getBBox", function() {
// same as 10,20,30,40 rect
var bbox = Savage.pathBBox("M10,20h30v40h-30z");
var bbox = Savage.path.getBBox("M10,20h30v40h-30z");
expect(bbox.x).to.eql(10);
expect(bbox.y).to.eql(20);
expect(bbox.width).to.eql(30);