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

Added support for gradients’ stops manipulation + url, deurl

master
Dmitry Baranovskiy 2017-01-24 13:08:13 +11:00
parent c31fad6ef9
commit 989b3f7c93
6 changed files with 481 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
dist/snap.svg-min.js vendored
View File

File diff suppressed because one or more lines are too long

135
dist/snap.svg.js vendored
View File

@ -14,7 +14,7 @@
// See the License for the specific language governing permissions and // See the License for the specific language governing permissions and
// limitations under the License. // limitations under the License.
// //
// build: 2017-01-18 // build: 2017-01-24
// Copyright (c) 2013 Adobe Systems Incorporated. All rights reserved. // Copyright (c) 2013 Adobe Systems Incorporated. All rights reserved.
// //
@ -919,7 +919,6 @@ var has = "hasOwnProperty",
ISURL = /^url\(['"]?([^\)]+?)['"]?\)$/i, 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,
bezierrg = /^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/, bezierrg = /^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/,
reURLValue = /^url\(#?([^)]+)\)$/,
separator = Snap._.separator = /[,\s]+/, separator = Snap._.separator = /[,\s]+/,
whitespace = /[\s]/g, whitespace = /[\s]/g,
commaSpaces = /[\s]*,[\s]*/, commaSpaces = /[\s]*,[\s]*/,
@ -4091,6 +4090,12 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
Str = String, Str = String,
separator = Snap._.separator, separator = Snap._.separator,
E = ""; E = "";
Snap.url = function (value) {
return "url(" + value + ")";
}
Snap.deurl = function (value) {
return String(value).match(reURLValue)[1];
}
// Attributes event handlers // Attributes event handlers
eve.on("snap.util.attr.mask", function (value) { eve.on("snap.util.attr.mask", function (value) {
if (value instanceof Element || value instanceof Fragment) { if (value instanceof Element || value instanceof Fragment) {
@ -4211,6 +4216,23 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
} }
return out; return out;
}); });
var len = stops.length,
start = 0,
j = 0;
function seed(i, end) {
var step = (end - start) / (i - j);
for (var k = j; k < i; k++) {
stops[k].offset = +(+start + step * (k - j)).toFixed(2);
}
j = i;
start = end;
}
len--;
for (var i = 0; i < len; i++) if ("offset" in stops[i]) {
seed(i, stops[i].offset);
}
stops[len].offset = stops[len].offset || 100;
seed(len, stops[len].offset);
return { return {
type: type, type: type,
params: params, params: params,
@ -4443,6 +4465,22 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
eve.on("snap.util.getattr.#text", function () { eve.on("snap.util.getattr.#text", function () {
return this.node.textContent; return this.node.textContent;
})(-1); })(-1);
eve.on("snap.util.getattr.fill", function (internal) {
if (internal) {
return;
}
eve.stop();
var value = eve("snap.util.getattr.fill", this, true).firstDefined();
return Snap("#" + Snap.deurl(value)) || value;
})(-1);
eve.on("snap.util.getattr.stroke", function (internal) {
if (internal) {
return;
}
eve.stop();
var value = eve("snap.util.getattr.stroke", this, true).firstDefined();
return Snap("#" + Snap.deurl(value)) || value;
})(-1);
eve.on("snap.util.getattr.viewBox", function () { eve.on("snap.util.getattr.viewBox", function () {
eve.stop(); eve.stop();
var vb = $(this.node, "viewBox"); var vb = $(this.node, "viewBox");
@ -5230,21 +5268,51 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
(function () { (function () {
var $ = Snap._.$; var $ = Snap._.$;
// gradients' helpers // gradients' helpers
/*\
* Element.stops()
[ method ]
**
* Only for gradients!
* Returns array of gradient stops elements.
= (array) the stops array.
\*/
function Gstops() { function Gstops() {
return this.selectAll("stop"); return this.selectAll("stop");
} }
/*\
* Element.addStop()
[ method ]
**
* Only for gradients!
* Adds another stop to the gradient.
- color (string) stops color
- offset (number) stops offset 0..100
= (object) gradient element
\*/
function GaddStop(color, offset) { function GaddStop(color, offset) {
var stop = $("stop"), var stop = $("stop"),
attr = { attr = {
offset: +offset + "%" offset: +offset + "%"
}; };
color = Snap.color(color); color = Snap.color(color);
attr["stop-color"] = color.toString(); attr["stop-color"] = color.hex;
if (color.opacity < 1) { if (color.opacity < 1) {
attr["stop-opacity"] = color.opacity; attr["stop-opacity"] = color.opacity;
} }
$(stop, attr); $(stop, attr);
this.node.appendChild(stop); var stops = this.stops(),
inserted;
for (var i = 0; i < stops.length; i++) {
var stopOffset = stops[i].attr("offset");
if (parseFloat(stopOffset) > offset) {
this.node.insertBefore(stop, stops[i].node);
inserted = true;
break;
}
}
if (!inserted) {
this.node.appendChild(stop);
}
return this; return this;
} }
function GgetBBox() { function GgetBBox() {
@ -5261,6 +5329,44 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
return Snap._.box(cx - r, cy - r, r * 2, r * 2); return Snap._.box(cx - r, cy - r, r * 2, r * 2);
} }
} }
/*\
* Element.setStops()
[ method ]
**
* Only for gradients!
* Updates stops of the gradient based on passed gradient descriptor. See @Ppaer.gradient
- str (string) gradient descriptor part after `()`.
= (object) gradient element
| var g = paper.gradient("l(0, 0, 1, 1)#000-#f00-#fff");
| g.setStops("#fff-#000-#f00-#fc0");
\*/
function GsetStops(str) {
var grad = str,
stops = this.stops();
if (typeof str == "string") {
grad = eve("snap.util.grad.parse", null, "l(0,0,0,1)" + str).firstDefined().stops;
}
if (!Snap.is(grad, "array")) {
return;
}
for (var i = 0; i < stops.length; i++) {
if (grad[i]) {
var color = Snap.color(grad[i].color),
attr = {"offset": grad[i].offset + "%"};
attr["stop-color"] = color.hex;
if (color.opacity < 1) {
attr["stop-opacity"] = color.opacity;
}
stops[i].attr(attr);
} else {
stops[i].remove();
}
}
for (i = stops.length; i < grad.length; i++) {
this.addStop(grad[i].color, grad[i].offset);
}
return this;
}
function gradient(defs, str) { function gradient(defs, str) {
var grad = eve("snap.util.grad.parse", null, str).firstDefined(), var grad = eve("snap.util.grad.parse", null, str).firstDefined(),
el; el;
@ -5279,24 +5385,8 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
}); });
} }
var stops = grad.stops, var stops = grad.stops,
len = stops.length, len = stops.length;
start = 0, for (var i = 0; i < len; i++) {
j = 0;
function seed(i, end) {
var step = (end - start) / (i - j);
for (var k = j; k < i; k++) {
stops[k].offset = +(+start + step * (k - j)).toFixed(2);
}
j = i;
start = end;
}
len--;
for (var i = 0; i < len; i++) if ("offset" in stops[i]) {
seed(i, stops[i].offset);
}
stops[len].offset = stops[len].offset || 100;
seed(len, stops[len].offset);
for (i = 0; i <= len; i++) {
var stop = stops[i]; var stop = stops[i];
el.addStop(stop.color, stop.offset); el.addStop(stop.color, stop.offset);
} }
@ -5307,6 +5397,7 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
el.stops = Gstops; el.stops = Gstops;
el.addStop = GaddStop; el.addStop = GaddStop;
el.getBBox = GgetBBox; el.getBBox = GgetBBox;
el.setStops = GsetStops;
if (x1 != null) { if (x1 != null) {
$(el.node, { $(el.node, {
x1: x1, x1: x1,

282
doc/reference.html
View File

@ -79,6 +79,10 @@
<a href="#Element.addClass" class="dr-method"><span>Element.addClass()</span></a> <a href="#Element.addClass" class="dr-method"><span>Element.addClass()</span></a>
</li> </li>
<li class="dr-lvl1">
<a href="#Element.addStop()" class="dr-method"><span>Element.addStop()()</span></a>
</li>
<li class="dr-lvl1"> <li class="dr-lvl1">
<a href="#Element.after" class="dr-method"><span>Element.after()</span></a> <a href="#Element.after" class="dr-method"><span>Element.after()</span></a>
</li> </li>
@ -235,10 +239,18 @@
<a href="#Element.selectAll" class="dr-method"><span>Element.selectAll()</span></a> <a href="#Element.selectAll" class="dr-method"><span>Element.selectAll()</span></a>
</li> </li>
<li class="dr-lvl1">
<a href="#Element.setStops()" class="dr-method"><span>Element.setStops()()</span></a>
</li>
<li class="dr-lvl1"> <li class="dr-lvl1">
<a href="#Element.stop" class="dr-method"><span>Element.stop()</span></a> <a href="#Element.stop" class="dr-method"><span>Element.stop()</span></a>
</li> </li>
<li class="dr-lvl1">
<a href="#Element.stops()" class="dr-method"><span>Element.stops()()</span></a>
</li>
<li class="dr-lvl1"> <li class="dr-lvl1">
<a href="#Element.toDefs" class="dr-method"><span>Element.toDefs()</span></a> <a href="#Element.toDefs" class="dr-method"><span>Element.toDefs()</span></a>
</li> </li>
@ -1018,7 +1030,7 @@
<article id="Snap.format"> <article id="Snap.format">
<header> <header>
<h3 class="dr-method">Snap.format(token, json)<a href="#Snap.format" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 200 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L200">&#x27ad;</a></h3> <h3 class="dr-method">Snap.format(token, json)<a href="#Snap.format" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 199 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L199">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.format-extra"></div> <div class="extra" id="Snap.format-extra"></div>
@ -1112,7 +1124,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.rad"> <article id="Snap.rad">
<header> <header>
<h3 class="dr-method">Snap.rad(deg)<a href="#Snap.rad" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 290 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L290">&#x27ad;</a></h3> <h3 class="dr-method">Snap.rad(deg)<a href="#Snap.rad" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 289 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L289">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.rad-extra"></div> <div class="extra" id="Snap.rad-extra"></div>
@ -1172,7 +1184,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.deg"> <article id="Snap.deg">
<header> <header>
<h3 class="dr-method">Snap.deg(rad)<a href="#Snap.deg" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 299 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L299">&#x27ad;</a></h3> <h3 class="dr-method">Snap.deg(rad)<a href="#Snap.deg" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 298 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L298">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.deg-extra"></div> <div class="extra" id="Snap.deg-extra"></div>
@ -1232,7 +1244,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.sin"> <article id="Snap.sin">
<header> <header>
<h3 class="dr-method">Snap.sin(angle)<a href="#Snap.sin" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 308 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L308">&#x27ad;</a></h3> <h3 class="dr-method">Snap.sin(angle)<a href="#Snap.sin" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 307 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L307">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.sin-extra"></div> <div class="extra" id="Snap.sin-extra"></div>
@ -1292,7 +1304,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.tan"> <article id="Snap.tan">
<header> <header>
<h3 class="dr-method">Snap.tan(angle)<a href="#Snap.tan" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 319 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L319">&#x27ad;</a></h3> <h3 class="dr-method">Snap.tan(angle)<a href="#Snap.tan" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 318 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L318">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.tan-extra"></div> <div class="extra" id="Snap.tan-extra"></div>
@ -1352,7 +1364,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.cos"> <article id="Snap.cos">
<header> <header>
<h3 class="dr-method">Snap.cos(angle)<a href="#Snap.cos" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 330 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L330">&#x27ad;</a></h3> <h3 class="dr-method">Snap.cos(angle)<a href="#Snap.cos" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 329 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L329">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.cos-extra"></div> <div class="extra" id="Snap.cos-extra"></div>
@ -1412,7 +1424,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.asin"> <article id="Snap.asin">
<header> <header>
<h3 class="dr-method">Snap.asin(num)<a href="#Snap.asin" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 341 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L341">&#x27ad;</a></h3> <h3 class="dr-method">Snap.asin(num)<a href="#Snap.asin" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 340 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L340">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.asin-extra"></div> <div class="extra" id="Snap.asin-extra"></div>
@ -1472,7 +1484,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.acos"> <article id="Snap.acos">
<header> <header>
<h3 class="dr-method">Snap.acos(num)<a href="#Snap.acos" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 352 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L352">&#x27ad;</a></h3> <h3 class="dr-method">Snap.acos(num)<a href="#Snap.acos" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 351 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L351">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.acos-extra"></div> <div class="extra" id="Snap.acos-extra"></div>
@ -1532,7 +1544,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.atan"> <article id="Snap.atan">
<header> <header>
<h3 class="dr-method">Snap.atan(num)<a href="#Snap.atan" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 363 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L363">&#x27ad;</a></h3> <h3 class="dr-method">Snap.atan(num)<a href="#Snap.atan" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 362 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L362">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.atan-extra"></div> <div class="extra" id="Snap.atan-extra"></div>
@ -1592,7 +1604,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.atan2"> <article id="Snap.atan2">
<header> <header>
<h3 class="dr-method">Snap.atan2(num)<a href="#Snap.atan2" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 374 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L374">&#x27ad;</a></h3> <h3 class="dr-method">Snap.atan2(num)<a href="#Snap.atan2" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 373 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L373">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.atan2-extra"></div> <div class="extra" id="Snap.atan2-extra"></div>
@ -1652,7 +1664,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.angle"> <article id="Snap.angle">
<header> <header>
<h3 class="dr-method">Snap.angle(x1, y1, x2, y2, [x3], [y3])<a href="#Snap.angle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 391 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L391">&#x27ad;</a></h3> <h3 class="dr-method">Snap.angle(x1, y1, x2, y2, [x3], [y3])<a href="#Snap.angle" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 390 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L390">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.angle-extra"></div> <div class="extra" id="Snap.angle-extra"></div>
@ -1738,7 +1750,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.len"> <article id="Snap.len">
<header> <header>
<h3 class="dr-method">Snap.len(x1, y1, x2, y2)<a href="#Snap.len" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 404 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L404">&#x27ad;</a></h3> <h3 class="dr-method">Snap.len(x1, y1, x2, y2)<a href="#Snap.len" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 403 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L403">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.len-extra"></div> <div class="extra" id="Snap.len-extra"></div>
@ -1818,7 +1830,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.len2"> <article id="Snap.len2">
<header> <header>
<h3 class="dr-method">Snap.len2(x1, y1, x2, y2)<a href="#Snap.len2" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 419 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L419">&#x27ad;</a></h3> <h3 class="dr-method">Snap.len2(x1, y1, x2, y2)<a href="#Snap.len2" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 418 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L418">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.len2-extra"></div> <div class="extra" id="Snap.len2-extra"></div>
@ -1898,7 +1910,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.closestPoint"> <article id="Snap.closestPoint">
<header> <header>
<h3 class="dr-method">Snap.closestPoint(path, x, y)<a href="#Snap.closestPoint" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 439 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L439">&#x27ad;</a></h3> <h3 class="dr-method">Snap.closestPoint(path, x, y)<a href="#Snap.closestPoint" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 438 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L438">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.closestPoint-extra"></div> <div class="extra" id="Snap.closestPoint-extra"></div>
@ -1975,7 +1987,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.is"> <article id="Snap.is">
<header> <header>
<h3 class="dr-method">Snap.is(o, type)<a href="#Snap.is" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 495 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L495">&#x27ad;</a></h3> <h3 class="dr-method">Snap.is(o, type)<a href="#Snap.is" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 494 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L494">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.is-extra"></div> <div class="extra" id="Snap.is-extra"></div>
@ -2038,7 +2050,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.snapTo"> <article id="Snap.snapTo">
<header> <header>
<h3 class="dr-method">Snap.snapTo(values, value, [tolerance])<a href="#Snap.snapTo" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 506 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L506">&#x27ad;</a></h3> <h3 class="dr-method">Snap.snapTo(values, value, [tolerance])<a href="#Snap.snapTo" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 505 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L505">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.snapTo-extra"></div> <div class="extra" id="Snap.snapTo-extra"></div>
@ -2104,7 +2116,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.getRGB"> <article id="Snap.getRGB">
<header> <header>
<h3 class="dr-method">Snap.getRGB(color)<a href="#Snap.getRGB" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 559 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L559">&#x27ad;</a></h3> <h3 class="dr-method">Snap.getRGB(color)<a href="#Snap.getRGB" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 558 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L558">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.getRGB-extra"></div> <div class="extra" id="Snap.getRGB-extra"></div>
@ -2439,7 +2451,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.hsb"> <article id="Snap.hsb">
<header> <header>
<h3 class="dr-method">Snap.hsb(h, s, b)<a href="#Snap.hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 647 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L647">&#x27ad;</a></h3> <h3 class="dr-method">Snap.hsb(h, s, b)<a href="#Snap.hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 646 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L646">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.hsb-extra"></div> <div class="extra" id="Snap.hsb-extra"></div>
@ -2505,7 +2517,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.hsl"> <article id="Snap.hsl">
<header> <header>
<h3 class="dr-method">Snap.hsl(h, s, l)<a href="#Snap.hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 660 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L660">&#x27ad;</a></h3> <h3 class="dr-method">Snap.hsl(h, s, l)<a href="#Snap.hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 659 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L659">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.hsl-extra"></div> <div class="extra" id="Snap.hsl-extra"></div>
@ -2571,7 +2583,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.rgb"> <article id="Snap.rgb">
<header> <header>
<h3 class="dr-method">Snap.rgb(r, g, b)<a href="#Snap.rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 673 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L673">&#x27ad;</a></h3> <h3 class="dr-method">Snap.rgb(r, g, b)<a href="#Snap.rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 672 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L672">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.rgb-extra"></div> <div class="extra" id="Snap.rgb-extra"></div>
@ -2637,7 +2649,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.color"> <article id="Snap.color">
<header> <header>
<h3 class="dr-method">Snap.color(clr)<a href="#Snap.color" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 759 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L759">&#x27ad;</a></h3> <h3 class="dr-method">Snap.color(clr)<a href="#Snap.color" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 758 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L758">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.color-extra"></div> <div class="extra" id="Snap.color-extra"></div>
@ -2789,7 +2801,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.hsb2rgb"> <article id="Snap.hsb2rgb">
<header> <header>
<h3 class="dr-method">Snap.hsb2rgb(h, s, v)<a href="#Snap.hsb2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 811 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L811">&#x27ad;</a></h3> <h3 class="dr-method">Snap.hsb2rgb(h, s, v)<a href="#Snap.hsb2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 810 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L810">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.hsb2rgb-extra"></div> <div class="extra" id="Snap.hsb2rgb-extra"></div>
@ -2907,7 +2919,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.hsl2rgb"> <article id="Snap.hsl2rgb">
<header> <header>
<h3 class="dr-method">Snap.hsl2rgb(h, s, l)<a href="#Snap.hsl2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 847 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L847">&#x27ad;</a></h3> <h3 class="dr-method">Snap.hsl2rgb(h, s, l)<a href="#Snap.hsl2rgb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 846 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L846">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.hsl2rgb-extra"></div> <div class="extra" id="Snap.hsl2rgb-extra"></div>
@ -3025,7 +3037,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.rgb2hsb"> <article id="Snap.rgb2hsb">
<header> <header>
<h3 class="dr-method">Snap.rgb2hsb(r, g, b)<a href="#Snap.rgb2hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 886 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L886">&#x27ad;</a></h3> <h3 class="dr-method">Snap.rgb2hsb(r, g, b)<a href="#Snap.rgb2hsb" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 885 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L885">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.rgb2hsb-extra"></div> <div class="extra" id="Snap.rgb2hsb-extra"></div>
@ -3135,7 +3147,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.rgb2hsl"> <article id="Snap.rgb2hsl">
<header> <header>
<h3 class="dr-method">Snap.rgb2hsl(r, g, b)<a href="#Snap.rgb2hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 919 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L919">&#x27ad;</a></h3> <h3 class="dr-method">Snap.rgb2hsl(r, g, b)<a href="#Snap.rgb2hsl" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 918 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L918">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.rgb2hsl-extra"></div> <div class="extra" id="Snap.rgb2hsl-extra"></div>
@ -3245,7 +3257,7 @@ paper.path(Snap.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']
<article id="Snap.parsePathString"> <article id="Snap.parsePathString">
<header> <header>
<h3 class="dr-method">Snap.parsePathString(pathString)<a href="#Snap.parsePathString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 952 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L952">&#x27ad;</a></h3> <h3 class="dr-method">Snap.parsePathString(pathString)<a href="#Snap.parsePathString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 951 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L951">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.parsePathString-extra"></div> <div class="extra" id="Snap.parsePathString-extra"></div>
@ -3306,7 +3318,7 @@ Parses given path string into an array of arrays of path segments
<article id="Snap.parseTransformString"> <article id="Snap.parseTransformString">
<header> <header>
<h3 class="dr-method">Snap.parseTransformString(TString)<a href="#Snap.parseTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1005 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1005">&#x27ad;</a></h3> <h3 class="dr-method">Snap.parseTransformString(TString)<a href="#Snap.parseTransformString" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1004 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1004">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.parseTransformString-extra"></div> <div class="extra" id="Snap.parseTransformString-extra"></div>
@ -3367,7 +3379,7 @@ Parses given transform string into an array of transformations
<article id="Snap.select"> <article id="Snap.select">
<header> <header>
<h3 class="dr-method">Snap.select(query)<a href="#Snap.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1265 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1265">&#x27ad;</a></h3> <h3 class="dr-method">Snap.select(query)<a href="#Snap.select" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1264 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1264">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.select-extra"></div> <div class="extra" id="Snap.select-extra"></div>
@ -3427,7 +3439,7 @@ Parses given transform string into an array of transformations
<article id="Snap.selectAll"> <article id="Snap.selectAll">
<header> <header>
<h3 class="dr-method">Snap.selectAll(query)<a href="#Snap.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1277 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1277">&#x27ad;</a></h3> <h3 class="dr-method">Snap.selectAll(query)<a href="#Snap.selectAll" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1276 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1276">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.selectAll-extra"></div> <div class="extra" id="Snap.selectAll-extra"></div>
@ -3487,7 +3499,7 @@ Parses given transform string into an array of transformations
<article id="Element.node"> <article id="Element.node">
<header> <header>
<h3 class="dr-property">Element.node()<a href="#Element.node" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1339 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1339">&#x27ad;</a></h3> <h3 class="dr-property">Element.node()<a href="#Element.node" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1338 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1338">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Element.node-extra"></div> <div class="extra" id="Element.node-extra"></div>
@ -3538,7 +3550,7 @@ c.node.onclick = function () {
<article id="Element.type"> <article id="Element.type">
<header> <header>
<h3 class="dr-property">Element.type()<a href="#Element.type" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1349 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1349">&#x27ad;</a></h3> <h3 class="dr-property">Element.type()<a href="#Element.type" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1348 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1348">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Element.type-extra"></div> <div class="extra" id="Element.type-extra"></div>
@ -3563,7 +3575,7 @@ c.node.onclick = function () {
<article id="Element.attr"> <article id="Element.attr">
<header> <header>
<h3 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 1391 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1391">&#x27ad;</a></h3> <h3 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 1390 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1390">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Element.attr-extra"></div> <div class="extra" id="Element.attr-extra"></div>
@ -3722,7 +3734,7 @@ and <code>-</code>: <code>&quot;+=2em&quot;</code>.
<article id="Snap.parse"> <article id="Snap.parse">
<header> <header>
<h3 class="dr-method">Snap.parse(svg)<a href="#Snap.parse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1432 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1432">&#x27ad;</a></h3> <h3 class="dr-method">Snap.parse(svg)<a href="#Snap.parse" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1431 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1431">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.parse-extra"></div> <div class="extra" id="Snap.parse-extra"></div>
@ -3782,7 +3794,7 @@ and <code>-</code>: <code>&quot;+=2em&quot;</code>.
<article id="Snap.fragment"> <article id="Snap.fragment">
<header> <header>
<h3 class="dr-method">Snap.fragment(varargs)<a href="#Snap.fragment" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1466 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1466">&#x27ad;</a></h3> <h3 class="dr-method">Snap.fragment(varargs)<a href="#Snap.fragment" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1465 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1465">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.fragment-extra"></div> <div class="extra" id="Snap.fragment-extra"></div>
@ -3842,7 +3854,7 @@ and <code>-</code>: <code>&quot;+=2em&quot;</code>.
<article id="Paper.el"> <article id="Paper.el">
<header> <header>
<h3 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 1569 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1569">&#x27ad;</a></h3> <h3 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 1568 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1568">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Paper.el-extra"></div> <div class="extra" id="Paper.el-extra"></div>
@ -3938,7 +3950,7 @@ var c = paper.el("circle", {
<article id="Element.children"> <article id="Element.children">
<header> <header>
<h3 class="dr-method">Element.children()<a href="#Element.children" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1581 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1581">&#x27ad;</a></h3> <h3 class="dr-method">Element.children()<a href="#Element.children" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1580 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1580">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Element.children-extra"></div> <div class="extra" id="Element.children-extra"></div>
@ -3980,7 +3992,7 @@ var c = paper.el("circle", {
<article id="Element.toJSON"> <article id="Element.toJSON">
<header> <header>
<h3 class="dr-method">Element.toJSON()<a href="#Element.toJSON" 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/Snap.svg/blob/master/src/svg.js#L1614">&#x27ad;</a></h3> <h3 class="dr-method">Element.toJSON()<a href="#Element.toJSON" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1613 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1613">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Element.toJSON-extra"></div> <div class="extra" id="Element.toJSON-extra"></div>
@ -4066,7 +4078,7 @@ var c = paper.el("circle", {
<article id="Snap.ajax"> <article id="Snap.ajax">
<header> <header>
<h3 class="dr-method">Snap.ajax(…)<a href="#Snap.ajax" 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/Snap.svg/blob/master/src/svg.js#L1732">&#x27ad;</a></h3> <h3 class="dr-method">Snap.ajax(…)<a href="#Snap.ajax" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1731 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1731">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.ajax-extra"></div> <div class="extra" id="Snap.ajax-extra"></div>
@ -4170,7 +4182,7 @@ var c = paper.el("circle", {
<article id="Snap.load"> <article id="Snap.load">
<header> <header>
<h3 class="dr-method">Snap.load(url, callback, [scope])<a href="#Snap.load" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1778 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1778">&#x27ad;</a></h3> <h3 class="dr-method">Snap.load(url, callback, [scope])<a href="#Snap.load" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1777 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1777">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.load-extra"></div> <div class="extra" id="Snap.load-extra"></div>
@ -4219,7 +4231,7 @@ var c = paper.el("circle", {
<article id="Snap.getElementByPoint"> <article id="Snap.getElementByPoint">
<header> <header>
<h3 class="dr-method">Snap.getElementByPoint(x, y)<a href="#Snap.getElementByPoint" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1809 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1809">&#x27ad;</a></h3> <h3 class="dr-method">Snap.getElementByPoint(x, y)<a href="#Snap.getElementByPoint" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1808 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1808">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.getElementByPoint-extra"></div> <div class="extra" id="Snap.getElementByPoint-extra"></div>
@ -4304,7 +4316,7 @@ var c = paper.el("circle", {
<article id="Snap.plugin"> <article id="Snap.plugin">
<header> <header>
<h3 class="dr-method">Snap.plugin(f)<a href="#Snap.plugin" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 1844 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L1844">&#x27ad;</a></h3> <h3 class="dr-method">Snap.plugin(f)<a href="#Snap.plugin" 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/Snap.svg/blob/master/src/svg.js#L1843">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Snap.plugin-extra"></div> <div class="extra" id="Snap.plugin-extra"></div>
@ -9073,13 +9085,193 @@ var p2 = paper.polyline(10, 10, 100, 100);</code></pre></section>
</div>
</section>
</article>
<article id="Element.stops()">
<header>
<h3 class="dr-method">Element.stops()()<a href="#Element.stops()" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 523 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L523">&#x27ad;</a></h3>
</header>
<section>
<div class="extra" id="Element.stops()-extra"></div>
<div class="dr-method">
<p>Only for gradients!
Returns array of gradient stops elements.
</p>
<p class="dr-returns">
<strong class="dr-title">Returns:</strong>
<em class="dr-type-array">array</em>
<span class="dr-description">the stops array.</span>
</p>
</div>
</section>
</article>
<article id="Element.addStop()">
<header>
<h3 class="dr-method">Element.addStop()(color, offset)<a href="#Element.addStop()" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 536 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L536">&#x27ad;</a></h3>
</header>
<section>
<div class="extra" id="Element.addStop()-extra"></div>
<div class="dr-method">
<p>Only for gradients!
Adds another stop to the gradient.
</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">color</span>
<span class="dr-type"><em class="dr-type-string">string</em> </span>
<span class="dr-description">stops color</span></li>
<li class="topcoat-list__item"><span class="dr-param">offset</span>
<span class="dr-type"><em class="dr-type-number">number</em> </span>
<span class="dr-description">stops offset 0..100</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">gradient element</span>
</p>
</div>
</section>
</article>
<article id="Element.setStops()">
<header>
<h3 class="dr-method">Element.setStops()(str)<a href="#Element.setStops()" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 587 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L587">&#x27ad;</a></h3>
</header>
<section>
<div class="extra" id="Element.setStops()-extra"></div>
<div class="dr-method">
<p>Only for gradients!
Updates stops of the gradient based on passed gradient descriptor. See <a href="#Ppaer.gradient" class="dr-link">Ppaer.gradient</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">str</span>
<span class="dr-type"><em class="dr-type-string">string</em> </span>
<span class="dr-description">gradient descriptor part after <code>()</code>.</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">gradient element</span>
</p>
<section class="code"><pre class="javascript code"><code data-language="javascript" class="language-javascript">var g = paper.gradient("l(0, 0, 1, 1)#000-#f00-#fff");
g.setStops("#fff-#000-#f00-#fc0");</code></pre></section>
</div> </div>
</section> </section>
</article> </article>
<article id="Paper.gradient"> <article id="Paper.gradient">
<header> <header>
<h3 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 659 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L659">&#x27ad;</a></h3> <h3 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 712 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L712">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Paper.gradient-extra"></div> <div class="extra" id="Paper.gradient-extra"></div>
@ -9277,7 +9469,7 @@ half the width, from black to white:
<article id="Paper.toString"> <article id="Paper.toString">
<header> <header>
<h3 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 675 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L675">&#x27ad;</a></h3> <h3 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 728 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L728">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Paper.toString-extra"></div> <div class="extra" id="Paper.toString-extra"></div>
@ -9319,7 +9511,7 @@ half the width, from black to white:
<article id="Paper.toDataURL"> <article id="Paper.toDataURL">
<header> <header>
<h3 class="dr-method">Paper.toDataURL()<a href="#Paper.toDataURL" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 695 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L695">&#x27ad;</a></h3> <h3 class="dr-method">Paper.toDataURL()<a href="#Paper.toDataURL" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 748 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L748">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Paper.toDataURL-extra"></div> <div class="extra" id="Paper.toDataURL-extra"></div>
@ -9361,7 +9553,7 @@ half the width, from black to white:
<article id="Paper.clear"> <article id="Paper.clear">
<header> <header>
<h3 class="dr-method">Paper.clear()<a href="#Paper.clear" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 706 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L706">&#x27ad;</a></h3> <h3 class="dr-method">Paper.clear()<a href="#Paper.clear" title="Link to this section" class="dr-hash">&#x2693;</a><a class="dr-sourceline" title="Go to line 759 in the source" href="https://github.com/adobe-webplatform/Snap.svg/blob/master/src/svg.js#L759">&#x27ad;</a></h3>
</header> </header>
<section> <section>
<div class="extra" id="Paper.clear-extra"></div> <div class="extra" id="Paper.clear-extra"></div>

55
src/attr.js
View File

@ -23,6 +23,28 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
Str = String, Str = String,
separator = Snap._.separator, separator = Snap._.separator,
E = ""; E = "";
/*\
* Snap.url()
[ method ]
**
* Wraps path into `"url(<path>)"`.
- value (string) path
= (string) wrapped path
\*/
Snap.url = function (value) {
return "url(" + value + ")";
}
/*\
* Snap.deurl()
[ method ]
**
* Unwraps path from `"url(<path>)"`.
- value (string) url path
= (string) unwrapped path
\*/
Snap.deurl = function (value) {
return String(value).match(reURLValue)[1];
}
// Attributes event handlers // Attributes event handlers
eve.on("snap.util.attr.mask", function (value) { eve.on("snap.util.attr.mask", function (value) {
if (value instanceof Element || value instanceof Fragment) { if (value instanceof Element || value instanceof Fragment) {
@ -143,6 +165,23 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
} }
return out; return out;
}); });
var len = stops.length,
start = 0,
j = 0;
function seed(i, end) {
var step = (end - start) / (i - j);
for (var k = j; k < i; k++) {
stops[k].offset = +(+start + step * (k - j)).toFixed(2);
}
j = i;
start = end;
}
len--;
for (var i = 0; i < len; i++) if ("offset" in stops[i]) {
seed(i, stops[i].offset);
}
stops[len].offset = stops[len].offset || 100;
seed(len, stops[len].offset);
return { return {
type: type, type: type,
params: params, params: params,
@ -375,6 +414,22 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
eve.on("snap.util.getattr.#text", function () { eve.on("snap.util.getattr.#text", function () {
return this.node.textContent; return this.node.textContent;
})(-1); })(-1);
eve.on("snap.util.getattr.fill", function (internal) {
if (internal) {
return;
}
eve.stop();
var value = eve("snap.util.getattr.fill", this, true).firstDefined();
return Snap("#" + Snap.deurl(value)) || value;
})(-1);
eve.on("snap.util.getattr.stroke", function (internal) {
if (internal) {
return;
}
eve.stop();
var value = eve("snap.util.getattr.stroke", this, true).firstDefined();
return Snap("#" + Snap.deurl(value)) || value;
})(-1);
eve.on("snap.util.getattr.viewBox", function () { eve.on("snap.util.getattr.viewBox", function () {
eve.stop(); eve.stop();
var vb = $(this.node, "viewBox"); var vb = $(this.node, "viewBox");

93
src/paper.js
View File

@ -512,21 +512,51 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
(function () { (function () {
var $ = Snap._.$; var $ = Snap._.$;
// gradients' helpers // gradients' helpers
/*\
* Element.stops()
[ method ]
**
* Only for gradients!
* Returns array of gradient stops elements.
= (array) the stops array.
\*/
function Gstops() { function Gstops() {
return this.selectAll("stop"); return this.selectAll("stop");
} }
/*\
* Element.addStop()
[ method ]
**
* Only for gradients!
* Adds another stop to the gradient.
- color (string) stops color
- offset (number) stops offset 0..100
= (object) gradient element
\*/
function GaddStop(color, offset) { function GaddStop(color, offset) {
var stop = $("stop"), var stop = $("stop"),
attr = { attr = {
offset: +offset + "%" offset: +offset + "%"
}; };
color = Snap.color(color); color = Snap.color(color);
attr["stop-color"] = color.toString(); attr["stop-color"] = color.hex;
if (color.opacity < 1) { if (color.opacity < 1) {
attr["stop-opacity"] = color.opacity; attr["stop-opacity"] = color.opacity;
} }
$(stop, attr); $(stop, attr);
this.node.appendChild(stop); var stops = this.stops(),
inserted;
for (var i = 0; i < stops.length; i++) {
var stopOffset = parseFloat(stops[i].attr("offset"));
if (stopOffset > offset) {
this.node.insertBefore(stop, stops[i].node);
inserted = true;
break;
}
}
if (!inserted) {
this.node.appendChild(stop);
}
return this; return this;
} }
function GgetBBox() { function GgetBBox() {
@ -543,6 +573,44 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
return Snap._.box(cx - r, cy - r, r * 2, r * 2); return Snap._.box(cx - r, cy - r, r * 2, r * 2);
} }
} }
/*\
* Element.setStops()
[ method ]
**
* Only for gradients!
* Updates stops of the gradient based on passed gradient descriptor. See @Ppaer.gradient
- str (string) gradient descriptor part after `()`.
= (object) gradient element
| var g = paper.gradient("l(0, 0, 1, 1)#000-#f00-#fff");
| g.setStops("#fff-#000-#f00-#fc0");
\*/
function GsetStops(str) {
var grad = str,
stops = this.stops();
if (typeof str == "string") {
grad = eve("snap.util.grad.parse", null, "l(0,0,0,1)" + str).firstDefined().stops;
}
if (!Snap.is(grad, "array")) {
return;
}
for (var i = 0; i < stops.length; i++) {
if (grad[i]) {
var color = Snap.color(grad[i].color),
attr = {"offset": grad[i].offset + "%"};
attr["stop-color"] = color.hex;
if (color.opacity < 1) {
attr["stop-opacity"] = color.opacity;
}
stops[i].attr(attr);
} else {
stops[i].remove();
}
}
for (i = stops.length; i < grad.length; i++) {
this.addStop(grad[i].color, grad[i].offset);
}
return this;
}
function gradient(defs, str) { function gradient(defs, str) {
var grad = eve("snap.util.grad.parse", null, str).firstDefined(), var grad = eve("snap.util.grad.parse", null, str).firstDefined(),
el; el;
@ -561,24 +629,8 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
}); });
} }
var stops = grad.stops, var stops = grad.stops,
len = stops.length, len = stops.length;
start = 0, for (var i = 0; i < len; i++) {
j = 0;
function seed(i, end) {
var step = (end - start) / (i - j);
for (var k = j; k < i; k++) {
stops[k].offset = +(+start + step * (k - j)).toFixed(2);
}
j = i;
start = end;
}
len--;
for (var i = 0; i < len; i++) if ("offset" in stops[i]) {
seed(i, stops[i].offset);
}
stops[len].offset = stops[len].offset || 100;
seed(len, stops[len].offset);
for (i = 0; i <= len; i++) {
var stop = stops[i]; var stop = stops[i];
el.addStop(stop.color, stop.offset); el.addStop(stop.color, stop.offset);
} }
@ -589,6 +641,7 @@ Snap.plugin(function (Snap, Element, Paper, glob, Fragment) {
el.stops = Gstops; el.stops = Gstops;
el.addStop = GaddStop; el.addStop = GaddStop;
el.getBBox = GgetBBox; el.getBBox = GgetBBox;
el.setStops = GsetStops;
if (x1 != null) { if (x1 != null) {
$(el.node, { $(el.node, {
x1: x1, x1: x1,

1
src/svg.js
View File

@ -76,7 +76,6 @@ var has = "hasOwnProperty",
ISURL = /^url\(['"]?([^\)]+?)['"]?\)$/i, 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,
bezierrg = /^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/, bezierrg = /^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/,
reURLValue = /^url\(#?([^)]+)\)$/,
separator = Snap._.separator = /[,\s]+/, separator = Snap._.separator = /[,\s]+/,
whitespace = /[\s]/g, whitespace = /[\s]/g,
commaSpaces = /[\s]*,[\s]*/, commaSpaces = /[\s]*,[\s]*/,