Skip to content

殷洪（管理员） / raphael

Go to a project
Commit 923ec06e by Dmitry Baranovskiy
Options

Merge branch 'cuttingedge'

parents f1d24342 7d132c6d
Showing with 1036 additions and 450 deletions
plugins/colorpicker.js 0 → 100644
/*!
* Color Picker 0.1.0 - Raphael plugin
*
* Copyright (c) 2010 Dmitry Baranovskiy (http://raphaeljs.com)
* Based on Color Wheel (http://jweir.github.com/colorwheel) by John Weir (http://famedriver.com)
* Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license.
*/
/*
* Usage
* var cp = Raphael.colorpicker(x, y, size, "#fff"); // #fff is optional init color
* cp.color(); // returns "#fff"
* cp.color("#fc0"); // sets new color
* cp.onchange = function (color) {
* // do something with the color when user change it
* }
* cp.remove(); // removes widget
*/
(function (Raphael) {
Raphael.colorpicker = function (x, y, size, initcolor, element) {
return new ColorPicker(x, y, size, initcolor, element);
};
Raphael.fn.colorPickerIcon = function (x, y, r) {
var segments = pi * r * 2 / Math.min(r / 8, 4);
var a = pi / 2 - pi * 2 / segments * 1.5,
path = ["M", x, y - r, "A", r, r, 0, 0, 1, r * Math.cos(a) + x, y - r * Math.sin(a), "L", x, y, "z"].join();
for (var i = 0; i < segments; i++) {
this.path(path).attr({
stroke: "none",
fill: "hsb(" + (segments - i) * (255 / segments) + ", 255, 255)",
rotation: [90 + (360 / segments) * i, x, y]
});
}
return this.circle(x, y, r).attr({
fill: "r#fff-#fff",
"fill-opacity": 0,
"stroke-width": Math.round(r * .03),
stroke: "#fff"
});
};
var pi = Math.PI;
function angle(x, y) {
return (x < 0) * 180 + Math.atan(-y / -x) * 180 / pi;
}
var doc = document, win = window,
addEvent = (function () {
if (doc.addEventListener) {
return function (obj, type, fn, element) {
var f = function (e) {
return fn.call(element, e);
};
obj.addEventListener(type, f, false);
return function () {
obj.removeEventListener(type, f, false);
return true;
};
};
} else if (doc.attachEvent) {
return function (obj, type, fn, element) {
var f = function (e) {
return fn.call(element, e || win.event);
};
obj.attachEvent("on" + type, f);
var detacher = function () {
obj.detachEvent("on" + type, f);
return true;
};
return detacher;
};
}
})(),
ColorPicker = function (x, y, size, initcolor, element) {
size = size || 200;
var w3 = 3 * size / 200,
w1 = size / 200,
fi = 1.6180339887,
size20 = size / 20,
size2 = size / 2,
padding = 2 * size / 200,
height = size + size20 * 2 + padding * 3,
t = this,
H = 1, S = 1, B = 1, s = size - (size20 * 4),
r = element ? Raphael(element, size, height) : Raphael(x, y, size, height),
xy = s / 6 + size20 * 2 + padding,
wh = s * 2 / 3 - padding * 2;
w1 < 1 && (w1 = 1);
w3 < 1 && (w3 = 1);
r.colorPickerIcon(size2, size2, size2 - padding);
t.cursor = r.set();
t.cursor.push(r.circle(size2, size2, size20 / 2).attr({
stroke: "#000",
opacity: .5,
"stroke-width": w3
}));
t.cursor.push(t.cursor[0].clone().attr({
stroke: "#fff",
opacity: 1,
"stroke-width": w1
}));
t.disc = r.circle(size2, size2, size2 - padding).attr({
fill: "#000",
"fill-opacity": 0,
stroke: "none",
cursor: "crosshair"
});
var style = t.disc.node.style;
style.unselectable = "on";
style.MozUserSelect = "none";
style.WebkitUserSelect= "none";
// brightness drawing
var h = size20 * 2 + 2;
t.brect = r.rect(padding + h / fi / 2, size + padding * 2, size - padding * 2 - h / fi, h - padding * 2).attr({
stroke: "#fff",
fill: "180-#fff-#000"
});
t.cursorb = r.set();
t.cursorb.push(r.rect(size - padding - h / fi, size + padding, ~~(h / fi), h, w3).attr({
stroke: "#000",
opacity: .5,
"stroke-width": w3
}));
t.cursorb.push(t.cursorb[0].clone().attr({
stroke: "#fff",
opacity: 1,
"stroke-width": w1
}));
t.btop = t.brect.clone().attr({
stroke: "#000",
fill: "#000",
opacity: 0
});
style = t.btop.node.style;
style.unselectable = "on";
style.MozUserSelect = "none";
style.WebkitUserSelect= "none";
t.bwidth = ~~(h / fi) / 2;
t.minx = padding + t.bwidth;
t.maxx = size - h / fi - padding + t.bwidth;
t.H = t.S = t.B = 1;
t.padding = padding;
t.raphael = r;
t.size2 = size2;
t.size20 = size20;
t.x = x;
t.y = y;
// events
t.hson = addEvent(t.disc.node, "mousedown", function (e) {
var scrollY = doc.documentElement.scrollTop || doc.body.scrollTop,
scrollX = doc.documentElement.scrollLeft || doc.body.scrollLeft;
this.hsOnTheMove = true;
this.setHS(e.clientX + scrollX - this.x, e.clientY + scrollY - this.y);
this.docmove = addEvent(doc, "mousemove", this.docOnMove, this);
this.docup = addEvent(doc, "mouseup", this.docOnUp, this);
}, t);
t.bon = addEvent(t.btop.node, "mousedown", function (e) {
var scrollX = doc.documentElement.scrollLeft || doc.body.scrollLeft;
this.bOnTheMove = true;
this.setB(e.clientX + scrollX - this.x);
this.docmove = addEvent(doc, "mousemove", this.docOnMove, this);
this.docup = addEvent(doc, "mouseup", this.docOnUp, this);
}, t);
t.winunload = addEvent(win, "unload", function () {
this.hson();
this.bon();
this.docmove && this.docmove();
this.docup && this.docup();
this.winunload();
}, t);
t.color(initcolor || "#fff");
this.onchanged && this.onchanged(this.color());
};
ColorPicker.prototype.setB = function (x) {
x < this.minx && (x = this.minx);
x > this.maxx && (x = this.maxx);
this.cursorb.attr({x: x - this.bwidth});
this.B = (x - this.minx) / (this.maxx - this.minx);
this.onchange && this.onchange(this.color());
};
ColorPicker.prototype.setHS = function (x, y) {
var X = x - this.size2,
Y = y - this.size2,
R = this.size2 - this.size20 / 2 - this.padding,
d = angle(X, Y),
rd = d * pi / 180;
isNaN(d) && (d = 0);
if (X * X + Y * Y > R * R) {
x = R * Math.cos(rd) + this.size2;
y = R * Math.sin(rd) + this.size2;
}
this.cursor.attr({cx: x, cy: y});
this.H = (1 - d / 360) % 1;
this.S = Math.min((X * X + Y * Y) / R / R, 1);
this.brect.attr({fill: "180-hsb(" + [this.H, this.S] + ",1)-#000"});
this.onchange && this.onchange(this.color());
};
ColorPicker.prototype.docOnMove = function (e) {
var scrollY = doc.documentElement.scrollTop || doc.body.scrollTop,
scrollX = doc.documentElement.scrollLeft || doc.body.scrollLeft;
if (this.hsOnTheMove) {
this.setHS(e.clientX + scrollX - this.x, e.clientY + scrollY - this.y);
}
if (this.bOnTheMove) {
this.setB(e.clientX + scrollX - this.x);
}
e.preventDefault && e.preventDefault();
e.returnValue = false;
return false;
};
ColorPicker.prototype.docOnUp = function (e) {
this.hsOnTheMove = this.bOnTheMove = false;
this.docmove();
delete this.docmove;
this.docup();
delete this.docup;
this.onchanged && this.onchanged(this.color());
e.preventDefault && e.preventDefault();
e.stopPropagation && e.stopPropagation();
e.returnValue = false;
return false;
};
ColorPicker.prototype.remove = function () {
this.raphael.remove();
this.color = function () {
return false;
};
};
ColorPicker.prototype.color = function (color) {
if (color) {
color = Raphael.getRGB(color);
var hex = color.hex;
color = Raphael.rgb2hsb(color.r, color.g, color.b);
d = color.h * 360;
this.H = color.h;
this.S = color.s;
this.B = color.b;
this.cursorb.attr({x: this.B * (this.maxx - this.minx) + this.minx - this.bwidth});
this.brect.attr({fill: "180-hsb(" + [this.H, this.S] + ",1)-#000"});
var d = (1 - this.H) * 360,
rd = d * pi / 180,
R = (this.size2 - this.size20 / 2 - this.padding) * this.S,
x = Math.cos(rd) * R + this.size2,
y = Math.sin(rd) * R + this.size2;
this.cursor.attr({cx: x, cy: y});
return this;
} else {
return Raphael.hsb2rgb(this.H, this.S, this.B).hex;
}
};
})(window.Raphael);
\ No newline at end of file
plugins/colorwheel.js 0 → 100644
(function (Raphael) {
Raphael.colorwheel = function (x, y, size, initcolor, element) {
return new ColorWheel(x, y, size, initcolor, element);
};
var pi = Math.PI;
function angle(x, y) {
return (x < 0) * 180 + Math.atan(-y / -x) * 180 / pi;
}
var doc = document, win = window;
var addEvent = (function () {
if (doc.addEventListener) {
return function (obj, type, fn, element) {
var f = function (e) {
return fn.call(element, e);
};
obj.addEventListener(type, f, false);
return function () {
obj.removeEventListener(type, f, false);
return true;
};
};
} else if (doc.attachEvent) {
return function (obj, type, fn, element) {
var f = function (e) {
return fn.call(element, e || win.event);
};
obj.attachEvent("on" + type, f);
var detacher = function () {
obj.detachEvent("on" + type, f);
return true;
};
return detacher;
};
}
})();
var ColorWheel = function (x, y, size, initcolor, element) {
size = size || 200;
var w3 = 3 * size / 200,
w1 = size / 200,
fi = 1.6180339887,
segments = pi * size / 5,
size20 = size / 20,
size2 = size / 2,
padding = 2 * size / 200,
t = this;
var H = 1, S = 1, B = 1, s = size - (size20 * 4);
var r = element ? Raphael(element, size, size) : Raphael(x, y, size, size),
xy = s / 6 + size20 * 2 + padding,
wh = s * 2 / 3 - padding * 2;
w1 < 1 && (w1 = 1);
w3 < 1 && (w3 = 1);
// ring drawing
var a = pi / 2 - pi * 2 / segments * 1.3,
R = size2 - padding,
R2 = size2 - padding - size20 * 2,
path = ["M", size2, padding, "A", R, R, 0, 0, 1, R * Math.cos(a) + R + padding, R - R * Math.sin(a) + padding, "L", R2 * Math.cos(a) + R + padding, R - R2 * Math.sin(a) + padding, "A", R2, R2, 0, 0, 0, size2, padding + size20 * 2, "z"].join();
for (var i = 0; i < segments; i++) {
r.path(path).attr({
stroke: "none",
fill: "hsb(" + i * (255 / segments) + ", 255, 200)",
rotation: [(360 / segments) * i, size2, size2]
});
}
r.path(["M", size2, padding, "A", R, R, 0, 1, 1, size2 - 1, padding, "l1,0", "M", size2, padding + size20 * 2, "A", R2, R2, 0, 1, 1, size2 - 1, padding + size20 * 2, "l1,0"]).attr({
"stroke-width": w3,
stroke: "#fff"
});
t.cursorhsb = r.set();
var h = size20 * 2 + 2;
t.cursorhsb.push(r.rect(size2 - h / fi / 2, padding - 1, h / fi, h, 3 * size / 200).attr({
stroke: "#000",
opacity: .5,
"stroke-width": w3
}));
t.cursorhsb.push(t.cursorhsb[0].clone().attr({
stroke: "#fff",
opacity: 1,
"stroke-width": w1
}));
t.ring = r.path(["M", size2, padding, "A", R, R, 0, 1, 1, size2 - 1, padding, "l1,0M", size2, padding + size20 * 2, "A", R2, R2, 0, 1, 1, size2 - 1, padding + size20 * 2, "l1,0"]).attr({
fill: "#000",
opacity: 0,
stroke: "none"
});
// rect drawing
t.main = r.rect(xy, xy, wh, wh).attr({
stroke: "none",
fill: "#f00",
opacity: 1
});
t.main.clone().attr({
stroke: "none",
fill: "0-#fff-#fff",
opacity: 0
});
t.square = r.rect(xy - 1, xy - 1, wh + 2, wh + 2).attr({
r: 2,
stroke: "#fff",
"stroke-width": w3,
fill: "90-#000-#000",
opacity: 0,
cursor: "crosshair"
});
t.cursor = r.set();
t.cursor.push(r.circle(size2, size2, size20 / 2).attr({
stroke: "#000",
opacity: .5,
"stroke-width": w3
}));
t.cursor.push(t.cursor[0].clone().attr({
stroke: "#fff",
opacity: 1,
"stroke-width": w1
}));
t.H = t.S = t.B = 1;
t.raphael = r;
t.size2 = size2;
t.wh = wh;
t.x = x;
t.xy = xy;
t.y = y;
// events
t.hsbon = addEvent(t.ring.node, "mousedown", function (e) {
this.hsbOnTheMove = true;
this.setH(e.clientX - this.x - this.size2, e.clientY - this.y - this.size2);
this.docmove = addEvent(doc, "mousemove", this.docOnMove, this);
this.docup = addEvent(doc, "mouseup", this.docOnUp, this);
}, t);
t.clron = addEvent(t.square.node, "mousedown", function (e) {
this.clrOnTheMove = true;
this.setSB(e.clientX - this.x, e.clientY - this.y);
this.docmove = addEvent(doc, "mousemove", this.docOnMove, this);
this.docup = addEvent(doc, "mouseup", this.docOnUp, this);
}, t);
t.winunload = addEvent(win, "unload", function () {
this.hsbon();
this.clron();
this.docmove && this.docmove();
this.docup && this.docup();
this.winunload();
}, t);
t.color(initcolor || "#f00");
this.onchanged && this.onchanged(this.color());
};
ColorWheel.prototype.setH = function (x, y) {
var d = angle(x, y),
rd = d * pi / 180;
this.cursorhsb.rotate(d + 90, this.size2, this.size2);
this.H = (d + 90) / 360;
this.main.attr({fill: "hsb(" + this.H + ",1,1)"});
this.onchange && this.onchange(this.color());
};
ColorWheel.prototype.setSB = function (x, y) {
x < this.size2 - this.wh / 2 && (x = this.size2 - this.wh / 2);
x > this.size2 + this.wh / 2 && (x = this.size2 + this.wh / 2);
y < this.size2 - this.wh / 2 && (y = this.size2 - this.wh / 2);
y > this.size2 + this.wh / 2 && (y = this.size2 + this.wh / 2);
this.cursor.attr({cx: x, cy: y});
this.B = 1 - (y - this.xy) / this.wh;
this.S = (x - this.xy) / this.wh;
this.onchange && this.onchange(this.color());
};
ColorWheel.prototype.docOnMove = function (e) {
if (this.hsbOnTheMove) {
this.setH(e.clientX - this.x - this.size2, e.clientY - this.y - this.size2);
}
if (this.clrOnTheMove) {
this.setSB(e.clientX - this.x, e.clientY - this.y);
}
e.preventDefault && e.preventDefault();
e.returnValue = false;
return false;
};
ColorWheel.prototype.docOnUp = function (e) {
this.hsbOnTheMove = this.clrOnTheMove = false;
this.docmove();
delete this.docmove;
this.docup();
delete this.docup;
this.onchanged && this.onchanged(this.color());
};
ColorWheel.prototype.remove = function () {
this.raphael.remove();
this.color = function () {
return false;
};
};
ColorWheel.prototype.color = function (color) {
if (color) {
color = Raphael.getRGB(color);
color = Raphael.rgb2hsb(color.r, color.g, color.b);
var d = color.h * 360;
this.H = color.h;
this.S = color.s;
this.B = color.b;
this.cursorhsb.rotate(d, this.size2, this.size2);
this.main.attr({fill: "hsb(" + this.H + ",1,1)"});
var x = this.S * this.wh + this.xy,
y = (1 - this.B) * this.wh + this.xy;
this.cursor.attr({cx: x, cy: y});
return this;
} else {
return Raphael.hsb2rgb(this.H, this.S, this.B).hex;
}
};
})(window.Raphael);
plugins/jquery.colorpicker.js 0 → 100644
/*!
* Color Picker 0.1.0 - Raphael plugin
*
* Copyright (c) 2010 Dmitry Baranovskiy (http://raphaeljs.com)
* Based on Color Wheel (http://jweir.github.com/colorwheel) by John Weir (http://famedriver.com)
* Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license.
*/
(function ($, R) {
$.fn.colorpicker = function (size, initcolor) {
if (R) {
var offset = this.offset();
return R.colorpicker(offset.left, offset.top, size, initcolor, this[0]);
}
return null;
};
})(window.jQuery, window.Raphael);
\ No newline at end of file
plugins/jquery.colorwheel.js 0 → 100644
(function ($, R) {
$.fn.colorwheel = function (size, initcolor) {
if (R) {
var offset = this.offset();
return R.colorwheel(offset.left, offset.top, size, initcolor, this[0]);
}
return null;
};
})(window.jQuery, window.Raphael);
\ No newline at end of file
plugins/raphael.shadow.js
/*! /*!
* Raphael Shadow Plugin 0.2 * Raphael Shadow plugin 0.3
* *
* Copyright (c) 2009 Dmitry Baranovskiy (http://raphaeljs.com) * Copyright (c) 2008 - 2009 Dmitry Baranovskiy (http://raphaeljs.com)
* Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license. * Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license.
*/ */
Raphael.shadow = function (x, y, w, h, options) { Raphael.shadow = function (x, y, w, h, options) {
// options format: { // options format: {
// size: 0..1, shadow size // size: 0..1, shadow size
// color: "#000", placeholder colour // color: "#000", placeholder colour
// stroke: "#000", placeholder stroke colour // stroke: "#000", placeholder stroke colour
// shadow: "#000", shadow colour // shadow: "#000", shadow colour
// target: "someID" | htmlElement
// r: 5, radius of placeholder rounded corners // r: 5, radius of placeholder rounded corners
// } // }
options = options || {}; options = options || {};
...@@ -19,25 +19,34 @@ Raphael.shadow = function (x, y, w, h, options) { ...@@ -19,25 +19,34 @@ Raphael.shadow = function (x, y, w, h, options) {
color = options.color || "#fff", color = options.color || "#fff",
stroke = options.stroke || color, stroke = options.stroke || color,
shadowColor = options.shadow || "#000", shadowColor = options.shadow || "#000",
R = options.r || 3, target = options.target || null,
R = options.r == null ? 3 : options.r,
s = size, s = size,
b = size * 2, b = size * 2,
r = b + s, r = b + s,
rg = this.format("r{0}-{0}", shadowColor), rg = this.format("r{0}-{0}", shadowColor),
rect = "rect", rect = "rect",
circ = "circle", none = "none",
none = "none"; res,
var res = this([ set;
x - s, y - t, w + (x = s) * 2, h + (y = t) + b,
{type: rect, x: x - s, y: y - t, width: b + s, height: h + y + b, stroke: none, fill: this.format("180-{0}-{0}", shadowColor), opacity: 0, "clip-rect": [x - s + 1, y - t + r, b, h + y + b - r * 2 + .9]}, if (target) {
{type: rect, x: x + w - b, y: y - t, width: b + s, height: h + y + b, stroke: none, fill: this.format("0-{0}-{0}", shadowColor), opacity: 0, "clip-rect": [x + w - s + 1, y - t + r, b, h + y + b - r * 2]}, res = this(target, w + (x = s) * 2, h + (y = t) + b);
{type: rect, x: x + b - 1, y: y + h - s, width: w + b, height: b + s, stroke: none, fill: this.format("270-{0}-{0}", shadowColor), opacity: 0, "clip-rect": [x + b, y + h - s, w + b - r * 2, b + s]}, } else {
{type: rect, x: x + s - 1, y: y - t, width: w + b, height: b + s, stroke: none, fill: this.format("90-{0}-{0}", shadowColor), opacity: 0, "clip-rect": [x + b, y - t, w + b - r * 2, s + t + 1]}, res = this(x - s, y - t, w + (x = s) * 2, h + (y = t) + b);
{type: circ, cx: x + b, cy: y + h - s, r: r, stroke: none, fill: rg, opacity: 0, "clip-rect": [x - s, y + h - s + .999, r, r]}, }
{type: circ, cx: x + w - b, cy: y + h - s, r: r, stroke: none, fill: rg, opacity: 0, "clip-rect": [x + w - b, y + h - s, r, r]},
{type: circ, cx: x + b, cy: y - t + r, r: r, stroke: none, fill: rg, opacity: 0, "clip-rect": [x - s, y - t, r, r]}, set = res.set(
{type: circ, cx: x + w - b, cy: y - t + r, r: r , stroke: none, fill: rg, opacity: 0, "clip-rect": [x + w - b, y - t, r, r]}, res.rect(x - s, y - t, b + s, h + y + b).attr({stroke: none, fill: this.format("180-{0}-{0}", shadowColor), opacity: 0, "clip-rect": [x - s + 1, y - t + r, b, h + y + b - r * 2 + .9]}),
{type: rect, x: x, y: y, width: w, height: h, r: R, fill: color, stroke: stroke} res.rect(x + w - b, y - t, b + s, h + y + b).attr({stroke: none, fill: this.format("0-{0}-{0}", shadowColor), opacity: 0, "clip-rect": [x + w - s + 1, y - t + r, b, h + y + b - r * 2]}),
]); res.rect(x + b - 1, y + h - s, w + b, b + s).attr({stroke: none, fill: this.format("270-{0}-{0}", shadowColor), opacity: 0, "clip-rect": [x + b, y + h - s, w + b - r * 2, b + s]}),
return res[0].paper; res.rect(x + s - 1, y - t, w + b, b + s).attr({stroke: none, fill: this.format("90-{0}-{0}", shadowColor), opacity: 0, "clip-rect": [x + b, y - t, w + b - r * 2, s + t + 1]}),
}; res.circle(x + b, y + h - s, r).attr({stroke: none, fill: rg, opacity: 0, "clip-rect": [x - s, y + h - s + .999, r, r]}),
\ No newline at end of file res.circle(x + w - b, y + h - s, r).attr({stroke: none, fill: rg, opacity: 0, "clip-rect": [x + w - b, y + h - s, r, r]}),
res.circle(x + b, y - t + r, r).attr({stroke: none, fill: rg, opacity: 0, "clip-rect": [x - s, y - t, r, r]}),
res.circle(x + w - b, y - t + r, r).attr({stroke: none, fill: rg, opacity: 0, "clip-rect": [x + w - b, y - t, r, r]}),
res.rect(x, y, w, h, R).attr({fill: color, stroke: stroke})
);
return set[0].paper;
};
raphael-min.js
This source diff could not be displayed because it is too large. You can view the blob instead.
raphael.js
/*! /*!
* Raphael 1.3.1 - JavaScript Vector Library * Raphael 1.3.2 - JavaScript Vector Library
* *
* Copyright (c) 2008 - 2009 Dmitry Baranovskiy (http://raphaeljs.com) * Copyright (c) 2009 Dmitry Baranovskiy (http://raphaeljs.com)
* Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license. * Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license.
*/ */
Raphael = (function () { Raphael = (function () {
var separator = /[, ]+/, var separator = /[, ]+/,
elements = /^(circle|rect|path|ellipse|text|image)$/, elements = /^(circle|rect|path|ellipse|text|image)$/,
proto = "prototype",
has = "hasOwnProperty",
doc = document, doc = document,
win = window, win = window,
oldRaphael = { oldRaphael = {
was: "Raphael" in win, was: Object[proto][has].call(win, "Raphael"),
is: win.Raphael is: win.Raphael
}, },
R = function () { R = function () {
...@@ -36,10 +37,8 @@ Raphael = (function () { ...@@ -36,10 +37,8 @@ Raphael = (function () {
S = " ", S = " ",
split = "split", split = "split",
events = "click dblclick mousedown mousemove mouseout mouseover mouseup"[split](S), events = "click dblclick mousedown mousemove mouseout mouseover mouseup"[split](S),
has = "hasOwnProperty",
join = "join", join = "join",
length = "length", length = "length",
proto = "prototype",
lowerCase = String[proto].toLowerCase, lowerCase = String[proto].toLowerCase,
math = Math, math = Math,
mmax = math.max, mmax = math.max,
...@@ -51,24 +50,25 @@ Raphael = (function () { ...@@ -51,24 +50,25 @@ Raphael = (function () {
pow = math.pow, pow = math.pow,
push = "push", push = "push",
rg = /^(?=[\da-f]$)/, rg = /^(?=[\da-f]$)/,
ISURL = /^url\(['"]?([^\)]+)['"]?\)$/i, ISURL = /^url\(['"]?([^\)]+?)['"]?\)$/i,
colourRegExp = /^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|rgb\(\s*([\d\.]+\s*,\s*[\d\.]+\s*,\s*[\d\.]+)\s*\)|rgb\(\s*([\d\.]+%\s*,\s*[\d\.]+%\s*,\s*[\d\.]+%)\s*\)|hs[bl]\(\s*([\d\.]+\s*,\s*[\d\.]+\s*,\s*[\d\.]+)\s*\)|hs[bl]\(\s*([\d\.]+%\s*,\s*[\d\.]+%\s*,\s*[\d\.]+%)\s*\))\s*$/i, colourRegExp = /^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|rgb\(\s*([\d\.]+\s*,\s*[\d\.]+\s*,\s*[\d\.]+)\s*\)|rgb\(\s*([\d\.]+%\s*,\s*[\d\.]+%\s*,\s*[\d\.]+%)\s*\)|hs[bl]\(\s*([\d\.]+\s*,\s*[\d\.]+\s*,\s*[\d\.]+)\s*\)|hs[bl]\(\s*([\d\.]+%\s*,\s*[\d\.]+%\s*,\s*[\d\.]+%)\s*\))\s*$/i,
round = math.round, round = math.round,
setAttribute = "setAttribute", setAttribute = "setAttribute",
toFloat = parseFloat, toFloat = parseFloat,
toInt = parseInt, toInt = parseInt,
upperCase = String[proto].toUpperCase, upperCase = String[proto].toUpperCase,
availableAttrs = {"clip-rect": "0 0 1e9 1e9", cursor: "default", cx: 0, cy: 0, fill: "#fff", "fill-opacity": 1, font: '10px "Arial"', "font-family": '"Arial"', "font-size": "10", "font-style": "normal", "font-weight": 400, gradient: 0, height: 0, href: "http://raphaeljs.com/", opacity: 1, path: "M0,0", r: 0, rotation: 0, rx: 0, ry: 0, scale: "1 1", src: "", stroke: "#000", "stroke-dasharray": "", "stroke-linecap": "butt", "stroke-linejoin": "butt", "stroke-miterlimit": 0, "stroke-opacity": 1, "stroke-width": 1, target: "_blank", "text-anchor": "middle", title: "Raphael", translation: "0 0", width: 0, x: 0, y: 0}, availableAttrs = {blur: 0, "clip-rect": "0 0 1e9 1e9", cursor: "default", cx: 0, cy: 0, fill: "#fff", "fill-opacity": 1, font: '10px "Arial"', "font-family": '"Arial"', "font-size": "10", "font-style": "normal", "font-weight": 400, gradient: 0, height: 0, href: "http://raphaeljs.com/", opacity: 1, path: "M0,0", r: 0, rotation: 0, rx: 0, ry: 0, scale: "1 1", src: "", stroke: "#000", "stroke-dasharray": "", "stroke-linecap": "butt", "stroke-linejoin": "butt", "stroke-miterlimit": 0, "stroke-opacity": 1, "stroke-width": 1, target: "_blank", "text-anchor": "middle", title: "Raphael", translation: "0 0", width: 0, x: 0, y: 0},
availableAnimAttrs = {along: "along", "clip-rect": "csv", cx: nu, cy: nu, fill: "colour", "fill-opacity": nu, "font-size": nu, height: nu, opacity: nu, path: "path", r: nu, rotation: "csv", rx: nu, ry: nu, scale: "csv", stroke: "colour", "stroke-opacity": nu, "stroke-width": nu, translation: "csv", width: nu, x: nu, y: nu}, availableAnimAttrs = {along: "along", blur: nu, "clip-rect": "csv", cx: nu, cy: nu, fill: "colour", "fill-opacity": nu, "font-size": nu, height: nu, opacity: nu, path: "path", r: nu, rotation: "csv", rx: nu, ry: nu, scale: "csv", stroke: "colour", "stroke-opacity": nu, "stroke-width": nu, translation: "csv", width: nu, x: nu, y: nu},
rp = "replace"; rp = "replace";
R.version = "1.3.1"; R.version = "1.3.2";
R.type = (win.SVGAngle || doc.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure", "1.1") ? "SVG" : "VML"); R.type = (win.SVGAngle || doc.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure", "1.1") ? "SVG" : "VML");
if (R.type == "VML") { if (R.type == "VML") {
var d = document.createElement("div"); var d = doc.createElement("div");
d.innerHTML = '<!--[if vml]><br><br><![endif]-->'; d.innerHTML = '<!--[if vml]><br><br><![endif]-->';
if (d.childNodes[length] != 2) { if (d.childNodes[length] != 2) {
return null; return R.type = null;
} }
d = null;
} }
R.svg = !(R.vml = R.type == "VML"); R.svg = !(R.vml = R.type == "VML");
Paper[proto] = R[proto]; Paper[proto] = R[proto];
...@@ -92,12 +92,12 @@ Raphael = (function () { ...@@ -92,12 +92,12 @@ Raphael = (function () {
var bod; var bod;
color = (color + E)[rp](trim, E); color = (color + E)[rp](trim, E);
try { try {
var docum = new ActiveXObject("htmlfile"); var docum = new win.ActiveXObject("htmlfile");
docum.write("<body>"); docum.write("<body>");
docum.close(); docum.close();
bod = docum.body; bod = docum.body;
} catch(e) { } catch(e) {
bod = createPopup().document.body; bod = win.createPopup().document.body;
} }
var range = bod.createTextRange(); var range = bod.createTextRange();
try { try {
...@@ -121,6 +121,12 @@ Raphael = (function () { ...@@ -121,6 +121,12 @@ Raphael = (function () {
} }
return toHex(color); return toHex(color);
}; };
var hsbtoString = function () {
return "hsb(" + [this.h, this.s, this.b] + ")";
},
rgbtoString = function () {
return this.hex;
};
R.hsb2rgb = cacher(function (hue, saturation, brightness) { R.hsb2rgb = cacher(function (hue, saturation, brightness) {
if (R.is(hue, "object") && "h" in hue && "s" in hue && "b" in hue) { if (R.is(hue, "object") && "h" in hue && "s" in hue && "b" in hue) {
brightness = hue.b; brightness = hue.b;
...@@ -149,7 +155,7 @@ Raphael = (function () { ...@@ -149,7 +155,7 @@ Raphael = (function () {
red *= 255; red *= 255;
green *= 255; green *= 255;
blue *= 255; blue *= 255;
var rgb = {r: red, g: green, b: blue}, var rgb = {r: red, g: green, b: blue, toString: rgbtoString},
r = (~~red)[toString](16), r = (~~red)[toString](16),
g = (~~green)[toString](16), g = (~~green)[toString](16),
b = (~~blue)[toString](16); b = (~~blue)[toString](16);
...@@ -197,7 +203,7 @@ Raphael = (function () { ...@@ -197,7 +203,7 @@ Raphael = (function () {
hue < 0 && hue++; hue < 0 && hue++;
hue > 1 && hue--; hue > 1 && hue--;
} }
return {h: hue, s: saturation, b: brightness}; return {h: hue, s: saturation, b: brightness, toString: hsbtoString};
}, R); }, R);
var p2s = /,?([achlmqrstvxz]),?/gi; var p2s = /,?([achlmqrstvxz]),?/gi;
R._path2string = function () { R._path2string = function () {
...@@ -298,6 +304,8 @@ Raphael = (function () { ...@@ -298,6 +304,8 @@ Raphael = (function () {
delete this.start; delete this.start;
}; };
// path utilities // path utilities
var pathCommand = /([achlmqstvz])[\s,]*((-?\d*\.?\d*(?:e[-+]?\d+)?\s*,?\s*)+)/ig,
pathValues = /(-?\d*\.?\d*(?:e[-+]?\d+)?)\s*,?\s*/ig;
R.parsePathString = cacher(function (pathString) { R.parsePathString = cacher(function (pathString) {
if (!pathString) { if (!pathString) {
return null; return null;
...@@ -308,17 +316,22 @@ Raphael = (function () { ...@@ -308,17 +316,22 @@ Raphael = (function () {
data = pathClone(pathString); data = pathClone(pathString);
} }
if (!data[length]) { if (!data[length]) {
(pathString + E)[rp](/([achlmqstvz])[\s,]*((-?\d*\.?\d*(?:e[-+]?\d+)?\s*,?\s*)+)/ig, function (a, b, c) { (pathString + E)[rp](pathCommand, function (a, b, c) {
var params = [], var params = [],
name = lowerCase.call(b); name = lowerCase.call(b);
c[rp](/(-?\d*\.?\d*(?:e[-+]?\d+)?)\s*,?\s*/ig, function (a, b) { c[rp](pathValues, function (a, b) {
b && params[push](+b); b && params[push](+b);
}); });
if (name == "m" && params[length] > 2) {
data[push]([b][concat](params.splice(0, 2)));
name = "l";
b = b == "m" ? "l" : "L";
}
while (params[length] >= paramCounts[name]) { while (params[length] >= paramCounts[name]) {
data[push]([b][concat](params.splice(0, paramCounts[name]))); data[push]([b][concat](params.splice(0, paramCounts[name])));
if (!paramCounts[name]) { if (!paramCounts[name]) {
break; break;
}; }
} }
}); });
} }
...@@ -573,12 +586,13 @@ Raphael = (function () { ...@@ -573,12 +586,13 @@ Raphael = (function () {
sin = math.sin(PI / 180 * angle), sin = math.sin(PI / 180 * angle),
x = (x1 - x2) / 2, x = (x1 - x2) / 2,
y = (y1 - y2) / 2; y = (y1 - y2) / 2;
rx = mmax(rx, math.abs(x)); // rx = mmax(rx, math.abs(x));
ry = mmax(ry, math.abs(y)); // ry = mmax(ry, math.abs(y));
var h = (x * x) / (rx * rx) + (y * y) / (ry * ry); var h = (x * x) / (rx * rx) + (y * y) / (ry * ry);
if (h > 1){ if (h > 1) {
rx = math.sqrt(h) * rx; h = math.sqrt(h);
ry = math.sqrt(h) * ry; rx = h * rx;
ry = h * ry;
} }
var rx2 = rx * rx, var rx2 = rx * rx,
ry2 = ry * ry, ry2 = ry * ry,
...@@ -588,7 +602,7 @@ Raphael = (function () { ...@@ -588,7 +602,7 @@ Raphael = (function () {
cy = k * -ry * x / rx + (y1 + y2) / 2, cy = k * -ry * x / rx + (y1 + y2) / 2,
f1 = math.asin(((y1 - cy) / ry).toFixed(7)), f1 = math.asin(((y1 - cy) / ry).toFixed(7)),
f2 = math.asin(((y2 - cy) / ry).toFixed(7)); f2 = math.asin(((y2 - cy) / ry).toFixed(7));
f1 = x1 < cx ? PI - f1 : f1; f1 = x1 < cx ? PI - f1 : f1;
f2 = x2 < cx ? PI - f2 : f2; f2 = x2 < cx ? PI - f2 : f2;
f1 < 0 && (f1 = PI * 2 + f1); f1 < 0 && (f1 = PI * 2 + f1);
...@@ -637,6 +651,7 @@ Raphael = (function () { ...@@ -637,6 +651,7 @@ Raphael = (function () {
for (var i = 0, ii = res[length]; i < ii; i++) { for (var i = 0, ii = res[length]; i < ii; i++) {
newres[i] = i % 2 ? rotate(res[i - 1], res[i], rad).y : rotate(res[i], res[i + 1], rad).x; newres[i] = i % 2 ? rotate(res[i - 1], res[i], rad).y : rotate(res[i], res[i + 1], rad).x;
} }
// alert(newres);
return newres; return newres;
} }
}, },
...@@ -795,7 +810,7 @@ Raphael = (function () { ...@@ -795,7 +810,7 @@ Raphael = (function () {
par[2] && (dot.offset = par[2] + "%"); par[2] && (dot.offset = par[2] + "%");
dots[push](dot); dots[push](dot);
} }
for (var i = 1, ii = dots[length] - 1; i < ii; i++) { for (i = 1, ii = dots[length] - 1; i < ii; i++) {
if (!dots[i].offset) { if (!dots[i].offset) {
var start = toFloat(dots[i - 1].offset || 0), var start = toFloat(dots[i - 1].offset || 0),
end = 0; end = 0;
...@@ -819,49 +834,43 @@ Raphael = (function () { ...@@ -819,49 +834,43 @@ Raphael = (function () {
} }
return dots; return dots;
}), }),
getContainer = function () { getContainer = function (x, y, w, h) {
var container, var container;
x, if (R.is(x, "string") || R.is(x, "object")) {
y, container = R.is(x, "string") ? doc.getElementById(x) : x;
width,
height;
if (R.is(arguments[0], "string") || R.is(arguments[0], "object")) {
if (R.is(arguments[0], "string")) {
container = doc.getElementById(arguments[0]);
} else {
container = arguments[0];
}
if (container.tagName) { if (container.tagName) {
if (arguments[1] == null) { if (y == null) {
return { return {
container: container, container: container,
width: container.style.pixelWidth || container.offsetWidth, width: container.style.pixelWidth || container.offsetWidth,
height: container.style.pixelHeight || container.offsetHeight height: container.style.pixelHeight || container.offsetHeight
}; };
} else { } else {
return {container: container, width: arguments[1], height: arguments[2]}; return {container: container, width: y, height: w};
} }
} }
} else if (R.is(arguments[0], nu) && arguments[length] > 3) { } else if (R.is(x, nu) && h != null) {
return {container: 1, x: arguments[0], y: arguments[1], width: arguments[2], height: arguments[3]}; return {container: 1, x: x, y: y, width: w, height: h};
} }
}, },
plugins = function (con, add) { plugins = function (con, add) {
var that = this; var that = this;
for (var prop in add) if (add[has](prop) && !(prop in con)) { for (var prop in add) {
switch (typeof add[prop]) { if (add[has](prop) && !(prop in con)) {
case "function": switch (typeof add[prop]) {
(function (f) { case "function":
con[prop] = con === that ? f : function () { return f[apply](that, arguments); }; (function (f) {
})(add[prop]); con[prop] = con === that ? f : function () { return f[apply](that, arguments); };
break; })(add[prop]);
case "object": break;
con[prop] = con[prop] || {}; case "object":
plugins.call(this, con[prop], add[prop]); con[prop] = con[prop] || {};
break; plugins.call(this, con[prop], add[prop]);
default: break;
con[prop] = add[prop]; default:
break; con[prop] = add[prop];
break;
}
} }
} }
}, },
...@@ -918,31 +927,33 @@ Raphael = (function () { ...@@ -918,31 +927,33 @@ Raphael = (function () {
if (R.svg) { if (R.svg) {
Paper[proto].svgns = "http://www.w3.org/2000/svg"; Paper[proto].svgns = "http://www.w3.org/2000/svg";
Paper[proto].xlink = "http://www.w3.org/1999/xlink"; Paper[proto].xlink = "http://www.w3.org/1999/xlink";
var round = function (num) { round = function (num) {
return +num + (~~num === num) * .5; return +num + (~~num === num) * .5;
}, };
roundPath = function (path) { var roundPath = function (path) {
for (var i = 0, ii = path[length]; i < ii; i++) { for (var i = 0, ii = path[length]; i < ii; i++) {
if (lowerCase.call(path[i][0]) != "a") { if (lowerCase.call(path[i][0]) != "a") {
for (var j = 1, jj = path[i][length]; j < jj; j++) { for (var j = 1, jj = path[i][length]; j < jj; j++) {
path[i][j] = round(path[i][j]); path[i][j] = round(path[i][j]);
}
} else {
path[i][6] = round(path[i][6]);
path[i][7] = round(path[i][7]);
} }
} else {
path[i][6] = round(path[i][6]);
path[i][7] = round(path[i][7]);
} }
return path; }
}, return path;
$ = function (el, attr) { },
if (attr) { $ = function (el, attr) {
for (var key in attr) if (attr[has](key)) { if (attr) {
for (var key in attr) {
if (attr[has](key)) {
el[setAttribute](key, attr[key]); el[setAttribute](key, attr[key]);
} }
} else {
return doc.createElementNS(Paper[proto].svgns, el);
} }
}; } else {
return doc.createElementNS(Paper[proto].svgns, el);
}
};
R[toString] = function () { R[toString] = function () {
return "Your browser supports SVG.\nYou are running Rapha\xebl " + this.version; return "Your browser supports SVG.\nYou are running Rapha\xebl " + this.version;
}; };
...@@ -995,6 +1006,10 @@ Raphael = (function () { ...@@ -995,6 +1006,10 @@ Raphael = (function () {
if (!dots) { if (!dots) {
return null; return null;
} }
var id = o.getAttribute("fill");
id = id.match(/^url\(#(.*)\)$/);
id && SVG.defs.removeChild(doc.getElementById(id[1]));
var el = $(type + "Gradient"); var el = $(type + "Gradient");
el.id = "r" + (R._id++)[toString](36); el.id = "r" + (R._id++)[toString](36);
$(el, type == "radial" ? {fx: fx, fy: fy} : {x1: vector[0], y1: vector[1], x2: vector[2], y2: vector[3]}); $(el, type == "radial" ? {fx: fx, fy: fy} : {x1: vector[0], y1: vector[1], x2: vector[2], y2: vector[3]});
...@@ -1006,7 +1021,7 @@ Raphael = (function () { ...@@ -1006,7 +1021,7 @@ Raphael = (function () {
"stop-color": dots[i].color || "#fff" "stop-color": dots[i].color || "#fff"
}); });
el[appendChild](stop); el[appendChild](stop);
}; }
$(o, { $(o, {
fill: "url(#" + el.id + ")", fill: "url(#" + el.id + ")",
opacity: 1, opacity: 1,
...@@ -1061,209 +1076,213 @@ Raphael = (function () { ...@@ -1061,209 +1076,213 @@ Raphael = (function () {
rotxy[2] = +rotxy[2]; rotxy[2] = +rotxy[2];
} }
toFloat(rot) && o.rotate(0, true); toFloat(rot) && o.rotate(0, true);
for (var att in params) if (params[has](att)) { for (var att in params) {
if (!availableAttrs[has](att)) { if (params[has](att)) {
continue; if (!availableAttrs[has](att)) {
} continue;
var value = params[att]; }
attrs[att] = value; var value = params[att];
switch (att) { attrs[att] = value;
case "rotation": switch (att) {
o.rotate(value, true); case "blur":
break; o.blur(value);
// Hyperlink
case "href":
case "title":
case "target":
var pn = node.parentNode;
if (lowerCase.call(pn.tagName) != "a") {
var hl = $("a");
pn.insertBefore(hl, node);
hl[appendChild](node);
pn = hl;
}
pn.setAttributeNS(o.paper.xlink, att, value);
break;
case "cursor":
node.style.cursor = value;
break;
case "clip-rect":
var rect = (value + E)[split](separator);
if (rect[length] == 4) {
o.clip && o.clip.parentNode.parentNode.removeChild(o.clip.parentNode);
var el = $("clipPath"),
rc = $("rect");
el.id = "r" + (R._id++)[toString](36);
$(rc, {
x: rect[0],
y: rect[1],
width: rect[2],
height: rect[3]
});
el[appendChild](rc);
o.paper.defs[appendChild](el);
$(node, {"clip-path": "url(#" + el.id + ")"});
o.clip = rc;
}
if (!value) {
var clip = doc.getElementById(node.getAttribute("clip-path")[rp](/(^url\(#|\)$)/g, E));
clip && clip.parentNode.removeChild(clip);
$(node, {"clip-path": E});
delete o.clip;
}
break;
case "path":
if (value && o.type == "path") {
attrs.path = roundPath(pathToAbsolute(value));
$(node, {d: attrs.path});
}
break;
case "width":
node[setAttribute](att, value);
if (attrs.fx) {
att = "x";
value = attrs.x;
} else {
break; break;
} case "rotation":
case "x": o.rotate(value, true);
if (attrs.fx) {
value = -attrs.x - (attrs.width || 0);
}
case "rx":
if (att == "rx" && o.type == "rect") {
break; break;
} // Hyperlink
case "cx": case "href":
rotxy && (att == "x" || att == "cx") && (rotxy[1] += value - attrs[att]); case "title":
node[setAttribute](att, round(value)); case "target":
o.pattern && updatePosition(o); var pn = node.parentNode;
break; if (lowerCase.call(pn.tagName) != "a") {
case "height": var hl = $("a");
node[setAttribute](att, value); pn.insertBefore(hl, node);
if (attrs.fy) { hl[appendChild](node);
att = "y"; pn = hl;
value = attrs.y; }
} else { pn.setAttributeNS(o.paper.xlink, att, value);
break; break;
} case "cursor":
case "y": node.style.cursor = value;
if (attrs.fy) {
value = -attrs.y - (attrs.height || 0);
}
case "ry":
if (att == "ry" && o.type == "rect") {
break; break;
} case "clip-rect":
case "cy": var rect = (value + E)[split](separator);
rotxy && (att == "y" || att == "cy") && (rotxy[2] += value - attrs[att]); if (rect[length] == 4) {
node[setAttribute](att, round(value)); o.clip && o.clip.parentNode.parentNode.removeChild(o.clip.parentNode);
o.pattern && updatePosition(o); var el = $("clipPath"),
rc = $("rect");
el.id = "r" + (R._id++)[toString](36);
$(rc, {
x: rect[0],
y: rect[1],
width: rect[2],
height: rect[3]
});
el[appendChild](rc);
o.paper.defs[appendChild](el);
$(node, {"clip-path": "url(#" + el.id + ")"});
o.clip = rc;
}
if (!value) {
var clip = doc.getElementById(node.getAttribute("clip-path")[rp](/(^url\(#|\)$)/g, E));
clip && clip.parentNode.removeChild(clip);
$(node, {"clip-path": E});
delete o.clip;
}
break; break;
case "r": case "path":
if (o.type == "rect") { if (o.type == "path") {
$(node, {rx: value, ry: value}); $(node, {d: value ? attrs.path = roundPath(pathToAbsolute(value)) : "M0,0"});
} else { }
break;
case "width":
node[setAttribute](att, value); node[setAttribute](att, value);
} if (attrs.fx) {
break; att = "x";
case "src": value = attrs.x;
if (o.type == "image") { } else {
node.setAttributeNS(o.paper.xlink, "href", value); break;
} }
break; case "x":
case "stroke-width": if (attrs.fx) {
node.style.strokeWidth = value; value = -attrs.x - (attrs.width || 0);
// Need following line for Firefox }
node[setAttribute](att, value); case "rx":
if (attrs["stroke-dasharray"]) { if (att == "rx" && o.type == "rect") {
addDashes(o, attrs["stroke-dasharray"]); break;
} }
break; case "cx":
case "stroke-dasharray": rotxy && (att == "x" || att == "cx") && (rotxy[1] += value - attrs[att]);
addDashes(o, value); node[setAttribute](att, round(value));
break;
case "translation":
var xy = (value + E)[split](separator);
xy[0] = +xy[0] || 0;
xy[1] = +xy[1] || 0;
if (rotxy) {
rotxy[1] += xy[0];
rotxy[2] += xy[1];
}
translate.call(o, xy[0], xy[1]);
break;
case "scale":
var xy = (value + E)[split](separator);
o.scale(+xy[0] || 1, +xy[1] || +xy[0] || 1, +xy[2] || null, +xy[3] || null);
break;
case "fill":
var isURL = (value + E).match(ISURL);
if (isURL) {
var el = $("pattern"),
ig = $("image");
el.id = "r" + (R._id++)[toString](36);
$(el, {x: 0, y: 0, patternUnits: "userSpaceOnUse", height: 1, width: 1});
$(ig, {x: 0, y: 0});
ig.setAttributeNS(o.paper.xlink, "href", isURL[1]);
el[appendChild](ig);
var img = doc.createElement("img");
img.style.cssText = "position:absolute;left:-9999em;top-9999em";
img.onload = function () {
$(el, {width: this.offsetWidth, height: this.offsetHeight});
$(ig, {width: this.offsetWidth, height: this.offsetHeight});
doc.body.removeChild(this);
o.paper.safari();
};
doc.body[appendChild](img);
img.src = isURL[1];
o.paper.defs[appendChild](el);
node.style.fill = "url(#" + el.id + ")";
$(node, {fill: "url(#" + el.id + ")"});
o.pattern = el;
o.pattern && updatePosition(o); o.pattern && updatePosition(o);
break; break;
} case "height":
if (!R.getRGB(value).error) { node[setAttribute](att, value);
delete params.gradient; if (attrs.fy) {
delete attrs.gradient; att = "y";
!R.is(attrs.opacity, "undefined") && value = attrs.y;
R.is(params.opacity, "undefined") && } else {
$(node, {opacity: attrs.opacity}); break;
!R.is(attrs["fill-opacity"], "undefined") && }
R.is(params["fill-opacity"], "undefined") && case "y":
$(node, {"fill-opacity": attrs["fill-opacity"]}); if (attrs.fy) {
} else if ((({circle: 1, ellipse: 1})[has](o.type) || (value + E).charAt() != "r") && addGradientFill(node, value, o.paper)) { value = -attrs.y - (attrs.height || 0);
attrs.gradient = value; }
attrs.fill = "none"; case "ry":
if (att == "ry" && o.type == "rect") {
break;
}
case "cy":
rotxy && (att == "y" || att == "cy") && (rotxy[2] += value - attrs[att]);
node[setAttribute](att, round(value));
o.pattern && updatePosition(o);
break; break;
} case "r":
case "stroke": if (o.type == "rect") {
node[setAttribute](att, R.getRGB(value).hex); $(node, {rx: value, ry: value});
break; } else {
case "gradient": node[setAttribute](att, value);
(({circle: 1, ellipse: 1})[has](o.type) || (value + E).charAt() != "r") && addGradientFill(node, value, o.paper);
break;
case "opacity":
case "fill-opacity":
if (attrs.gradient) {
var gradient = doc.getElementById(node.getAttribute("fill")[rp](/^url\(#|\)$/g, E));
if (gradient) {
var stops = gradient.getElementsByTagName("stop");
stops[stops[length] - 1][setAttribute]("stop-opacity", value);
} }
break; break;
} case "src":
default: if (o.type == "image") {
att == "font-size" && (value = toInt(value, 10) + "px"); node.setAttributeNS(o.paper.xlink, "href", value);
var cssrule = att[rp](/(\-.)/g, function (w) { }
return upperCase.call(w.substring(1)); break;
}); case "stroke-width":
node.style[cssrule] = value; node.style.strokeWidth = value;
// Need following line for Firefox // Need following line for Firefox
node[setAttribute](att, value); node[setAttribute](att, value);
break; if (attrs["stroke-dasharray"]) {
addDashes(o, attrs["stroke-dasharray"]);
}
break;
case "stroke-dasharray":
addDashes(o, value);
break;
case "translation":
var xy = (value + E)[split](separator);
xy[0] = +xy[0] || 0;
xy[1] = +xy[1] || 0;
if (rotxy) {
rotxy[1] += xy[0];
rotxy[2] += xy[1];
}
translate.call(o, xy[0], xy[1]);
break;
case "scale":
xy = (value + E)[split](separator);
o.scale(+xy[0] || 1, +xy[1] || +xy[0] || 1, isNaN(toFloat(xy[2])) ? null : +xy[2], isNaN(toFloat(xy[3])) ? null : +xy[3]);
break;
case "fill":
var isURL = (value + E).match(ISURL);
if (isURL) {
el = $("pattern");
var ig = $("image");
el.id = "r" + (R._id++)[toString](36);
$(el, {x: 0, y: 0, patternUnits: "userSpaceOnUse", height: 1, width: 1});
$(ig, {x: 0, y: 0});
ig.setAttributeNS(o.paper.xlink, "href", isURL[1]);
el[appendChild](ig);
var img = doc.createElement("img");
img.style.cssText = "position:absolute;left:-9999em;top-9999em";
img.onload = function () {
$(el, {width: this.offsetWidth, height: this.offsetHeight});
$(ig, {width: this.offsetWidth, height: this.offsetHeight});
doc.body.removeChild(this);
o.paper.safari();
};
doc.body[appendChild](img);
img.src = isURL[1];
o.paper.defs[appendChild](el);
node.style.fill = "url(#" + el.id + ")";
$(node, {fill: "url(#" + el.id + ")"});
o.pattern = el;
o.pattern && updatePosition(o);
break;
}
if (!R.getRGB(value).error) {
delete params.gradient;
delete attrs.gradient;
!R.is(attrs.opacity, "undefined") &&
R.is(params.opacity, "undefined") &&
$(node, {opacity: attrs.opacity});
!R.is(attrs["fill-opacity"], "undefined") &&
R.is(params["fill-opacity"], "undefined") &&
$(node, {"fill-opacity": attrs["fill-opacity"]});
} else if ((({circle: 1, ellipse: 1})[has](o.type) || (value + E).charAt() != "r") && addGradientFill(node, value, o.paper)) {
attrs.gradient = value;
attrs.fill = "none";
break;
}
case "stroke":
node[setAttribute](att, R.getRGB(value).hex);
break;
case "gradient":
(({circle: 1, ellipse: 1})[has](o.type) || (value + E).charAt() != "r") && addGradientFill(node, value, o.paper);
break;
case "opacity":
case "fill-opacity":
if (attrs.gradient) {
var gradient = doc.getElementById(node.getAttribute("fill")[rp](/^url\(#|\)$/g, E));
if (gradient) {
var stops = gradient.getElementsByTagName("stop");
stops[stops[length] - 1][setAttribute]("stop-opacity", value);
}
break;
}
default:
att == "font-size" && (value = toInt(value, 10) + "px");
var cssrule = att[rp](/(\-.)/g, function (w) {
return upperCase.call(w.substring(1));
});
node.style[cssrule] = value;
// Need following line for Firefox
node[setAttribute](att, value);
break;
}
} }
} }
...@@ -1274,8 +1293,8 @@ Raphael = (function () { ...@@ -1274,8 +1293,8 @@ Raphael = (function () {
toFloat(rot) && o.rotate(rot, true); toFloat(rot) && o.rotate(rot, true);
} }
}; };
var leading = 1.2; var leading = 1.2,
var tuneText = function (el, params) { tuneText = function (el, params) {
if (el.type != "text" || !(params[has]("text") || params[has]("font") || params[has]("font-size") || params[has]("x") || params[has]("y"))) { if (el.type != "text" || !(params[has]("text") || params[has]("font") || params[has]("font-size") || params[has]("x") || params[has]("y"))) {
return; return;
} }
...@@ -1296,8 +1315,8 @@ Raphael = (function () { ...@@ -1296,8 +1315,8 @@ Raphael = (function () {
node[appendChild](tspan); node[appendChild](tspan);
} }
} else { } else {
var texts = node.getElementsByTagName("tspan"); texts = node.getElementsByTagName("tspan");
for (var i = 0, ii = texts[length]; i < ii; i++) { for (i = 0, ii = texts[length]; i < ii; i++) {
i && $(texts[i], {dy: fontSize * leading, x: a.x}); i && $(texts[i], {dy: fontSize * leading, x: a.x});
} }
} }
...@@ -1305,8 +1324,8 @@ Raphael = (function () { ...@@ -1305,8 +1324,8 @@ Raphael = (function () {
var bb = el.getBBox(), var bb = el.getBBox(),
dif = a.y - (bb.y + bb.height / 2); dif = a.y - (bb.y + bb.height / 2);
dif && isFinite(dif) && $(node, {y: a.y + dif}); dif && isFinite(dif) && $(node, {y: a.y + dif});
}; },
var Element = function (node, svg) { Element = function (node, svg) {
var X = 0, var X = 0,
Y = 0; Y = 0;
this[0] = node; this[0] = node;
...@@ -1416,11 +1435,11 @@ Raphael = (function () { ...@@ -1416,11 +1435,11 @@ Raphael = (function () {
hide && this.hide(); hide && this.hide();
return bbox; return bbox;
}; };
Element[proto].attr = function () { Element[proto].attr = function (name, value) {
if (this.removed) { if (this.removed) {
return this; return this;
} }
if (arguments[length] == 0) { if (name == null) {
var res = {}; var res = {};
for (var i in this.attrs) if (this.attrs[has](i)) { for (var i in this.attrs) if (this.attrs[has](i)) {
res[i] = this.attrs[i]; res[i] = this.attrs[i];
...@@ -1430,34 +1449,34 @@ Raphael = (function () { ...@@ -1430,34 +1449,34 @@ Raphael = (function () {
res.gradient && res.fill == "none" && (res.fill = res.gradient) && delete res.gradient; res.gradient && res.fill == "none" && (res.fill = res.gradient) && delete res.gradient;
return res; return res;
} }
if (arguments[length] == 1 && R.is(arguments[0], "string")) { if (value == null && R.is(name, "string")) {
if (arguments[0] == "translation") { if (name == "translation") {
return translate.call(this); return translate.call(this);
} }
if (arguments[0] == "rotation") { if (name == "rotation") {
return this.rotate(); return this.rotate();
} }
if (arguments[0] == "scale") { if (name == "scale") {
return this.scale(); return this.scale();
} }
if (arguments[0] == "fill" && this.attrs.fill == "none" && this.attrs.gradient) { if (name == "fill" && this.attrs.fill == "none" && this.attrs.gradient) {
return this.attrs.gradient; return this.attrs.gradient;
} }
return this.attrs[arguments[0]]; return this.attrs[name];
} }
if (arguments[length] == 1 && R.is(arguments[0], "array")) { if (value == null && R.is(name, "array")) {
var values = {}; var values = {};
for (var j in arguments[0]) if (arguments[0][has](j)) { for (var j = 0, jj = name.length; j < jj; j++) {
values[arguments[0][j]] = this.attrs[arguments[0][j]]; values[name[j]] = this.attr(name[j]);
} }
return values; return values;
} }
if (arguments[length] == 2) { if (value != null) {
var params = {}; var params = {};
params[arguments[0]] = arguments[1]; params[name] = value;
setFillAndStroke(this, params); setFillAndStroke(this, params);
} else if (arguments[length] == 1 && R.is(arguments[0], "object")) { } else if (name != null && R.is(name, "object")) {
setFillAndStroke(this, arguments[0]); setFillAndStroke(this, name);
} }
return this; return this;
}; };
...@@ -1503,6 +1522,28 @@ Raphael = (function () { ...@@ -1503,6 +1522,28 @@ Raphael = (function () {
insertbefore(this, element, this.paper); insertbefore(this, element, this.paper);
return this; return this;
}; };
Element[proto].blur = function (size) {
// Experimental. No Safari support. Use it on your own risk.
var t = this;
if (+size !== 0) {
var fltr = $("filter"),
blur = $("feGaussianBlur");
t.attrs.blur = size;
fltr.id = "r" + (R._id++)[toString](36);
$(blur, {stdDeviation: +size || 1.5});
fltr.appendChild(blur);
t.paper.defs.appendChild(fltr);
t._blur = fltr;
$(t.node, {filter: "url(#" + fltr.id + ")"});
} else {
if (t._blur) {
t._blur.parentNode.removeChild(t._blur);
delete t._blur;
delete t.attrs.blur;
}
t.node.removeAttribute("filter");
}
};
var theCircle = function (svg, x, y, r) { var theCircle = function (svg, x, y, r) {
x = round(x); x = round(x);
y = round(y); y = round(y);
...@@ -1564,7 +1605,7 @@ Raphael = (function () { ...@@ -1564,7 +1605,7 @@ Raphael = (function () {
return this; return this;
}; };
var create = function () { var create = function () {
var con = getContainer[apply](null, arguments), var con = getContainer[apply](0, arguments),
container = con && con.container, container = con && con.container,
x = con.x, x = con.x,
y = con.y, y = con.y,
...@@ -1617,64 +1658,75 @@ Raphael = (function () { ...@@ -1617,64 +1658,75 @@ Raphael = (function () {
} }
}; };
} }
// VML // VML
if (R.vml) { if (R.vml) {
var path2vml = function (path) { var map = {M: "m", L: "l", C: "c", Z: "x", m: "t", l: "r", c: "v", z: "x"},
var total = /[ahqstv]/ig, bites = /([clmz]),?([^clmz]*)/gi,
command = pathToAbsolute; val = /-?[^,\s-]+/g,
(path + E).match(total) && (command = path2curve); coordsize = 1e3 + S + 1e3,
total = /[clmz]/g; zoom = 10,
if (command == pathToAbsolute && !(path + E).match(total)) { path2vml = function (path) {
var map = {M: "m", L: "l", C: "c", Z: "x", m: "t", l: "r", c: "v", z: "x"}, var total = /[ahqstv]/ig,
bites = /([clmz]),?([^clmz]*)/gi, command = pathToAbsolute;
val = /-?[^,\s-]+/g; (path + E).match(total) && (command = path2curve);
var res = (path + E)[rp](bites, function (all, command, args) { total = /[clmz]/g;
var vals = []; if (command == pathToAbsolute && !(path + E).match(total)) {
args[rp](val, function (value) { var res = (path + E)[rp](bites, function (all, command, args) {
vals[push](round(value)); var vals = [],
isMove = lowerCase.call(command) == "m",
res = map[command];
args[rp](val, function (value) {
if (isMove && vals[length] == 2) {
res += vals + map[command == "m" ? "l" : "L"];
vals = [];
}
vals[push](round(value * zoom));
});
return res + vals;
}); });
return map[command] + vals; return res;
}); }
return res; var pa = command(path), p, r;
} res = [];
var pa = command(path), p, res = [], r; for (var i = 0, ii = pa[length]; i < ii; i++) {
for (var i = 0, ii = pa[length]; i < ii; i++) { p = pa[i];
p = pa[i]; r = lowerCase.call(pa[i][0]);
r = lowerCase.call(pa[i][0]); r == "z" && (r = "x");
r == "z" && (r = "x"); for (var j = 1, jj = p[length]; j < jj; j++) {
for (var j = 1, jj = p[length]; j < jj; j++) { r += round(p[j] * zoom) + (j != jj - 1 ? "," : E);
r += round(p[j]) + (j != jj - 1 ? "," : E); }
res[push](r);
} }
res[push](r); return res[join](S);
} };
return res[join](S);
};
R[toString] = function () { R[toString] = function () {
return "Your browser doesn\u2019t support SVG. Falling down to VML.\nYou are running Rapha\xebl " + this.version; return "Your browser doesn\u2019t support SVG. Falling down to VML.\nYou are running Rapha\xebl " + this.version;
}; };
var thePath = function (pathString, VML) { thePath = function (pathString, vml) {
var g = createNode("group"); var g = createNode("group");
g.style.cssText = "position:absolute;left:0;top:0;width:" + VML.width + "px;height:" + VML.height + "px"; g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px";
g.coordsize = VML.coordsize; g.coordsize = vml.coordsize;
g.coordorigin = VML.coordorigin; g.coordorigin = vml.coordorigin;
var el = createNode("shape"), ol = el.style; var el = createNode("shape"), ol = el.style;
ol.width = VML.width + "px"; ol.width = vml.width + "px";
ol.height = VML.height + "px"; ol.height = vml.height + "px";
el.coordsize = this.coordsize; el.coordsize = coordsize;
el.coordorigin = this.coordorigin; el.coordorigin = vml.coordorigin;
g[appendChild](el); g[appendChild](el);
var p = new Element(el, g, VML); var p = new Element(el, g, vml),
attr = {fill: "none", stroke: "#000"};
pathString && (attr.path = pathString);
p.isAbsolute = true; p.isAbsolute = true;
p.type = "path"; p.type = "path";
p.path = []; p.path = [];
p.Path = E; p.Path = E;
pathString && setFillAndStroke(p, {fill: "none", stroke: "#000", path: pathString}); setFillAndStroke(p, attr);
VML.canvas[appendChild](g); vml.canvas[appendChild](g);
return p; return p;
}; };
var setFillAndStroke = function (o, params) { setFillAndStroke = function (o, params) {
o.attrs = o.attrs || {}; o.attrs = o.attrs || {};
var node = o.node, var node = o.node,
a = o.attrs, a = o.attrs,
...@@ -1688,6 +1740,7 @@ Raphael = (function () { ...@@ -1688,6 +1740,7 @@ Raphael = (function () {
params.title && (node.title = params.title); params.title && (node.title = params.title);
params.target && (node.target = params.target); params.target && (node.target = params.target);
params.cursor && (s.cursor = params.cursor); params.cursor && (s.cursor = params.cursor);
"blur" in params && o.blur(params.blur);
if (params.path && o.type == "path") { if (params.path && o.type == "path") {
a.path = params.path; a.path = params.path;
node.path = path2vml(a.path); node.path = path2vml(a.path);
...@@ -1799,8 +1852,8 @@ Raphael = (function () { ...@@ -1799,8 +1852,8 @@ Raphael = (function () {
} }
(params.stroke == "none" || stroke.on == null || params.stroke == 0 || params["stroke-width"] == 0) && (stroke.on = false); (params.stroke == "none" || stroke.on == null || params.stroke == 0 || params["stroke-width"] == 0) && (stroke.on = false);
stroke.on && params.stroke && (stroke.color = R.getRGB(params.stroke).hex); stroke.on && params.stroke && (stroke.color = R.getRGB(params.stroke).hex);
var opacity = ((+a["stroke-opacity"] + 1 || 2) - 1) * ((+a.opacity + 1 || 2) - 1), opacity = ((+a["stroke-opacity"] + 1 || 2) - 1) * ((+a.opacity + 1 || 2) - 1);
width = (toFloat(params["stroke-width"]) || 1) * .75; var width = (toFloat(params["stroke-width"]) || 1) * .75;
opacity < 0 && (opacity = 0); opacity < 0 && (opacity = 0);
opacity > 1 && (opacity = 1); opacity > 1 && (opacity = 1);
params["stroke-width"] == null && (width = a["stroke-width"]); params["stroke-width"] == null && (width = a["stroke-width"]);
...@@ -1829,7 +1882,7 @@ Raphael = (function () { ...@@ -1829,7 +1882,7 @@ Raphael = (function () {
newstroke && node[appendChild](stroke); newstroke && node[appendChild](stroke);
} }
if (res.type == "text") { if (res.type == "text") {
var s = res.paper.span.style; s = res.paper.span.style;
a.font && (s.font = a.font); a.font && (s.font = a.font);
a["font-family"] && (s.fontFamily = a["font-family"]); a["font-family"] && (s.fontFamily = a["font-family"]);
a["font-size"] && (s.fontSize = a["font-size"]); a["font-size"] && (s.fontSize = a["font-size"]);
...@@ -1857,7 +1910,7 @@ Raphael = (function () { ...@@ -1857,7 +1910,7 @@ Raphael = (function () {
} }
} }
}; };
var addGradientFill = function (o, gradient) { addGradientFill = function (o, gradient) {
o.attrs = o.attrs || {}; o.attrs = o.attrs || {};
var attrs = o.attrs, var attrs = o.attrs,
fill = o.node.getElementsByTagName("fill"), fill = o.node.getElementsByTagName("fill"),
...@@ -1909,7 +1962,7 @@ Raphael = (function () { ...@@ -1909,7 +1962,7 @@ Raphael = (function () {
} }
return 1; return 1;
}; };
var Element = function (node, group, vml) { Element = function (node, group, vml) {
var Rotation = 0, var Rotation = 0,
RotX = 0, RotX = 0,
RotY = 0, RotY = 0,
...@@ -2036,43 +2089,40 @@ Raphael = (function () { ...@@ -2036,43 +2089,40 @@ Raphael = (function () {
cx = (cx == null) ? x + w / 2 : cx; cx = (cx == null) ? x + w / 2 : cx;
cy = (cy == null) ? y + h / 2 : cy; cy = (cy == null) ? y + h / 2 : cy;
var left = cx - this.paper.width / 2, var left = cx - this.paper.width / 2,
top = cy - this.paper.height / 2; top = cy - this.paper.height / 2, t;
if (this.type == "path" || this.type == "text") { gs.left != (t = left + "px") && (gs.left = t);
(gs.left != left + "px") && (gs.left = left + "px"); gs.top != (t = top + "px") && (gs.top = t);
(gs.top != top + "px") && (gs.top = top + "px"); this.X = this.type == "path" ? -left : x;
this.X = this.type == "text" ? x : -left; this.Y = this.type == "path" ? -top : y;
this.Y = this.type == "text" ? y : -top; this.W = w;
this.W = w; this.H = h;
this.H = h; if (this.type == "path") {
(os.left != -left + "px") && (os.left = -left + "px"); os.left != (t = -left * zoom + "px") && (os.left = t);
(os.top != -top + "px") && (os.top = -top + "px"); os.top != (t = -top * zoom + "px") && (os.top = t);
} else if (this.type == "text") {
os.left != (t = -left + "px") && (os.left = t);
os.top != (t = -top + "px") && (os.top = t);
} else { } else {
(gs.left != left + "px") && (gs.left = left + "px"); gs.width != (t = this.paper.width + "px") && (gs.width = t);
(gs.top != top + "px") && (gs.top = top + "px"); gs.height != (t = this.paper.height + "px") && (gs.height = t);
this.X = x; os.left != (t = x - left + "px") && (os.left = t);
this.Y = y; os.top != (t = y - top + "px") && (os.top = t);
this.W = w; os.width != (t = w + "px") && (os.width = t);
this.H = h; os.height != (t = h + "px") && (os.height = t);
(gs.width != this.paper.width + "px") && (gs.width = this.paper.width + "px");
(gs.height != this.paper.height + "px") && (gs.height = this.paper.height + "px");
(os.left != x - left + "px") && (os.left = x - left + "px");
(os.top != y - top + "px") && (os.top = y - top + "px");
(os.width != w + "px") && (os.width = w + "px");
(os.height != h + "px") && (os.height = h + "px");
var arcsize = (+params.r || 0) / mmin(w, h); var arcsize = (+params.r || 0) / mmin(w, h);
if (this.type == "rect" && this.arcsize.toFixed(4) != arcsize.toFixed(4) && (arcsize || this.arcsize)) { if (this.type == "rect" && this.arcsize.toFixed(4) != arcsize.toFixed(4) && (arcsize || this.arcsize)) {
// We should replace element with the new one // We should replace element with the new one
var o = createNode("roundrect"), var o = createNode("roundrect"),
a = {}, a = {},
i = 0,
ii = this.events && this.events[length]; ii = this.events && this.events[length];
i = 0;
o.arcsize = arcsize; o.arcsize = arcsize;
o.raphael = this; o.raphael = this;
this.Group[appendChild](o); this.Group[appendChild](o);
this.Group.removeChild(this.node); this.Group.removeChild(this.node);
this[0] = this.node = o; this[0] = this.node = o;
this.arcsize = arcsize; this.arcsize = arcsize;
for (var i in attr) { for (i in attr) {
a[i] = attr[i]; a[i] = attr[i];
} }
delete a.scale; delete a.scale;
...@@ -2118,11 +2168,11 @@ Raphael = (function () { ...@@ -2118,11 +2168,11 @@ Raphael = (function () {
} }
this.removed = true; this.removed = true;
}; };
Element[proto].attr = function () { Element[proto].attr = function (name, value) {
if (this.removed) { if (this.removed) {
return this; return this;
} }
if (arguments[length] == 0) { if (name == null) {
var res = {}; var res = {};
for (var i in this.attrs) if (this.attrs[has](i)) { for (var i in this.attrs) if (this.attrs[has](i)) {
res[i] = this.attrs[i]; res[i] = this.attrs[i];
...@@ -2132,34 +2182,34 @@ Raphael = (function () { ...@@ -2132,34 +2182,34 @@ Raphael = (function () {
res.gradient && res.fill == "none" && (res.fill = res.gradient) && delete res.gradient; res.gradient && res.fill == "none" && (res.fill = res.gradient) && delete res.gradient;
return res; return res;
} }
if (arguments[length] == 1 && R.is(arguments[0], "string")) { if (value == null && R.is(name, "string")) {
if (arguments[0] == "translation") { if (name == "translation") {
return translate.call(this); return translate.call(this);
} }
if (arguments[0] == "rotation") { if (name == "rotation") {
return this.rotate(); return this.rotate();
} }
if (arguments[0] == "scale") { if (name == "scale") {
return this.scale(); return this.scale();
} }
if (arguments[0] == "fill" && this.attrs.fill == "none" && this.attrs.gradient) { if (name == "fill" && this.attrs.fill == "none" && this.attrs.gradient) {
return this.attrs.gradient; return this.attrs.gradient;
} }
return this.attrs[arguments[0]]; return this.attrs[name];
} }
if (this.attrs && arguments[length] == 1 && R.is(arguments[0], "array")) { if (this.attrs && value == null && R.is(name, "array")) {
var values = {}; var ii, values = {};
for (var i = 0, ii = arguments[0][length]; i < ii; i++) { for (i = 0, ii = name[length]; i < ii; i++) {
values[arguments[0][i]] = this.attrs[arguments[0][i]]; values[name[i]] = this.attr(name[i]);
}; }
return values; return values;
} }
var params; var params;
if (arguments[length] == 2) { if (value != null) {
params = {}; params = {};
params[arguments[0]] = arguments[1]; params[name] = value;
} }
arguments[length] == 1 && R.is(arguments[0], "object") && (params = arguments[0]); value == null && R.is(name, "object") && (params = name);
if (params) { if (params) {
if (params.text && this.type == "text") { if (params.text && this.type == "text") {
this.node.string = params.text; this.node.string = params.text;
...@@ -2207,13 +2257,28 @@ Raphael = (function () { ...@@ -2207,13 +2257,28 @@ Raphael = (function () {
insertbefore(this, element, this.paper); insertbefore(this, element, this.paper);
return this; return this;
}; };
var blurregexp = / progid:\S+Blur\([^\)]+\)/g;
Element[proto].blur = function (size) {
var s = this.node.style,
f = s.filter;
f = f.replace(blurregexp, "");
if (+size !== 0) {
this.attrs.blur = size;
s.filter = f + " progid:DXImageTransform.Microsoft.Blur(pixelradius=" + (+size || 1.5) + ")";
s.margin = Raphael.format("-{0}px 0 0 -{0}px", Math.round(+size || 1.5));
} else {
s.filter = f;
s.margin = 0;
delete this.attrs.blur;
}
};
var theCircle = function (vml, x, y, r) { theCircle = function (vml, x, y, r) {
var g = createNode("group"), var g = createNode("group"),
o = createNode("oval"), o = createNode("oval"),
ol = o.style; ol = o.style;
g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px"; g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px";
g.coordsize = vml.coordsize; g.coordsize = coordsize;
g.coordorigin = vml.coordorigin; g.coordorigin = vml.coordorigin;
g[appendChild](o); g[appendChild](o);
var res = new Element(o, g, vml); var res = new Element(o, g, vml);
...@@ -2225,13 +2290,13 @@ Raphael = (function () { ...@@ -2225,13 +2290,13 @@ Raphael = (function () {
res.setBox({x: x - r, y: y - r, width: r * 2, height: r * 2}); res.setBox({x: x - r, y: y - r, width: r * 2, height: r * 2});
vml.canvas[appendChild](g); vml.canvas[appendChild](g);
return res; return res;
}, };
theRect = function (vml, x, y, w, h, r) { theRect = function (vml, x, y, w, h, r) {
var g = createNode("group"), var g = createNode("group"),
o = createNode("roundrect"), o = createNode("roundrect"),
arcsize = (+r || 0) / (mmin(w, h)); arcsize = (+r || 0) / (mmin(w, h));
g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px"; g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px";
g.coordsize = vml.coordsize; g.coordsize = coordsize;
g.coordorigin = vml.coordorigin; g.coordorigin = vml.coordorigin;
g[appendChild](o); g[appendChild](o);
o.arcsize = arcsize; o.arcsize = arcsize;
...@@ -2242,13 +2307,13 @@ Raphael = (function () { ...@@ -2242,13 +2307,13 @@ Raphael = (function () {
res.setBox({x: x, y: y, width: w, height: h, r: r}); res.setBox({x: x, y: y, width: w, height: h, r: r});
vml.canvas[appendChild](g); vml.canvas[appendChild](g);
return res; return res;
}, };
theEllipse = function (vml, x, y, rx, ry) { theEllipse = function (vml, x, y, rx, ry) {
var g = createNode("group"), var g = createNode("group"),
o = createNode("oval"), o = createNode("oval"),
ol = o.style; ol = o.style;
g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px"; g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px";
g.coordsize = vml.coordsize; g.coordsize = coordsize;
g.coordorigin = vml.coordorigin; g.coordorigin = vml.coordorigin;
g[appendChild](o); g[appendChild](o);
var res = new Element(o, g, vml); var res = new Element(o, g, vml);
...@@ -2261,13 +2326,13 @@ Raphael = (function () { ...@@ -2261,13 +2326,13 @@ Raphael = (function () {
res.setBox({x: x - rx, y: y - ry, width: rx * 2, height: ry * 2}); res.setBox({x: x - rx, y: y - ry, width: rx * 2, height: ry * 2});
vml.canvas[appendChild](g); vml.canvas[appendChild](g);
return res; return res;
}, };
theImage = function (vml, src, x, y, w, h) { theImage = function (vml, src, x, y, w, h) {
var g = createNode("group"), var g = createNode("group"),
o = createNode("image"), o = createNode("image"),
ol = o.style; ol = o.style;
g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px"; g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px";
g.coordsize = vml.coordsize; g.coordsize = coordsize;
g.coordorigin = vml.coordorigin; g.coordorigin = vml.coordorigin;
o.src = src; o.src = src;
g[appendChild](o); g[appendChild](o);
...@@ -2281,7 +2346,7 @@ Raphael = (function () { ...@@ -2281,7 +2346,7 @@ Raphael = (function () {
res.setBox({x: x, y: y, width: w, height: h}); res.setBox({x: x, y: y, width: w, height: h});
vml.canvas[appendChild](g); vml.canvas[appendChild](g);
return res; return res;
}, };
theText = function (vml, x, y, text) { theText = function (vml, x, y, text) {
var g = createNode("group"), var g = createNode("group"),
el = createNode("shape"), el = createNode("shape"),
...@@ -2290,9 +2355,9 @@ Raphael = (function () { ...@@ -2290,9 +2355,9 @@ Raphael = (function () {
ps = path.style, ps = path.style,
o = createNode("textpath"); o = createNode("textpath");
g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px"; g.style.cssText = "position:absolute;left:0;top:0;width:" + vml.width + "px;height:" + vml.height + "px";
g.coordsize = vml.coordsize; g.coordsize = coordsize;
g.coordorigin = vml.coordorigin; g.coordorigin = vml.coordorigin;
path.v = R.format("m{0},{1}l{2},{1}", round(x), round(y), round(x) + 1); path.v = R.format("m{0},{1}l{2},{1}", round(x * 10), round(y * 10), round(x * 10) + 1);
path.textpathok = true; path.textpathok = true;
ol.width = vml.width; ol.width = vml.width;
ol.height = vml.height; ol.height = vml.height;
...@@ -2314,7 +2379,7 @@ Raphael = (function () { ...@@ -2314,7 +2379,7 @@ Raphael = (function () {
res.setBox(); res.setBox();
vml.canvas[appendChild](g); vml.canvas[appendChild](g);
return res; return res;
}, };
setSize = function (width, height) { setSize = function (width, height) {
var cs = this.canvas.style; var cs = this.canvas.style;
width == +width && (width += "px"); width == +width && (width += "px");
...@@ -2323,8 +2388,8 @@ Raphael = (function () { ...@@ -2323,8 +2388,8 @@ Raphael = (function () {
cs.height = height; cs.height = height;
cs.clip = "rect(0 " + width + " " + height + " 0)"; cs.clip = "rect(0 " + width + " " + height + " 0)";
return this; return this;
}, };
createNode; var createNode;
doc.createStyleSheet().addRule(".rvml", "behavior:url(#default#VML)"); doc.createStyleSheet().addRule(".rvml", "behavior:url(#default#VML)");
try { try {
!doc.namespaces.rvml && doc.namespaces.add("rvml", "urn:schemas-microsoft-com:vml"); !doc.namespaces.rvml && doc.namespaces.add("rvml", "urn:schemas-microsoft-com:vml");
...@@ -2336,8 +2401,8 @@ Raphael = (function () { ...@@ -2336,8 +2401,8 @@ Raphael = (function () {
return doc.createElement('<' + tagName + ' xmlns="urn:schemas-microsoft.com:vml" class="rvml">'); return doc.createElement('<' + tagName + ' xmlns="urn:schemas-microsoft.com:vml" class="rvml">');
}; };
} }
var create = function () { create = function () {
var con = getContainer[apply](null, arguments), var con = getContainer[apply](0, arguments),
container = con.container, container = con.container,
height = con.height, height = con.height,
s, s,
...@@ -2356,7 +2421,7 @@ Raphael = (function () { ...@@ -2356,7 +2421,7 @@ Raphael = (function () {
height == +height && (height += "px"); height == +height && (height += "px");
res.width = 1e3; res.width = 1e3;
res.height = 1e3; res.height = 1e3;
res.coordsize = "1000 1000"; res.coordsize = zoom * 1e3 + S + zoom * 1e3;
res.coordorigin = "0 0"; res.coordorigin = "0 0";
res.span = doc.createElement("span"); res.span = doc.createElement("span");
res.span.style.cssText = "position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;display:inline;"; res.span.style.cssText = "position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;display:inline;";
...@@ -2390,15 +2455,16 @@ Raphael = (function () { ...@@ -2390,15 +2455,16 @@ Raphael = (function () {
for (var i in this) { for (var i in this) {
this[i] = removed(i); this[i] = removed(i);
} }
return true;
}; };
} }
// rest // rest
// Safari or Chrome (WebKit) rendering bug workaround method // Safari or Chrome (WebKit) rendering bug workaround method
if ((/^Apple|^Google/).test(navigator.vendor) && !(navigator.userAgent.indexOf("Version/4.0") + 1)) { if ((/^Apple|^Google/).test(win.navigator.vendor) && !(win.navigator.userAgent.indexOf("Version/4.0") + 1)) {
Paper[proto].safari = function () { Paper[proto].safari = function () {
var rect = this.rect(-99, -99, this.width + 99, this.height + 99); var rect = this.rect(-99, -99, this.width + 99, this.height + 99);
setTimeout(function () {rect.remove();}); win.setTimeout(function () {rect.remove();});
}; };
} else { } else {
Paper[proto].safari = function () {}; Paper[proto].safari = function () {};
...@@ -2487,7 +2553,7 @@ Raphael = (function () { ...@@ -2487,7 +2553,7 @@ Raphael = (function () {
Paper[proto].raphael = R; Paper[proto].raphael = R;
function x_y() { function x_y() {
return this.x + S + this.y; return this.x + S + this.y;
}; }
Element[proto].scale = function (x, y, cx, cy) { Element[proto].scale = function (x, y, cx, cy) {
if (x == null && y == null) { if (x == null && y == null) {
return { return {
...@@ -2544,7 +2610,6 @@ Raphael = (function () { ...@@ -2544,7 +2610,6 @@ Raphael = (function () {
skip = true; skip = true;
for (var i = 0, ii = path[length]; i < ii; i++) { for (var i = 0, ii = path[length]; i < ii; i++) {
var p = path[i], var p = path[i],
j,
P0 = upperCase.call(p[0]); P0 = upperCase.call(p[0]);
if (P0 == "M" && skip) { if (P0 == "M" && skip) {
continue; continue;
...@@ -2556,9 +2621,9 @@ Raphael = (function () { ...@@ -2556,9 +2621,9 @@ Raphael = (function () {
p[path[i][length] - 1] *= ky; p[path[i][length] - 1] *= ky;
p[1] *= dirx * kx; p[1] *= dirx * kx;
p[2] *= diry * ky; p[2] *= diry * ky;
p[5] = +(dirx + diry ? !!+p[5] : !+p[5]); p[5] = +!(dirx + diry ? !+p[5] : +p[5]);
} else if (P0 == "H") { } else if (P0 == "H") {
for (j = 1, jj = p[length]; j < jj; j++) { for (var j = 1, jj = p[length]; j < jj; j++) {
p[j] *= kx; p[j] *= kx;
} }
} else if (P0 == "V") { } else if (P0 == "V") {
...@@ -2571,9 +2636,9 @@ Raphael = (function () { ...@@ -2571,9 +2636,9 @@ Raphael = (function () {
} }
} }
} }
var dim2 = pathDimensions(path), var dim2 = pathDimensions(path);
dx = ncx - dim2.x - dim2.width / 2, dx = ncx - dim2.x - dim2.width / 2;
dy = ncy - dim2.y - dim2.height / 2; dy = ncy - dim2.y - dim2.height / 2;
path[0][1] += dx; path[0][1] += dx;
path[0][2] += dy; path[0][2] += dy;
this.attr({path: path}); this.attr({path: path});
...@@ -2617,7 +2682,19 @@ Raphael = (function () { ...@@ -2617,7 +2682,19 @@ Raphael = (function () {
delete attr.translation; delete attr.translation;
return this.paper[this.type]().attr(attr); return this.paper[this.type]().attr(attr);
}; };
var getLengthFactory = function (istotal, subpath) { var getPointAtSegmentLength = cacher(function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, length) {
var len = 0,
old;
for (var i = 0; i < 1.001; i+=.001) {
var dot = R.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, i);
i && (len += pow(pow(old.x - dot.x, 2) + pow(old.y - dot.y, 2), .5));
if (len >= length) {
return dot;
}
old = dot;
}
}),
getLengthFactory = function (istotal, subpath) {
return function (path, length, onlystart) { return function (path, length, onlystart) {
path = path2curve(path); path = path2curve(path);
var x, y, p, l, sp = "", subpaths = {}, point, var x, y, p, l, sp = "", subpaths = {}, point,
...@@ -2631,9 +2708,9 @@ Raphael = (function () { ...@@ -2631,9 +2708,9 @@ Raphael = (function () {
l = segmentLength(x, y, p[1], p[2], p[3], p[4], p[5], p[6]); l = segmentLength(x, y, p[1], p[2], p[3], p[4], p[5], p[6]);
if (len + l > length) { if (len + l > length) {
if (subpath && !subpaths.start) { if (subpath && !subpaths.start) {
point = R.findDotsAtSegment(x, y, p[1], p[2], p[3], p[4], p[5], p[6], (length - len) / l); point = getPointAtSegmentLength(x, y, p[1], p[2], p[3], p[4], p[5], p[6], length - len);
sp += ["C", point.start.x, point.start.y, point.m.x, point.m.y, point.x, point.y]; sp += ["C", point.start.x, point.start.y, point.m.x, point.m.y, point.x, point.y];
if (onlystart) return sp; if (onlystart) {return sp;}
subpaths.start = sp; subpaths.start = sp;
sp = ["M", point.x, point.y + "C", point.n.x, point.n.y, point.end.x, point.end.y, p[5], p[6]][join](); sp = ["M", point.x, point.y + "C", point.n.x, point.n.y, point.end.x, point.end.y, p[5], p[6]][join]();
len += l; len += l;
...@@ -2642,7 +2719,7 @@ Raphael = (function () { ...@@ -2642,7 +2719,7 @@ Raphael = (function () {
continue; continue;
} }
if (!istotal && !subpath) { if (!istotal && !subpath) {
point = R.findDotsAtSegment(x, y, p[1], p[2], p[3], p[4], p[5], p[6], (length - len) / l); point = getPointAtSegmentLength(x, y, p[1], p[2], p[3], p[4], p[5], p[6], length - len);
return {x: point.x, y: point.y, alpha: point.alpha}; return {x: point.x, y: point.y, alpha: point.alpha};
} }
} }
...@@ -2663,7 +2740,7 @@ Raphael = (function () { ...@@ -2663,7 +2740,7 @@ Raphael = (function () {
len = 0; len = 0;
for (var i = 0; i < 1.01; i+=.01) { for (var i = 0; i < 1.01; i+=.01) {
var dot = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, i); var dot = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, i);
i && (len += math.sqrt(pow(old.x - dot.x, 2) + pow(old.y - dot.y, 2))); i && (len += pow(pow(old.x - dot.x, 2) + pow(old.y - dot.y, 2), .5));
old = dot; old = dot;
} }
return len; return len;
...@@ -2672,15 +2749,15 @@ Raphael = (function () { ...@@ -2672,15 +2749,15 @@ Raphael = (function () {
getPointAtLength = getLengthFactory(), getPointAtLength = getLengthFactory(),
getSubpathsAtLength = getLengthFactory(0, 1); getSubpathsAtLength = getLengthFactory(0, 1);
Element[proto].getTotalLength = function () { Element[proto].getTotalLength = function () {
if (this.type != "path") return; if (this.type != "path") {return;}
return getTotalLength(this.attrs.path); return getTotalLength(this.attrs.path);
}; };
Element[proto].getPointAtLength = function (length) { Element[proto].getPointAtLength = function (length) {
if (this.type != "path") return; if (this.type != "path") {return;}
return getPointAtLength(this.attrs.path, length); return getPointAtLength(this.attrs.path, length);
}; };
Element[proto].getSubpath = function (from, to) { Element[proto].getSubpath = function (from, to) {
if (this.type != "path") return; if (this.type != "path") {return;}
if (math.abs(this.getTotalLength() - to) < 1e-6) { if (math.abs(this.getTotalLength() - to) < 1e-6) {
return getSubpathsAtLength(this.attrs.path, from).end; return getSubpathsAtLength(this.attrs.path, from).end;
} }
...@@ -2753,7 +2830,7 @@ Raphael = (function () { ...@@ -2753,7 +2830,7 @@ Raphael = (function () {
var Now = +new Date; var Now = +new Date;
for (var l in animationElements) if (l != "length" && animationElements[has](l)) { for (var l in animationElements) if (l != "length" && animationElements[has](l)) {
var e = animationElements[l]; var e = animationElements[l];
if (e.stop) { if (e.stop || e.el.removed) {
delete animationElements[l]; delete animationElements[l];
animationElements[length]--; animationElements[length]--;
continue; continue;
...@@ -2823,7 +2900,7 @@ Raphael = (function () { ...@@ -2823,7 +2900,7 @@ Raphael = (function () {
break; break;
case "clip-rect": case "clip-rect":
now = []; now = [];
var i = 4; i = 4;
while (i--) { while (i--) {
now[i] = +from[attr][i] + pos * ms * diff[attr][i]; now[i] = +from[attr][i] + pos * ms * diff[attr][i];
} }
...@@ -2837,7 +2914,7 @@ Raphael = (function () { ...@@ -2837,7 +2914,7 @@ Raphael = (function () {
that._run && that._run.call(that); that._run && that._run.call(that);
} else { } else {
if (to.along) { if (to.along) {
var point = getPointAtLength(to.along, to.len * !to.back); point = getPointAtLength(to.along, to.len * !to.back);
that.translate(diff.sx - (diff.x || 0) + point.x - diff.sx, diff.sy - (diff.y || 0) + point.y - diff.sy); that.translate(diff.sx - (diff.x || 0) + point.x - diff.sx, diff.sy - (diff.y || 0) + point.y - diff.sy);
to.rot && that.rotate(diff.r + point.alpha, point.x, point.y); to.rot && that.rotate(diff.r + point.alpha, point.x, point.y);
} }
...@@ -2852,7 +2929,7 @@ Raphael = (function () { ...@@ -2852,7 +2929,7 @@ Raphael = (function () {
e.prev = time; e.prev = time;
} }
R.svg && that && that.paper.safari(); R.svg && that && that.paper.safari();
animationElements[length] && setTimeout(animation); animationElements[length] && win.setTimeout(animation);
}, },
upto255 = function (color) { upto255 = function (color) {
return color > 255 ? 255 : (color < 0 ? 0 : color); return color > 255 ? 255 : (color < 0 ? 0 : color);
...@@ -2972,7 +3049,7 @@ Raphael = (function () { ...@@ -2972,7 +3049,7 @@ Raphael = (function () {
case "clip-rect": case "clip-rect":
from[attr] = (from[attr] + E)[split](separator); from[attr] = (from[attr] + E)[split](separator);
diff[attr] = []; diff[attr] = [];
var i = 4; i = 4;
while (i--) { while (i--) {
diff[attr][i] = (values[i] - from[attr][i]) / ms; diff[attr][i] = (values[i] - from[attr][i]) / ms;
} }
...@@ -3058,7 +3135,7 @@ Raphael = (function () { ...@@ -3058,7 +3135,7 @@ Raphael = (function () {
} }
} else { } else {
for (var i = 0, ii = this.items[length]; i < ii; i++) { for (var i = 0, ii = this.items[length]; i < ii; i++) {
this.items[i].attr[apply](this.items[i], arguments); this.items[i].attr(name, value);
} }
} }
return this; return this;
...@@ -3106,7 +3183,14 @@ Raphael = (function () { ...@@ -3106,7 +3183,14 @@ Raphael = (function () {
height: mmax[apply](0, h) - y height: mmax[apply](0, h) - y
}; };
}; };
Set[proto].clone = function (s) {
s = new Set;
for (var i = 0, ii = this.items[length]; i < ii; i++) {
s[push](this.items[i].clone());
}
return s;
};
R.registerFont = function (font) { R.registerFont = function (font) {
if (!font.face) { if (!font.face) {
return font; return font;
...@@ -3194,23 +3278,18 @@ Raphael = (function () { ...@@ -3194,23 +3278,18 @@ Raphael = (function () {
} }
return out; return out;
}; };
R.format = function (token) { var formatrg = /\{(\d+)\}/g;
var args = R.is(arguments[1], "array") ? [0][concat](arguments[1]) : arguments, R.format = function (token, array) {
rg = /\{(\d+)\}/g; var args = R.is(array, "array") ? [0][concat](array) : arguments;
token && R.is(token, "string") && args[length] - 1 && (token = token[rp](rg, function (str, i) { token && R.is(token, "string") && args[length] - 1 && (token = token[rp](formatrg, function (str, i) {
return args[++i] == null ? E : args[i]; return args[++i] == null ? E : args[i];
})); }));
return token || E; return token || E;
}; };
R.ninja = function () { R.ninja = function () {
var r = Raphael; oldRaphael.was ? (Raphael = oldRaphael.is) : delete Raphael;
if (oldRaphael.was) { return R;
Raphael = oldRaphael.is;
} else {
delete Raphael;
}
return r;
}; };
R.el = Element[proto]; R.el = Element[proto];
return R; return R;
......
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