Skip to content

殷洪（管理员） / raphael

Go to a project
Commit 10c3e3b7 by Dmitry Baranovskiy
Options

* Global variables leakage fix 

  *  fix for elements with links
  * Gradient clean up
  * Added  attribute
  * Fixed hsb methods
  * Fixed image flickering
  * Improved  method on
  * Fixed drag'n'drop
  * New method [Paper.add](http://raphaeljs.com/reference.html#Paper.add)
  * Fix for
parent 3c49587c
Showing with 196 additions and 104 deletions
history.md 0 → 100644
2.0.1 * 2011-11-18
------------------
* Global variables leakage fix
* `toFront` fix for elements with links
* Gradient clean up
* Added `letter-spacing` attribute
* Fixed hsb methods
* Fixed image flickering
* Improved `toTransformString` method on `matrix`
* Fixed drag'n'drop
* New method [Paper.add](http://raphaeljs.com/reference.html#Paper.add)
* Fix for `clip-path`
2.0.0 * 2011-10-03
------------------
* Completely changed transformation handling:
* `translate()`, `rotate()` and `scale()` are deprecated
* `translation`, `rotation` and `scale` attributes are removed (!)
* new method `transform()` and new attribute `transform` were introduced
* chaining of transformations now allowed
* matrix transformation introduced
* see [docs](http://raphaeljs.com/reference.html#Element.transform)
* Animation API was updated (see [docs](http://raphaeljs.com/reference.html#Raphael.animation))
* delay, repeat, [setTime](http://raphaeljs.com/reference.html#Element.status), [status](http://raphaeljs.com/reference.html#Element.setTime)
* New methods:
* [Paper.setViewBox](http://raphaeljs.com/reference.html#Paper.setViewBox)
* [Paper.setStart](http://raphaeljs.com/reference.html#Paper.setStart)
* [Paper.setFinish](http://raphaeljs.com/reference.html#Paper.setFinish)
* [Paper.forEach](http://raphaeljs.com/reference.html#Paper.forEach)
* [Paper.getById](http://raphaeljs.com/reference.html#Paper.getById)
* [Paper.getElementByPoint](http://raphaeljs.com/reference.html#Paper.getElementByPoint)
* [Element.data](http://raphaeljs.com/reference.html#Element.data)
* [Element.glow](http://raphaeljs.com/reference.html#Element.glow)
* [Element.onDragOver](http://raphaeljs.com/reference.html#Element.onDragOver)
* [Element.removeData](http://raphaeljs.com/reference.html#Element.removeData)
* [Raphael.fullfill](http://raphaeljs.com/reference.html#Raphael.fullfill)
* [Raphael.matrix](http://raphaeljs.com/reference.html#Raphael.matrix)
* [Raphael.parseTransformString](http://raphaeljs.com/reference.html#Raphael.parseTransformString)
* [Set.clear](http://raphaeljs.com/reference.html#Set.clear)
* [Set.exclude](http://raphaeljs.com/reference.html#Set.exclude)
* [Set.forEach](http://raphaeljs.com/reference.html#Set.forEach)
* [Set.splice](http://raphaeljs.com/reference.html#Set.splice)
* VML completely rewritten
* `getBBox` was fixed to take transformations into account
* [eve](http://raphaeljs.com/reference.html#eve) was added to the project
* Whole new [documentation](http://raphaeljs.com/reference.html)
* Various bug fixes
raphael-min.js
This source diff could not be displayed because it is too large. You can view the blob instead.
raphael.core.js
// ┌─────────────────────────────────────────────────────────────────────┐ \\
// │ "Raphaël 2.0" - JavaScript Vector Library │ \\
// │ "Raphaël 2.0.1" - JavaScript Vector Library │ \\
// ├─────────────────────────────────────────────────────────────────────┤ \\
// │ Copyright (c) 2008-2011 Dmitry Baranovskiy (http://raphaeljs.com) │ \\
// │ Copyright (c) 2008-2011 Sencha Labs (http://sencha.com) │ \\
......@@ -26,7 +26,7 @@
- height (number)
- callback (function) #optional callback function which is going to be executed in the context of newly created paper
* or
- all (array) (first 3 or 4 elements in the array are equal to [containerID, width, height] or [x, y, width, height]. The rest are element descriptions in format {type: type, <attributes>})
- all (array) (first 3 or 4 elements in the array are equal to [containerID, width, height] or [x, y, width, height]. The rest are element descriptions in format {type: type, <attributes>}). See @Paper.add.
- callback (function) #optional callback function which is going to be executed in the context of newly created paper
* or
- onReadyCallback (function) function that is going to be called on DOM ready event. You can also subscribe to this event via Eve’s “DOMLoad” event. In this case method returns `undefined`.
......@@ -60,17 +60,7 @@
if (R.is(first, "function")) {
return loaded ? first() : eve.on("DOMload", first);
} else if (R.is(first, array)) {
var a = first,
cnv = R._engine.create[apply](R, a.splice(0, 3 + R.is(a[0], nu))),
res = cnv.set(),
i = 0,
ii = a.length,
j;
for (; i < ii; i++) {
j = a[i] || {};
elements[has](j.type) && res.push(cnv[j.type]().attr(j));
}
return res;
return R._engine.create[apply](R, first.splice(0, 3 + R.is(first[0], nu))).add(first);
} else {
var args = Array.prototype.slice.call(arguments, 0);
if (R.is(args[args.length - 1], "function")) {
......@@ -83,7 +73,7 @@
}
}
}
R.version = "2.0.0";
R.version = "2.0.1";
R.eve = eve;
var loaded,
separator = /[, ]+/,
......@@ -191,6 +181,7 @@
gradient: 0,
height: 0,
href: "http://raphaeljs.com/",
"letter-spacing": 0,
opacity: 1,
path: "M0,0",
r: 0,
......@@ -293,7 +284,7 @@
if (!matrix) {
return path;
}
var x, y, i, j, pathi;
var x, y, i, j, ii, jj, pathi;
path = path2curve(path);
for (i = 0, ii = path.length; i < ii; i++) {
pathi = path[i];
......@@ -501,8 +492,8 @@
eve("setWindow", R, g.win, newwin);
g.win = newwin;
g.doc = g.win.document;
if (initWin) {
initWin(g.win);
if (R._engine.initWin) {
R._engine.initWin(g.win);
}
};
var toHex = function (color) {
......@@ -632,7 +623,7 @@
clr.v = rgb.b;
} else {
clr = {hex: "none"};
crl.r = clr.g = clr.b = clr.h = clr.s = clr.v = clr.l = -1;
clr.r = clr.g = clr.b = clr.h = clr.s = clr.v = clr.l = -1;
}
}
clr.toString = rgbtoString;
......@@ -815,7 +806,7 @@
var preload = R._preload = function (src, f) {
var img = g.doc.createElement("img");
img.style.cssText = "position:absolute;left:-9999em;top-9999em";
img.style.cssText = "position:absolute;left:-9999em;top:-9999em";
img.onload = function () {
f.call(this);
this.onload = null;
......@@ -1174,6 +1165,11 @@
alpha: alpha
};
};
R._removedFactory = function (methodname) {
return function () {
throw new Error("Rapha\xebl: you are calling to method \u201c" + methodname + "\u201d of removed object");
};
};
var pathDimensions = cacher(function (path) {
if (!path) {
return {x: 0, y: 0, width: 0, height: 0};
......@@ -1719,11 +1715,6 @@
el2.prev = el;
el.next = el2;
},
removed = function (methodname) {
return function () {
throw new Error("Rapha\xebl: you are calling to method \u201c" + methodname + "\u201d of removed object");
};
},
extractTransform = R._extractTransform = function (el, tstr) {
if (tstr == null) {
return el._.transform;
......@@ -2175,7 +2166,12 @@
matrixproto.toTransformString = function (shorter) {
var s = shorter || this[split]();
if (s.isSimple) {
return "t" + [s.dx, s.dy] + "s" + [s.scalex, s.scaley, 0, 0] + "r" + [s.rotate, 0, 0];
s.scalex = +s.scalex.toFixed(4);
s.scaley = +s.scaley.toFixed(4);
s.rotate = +s.rotate.toFixed(4);
return (s.dx && s.dy ? "t" + [s.dx, s.dy] : E) +
(s.scalex != 1 || s.scaley != 1 ? "s" + [s.scalex, s.scaley, 0, 0] : E) +
(s.rotate ? "r" + [s.rotate, 0, 0] : E);
} else {
return "m" + [this.get(0), this.get(1), this.get(2), this.get(3), this.get(4), this.get(5)];
}
......@@ -2647,6 +2643,7 @@
elproto.unhover = function (f_in, f_out) {
return this.unmouseover(f_in).unmouseout(f_out);
};
var draggable = [];
/*\
* Element.drag
[ method ]
......@@ -2693,6 +2690,7 @@
eve("drag.start." + this.id, start_scope || move_scope || this, e.clientX + scrollX, e.clientY + scrollY, e);
}
this._drag = {};
draggable.push({el: this, start: start});
this.mousedown(start);
return this;
};
......@@ -2714,13 +2712,13 @@
* Removes all drag event handlers from given element.
\*/
elproto.undrag = function () {
var i = drag.length;
while (i--) if (drag[i].el == this) {
R.unmousedown(drag[i].start);
drag.splice(i++, 1);
var i = draggable.length;
while (i--) if (draggable[i].el == this) {
this.unmousedown(draggable[i].start);
draggable.splice(i, 1);
eve.unbind("drag.*." + this.id);
}
!drag.length && R.unmousemove(dragMove).unmouseup(dragUp);
!draggable.length && R.unmousemove(dragMove).unmouseup(dragUp);
};
/*\
* Paper.circle
......@@ -3615,7 +3613,7 @@
= (object) original element
\*/
elproto.animateWith = function (element, anim, params, ms, easing, callback) {
var a = params ? R.animation(params, ms, easing, callback) : anim;
var a = params ? R.animation(params, ms, easing, callback) : anim,
status = element.status(anim);
return this.animate(a).status(a, status * anim.ms / a.ms);
};
......@@ -3776,7 +3774,7 @@
return;
}
if (!isInAnim) {
for (attr in params) if (params[has](attr)) {
for (var attr in params) if (params[has](attr)) {
if (availableAnimAttrs[has](attr) || element.paper.customAttributes[has](attr)) {
from[attr] = element.attr(attr);
(from[attr] == null) && (from[attr] = availableAttrs[attr]);
......@@ -4508,6 +4506,48 @@
};
/*\
* Paper.add
[ method ]
**
* Imports elements in JSON array in format `{type: type, <attributes>}`
**
> Parameters
**
- json (array)
= (object) resulting set of imported elements
> Usage
| paper.import([
| {
| type: "circle",
| cx: 10,
| cy: 10,
| r: 5
| },
| {
| type: "rect",
| x: 10,
| y: 10,
| width: 10,
| height: 10,
| fill: "#fc0"
| }
| ]);
\*/
paperproto.add = function (json) {
if (R.is(json, "array")) {
var res = this.set(),
i = 0,
ii = json.length,
j;
for (; i < ii; i++) {
j = json[i] || {};
elements[has](j.type) && res.push(this[j.type]().attr(j));
}
}
return res;
};
/*\
* Raphael.format
[ method ]
**
......
raphael.svg.js
// ┌─────────────────────────────────────────────────────────────────────┐ \\
// │ Raphaël 2 - JavaScript Vector Library │ \\
// │ Raphaël - JavaScript Vector Library │ \\
// ├─────────────────────────────────────────────────────────────────────┤ \\
// │ SVG Module │ \\
// ├─────────────────────────────────────────────────────────────────────┤ \\
......@@ -50,16 +50,6 @@ window.Raphael.svg && function (R) {
}
return el;
},
gradients = {},
rgGrad = /^url\(#(.*)\)$/,
removeGradientFill = function (node, paper) {
var oid = node.getAttribute("fill");
oid = oid && oid.match(rgGrad);
if (oid && !--gradients[oid[1]]) {
delete gradients[oid[1]];
paper.defs.removeChild(R._g.doc.getElementById(oid[1]));
}
},
addGradientFill = function (element, gradient) {
var type = "linear",
id = element.id + gradient,
......@@ -106,30 +96,33 @@ window.Raphael.svg && function (R) {
if (!dots) {
return null;
}
if (element.gradient) {
id = id.replace(/[\(\)\s,\xb0#]/g, "_");
if (element.gradient && id != element.gradient.id) {
SVG.defs.removeChild(element.gradient);
delete element.gradient;
}
id = id.replace(/[\(\)\s,\xb0#]/g, "-");
el = $(type + "Gradient", {id: id});
element.gradient = el;
$(el, type == "radial" ? {
fx: fx,
fy: fy
} : {
x1: vector[0],
y1: vector[1],
x2: vector[2],
y2: vector[3],
gradientTransform: element.matrix.invert()
});
SVG.defs.appendChild(el);
for (var i = 0, ii = dots.length; i < ii; i++) {
el.appendChild($("stop", {
offset: dots[i].offset ? dots[i].offset : i ? "100%" : "0%",
"stop-color": dots[i].color || "#fff"
}));
if (!element.gradient) {
el = $(type + "Gradient", {id: id});
element.gradient = el;
$(el, type == "radial" ? {
fx: fx,
fy: fy
} : {
x1: vector[0],
y1: vector[1],
x2: vector[2],
y2: vector[3],
gradientTransform: element.matrix.invert()
});
SVG.defs.appendChild(el);
for (var i = 0, ii = dots.length; i < ii; i++) {
el.appendChild($("stop", {
offset: dots[i].offset ? dots[i].offset : i ? "100%" : "0%",
"stop-color": dots[i].color || "#fff"
}));
}
}
}
$(o, {
......@@ -375,10 +368,13 @@ window.Raphael.svg && function (R) {
o.clip = rc;
}
if (!value) {
var clip = R._g.doc.getElementById(node.getAttribute("clip-path").replace(/(^url\(#|\)$)/g, E));
clip && clip.parentNode.removeChild(clip);
$(node, {"clip-path": E});
delete o.clip;
var path = node.getAttribute("clip-path");
if (path) {
var clip = R._g.doc.getElementById(path.replace(/(^url\(#|\)$)/g, E));
clip && clip.parentNode.removeChild(clip);
$(node, {"clip-path": E});
delete o.clip;
}
}
break;
case "path":
......@@ -873,12 +869,16 @@ window.Raphael.svg && function (R) {
if (this.removed) {
return;
}
this.paper.__set__ && this.paper.__set__.exclude(this);
var paper = this.paper;
paper.__set__ && paper.__set__.exclude(this);
eve.unbind("*.*." + this.id);
R._tear(this, this.paper);
if (this.gradient) {
paper.defs.removeChild(this.gradient);
}
R._tear(this, paper);
this.node.parentNode.removeChild(this.node);
for (var i in this) {
delete this[i];
this[i] = typeof this[i] == "function" ? R._removedFactory(i) : null;
}
this.removed = true;
};
......@@ -921,8 +921,8 @@ window.Raphael.svg && function (R) {
o arrow-end (string) arrowhead on the end of the path. The format for string is `<type>[-<width>[-<length>]]`. Possible types: `classic`, `block`, `open`, `oval`, `diamond`, `none`, width: `wide`, `narrow`, `midium`, length: `long`, `short`, `midium`.
o clip-rect (string) comma or space separated values: x, y, width and height
o cursor (string) CSS type of the cursor
o cx (number)
o cy (number)
o cx (number) the x-axis coordinate of the center of the circle, or ellipse
o cy (number) the y-axis coordinate of the center of the circle, or ellipse
o fill (string) colour, gradient or image
o fill-opacity (number)
o font (string)
......@@ -933,9 +933,9 @@ window.Raphael.svg && function (R) {
o href (string) URL, if specified element behaves as hyperlink
o opacity (number)
o path (string) SVG path string format
o r (number)
o rx (number)
o ry (number)
o r (number) radius of the circle, ellipse or rounded corner on the rect
o rx (number) horisontal radius of the ellipse
o ry (number) vertical radius of the ellipse
o src (string) image URL, only works for @Element.image element
o stroke (string) stroke colour
o stroke-dasharray (string) [“”, “`-`”, “`.`”, “`-.`”, “`-..`”, “`. `”, “`- `”, “`--`”, “`- .`”, “`--.`”, “`--..`”]
......@@ -1050,7 +1050,11 @@ window.Raphael.svg && function (R) {
if (this.removed) {
return this;
}
this.node.parentNode.appendChild(this.node);
if (this.node.parentNode.tagName.toLowerCase() == "a") {
this.node.parentNode.parentNode.appendChild(this.node.parentNode);
} else {
this.node.parentNode.appendChild(this.node);
}
var svg = this.paper;
svg.top != this && R._tofront(this, svg);
return this;
......@@ -1066,11 +1070,14 @@ window.Raphael.svg && function (R) {
if (this.removed) {
return this;
}
if (this.node.parentNode.firstChild != this.node) {
this.node.parentNode.insertBefore(this.node, this.node.parentNode.firstChild);
R._toback(this, this.paper);
var svg = this.paper;
var parent = this.node.parentNode;
if (parent.tagName.toLowerCase() == "a") {
parent.parentNode.insertBefore(this.node.parentNode, this.node.parentNode.parentNode.firstChild);
} else if (parent.firstChild != this.node) {
parent.insertBefore(this.node, this.node.parentNode.firstChild);
}
R._toback(this, this.paper);
var svg = this.paper;
return this;
};
/*\
......@@ -1327,7 +1334,7 @@ window.Raphael.svg && function (R) {
eve("remove", this);
this.canvas.parentNode && this.canvas.parentNode.removeChild(this.canvas);
for (var i in this) {
this[i] = removed(i);
this[i] = typeof this[i] == "function" ? R._removedFactory(i) : null;
}
};
var setproto = R.st;
......
raphael.vml.js
// ┌─────────────────────────────────────────────────────────────────────┐ \\
// │ Raphaël 2 - JavaScript Vector Library │ \\
// │ Raphaël - JavaScript Vector Library │ \\
// ├─────────────────────────────────────────────────────────────────────┤ \\
// │ VML Module │ \\
// ├─────────────────────────────────────────────────────────────────────┤ \\
......@@ -116,7 +116,7 @@ window.Raphael.vml && function (R) {
R.toString = function () {
return "Your browser doesn\u2019t support SVG. Falling down to VML.\nYou are running Rapha\xebl " + this.version;
};
addArrow = function (o, value, isEnd) {
var addArrow = function (o, value, isEnd) {
var values = Str(value).toLowerCase().split("-"),
se = isEnd ? "end" : "start",
i = values.length,
......@@ -143,7 +143,7 @@ window.Raphael.vml && function (R) {
stroke[se + "arrow"] = type;
stroke[se + "arrowlength"] = w;
stroke[se + "arrowwidth"] = h;
};
},
setFillAndStroke = function (o, params) {
// o.paper.canvas.style.display = "none";
o.attrs = o.attrs || {};
......@@ -204,7 +204,7 @@ window.Raphael.vml && function (R) {
}
}
if (!params["clip-rect"]) {
node.clipRect && (node.clipRect.style.clip = E);
node.clipRect && (node.clipRect.style.clip = "auto");
}
}
if (o.textpath) {
......@@ -331,7 +331,7 @@ window.Raphael.vml && function (R) {
a["font-family"] && (s.fontFamily = a["font-family"]);
a["font-weight"] && (s.fontWeight = a["font-weight"]);
a["font-style"] && (s.fontStyle = a["font-style"]);
fontSize = toFloat(fontSize ? fontSize[0] : a["font-size"]);
fontSize = toFloat(a["font-size"] || fontSize && fontSize[0]) || 10;
s.fontSize = fontSize * m + "px";
res.textpath.string && (span.innerHTML = Str(res.textpath.string).replace(/</g, "&#60;").replace(/&/g, "&#38;").replace(/\n/g, "<br>"));
var brect = span.getBoundingClientRect();
......@@ -366,7 +366,7 @@ window.Raphael.vml && function (R) {
res.textpath.style["v-text-kern"] = true;
}
// res.paper.canvas.style.display = E;
};
},
addGradientFill = function (o, gradient, fill) {
o.attrs = o.attrs || {};
var attrs = o.attrs,
......@@ -424,7 +424,7 @@ window.Raphael.vml && function (R) {
o.appendChild(fill);
}
return 1;
};
},
Element = function (node, vml) {
this[0] = this.node = node;
node.raphael = true;
......@@ -574,16 +574,12 @@ window.Raphael.vml && function (R) {
if (this.removed) {
return {};
}
if (this.type == "text") {
return {
x: this.X + (this.bbx || 0) - this.W / 2,
y: this.Y - this.H,
width: this.W,
height: this.H
};
} else {
return pathDimensions(this.attrs.path);
}
return {
x: this.X + (this.bbx || 0) - this.W / 2,
y: this.Y - this.H,
width: this.W,
height: this.H
};
};
elproto.remove = function () {
if (this.removed) {
......@@ -595,7 +591,7 @@ window.Raphael.vml && function (R) {
this.node.parentNode.removeChild(this.node);
this.shape && this.shape.parentNode.removeChild(this.shape);
for (var i in this) {
delete this[i];
this[i] = typeof this[i] == "function" ? R._removedFactory(i) : null;
}
this.removed = true;
};
......@@ -856,7 +852,7 @@ window.Raphael.vml && function (R) {
cs.height = height;
cs.clip = "rect(0 " + width + " " + height + " 0)";
if (this._viewBox) {
setViewBox.apply(this, this._viewBox);
R._engine.setViewBox.apply(this, this._viewBox);
}
return this;
};
......@@ -887,8 +883,8 @@ window.Raphael.vml && function (R) {
});
return this;
};
var createNode,
initWin = function (win) {
var createNode;
R._engine.initWin = function (win) {
var doc = win.document;
doc.createStyleSheet().addRule(".rvml", "behavior:url(#default#VML)");
try {
......@@ -902,7 +898,7 @@ window.Raphael.vml && function (R) {
};
}
};
initWin(R._g.win);
R._engine.initWin(R._g.win);
R._engine.create = function () {
var con = R._getContainer.apply(0, arguments),
container = con.container,
......@@ -959,7 +955,7 @@ window.Raphael.vml && function (R) {
R.eve("remove", this);
this.canvas.parentNode.removeChild(this.canvas);
for (var i in this) {
this[i] = removed(i);
this[i] = typeof this[i] == "function" ? R._removedFactory(i) : null;
}
return true;
};
......
reference.html
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment