projects / raphael / blob
? search:
summary | shortlog | log | commit | commitdiff | tree
history | raw | HEAD
Removed path method into external plugin as deprecated
[raphael] / raphael.js
1 /*
2  * Raphael 1.0 - JavaScript Vector Library
3  *
4  * Copyright (c) 2008 - 2009 Dmitry Baranovskiy (http://raphaeljs.com)
5  * Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license.
6  */
7
8
9 window.Raphael = (function () {
10     var separator = /[, ]+/,
11         doc = document,
12         win = window,
13         oldRaphael = {
14             was: "Raphael" in window,
15             is: window.Raphael
16         },
17         R = function () {
18             return create.apply(R, arguments);
19         },
20         paper = {},
21         availableAttrs = {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},
22         availableAnimAttrs = {cx: "number", cy: "number", fill: "colour", "fill-opacity": "number", "font-size": "number", height: "number", opacity: "number", path: "path", r: "number", rotation: "csv", rx: "number", ry: "number", scale: "csv", stroke: "colour", "stroke-opacity": "number", "stroke-width": "number", translation: "csv", width: "number", x: "number", y: "number"},
23         events = ["click", "dblclick", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup"];
24     R.version = "1.0";
25     R.type = (window.SVGAngle || document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure", "1.1") ? "SVG" : "VML");
26     R.svg = !(R.vml = R.type == "VML");
27     R.idGenerator = 0;
28     R.fn = {};
29     R.isArray = function (arr) {
30         return Object.prototype.toString.call(arr) == "[object Array]";
31     };
32     R.setWindow = function (newwin) {
33         win = newwin;
34         doc = win.document;
35     };
36     // colour utilities
37     R.hsb2rgb = function (hue, saturation, brightness) {
38         if (typeof hue == "object" && "h" in hue && "s" in hue && "b" in hue) {
39             brightness = hue.b;
40             saturation = hue.s;
41             hue = hue.h;
42         }
43         var red,
44             green,
45             blue;
46         if (brightness == 0) {
47             return {r: 0, g: 0, b: 0, hex: "#000"};
48         }
49         if (hue > 1 || saturation > 1 || brightness > 1) {
50             hue /= 255;
51             saturation /= 255;
52             brightness /= 255;
53         }
54         var i = Math.floor(hue * 6),
55             f = (hue * 6) - i,
56             p = brightness * (1 - saturation),
57             q = brightness * (1 - (saturation * f)),
58             t = brightness * (1 - (saturation * (1 - f)));
59         red = [brightness, q, p, p, t, brightness, brightness][i];
60         green = [t, brightness, brightness, q, p, p, t][i];
61         blue = [p, p, t, brightness, brightness, q, p][i];
62         red *= 255;
63         green *= 255;
64         blue *= 255;
65         var rgb = {r: red, g: green, b: blue},
66             r = Math.round(red).toString(16),
67             g = Math.round(green).toString(16),
68             b = Math.round(blue).toString(16);
69         if (r.length == 1) {
70             r = "0" + r;
71         }
72         if (g.length == 1) {
73             g = "0" + g;
74         }
75         if (b.length == 1) {
76             b = "0" + b;
77         }
78         rgb.hex = "#" + r + g + b;
79         return rgb;
80     };
81     R.rgb2hsb = function (red, green, blue) {
82         if (typeof red == "object" && "r" in red && "g" in red && "b" in red) {
83             blue = red.b;
84             green = red.g;
85             red = red.r;
86         }
87         if (typeof red == "string") {
88             var clr = R.getRGB(red);
89             red = clr.r;
90             green = clr.g;
91             blue = clr.b;
92         }
93         if (red > 1 || green > 1 || blue > 1) {
94             red /= 255;
95             green /= 255;
96             blue /= 255;
97         }
98         var max = Math.max(red, green, blue),
99             min = Math.min(red, green, blue),
100             hue,
101             saturation,
102             brightness = max;
103         if (min == max) {
104             return {h: 0, s: 0, b: max};
105         } else {
106             var delta = (max - min);
107             saturation = delta / max;
108             if (red == max) {
109                 hue = (green - blue) / delta;
110             } else if (green == max) {
111                 hue = 2 + ((blue - red) / delta);
112             } else {
113                 hue = 4 + ((red - green) / delta);
114             }
115             hue /= 6;
116             if (hue < 0) {
117                 hue += 1;
118             }
119             if (hue > 1) {
120                 hue -= 1;
121             }
122         }
123         return {h: hue, s: saturation, b: brightness};
124     };
125     var getRGBcache = {},
126         getRGBcount = [];
127     R.getRGB = function (colour) {
128         if (colour in getRGBcache) {
129             return getRGBcache[colour];
130         }
131         var htmlcolors = {aliceblue: "#f0f8ff", amethyst: "#96c", antiquewhite: "#faebd7", aqua: "#0ff", aquamarine: "#7fffd4", azure: "#f0ffff", beige: "#f5f5dc", bisque: "#ffe4c4", black: "#000", blanchedalmond: "#ffebcd", blue: "#00f", blueviolet: "#8a2be2", brown: "#a52a2a", burlywood: "#deb887", cadetblue: "#5f9ea0", chartreuse: "#7fff00", chocolate: "#d2691e", coral: "#ff7f50", cornflowerblue: "#6495ed", cornsilk: "#fff8dc", crimson: "#dc143c", cyan: "#0ff", darkblue: "#00008b", darkcyan: "#008b8b", darkgoldenrod: "#b8860b", darkgray: "#a9a9a9", darkgreen: "#006400", darkkhaki: "#bdb76b", darkmagenta: "#8b008b", darkolivegreen: "#556b2f", darkorange: "#ff8c00", darkorchid: "#9932cc", darkred: "#8b0000", darksalmon: "#e9967a", darkseagreen: "#8fbc8f", darkslateblue: "#483d8b", darkslategray: "#2f4f4f", darkturquoise: "#00ced1", darkviolet: "#9400d3", deeppink: "#ff1493", deepskyblue: "#00bfff", dimgray: "#696969", dodgerblue: "#1e90ff", firebrick: "#b22222", floralwhite: "#fffaf0", forestgreen: "#228b22", fuchsia: "#f0f", gainsboro: "#dcdcdc", ghostwhite: "#f8f8ff", gold: "#ffd700", goldenrod: "#daa520", gray: "#808080", green: "#008000", greenyellow: "#adff2f", honeydew: "#f0fff0", hotpink: "#ff69b4", indianred: "#cd5c5c", indigo: "#4b0082", ivory: "#fffff0", khaki: "#f0e68c", lavender: "#e6e6fa", lavenderblush: "#fff0f5", lawngreen: "#7cfc00", lemonchiffon: "#fffacd", lightblue: "#add8e6", lightcoral: "#f08080", lightcyan: "#e0ffff", lightgoldenrodyellow: "#fafad2", lightgreen: "#90ee90", lightgrey: "#d3d3d3", lightpink: "#ffb6c1", lightsalmon: "#ffa07a", lightsalmon: "#ffa07a", lightseagreen: "#20b2aa", lightskyblue: "#87cefa", lightslategray: "#789", lightsteelblue: "#b0c4de", lightyellow: "#ffffe0", lime: "#0f0", limegreen: "#32cd32", linen: "#faf0e6", magenta: "#f0f", maroon: "#800000", mediumaquamarine: "#66cdaa", mediumblue: "#0000cd", mediumorchid: "#ba55d3", mediumpurple: "#9370db", mediumseagreen: "#3cb371", mediumslateblue: "#7b68ee", mediumslateblue: "#7b68ee", mediumspringgreen: "#00fa9a", mediumturquoise: "#48d1cc", mediumvioletred: "#c71585", midnightblue: "#191970", mintcream: "#f5fffa", mistyrose: "#ffe4e1", moccasin: "#ffe4b5", navajowhite: "#ffdead", navy: "#000080", oldlace: "#fdf5e6", olive: "#808000", olivedrab: "#6b8e23", orange: "#ffa500", orangered: "#ff4500", orchid: "#da70d6", palegoldenrod: "#eee8aa", palegreen: "#98fb98", paleturquoise: "#afeeee", palevioletred: "#db7093", papayawhip: "#ffefd5", peachpuff: "#ffdab9", peru: "#cd853f", pink: "#ffc0cb", plum: "#dda0dd", powderblue: "#b0e0e6", purple: "#800080", red: "#f00", rosybrown: "#bc8f8f", royalblue: "#4169e1", saddlebrown: "#8b4513", salmon: "#fa8072", sandybrown: "#f4a460", seagreen: "#2e8b57", seashell: "#fff5ee", sienna: "#a0522d", silver: "#c0c0c0", skyblue: "#87ceeb", slateblue: "#6a5acd", slategray: "#708090", snow: "#fffafa", springgreen: "#00ff7f", steelblue: "#4682b4", tan: "#d2b48c", teal: "#008080", thistle: "#d8bfd8", tomato: "#ff6347", turquoise: "#40e0d0", violet: "#ee82ee", wheat: "#f5deb3", white: "#fff", whitesmoke: "#f5f5f5", yellow: "#ff0", yellowgreen: "#9acd32"},
132         res;
133         if ((colour + "").toLowerCase() in htmlcolors) {
134             colour = htmlcolors[colour.toString().toLowerCase()];
135         }
136         if (!colour) {
137             return {r: 0, g: 0, b: 0, hex: "#000"};
138         }
139         if (colour == "none") {
140             return {r: -1, g: -1, b: -1, hex: "none"};
141         }
142         var red,
143             green,
144             blue,
145             rgb = (colour + "").match(/^\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*\)|hsb\(\s*([\d\.]+\s*,\s*[\d\.]+\s*,\s*[\d\.]+)\s*\)|hsb\(\s*([\d\.]+%\s*,\s*[\d\.]+%\s*,\s*[\d\.]+%)\s*\))\s*$/i);
146         if (rgb) {
147             if (rgb[2]) {
148                 blue = parseInt(rgb[2].substring(5), 16);
149                 green = parseInt(rgb[2].substring(3, 5), 16);
150                 red = parseInt(rgb[2].substring(1, 3), 16);
151             }
152             if (rgb[3]) {
153                 blue = parseInt(rgb[3].substring(3) + rgb[3].substring(3), 16);
154                 green = parseInt(rgb[3].substring(2, 3) + rgb[3].substring(2, 3), 16);
155                 red = parseInt(rgb[3].substring(1, 2) + rgb[3].substring(1, 2), 16);
156             }
157             if (rgb[4]) {
158                 rgb = rgb[4].split(/\s*,\s*/);
159                 red = parseFloat(rgb[0]);
160                 green = parseFloat(rgb[1]);
161                 blue = parseFloat(rgb[2]);
162             }
163             if (rgb[5]) {
164                 rgb = rgb[5].split(/\s*,\s*/);
165                 red = parseFloat(rgb[0]) * 2.55;
166                 green = parseFloat(rgb[1]) * 2.55;
167                 blue = parseFloat(rgb[2]) * 2.55;
168             }
169             if (rgb[6]) {
170                 rgb = rgb[6].split(/\s*,\s*/);
171                 red = parseFloat(rgb[0]);
172                 green = parseFloat(rgb[1]);
173                 blue = parseFloat(rgb[2]);
174                 return R.hsb2rgb(red, green, blue);
175             }
176             if (rgb[7]) {
177                 rgb = rgb[7].split(/\s*,\s*/);
178                 red = parseFloat(rgb[0]) * 2.55;
179                 green = parseFloat(rgb[1]) * 2.55;
180                 blue = parseFloat(rgb[2]) * 2.55;
181                 return R.hsb2rgb(red, green, blue);
182             }
183             var rgb = {r: red, g: green, b: blue},
184                 r = Math.round(red).toString(16),
185                 g = Math.round(green).toString(16),
186                 b = Math.round(blue).toString(16);
187             (r.length == 1) && (r = "0" + r);
188             (g.length == 1) && (g = "0" + g);
189             (b.length == 1) && (b = "0" + b);
190             rgb.hex = "#" + r + g + b;
191             res = rgb;
192         } else {
193             res = {r: -1, g: -1, b: -1, hex: "none"};
194         }
195         if (getRGBcount.length > 20) {
196             delete getRGBcache[getRGBcount.unshift()];
197         }
198         getRGBcount.push(colour);
199         getRGBcache[colour] = res;
200         return res;
201     };
202     R.getColor = function (value) {
203         var start = this.getColor.start = this.getColor.start || {h: 0, s: 1, b: value || .75},
204             rgb = this.hsb2rgb(start.h, start.s, start.b);
205         start.h += .075;
206         if (start.h > 1) {
207             start.h = 0;
208             start.s -= .2;
209             if (start.s <= 0) {
210                 this.getColor.start = {h: 0, s: 1, b: start.b};
211             }
212         }
213         return rgb.hex;
214     };
215     R.getColor.reset = function () {
216         delete this.start;
217     };
218     // path utilities
219     var pathcache = {"": []},
220         path2string = function () {
221             var res = "",
222                 item;
223             for (var i = 0, ii = this.length; i < ii; i++) {
224                 for (var j = 0, jj = this[i].length; j < jj; j++) {
225                     item = this[i][j];
226                     res += isNaN(item) ? item : +item.toFixed(3);
227                     j && j != jj - 1 && (res += ",");
228                 }
229                 i != ii - 1 && (res += "\n");
230             }
231             return res.replace(/,(?=-)/g, "");
232         },
233         pathcount = [];
234     R.parsePathString = function (pathString) {
235         if (pathString in pathcache) {
236             return pathcache[pathString];
237         }
238         var paramCounts = {a: 7, c: 6, h: 1, l: 2, m: 2, q: 4, s: 4, t: 2, v: 1, z: 0},
239             data = [];
240         if (pathString.toString == path2string) {
241             data = pathString;
242         }
243         if (!data.length) {
244             (pathString + "").replace(/([achlmqstvz])[\s,]*((-?\d*\.?\d*(?:e[-+]?\d+)?\s*,?\s*)+)/ig, function (a, b, c) {
245                 var params = [],
246                     name = b.toLowerCase();
247                 c.replace(/(-?\d*\.?\d*(?:e[-+]?\d+)?)\s*,?\s*/ig, function (a, b) {
248                     b && params.push(+b);
249                 });
250                 while (params.length >= paramCounts[name]) {
251                     data.push([b].concat(params.splice(0, paramCounts[name])));
252                     if (!paramCounts[name]) {
253                         break;
254                     };
255                 }
256             });
257             data.toString = path2string;
258         }
259         if (pathcount.length > 200) {
260             delete pathcache[pathcount.unshift()];
261         }
262         pathcount.push(pathString);
263         pathcache[pathString] = data;
264         return data;
265     };
266     var pathDimensions = function (path) {
267         pathDimensions.cache = pathDimensions.cache || {};
268         pathDimensions.count = pathDimensions.count || [];
269         if (path in pathDimensions.cache) {
270             return pathDimensions.cache[path];
271         }
272         path = path2curve(path);
273         var x = 0, 
274             y = 0,
275             X = [],
276             Y = [];
277         for (var i = 0, ii = path.length; i < ii; i++) {
278             if (path[i][0] == "M") {
279                 x = path[i][1];
280                 y = path[i][2];
281             } else {
282                 var dim = curveDim(x, y, path[i][1], path[i][2], path[i][3], path[i][4], path[i][5], path[i][6]);
283                 X = X.concat(dim.min.x, dim.max.x);
284                 Y = Y.concat(dim.min.y, dim.max.y);
285             }
286         }
287         var xmin = Math.min.apply(0, X),
288             ymin = Math.min.apply(0, Y);
289         if (pathDimensions.count.length > 100) {
290             delete pathDimensions.cache[pathDimensions.count.unshift()];
291         }
292         pathDimensions.count.push(path);
293         return (pathDimensions.cache[path] = {
294             x: xmin,
295             y: ymin,
296             width: Math.max.apply(0, X) - xmin,
297             height: Math.max.apply(0, Y) - ymin
298         });
299     },
300         pathToRelative = function (pathArray) {
301             if (typeof pathArray == "string") {
302                 pathArray = R.parsePathString(pathArray);
303             }
304             pathToRelative.cache = pathToRelative.cache || {};
305             pathToRelative.count = pathToRelative.count || [];
306             if (pathArray in pathToRelative.cache) {
307                 return pathClone(pathToRelative.cache[pathArray]);
308             }
309             var res = [],
310                 x = 0,
311                 y = 0,
312                 mx = 0,
313                 my = 0,
314                 start = 0;
315             if (pathArray[0][0] == "M") {
316                 x = pathArray[0][1];
317                 y = pathArray[0][2];
318                 mx = x;
319                 my = y;
320                 start++;
321                 res.push(["M", x, y]);
322             }
323             for (var i = start, ii = pathArray.length; i < ii; i++) {
324                 var r = res[i] = [],
325                     pa = pathArray[i];
326                 if (pa[0] != pa[0].toLowerCase()) {
327                     r[0] = pa[0].toLowerCase();
328                     switch (r[0]) {
329                         case "a":
330                             r[1] = pa[1];
331                             r[2] = pa[2];
332                             r[3] = pa[3];
333                             r[4] = pa[4];
334                             r[5] = pa[5];
335                             r[6] = +(pa[6] - x).toFixed(3);
336                             r[7] = +(pa[7] - y).toFixed(3);
337                             break;
338                         case "v":
339                             r[1] = +(pa[1] - y).toFixed(3);
340                             break;
341                         case "m":
342                             mx = pa[1];
343                             my = pa[2];
344                         default:
345                             for (var j = 1, jj = pa.length; j < jj; j++) {
346                                 r[j] = +(pa[j] - ((j % 2) ? x : y)).toFixed(3);
347                             }
348                     }
349                 } else {
350                     r = res[i] = [];
351                     if (pa[0] == "m") {
352                         mx = pa[1] + x;
353                         my = pa[2] + y;
354                     }
355                     for (var k = 0, kk = pa.length; k < kk; k++) {
356                         res[i][k] = pa[k];
357                     }
358                 }
359                 var len = res[i].length;
360                 switch (res[i][0]) {
361                     case "z":
362                         x = mx;
363                         y = my;
364                         break;
365                     case "h":
366                         x += +res[i][len - 1];
367                         break;
368                     case "v":
369                         y += +res[i][len - 1];
370                         break;
371                     default:
372                         x += +res[i][len - 2];
373                         y += +res[i][len - 1];
374                 }
375             }
376             res.toString = path2string;
377             if (pathToRelative.count.length > 100) {
378                 delete pathToRelative.cache[pathToRelative.count.unshift()];
379             }
380             pathToRelative.count.push(pathArray);
381             return pathClone(pathToRelative.cache[pathArray] = res);
382         },
383         pathClone = function (pathArray) {
384             var res = [];
385             if (typeof pathArray == "string") {
386                 pathArray = R.parsePathString(pathArray);
387             }
388             for (var i = 0, ii = pathArray.length; i < ii; i++) {
389                 res[i] = [];
390                 for (var j = 0, jj = pathArray[i].length; j < jj; j++) {
391                     res[i][j] = pathArray[i][j];
392                 }
393             }
394             res.toString = path2string;
395             return res;
396         },
397         pathToAbsolute = function (pathArray) {
398             if (typeof pathArray == "string") {
399                 pathArray = R.parsePathString(pathArray);
400             }
401             pathToAbsolute.cache = pathToAbsolute.cache || {};
402             pathToAbsolute.count = pathToAbsolute.count || [];
403             if (pathArray in pathToAbsolute.cache) {
404                 return pathClone(pathToAbsolute.cache[pathArray]);
405             }
406             var res = [],
407                 x = 0,
408                 y = 0,
409                 mx = 0,
410                 my = 0,
411                 start = 0;
412             if (pathArray[0][0] == "M") {
413                 x = +pathArray[0][1];
414                 y = +pathArray[0][2];
415                 mx = x;
416                 my = y;
417                 start++;
418                 res[0] = ["M", x, y];
419             }
420             for (var i = start, ii = pathArray.length; i < ii; i++) {
421                 var r = res[i] = [],
422                     pa = pathArray[i];
423                 if (pa[0] != (pa[0] + "").toUpperCase()) {
424                     r[0] = (pa[0] + "").toUpperCase();
425                     switch (r[0]) {
426                         case "A":
427                             r[1] = pa[1];
428                             r[2] = pa[2];
429                             r[3] = pa[3];
430                             r[4] = pa[4];
431                             r[5] = pa[5];
432                             r[6] = +(pa[6] + x);
433                             r[7] = +(pa[7] + y);
434                             break;
435                         case "V":
436                             r[1] = +pa[1] + y;
437                             break;
438                         case "H":
439                             r[1] = +pa[1] + x;
440                             break;
441                         case "M":
442                             mx = +pa[1] + x;
443                             my = +pa[2] + y;
444                         default:
445                             for (var j = 1, jj = pa.length; j < jj; j++) {
446                                 r[j] = +pa[j] + ((j % 2) ? x : y);
447                             }
448                     }
449                 } else {
450                     r = res[i] = [];
451                     for (var k = 0, kk = pa.length; k < kk; k++) {
452                         res[i][k] = pa[k];
453                     }
454                 }
455                 switch (r[0]) {
456                     case "Z":
457                         x = mx;
458                         y = my;
459                         break;
460                     case "H":
461                         x = r[1];
462                         break;
463                     case "V":
464                         y = r[1];
465                         break;
466                     default:
467                         x = res[i][res[i].length - 2];
468                         y = res[i][res[i].length - 1];
469                 }
470             }
471             res.toString = path2string;
472             if (pathToAbsolute.count.length > 100) {
473                 delete pathToAbsolute.cache[pathToAbsolute.count.unshift()];
474             }
475             pathToAbsolute.count.push(pathArray);
476             return pathClone(pathToAbsolute.cache[pathArray] = res);
477         },
478         l2c = function (x1, y1, x2, y2) {
479             return [x1, y1, x2, y2, x2, y2];
480         },
481         q2c = function (x1, y1, ax, ay, x2, y2) {
482             return [
483                     2 / 3 * x1 + 1 / 3 * ax,
484                     2 / 3 * y1 + 1 / 3 * ay,
485                     2 / 3 * x1 + 1 / 3 * x2,
486                     2 / 3 * y1 + 1 / 3 * y2,
487                     x2,
488                     y2
489                 ];
490         },
491         a2c = function (x1, y1, rx, ry, angle, large_arc_flag, sweep_flag, x2, y2, recursive) {
492             // for more information of where this math came from visit:
493             // http://www.w3.org/TR/SVG11/implnote.html#ArcImplementationNotes
494             var _120 = Math.PI * 120 / 180,
495                 res = [];
496             if (!recursive) {
497                 var x = (x1 - x2) / 2,
498                     y = (y1 - y2) / 2,
499                     rx2 = rx * rx,
500                     ry2 = ry * ry,
501                     k = (large_arc_flag == sweep_flag ? -1 : 1) *
502                         Math.sqrt(Math.abs(rx2 * ry2 - rx2 * y * y - ry2 * x * x) / (rx2 * y * y + ry2 * x * x)),
503                     cx = k * rx * y / ry + (x1 + x2) / 2,
504                     cy = k * -ry * x / rx + (y1 + y2) / 2,
505                     f1 = Math.asin((y1 - cy) / ry),
506                     f2 = Math.asin((y2 - cy) / ry);
507
508                 f1 = x1 < cx ? Math.PI - f1 : f1;
509                 f2 = x2 < cx ? Math.PI - f2 : f2;
510                 f1 < 0 && (f1 = Math.PI * 2 + f1);
511                 f2 < 0 && (f2 = Math.PI * 2 + f2);
512                 if (sweep_flag && f1 > f2) {
513                     f1 = f1 - Math.PI * 2;
514                 }
515                 if (!sweep_flag && f2 > f1) {
516                     f2 = f2 - Math.PI * 2;
517                 }
518             } else {
519                 f1 = recursive[0];
520                 f2 = recursive[1];
521                 cx = recursive[2];
522                 cy = recursive[3];
523             }
524             var df = f2 - f1;
525             if (Math.abs(df) > _120) {
526                 var f2old = f2,
527                     x2old = x2,
528                     y2old = y2;
529                 f2 = f1 + _120 * (sweep_flag && f2 > f1 ? 1 : -1);
530                 x2 = cx + rx * Math.cos(f2);
531                 y2 = cy + ry * Math.sin(f2);
532                 res = arguments.callee(x2, y2, rx, ry, angle, 0, sweep_flag, x2old, y2old, [f2, f2old, cx, cy]);
533             }
534             var c1 = Math.cos(f1),
535                 s1 = Math.sin(f1),
536                 c2 = Math.cos(f2),
537                 s2 = Math.sin(f2),
538                 df = f2 - f1,
539                 t = Math.tan(df / 4),
540                 hx = 4 / 3 * rx * t,
541                 hy = 4 / 3 * ry * t,
542                 m1 = [x1, y1],
543                 m2 = [x1 + hx * s1, y1 - hy * c1],
544                 m3 = [x2 + hx * s2, y2 - hy * c2],
545                 m4 = [x2, y2];
546             m2[0] = 2 * m1[0] - m2[0];
547             m2[1] = 2 * m1[1] - m2[1];
548             if (recursive) {
549                 return [m2, m3, m4].concat(res);
550             } else {
551                 res = [m2, m3, m4].concat(res).join(",").split(",");
552                 for (var i = res.length; i--;) {
553                     res[i] = +res[i];
554                 }
555                 return res;
556             }
557         },
558         findDotAtSegment = function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) {
559             var x = Math.pow(1 - t, 3) * p1x + Math.pow(1 - t, 2) * 3 * t * c1x + (1 - t) * 3 * t * t * c2x + Math.pow(t, 3) * p2x,
560                 y = Math.pow(1 - t, 3) * p1y + Math.pow(1 - t, 2) * 3 * t * c1y + (1 - t) * 3 * t * t * c2y + Math.pow(t, 3) * p2y,
561                 mx = p1x + 2 * t * (c1x - p1x) + t * t * (c2x - 2 * c1x + p1x),
562                 my = p1y + 2 * t * (c1y - p1y) + t * t * (c2y - 2 * c1y + p1y),
563                 nx = c1x + 2 * t * (c2x - c1x) + t * t * (p2x - 2 * c2x + c1x),
564                 ny = c1y + 2 * t * (c2y - c1y) + t * t * (p2y - 2 * c2y + c1y),
565                 ax = (1 - t) * p1x + t * c1x,
566                 ay = (1 - t) * p1y + t * c1y,
567                 cx = (1 - t) * c2x + t * p2x,
568                 cy = (1 - t) * c2y + t * p2y;
569             return {x: x, y: y, m: {x: mx, y: my}, n: {x: nx, y: ny}, start: {x: ax, y: ay}, end: {x: cx, y: cy}};
570         },
571         curveDim = function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y) {
572             var a = (c2x - 2 * c1x + p1x) - (p2x - 2 * c2x + c1x),
573                 b = 2 * (c1x - p1x) - 2 * (c2x - c1x),
574                 c = p1x - c1x,
575                 t1 = (-b + Math.sqrt(b * b - 4 * a * c)) / 2 / a,
576                 t2 = (-b - Math.sqrt(b * b - 4 * a * c)) / 2 / a,
577                 y = [p1y, p2y],
578                 x = [p1x, p2x],
579                 dot1 = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t1 > 0 && t1 < 1 ? t1 : 0),
580                 dot2 = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t2 > 0 && t2 < 1 ? t2 : 0);
581             x = x.concat(dot1.x, dot2.x);
582             y = y.concat(dot1.y, dot2.y);
583             a = (c2y - 2 * c1y + p1y) - (p2y - 2 * c2y + c1y);
584             b = 2 * (c1y - p1y) - 2 * (c2y - c1y);
585             c = p1y - c1y;
586             t1 = (-b + Math.sqrt(b * b - 4 * a * c)) / 2 / a;
587             t2 = (-b - Math.sqrt(b * b - 4 * a * c)) / 2 / a;
588             dot1 = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t1 > 0 && t1 < 1 ? t1 : 0);
589             dot2 = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t2 > 0 && t2 < 1 ? t2 : 0);
590             x = x.concat(dot1.x, dot2.x);
591             y = y.concat(dot1.y, dot2.y);
592             return {
593                 min: {x: Math.min.apply(Math, x), y: Math.min.apply(Math, y)},
594                 max: {x: Math.max.apply(Math, x), y: Math.max.apply(Math, y)}
595             };
596         },
597         path2curve = function (path, path2) {
598             path2curve.cache = path2curve.cache || {};
599             path2curve.count = path2curve.count || [];
600             if ((path + "&" + path2) in path2curve.cache) {
601                 return path2curve.cache[path + "&" + path2];
602             }
603             var p = pathToAbsolute(path),
604                 p2 = path2 && pathToAbsolute(path2),
605                 attrs = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0},
606                 attrs2 = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0},
607                 processPath = function (path, d) {
608                     if (!path) {
609                         return ["C", d.x, d.y, d.x, d.y, d.x, d.y];
610                     }
611                     switch (path[0]) {
612                         case "M":
613                             d.X = path[1];
614                             d.Y = path[2];
615                             break;
616                         case "A":
617                             path = ["C"].concat(a2c(d.x, d.y, path[1], path[2], path[3], path[4], path[5], path[6], path[7]));
618                             break;
619                         case "S":
620                             var nx = d.x + (d.x - (d.bx || d.x)),
621                                 ny = d.y + (d.y - (d.by || d.y));
622                             path = ["C", nx, ny, path[1], path[2], path[3], path[4]];
623                             break;
624                         case "T":
625                             var nx = d.x + (d.x - (d.bx || d.x)),
626                                 ny = d.y + (d.y - (d.by || d.y));
627                             path = ["C"].concat(q2c(d.x, d.y, nx, ny, path[1], path[2]));
628                             break;
629                         case "Q":
630                             path = ["C"].concat(q2c(d.x, d.y, path[1], path[2], path[3], path[4]));
631                             break;
632                         case "L":
633                             path = ["C"].concat(l2c(d.x, d.y, path[1], path[2]));
634                             break;
635                         case "H":
636                             path = ["C"].concat(l2c(d.x, d.y, path[1], d.y));
637                             break;
638                         case "V":
639                             path = ["C"].concat(l2c(d.x, d.y, d.x, path[1]));
640                             break;
641                         case "Z":
642                             path = ["C"].concat(l2c(d.x, d.y, d.X, d.Y));
643                             break;
644                     }
645                     return path;
646                 },
647                 fixArc = function (pp, i) {
648                     if (pp[i].length > 7) {
649                         pp[i].shift();
650                         var pi = pp[i];
651                         while (pi.length) {
652                             pp.splice(i++, 0, ["C"].concat(pi.splice(0, 6)));
653                         }
654                         pp.splice(i, 1);
655                         ii = Math.max(p.length, p2 && p2.length || 0);
656                     }
657                 },
658                 fixM = function (path1, path2, a1, a2, i) {
659                     if (path1 && path2 && path1[i][0] == "M" && path2[i][0] != "M") {
660                         path2.splice(i, 0, ["M", a2.x, a2.y]);
661                         a1.bx = 0;
662                         a1.by = 0;
663                         a1.x = path1[i][1];
664                         a1.y = path1[i][2];
665                         ii = Math.max(p.length, p2 && p2.length || 0);
666                     }
667                 };
668             for (var i = 0, ii = Math.max(p.length, p2 && p2.length || 0); i < ii; i++) {
669                 p[i] = processPath(p[i], attrs);
670                 fixArc(p, i);
671                 p2 && (p2[i] = processPath(p2[i], attrs2));
672                 p2 && fixArc(p2, i);
673                 fixM(p, p2, attrs, attrs2, i);
674                 fixM(p2, p, attrs2, attrs, i);
675                 var seg = p[i],
676                     seg2 = p2 && p2[i],
677                     seglen = seg.length,
678                     seg2len = p2 && seg2.length;
679                 attrs.bx = seg[seglen - 4] || 0;
680                 attrs.by = seg[seglen - 3] || 0;
681                 attrs.x = seg[seglen - 2];
682                 attrs.y = seg[seglen - 1];
683                 attrs2.bx = p2 && (seg2[seg2len - 4] || 0);
684                 attrs2.by = p2 && (seg2[seg2len - 3] || 0);
685                 attrs2.x = p2 && seg2[seg2len - 2];
686                 attrs2.y = p2 && seg2[seg2len - 1];
687             }
688             if (path2curve.count.length > 100) {
689                 delete path2curve.cache[path2curve.count.unshift()];
690             }
691             path2curve.count.push(path + "&" + path2);
692             return (path2curve.cache[path + "&" + path2] = p2 ? [p, p2] : p);
693         },
694         toGradient = function (gradient) {
695             if (typeof gradient == "string") {
696                 gradient = gradient.split(/\s*\-\s*/);
697                 var angle = gradient.shift();
698                 if (angle.toLowerCase() == "v") {
699                     angle = 90;
700                 } else if (angle.toLowerCase() == "h") {
701                     angle = 0;
702                 } else {
703                     angle = parseFloat(angle);
704                 }
705                 angle = -angle;
706                 var grobj = {angle: angle, type: "linear", dots: [], vector: [0, 0, Math.cos(angle * Math.PI / 180).toFixed(3), Math.sin(angle * Math.PI / 180).toFixed(3)]},
707                     max = 1 / (Math.max(Math.abs(grobj.vector[2]), Math.abs(grobj.vector[3])) || 1);
708                 grobj.vector[2] *= max;
709                 grobj.vector[3] *= max;
710                 if (grobj.vector[2] < 0) {
711                     grobj.vector[0] = -grobj.vector[2];
712                     grobj.vector[2] = 0;
713                 }
714                 if (grobj.vector[3] < 0) {
715                     grobj.vector[1] = -grobj.vector[3];
716                     grobj.vector[3] = 0;
717                 }
718                 grobj.vector[0] = grobj.vector[0].toFixed(3);
719                 grobj.vector[1] = grobj.vector[1].toFixed(3);
720                 grobj.vector[2] = grobj.vector[2].toFixed(3);
721                 grobj.vector[3] = grobj.vector[3].toFixed(3);
722                 for (var i = 0, ii = gradient.length; i < ii; i++) {
723                     var dot = {},
724                         par = gradient[i].match(/^([^:]*):?([\d\.]*)/);
725                     dot.color = R.getRGB(par[1]).hex;
726                     par[2] && (dot.offset = par[2] + "%");
727                     grobj.dots.push(dot);
728                 }
729                 for (var i = 1, ii = grobj.dots.length - 1; i < ii; i++) {
730                     if (!grobj.dots[i].offset) {
731                         var start = parseFloat(grobj.dots[i - 1].offset || 0),
732                             end = false;
733                         for (var j = i + 1; j < ii; j++) {
734                             if (grobj.dots[j].offset) {
735                                 end = grobj.dots[j].offset;
736                                 break;
737                             }
738                         }
739                         if (!end) {
740                             end = 100;
741                             j = ii;
742                         }
743                         end = parseFloat(end);
744                         var d = (end - start) / (j - i + 1);
745                         for (; i < j; i++) {
746                             start += d;
747                             grobj.dots[i].offset = start + "%";
748                         }
749                     }
750                 }
751                 return grobj;
752             } else {
753                 return gradient;
754             }
755         },
756         getContainer = function () {
757             var container,
758                 x,
759                 y,
760                 width,
761                 height;
762             if (typeof arguments[0] == "string" || typeof arguments[0] == "object") {
763                 if (typeof arguments[0] == "string") {
764                     container = doc.getElementById(arguments[0]);
765                 } else {
766                     container = arguments[0];
767                 }
768                 if (container.tagName) {
769                     if (arguments[1] == null) {
770                         return {
771                             container: container,
772                             width: container.style.pixelWidth || container.offsetWidth,
773                             height: container.style.pixelHeight || container.offsetHeight
774                         };
775                     } else {
776                         return {container: container, width: arguments[1], height: arguments[2]};
777                     }
778                 }
779             } else if (typeof arguments[0] == "number" && arguments.length > 3) {
780                 return {container: 1, x: arguments[0], y: arguments[1], width: arguments[2], height: arguments[3]};
781             }
782         },
783         plugins = function (con, add) {
784             var that = this;
785             for (var prop in add) if (add.hasOwnProperty(prop) && !(prop in con)) {
786                 switch (typeof add[prop]) {
787                     case "function":
788                         (function (f) {
789                             con[prop] = con === that ? f : function () { return f.apply(that, arguments); };
790                         })(add[prop]);
791                     break;
792                     case "object":
793                         con[prop] = con[prop] || {};
794                         plugins.call(this, con[prop], add[prop]);
795                     break;
796                     default:
797                         con[prop] = add[prop];
798                     break;
799                 }
800             }
801         };
802
803     // SVG
804     if (R.svg) {
805         R.toString = function () {
806             return  "Your browser supports SVG.\nYou are running Rapha\u00ebl " + this.version;
807         };
808         var thePath = function (pathString, SVG) {
809             var el = doc.createElementNS(SVG.svgns, "path");
810             if (SVG.canvas) {
811                 SVG.canvas.appendChild(el);
812             }
813             var p = new Element(el, SVG);
814             p.type = "path";
815             p.attrs.path = R.parsePathString(pathString);
816             pathString && p.node.setAttribute("d", p.attrs.path);
817             setFillAndStroke(p, {fill: "none", stroke: "#000"});
818             return p;
819         };
820         var addGradientFill = function (o, gradient, SVG) {
821             gradient = toGradient(gradient);
822             var el = doc.createElementNS(SVG.svgns, (gradient.type || "linear") + "Gradient");
823             el.id = "raphael-gradient-" + R.idGenerator++;
824             if (gradient.vector && gradient.vector.length) {
825                 el.setAttribute("x1", gradient.vector[0]);
826                 el.setAttribute("y1", gradient.vector[1]);
827                 el.setAttribute("x2", gradient.vector[2]);
828                 el.setAttribute("y2", gradient.vector[3]);
829             }
830             SVG.defs.appendChild(el);
831             var isopacity = true;
832             for (var i = 0, ii = gradient.dots.length; i < ii; i++) {
833                 var stop = doc.createElementNS(SVG.svgns, "stop");
834                 if (gradient.dots[i].offset) {
835                     isopacity = false;
836                 }
837                 stop.setAttribute("offset", gradient.dots[i].offset ? gradient.dots[i].offset : (i == 0) ? "0%" : "100%");
838                 stop.setAttribute("stop-color", R.getRGB(gradient.dots[i].color).hex || "#fff");
839                 // ignoring opacity for internal points, because VML doesn't support it
840                 el.appendChild(stop);
841             };
842             if (isopacity && typeof gradient.dots[ii - 1].opacity != "undefined") {
843                 stop.setAttribute("stop-opacity", gradient.dots[ii - 1].opacity);
844             }
845             o.setAttribute("fill", "url(#" + el.id + ")");
846             o.style.fill = "";
847             o.style.opacity = 1;
848             o.style.fillOpacity = 1;
849             o.setAttribute("opacity", 1);
850             o.setAttribute("fill-opacity", 1);
851         };
852         var updatePosition = function (o) {
853             if (o.pattern) {
854                 var bbox = o.getBBox();
855                 o.pattern.setAttribute("patternTransform", "translate(".concat(bbox.x, ",", bbox.y, ")"));
856             }
857         };
858         var setFillAndStroke = function (o, params) {
859             var dasharray = {
860                     "": [0],
861                     "none": [0],
862                     "-": [3, 1],
863                     ".": [1, 1],
864                     "-.": [3, 1, 1, 1],
865                     "-..": [3, 1, 1, 1, 1, 1],
866                     ". ": [1, 3],
867                     "- ": [4, 3],
868                     "--": [8, 3],
869                     "- .": [4, 3, 1, 3],
870                     "--.": [8, 3, 1, 3],
871                     "--..": [8, 3, 1, 3, 1, 3]
872                 },
873                 node = o.node,
874                 attrs = o.attrs,
875                 rot = o.attr("rotation"),
876                 addDashes = function (o, value) {
877                     value = dasharray[(value + "").toLowerCase()];
878                     if (value) {
879                         var width = o.attrs["stroke-width"] || "1",
880                             butt = {round: width, square: width, butt: 0}[o.attrs["stroke-linecap"] || params["stroke-linecap"]] || 0,
881                             dashes = [];
882                         for (var i = 0, ii = value.length; i < ii; i++) {
883                             dashes.push(value[i] * width + ((i % 2) ? 1 : -1) * butt);
884                         }
885                         value = dashes.join(",");
886                         node.setAttribute("stroke-dasharray", value);
887                     }
888                 };
889             o.rotate(0, true);
890             for (var att in params) {
891                 if (!(att in availableAttrs)) {
892                     continue;
893                 }
894                 var value = params[att];
895                 attrs[att] = value;
896                 switch (att) {
897                     // Hyperlink
898                     case "href":
899                     case "title":
900                     case "target":
901                         var pn = node.parentNode;
902                         if (pn.tagName.toLowerCase() != "a") {
903                             var hl = doc.createElementNS(o.paper.svgns, "a");
904                             pn.insertBefore(hl, node);
905                             hl.appendChild(node);
906                             pn = hl;
907                         }
908                         pn.setAttributeNS(o.paper.xlink, att, value);
909                       break;
910                     case "path":
911                         if (o.type == "path") {
912                             attrs.path = R.parsePathString(value);
913                             node.setAttribute("d", attrs.path);
914                         }
915                     case "width":
916                         node.setAttribute(att, value);
917                         if (attrs.fx) {
918                             att = "x";
919                             value = attrs.x;
920                         } else {
921                             break;
922                         }
923                     case "x":
924                         if (attrs.fx) {
925                             value = -attrs.x - (attrs.width || 0);
926                         }
927                     case "rx":
928                     case "cx":
929                         node.setAttribute(att, value);
930                         updatePosition(o);
931                         break;
932                     case "height":
933                         node.setAttribute(att, value);
934                         if (attrs.fy) {
935                             att = "y";
936                             value = attrs.y;
937                         } else {
938                             break;
939                         }
940                     case "y":
941                         if (attrs.fy) {
942                             value = -attrs.y - (attrs.height || 0);
943                         }
944                     case "ry":
945                     case "cy":
946                         node.setAttribute(att, value);
947                         updatePosition(o);
948                         break;
949                     case "r":
950                         if (o.type == "rect") {
951                             node.setAttribute("rx", value);
952                             node.setAttribute("ry", value);
953                         } else {
954                             node.setAttribute(att, value);
955                         }
956                         break;
957                     case "src":
958                         if (o.type == "image") {
959                             node.setAttributeNS(o.paper.xlink, "href", value);
960                         }
961                         break;
962                     case "stroke-width":
963                         node.style.strokeWidth = value;
964                         // Need following line for Firefox
965                         node.setAttribute(att, value);
966                         if (attrs["stroke-dasharray"]) {
967                             addDashes(o, attrs["stroke-dasharray"]);
968                         }
969                         break;
970                     case "stroke-dasharray":
971                         addDashes(o, value);
972                         break;
973                     case "rotation":
974                         rot = value;
975                         o.rotate(value, true);
976                         break;
977                     case "translation":
978                         var xy = (value + "").split(separator);
979                         o.translate((+xy[0] + 1 || 2) - 1, (+xy[1] + 1 || 2) - 1);
980                         break;
981                     case "scale":
982                         var xy = (value + "").split(separator);
983                         o.scale(+xy[0] || 1, +xy[1] || +xy[0] || 1, +xy[2] || null, +xy[3] || null);
984                         break;
985                     case "fill":
986                         var isURL = (value + "").match(/^url\(([^\)]+)\)$/i);
987                         if (isURL) {
988                             var el = doc.createElementNS(o.paper.svgns, "pattern"),
989                                 ig = doc.createElementNS(o.paper.svgns, "image");
990                             el.id = "raphael-pattern-" + R.idGenerator++;
991                             el.setAttribute("x", 0);
992                             el.setAttribute("y", 0);
993                             el.setAttribute("patternUnits", "userSpaceOnUse");
994                             ig.setAttribute("x", 0);
995                             ig.setAttribute("y", 0);
996                             ig.setAttributeNS(o.paper.xlink, "href", isURL[1]);
997                             el.appendChild(ig);
998
999                             var img = doc.createElement("img");
1000                             img.style.position = "absolute";
1001                             img.style.top = "-9999em";
1002                             img.style.left = "-9999em";
1003                             img.onload = function () {
1004                                 el.setAttribute("width", this.offsetWidth);
1005                                 el.setAttribute("height", this.offsetHeight);
1006                                 ig.setAttribute("width", this.offsetWidth);
1007                                 ig.setAttribute("height", this.offsetHeight);
1008                                 doc.body.removeChild(this);
1009                                 paper.safari();
1010                             };
1011                             doc.body.appendChild(img);
1012                             img.src = isURL[1];
1013                             o.paper.defs.appendChild(el);
1014                             node.style.fill = "url(#" + el.id + ")";
1015                             node.setAttribute("fill", "url(#" + el.id + ")");
1016                             o.pattern = el;
1017                             updatePosition(o);
1018                             break;
1019                         }
1020                         delete params.gradient;
1021                         delete attrs.gradient;
1022                         if (typeof attrs.opacity != "undefined" && typeof params.opacity == "undefined" ) {
1023                             node.style.opacity = attrs.opacity;
1024                             // Need following line for Firefox
1025                             node.setAttribute("opacity", attrs.opacity);
1026                         }
1027                         if (typeof attrs["fill-opacity"] != "undefined" && typeof params["fill-opacity"] == "undefined" ) {
1028                             node.style.fillOpacity = o.attrs["fill-opacity"];
1029                             // Need following line for Firefox
1030                             node.setAttribute("fill-opacity", attrs["fill-opacity"]);
1031                         }
1032                     case "stroke":
1033                         node.style[att] = R.getRGB(value).hex;
1034                         // Need following line for Firefox
1035                         node.setAttribute(att, R.getRGB(value).hex);
1036                         break;
1037                     case "gradient":
1038                         addGradientFill(node, value, o.paper);
1039                         break;
1040                     case "opacity":
1041                     case "fill-opacity":
1042                         if (attrs.gradient) {
1043                             var gradient = doc.getElementById(node.getAttribute("fill").replace(/^url\(#|\)$/g, ""));
1044                             if (gradient) {
1045                                 var stops = gradient.getElementsByTagName("stop");
1046                                 stops[stops.length - 1].setAttribute("stop-opacity", value);
1047                             }
1048                             break;
1049                         }
1050                     default :
1051                         var cssrule = att.replace(/(\-.)/g, function (w) {
1052                             return w.substring(1).toUpperCase();
1053                         });
1054                         node.style[cssrule] = value;
1055                         // Need following line for Firefox
1056                         node.setAttribute(att, value);
1057                         break;
1058                 }
1059             }
1060             
1061             tuneText(o, params);
1062             o.rotate(rot, true);
1063         };
1064         var leading = 1.2;
1065         var tuneText = function (el, params) {
1066             if (el.type != "text" || !("text" in params || "font" in params || "font-size" in params || "x" in params || "y" in params)) {
1067                 return;
1068             }
1069             var a = el.attrs,
1070                 node = el.node,
1071                 fontSize = node.firstChild ? parseInt(doc.defaultView.getComputedStyle(node.firstChild, "").getPropertyValue("font-size"), 10) : 10;
1072
1073             if ("text" in params) {
1074                 while (node.firstChild) {
1075                     node.removeChild(node.firstChild);
1076                 }
1077                 var texts = (params.text + "").split("\n");
1078                 for (var i = 0, ii = texts.length; i < ii; i++) {
1079                     var tspan = doc.createElementNS(el.paper.svgns, "tspan");
1080                     i && tspan.setAttribute("dy", fontSize * leading);
1081                     i && tspan.setAttribute("x", a.x);
1082                     tspan.appendChild(doc.createTextNode(texts[i]));
1083                     node.appendChild(tspan);
1084                 }
1085             } else {
1086                 var texts = node.getElementsByTagName("tspan");
1087                 for (var i = 0, ii = texts.length; i < ii; i++) {
1088                     i && texts[i].setAttribute("dy", fontSize * leading);
1089                     i && texts[i].setAttribute("x", a.x);
1090                 }
1091             }
1092             node.setAttribute("y", a.y);
1093             var bb = el.getBBox(),
1094                 dif = a.y - (bb.y + bb.height / 2);
1095             dif && node.setAttribute("y", a.y + dif);
1096         };
1097         var Element = function (node, svg) {
1098             var X = 0,
1099                 Y = 0;
1100             this[0] = node;
1101             this.node = node;
1102             this.paper = svg;
1103             this.attrs = this.attrs || {};
1104             this.transformations = []; // rotate, translate, scale
1105             this._ = {
1106                 tx: 0,
1107                 ty: 0,
1108                 rt: {deg: 0, cx: 0, cy: 0},
1109                 sx: 1,
1110                 sy: 1
1111             };
1112         };
1113         Element.prototype.rotate = function (deg, cx, cy) {
1114             if (deg == null) {
1115                 if (this._.rt.cx) {
1116                     return [this._.rt.deg, this._.rt.cx, this._.rt.cy].join(" ");
1117                 }
1118                 return this._.rt.deg;
1119             }
1120             var bbox = this.getBBox();
1121             deg = (deg + "").split(separator);
1122             if (deg.length - 1) {
1123                 cx = parseFloat(deg[1]);
1124                 cy = parseFloat(deg[2]);
1125             }
1126             deg = parseFloat(deg[0]);
1127             if (cx != null) {
1128                 this._.rt.deg = deg;
1129             } else {
1130                 this._.rt.deg += deg;
1131             }
1132             (cy == null) && (cx = null);
1133             this._.rt.cx = cx;
1134             this._.rt.cy = cy;
1135             cx = cx == null ? bbox.x + bbox.width / 2 : cx;
1136             cy = cy == null ? bbox.y + bbox.height / 2 : cy;
1137             if (this._.rt.deg) {
1138                 this.transformations[0] = "rotate(".concat(this._.rt.deg, " ", cx, " ", cy, ")");
1139             } else {
1140                 this.transformations[0] = "";
1141             }
1142             this.node.setAttribute("transform", this.transformations.join(" "));
1143             return this;
1144         };
1145         Element.prototype.hide = function () {
1146             this.node.style.display = "none";
1147             return this;
1148         };
1149         Element.prototype.show = function () {
1150             this.node.style.display = "block";
1151             return this;
1152         };
1153         Element.prototype.remove = function () {
1154             this.node.parentNode.removeChild(this.node);
1155         };
1156         Element.prototype.getBBox = function () {
1157             if (this.node.style.display == "none") {
1158                 this.show();
1159                 var hide = true;
1160             }
1161             var bbox = {};
1162             try {
1163                 bbox = this.node.getBBox();
1164             } catch(e) {
1165                 // Firefox 3.0.x plays badly here
1166             } finally {
1167                 bbox = bbox || {};
1168             }
1169             if (this.type == "text") {
1170                 bbox = {x: bbox.x, y: Infinity, width: bbox.width, height: 0};
1171                 for (var i = 0, ii = this.node.getNumberOfChars(); i < ii; i++) {
1172                     var bb = this.node.getExtentOfChar(i);
1173                     (bb.y < bbox.y) && (bbox.y = bb.y);
1174                     (bb.y + bb.height - bbox.y > bbox.height) && (bbox.height = bb.y + bb.height - bbox.y);
1175                 }
1176             }
1177             hide && this.hide();
1178             return bbox;
1179         };
1180         Element.prototype.attr = function () {
1181             if (arguments.length == 1 && typeof arguments[0] == "string") {
1182                 if (arguments[0] == "translation") {
1183                     return this.translate();
1184                 }
1185                 if (arguments[0] == "rotation") {
1186                     return this.rotate();
1187                 }
1188                 if (arguments[0] == "scale") {
1189                     return this.scale();
1190                 }
1191                 return this.attrs[arguments[0]];
1192             }
1193             if (arguments.length == 1 && R.isArray(arguments[0])) {
1194                 var values = {};
1195                 for (var j in arguments[0]) {
1196                     values[arguments[0][j]] = this.attrs[arguments[0][j]];
1197                 }
1198                 return values;
1199             }
1200             if (arguments.length == 2) {
1201                 var params = {};
1202                 params[arguments[0]] = arguments[1];
1203                 setFillAndStroke(this, params);
1204             } else if (arguments.length == 1 && typeof arguments[0] == "object") {
1205                 setFillAndStroke(this, arguments[0]);
1206             }
1207             return this;
1208         };
1209         Element.prototype.toFront = function () {
1210             this.node.parentNode.appendChild(this.node);
1211             return this;
1212         };
1213         Element.prototype.toBack = function () {
1214             if (this.node.parentNode.firstChild != this.node) {
1215                 this.node.parentNode.insertBefore(this.node, this.node.parentNode.firstChild);
1216             }
1217             return this;
1218         };
1219         Element.prototype.insertAfter = function (element) {
1220             if (element.node.nextSibling) {
1221                 element.node.parentNode.insertBefore(this.node, element.node.nextSibling);
1222             } else {
1223                 element.node.parentNode.appendChild(this.node);
1224             }
1225             return this;
1226         };
1227         Element.prototype.insertBefore = function (element) {
1228             var node = element.node;
1229             node.parentNode.insertBefore(this.node, node);
1230             return this;
1231         };
1232         var theCircle = function (svg, x, y, r) {
1233             var el = doc.createElementNS(svg.svgns, "circle");
1234             el.setAttribute("cx", x);
1235             el.setAttribute("cy", y);
1236             el.setAttribute("r", r);
1237             el.setAttribute("fill", "none");
1238             el.setAttribute("stroke", "#000");
1239             if (svg.canvas) {
1240                 svg.canvas.appendChild(el);
1241             }
1242             var res = new Element(el, svg);
1243             res.attrs = res.attrs || {};
1244             res.attrs.cx = x;
1245             res.attrs.cy = y;
1246             res.attrs.r = r;
1247             res.attrs.stroke = "#000";
1248             res.type = "circle";
1249             return res;
1250         };
1251         var theRect = function (svg, x, y, w, h, r) {
1252             var el = doc.createElementNS(svg.svgns, "rect");
1253             el.setAttribute("x", x);
1254             el.setAttribute("y", y);
1255             el.setAttribute("width", w);
1256             el.setAttribute("height", h);
1257             if (r) {
1258                 el.setAttribute("rx", r);
1259                 el.setAttribute("ry", r);
1260             }
1261             el.setAttribute("fill", "none");
1262             el.setAttribute("stroke", "#000");
1263             if (svg.canvas) {
1264                 svg.canvas.appendChild(el);
1265             }
1266             var res = new Element(el, svg);
1267             res.attrs = res.attrs || {};
1268             res.attrs.x = x;
1269             res.attrs.y = y;
1270             res.attrs.width = w;
1271             res.attrs.height = h;
1272             res.attrs.stroke = "#000";
1273             if (r) {
1274                 res.attrs.rx = res.attrs.ry = r;
1275             }
1276             res.type = "rect";
1277             return res;
1278         };
1279         var theEllipse = function (svg, x, y, rx, ry) {
1280             var el = doc.createElementNS(svg.svgns, "ellipse");
1281             el.setAttribute("cx", x);
1282             el.setAttribute("cy", y);
1283             el.setAttribute("rx", rx);
1284             el.setAttribute("ry", ry);
1285             el.setAttribute("fill", "none");
1286             el.setAttribute("stroke", "#000");
1287             if (svg.canvas) {
1288                 svg.canvas.appendChild(el);
1289             }
1290             var res = new Element(el, svg);
1291             res.attrs = res.attrs || {};
1292             res.attrs.cx = x;
1293             res.attrs.cy = y;
1294             res.attrs.rx = rx;
1295             res.attrs.ry = ry;
1296             res.attrs.stroke = "#000";
1297             res.type = "ellipse";
1298             return res;
1299         };
1300         var theImage = function (svg, src, x, y, w, h) {
1301             var el = doc.createElementNS(svg.svgns, "image");
1302             el.setAttribute("x", x);
1303             el.setAttribute("y", y);
1304             el.setAttribute("width", w);
1305             el.setAttribute("height", h);
1306             el.setAttribute("preserveAspectRatio", "none");
1307             el.setAttributeNS(svg.xlink, "href", src);
1308             if (svg.canvas) {
1309                 svg.canvas.appendChild(el);
1310             }
1311             var res = new Element(el, svg);
1312             res.attrs = res.attrs || {};
1313             res.attrs.src = src;
1314             res.attrs.x = x;
1315             res.attrs.y = y;
1316             res.attrs.width = w;
1317             res.attrs.height = h;
1318             res.type = "image";
1319             return res;
1320         };
1321         var theText = function (svg, x, y, text) {
1322             var el = doc.createElementNS(svg.svgns, "text");
1323             el.setAttribute("x", x);
1324             el.setAttribute("y", y);
1325             el.setAttribute("text-anchor", "middle");
1326             if (svg.canvas) {
1327                 svg.canvas.appendChild(el);
1328             }
1329             var res = new Element(el, svg);
1330             res.attrs = res.attrs || {};
1331             res.attrs.text = text;
1332             res.attrs.x = x;
1333             res.attrs.y = y;
1334             res.type = "text";
1335             setFillAndStroke(res, {font: availableAttrs.font, stroke: "none", fill: "#000", text: text});
1336             return res;
1337         };
1338         var setSize = function (width, height) {
1339             this.width = width || this.width;
1340             this.height = height || this.height;
1341             this.canvas.setAttribute("width", this.width);
1342             this.canvas.setAttribute("height", this.height);
1343             return this;
1344         };
1345         var create = function () {
1346             var con = getContainer.apply(null, arguments),
1347                 container = con.container,
1348                 x = con.x,
1349                 y = con.y,
1350                 width = con.width,
1351                 height = con.height;
1352             if (!container) {
1353                 throw new Error("SVG container not found.");
1354             }
1355             paper.canvas = doc.createElementNS(paper.svgns, "svg");
1356             paper.canvas.setAttribute("width", width || 512);
1357             paper.width = width || 512;
1358             paper.canvas.setAttribute("height", height || 342);
1359             paper.height = height || 342;
1360             if (container == 1) {
1361                 doc.body.appendChild(paper.canvas);
1362                 paper.canvas.style.position = "absolute";
1363                 paper.canvas.style.left = x + "px";
1364                 paper.canvas.style.top = y + "px";
1365             } else {
1366                 if (container.firstChild) {
1367                     container.insertBefore(paper.canvas, container.firstChild);
1368                 } else {
1369                     container.appendChild(paper.canvas);
1370                 }
1371             }
1372             container = {
1373                 canvas: paper.canvas,
1374                 clear: function () {
1375                     while (this.canvas.firstChild) {
1376                         this.canvas.removeChild(this.canvas.firstChild);
1377                     }
1378                     this.defs = doc.createElementNS(paper.svgns, "defs");
1379                     this.canvas.appendChild(this.defs);
1380                 }
1381             };
1382             for (var prop in paper) {
1383                 if (prop != "create") {
1384                     container[prop] = paper[prop];
1385                 }
1386             }
1387             plugins.call(container, container, R.fn);
1388             container.clear();
1389             container.raphael = R;
1390             return container;
1391         };
1392         paper.remove = function () {
1393             this.canvas.parentNode && this.canvas.parentNode.removeChild(this.canvas);
1394         };
1395         paper.svgns = "http://www.w3.org/2000/svg";
1396         paper.xlink = "http://www.w3.org/1999/xlink";
1397         paper.safari = function () {
1398             if ({"Apple Computer, Inc.": 1, "Google Inc.": 1}[navigator.vendor]) {
1399                 var rect = this.rect(-this.width, -this.height, this.width * 3, this.height * 3).attr({stroke: "none"});
1400                 setTimeout(function () {rect.remove();});
1401             }
1402         };
1403     }
1404
1405     // VML
1406     if (R.vml) {
1407         var path2vml = function (path) {
1408             var pa = path2curve(path);
1409             for (var i = 0, ii = pa.length; i < ii; i++) {
1410                 for (var j = 0, jj = pa[i].length; j < jj; j++) {
1411                     pa[i][j] = isNaN(pa[i][j]) ? pa[i][j] : Math.round(pa[i][j]);
1412                 }
1413             }
1414             return (pa + "").toLowerCase().replace(/z/g, "x");
1415         };
1416         R.toString = function () {
1417             return  "Your browser doesn\u2019t support SVG. Assuming it is Internet Explorer and falling down to VML.\nYou are running Rapha\u00ebl " + this.version;
1418         };
1419         var thePath = function (pathString, VML) {
1420             var g = createNode("group"), gl = g.style;
1421             gl.position = "absolute";
1422             gl.left = 0;
1423             gl.top = 0;
1424             gl.width = VML.width + "px";
1425             gl.height = VML.height + "px";
1426             g.coordsize = VML.coordsize;
1427             g.coordorigin = VML.coordorigin;
1428             var el = createNode("shape"), ol = el.style;
1429             ol.width = VML.width + "px";
1430             ol.height = VML.height + "px";
1431             el.path = "";
1432             el.coordsize = this.coordsize;
1433             el.coordorigin = this.coordorigin;
1434             g.appendChild(el);
1435             var p = new Element(el, g, VML);
1436             p.isAbsolute = true;
1437             p.type = "path";
1438             p.path = [];
1439             // p.last = {x: 0, y: 0, bx: 0, by: 0, isAbsolute: true};
1440             p.Path = "";
1441             if (pathString) {
1442                 p.attrs.path = R.parsePathString(pathString);
1443                 p.node.path = path2vml(p.attrs.path);
1444             }
1445             setFillAndStroke(p, {fill: "none", stroke: "#000"});
1446             p.setBox();
1447             VML.canvas.appendChild(g);
1448             return p;
1449         };
1450         var setFillAndStroke = function (o, params) {
1451             var node = o.node,
1452                 s = node.style,
1453                 xy,
1454                 res = o;
1455             o.attrs = o.attrs || {};
1456             for (var par in params) {
1457                 o.attrs[par] = params[par];
1458             }
1459             params.href && (node.href = params.href);
1460             params.title && (node.title = params.title);
1461             params.target && (node.target = params.target);
1462             if (params.path && o.type == "path") {
1463                 o.node.path = path2vml(params.path);
1464             }
1465             if (params.rotation != null) {
1466                 o.rotate(params.rotation, true);
1467             }
1468             if (params.translation) {
1469                 xy = (params.translation + "").split(separator);
1470                 o.translate(xy[0], xy[1]);
1471             }
1472             if (params.scale) {
1473                 xy = (params.scale + "").split(separator);
1474                 o.scale(+xy[0] || 1, +xy[1] || +xy[0] || 1, +xy[2] || null, +xy[3] || null);
1475             }
1476             if (o.type == "image" && params.src) {
1477                 node.src = params.src;
1478             }
1479             if (o.type == "image" && params.opacity) {
1480                 node.filterOpacity = " progid:DXImageTransform.Microsoft.Alpha(opacity=" + (params.opacity * 100) + ")";
1481                 node.style.filter = (node.filterMatrix || "") + (node.filterOpacity || "");
1482             }
1483             params.font && (s.font = params.font);
1484             params["font-family"] && (s.fontFamily = '"' + params["font-family"].split(",")[0].replace(/^['"]+|['"]+$/g, "") + '"');
1485             params["font-size"] && (s.fontSize = params["font-size"]);
1486             params["font-weight"] && (s.fontWeight = params["font-weight"]);
1487             params["font-style"] && (s.fontStyle = params["font-style"]);
1488             if (typeof params.opacity != "undefined" || typeof params["stroke-width"] != "undefined" || typeof params.fill != "undefined" || typeof params.stroke != "undefined" || params["stroke-width"] || params["stroke-opacity"] || params["fill-opacity"] || params["stroke-dasharray"] || params["stroke-miterlimit"] || params["stroke-linejoin"] || params["stroke-linecap"]) {
1489                 o = o.shape || node;
1490                 var fill = (o.getElementsByTagName("fill") && o.getElementsByTagName("fill")[0]) || createNode("fill");
1491                 if ("fill-opacity" in params || "opacity" in params) {
1492                     var opacity = ((+params["fill-opacity"] + 1 || 2) - 1) * ((+params.opacity + 1 || 2) - 1);
1493                     opacity < 0 && (opacity = 0);
1494                     opacity > 1 && (opacity = 1);
1495                     fill.opacity = opacity;
1496                 }
1497                 params.fill && (fill.on = true);
1498                 if (typeof fill.on == "undefined" || params.fill == "none") {
1499                     fill.on = false;
1500                 }
1501                 if (fill.on && params.fill) {
1502                     var isURL = params.fill.match(/^url\(([^\)]+)\)$/i);
1503                     if (isURL) {
1504                         fill.src = isURL[1];
1505                         fill.type = "tile";
1506                     } else {
1507                         fill.color = R.getRGB(params.fill).hex;
1508                         fill.src = "";
1509                         fill.type = "solid";
1510                     }
1511                 }
1512                 o.appendChild(fill);
1513                 var stroke = (o.getElementsByTagName("stroke") && o.getElementsByTagName("stroke")[0]) || createNode("stroke");
1514                 if ((params.stroke && params.stroke != "none") || params["stroke-width"] || typeof params["stroke-opacity"] != "undefined" || params["stroke-dasharray"] || params["stroke-miterlimit"] || params["stroke-linejoin"] || params["stroke-linecap"]) {
1515                     stroke.on = true;
1516                 }
1517                 if (params.stroke == "none" || typeof stroke.on == "undefined" || params.stroke == 0) {
1518                     stroke.on = false;
1519                 }
1520                 if (stroke.on && params.stroke) {
1521                     stroke.color = R.getRGB(params.stroke).hex;
1522                 }
1523                 var opacity = ((+params["stroke-opacity"] + 1 || 2) - 1) * ((+params.opacity + 1 || 2) - 1);
1524                 opacity < 0 && (opacity = 0);
1525                 opacity > 1 && (opacity = 1);
1526                 stroke.opacity = opacity;
1527                 params["stroke-linejoin"] && (stroke.joinstyle = params["stroke-linejoin"] || "miter");
1528                 stroke.miterlimit = params["stroke-miterlimit"] || 8;
1529                 params["stroke-linecap"] && (stroke.endcap = {butt: "flat", square: "square", round: "round"}[params["stroke-linecap"]] || "miter");
1530                 params["stroke-width"] && (stroke.weight = (parseFloat(params["stroke-width"]) || 1) * 12 / 16);
1531                 if (params["stroke-dasharray"]) {
1532                     var dasharray = {
1533                         "-": "shortdash",
1534                         ".": "shortdot",
1535                         "-.": "shortdashdot",
1536                         "-..": "shortdashdotdot",
1537                         ". ": "dot",
1538                         "- ": "dash",
1539                         "--": "longdash",
1540                         "- .": "dashdot",
1541                         "--.": "longdashdot",
1542                         "--..": "longdashdotdot"
1543                     };
1544                     stroke.dashstyle = dasharray[params["stroke-dasharray"]] || "";
1545                 }
1546                 o.appendChild(stroke);
1547             }
1548             if (res.type == "text") {
1549                 var s = paper.span.style,
1550                     a = res.attrs;
1551                 a.font && (s.font = a.font);
1552                 a["font-family"] && (s.fontFamily = a["font-family"]);
1553                 a["font-size"] && (s.fontSize = a["font-size"]);
1554                 a["font-weight"] && (s.fontWeight = a["font-weight"]);
1555                 a["font-style"] && (s.fontStyle = a["font-style"]);
1556                 paper.span.innerHTML = "";
1557                 paper.span.appendChild(doc.createTextNode(res.node.string));
1558                 res.W = a.w = paper.span.offsetWidth;
1559                 res.H = a.h = paper.span.offsetHeight;
1560                 res.X = a.x;
1561                 res.Y = a.y + Math.round(res.H / 2);
1562
1563                 // text-anchor emulation
1564                 switch (a["text-anchor"]) {
1565                     case "start":
1566                         res.node.style["v-text-align"] = "left";
1567                         res.bbx = Math.round(res.W / 2);
1568                     break;
1569                     case "end":
1570                         res.node.style["v-text-align"] = "right";
1571                         res.bbx = -Math.round(res.W / 2);
1572                     break;
1573                     default:
1574                         res.node.style["v-text-align"] = "center";
1575                     break;
1576                 }
1577             }
1578         };
1579         var getAngle = function (a, b, c, d) {
1580             var angle = Math.round(Math.atan((parseFloat(c) - parseFloat(a)) / (parseFloat(d) - parseFloat(b))) * 57.29) || 0;
1581             if (!angle && parseFloat(a) < parseFloat(b)) {
1582                 angle = 180;
1583             }
1584             angle -= 180;
1585             if (angle < 0) {
1586                 angle += 360;
1587             }
1588             return angle;
1589         };
1590         var addGradientFill = function (o, gradient) {
1591             gradient = toGradient(gradient);
1592             o.attrs = o.attrs || {};
1593             var attrs = o.attrs,
1594                 fill = o.node.getElementsByTagName("fill");
1595             o.attrs.gradient = gradient;
1596             o = o.shape || o.node;
1597             if (fill.length) {
1598                 fill = fill[0];
1599             } else {
1600                 fill = createNode("fill");
1601             }
1602             if (gradient.dots.length) {
1603                 fill.on = true;
1604                 fill.method = "none";
1605                 fill.type = ((gradient.type + "").toLowerCase() == "radial") ? "gradientTitle" : "gradient";
1606                 if (typeof gradient.dots[0].color != "undefined") {
1607                     fill.color = R.getRGB(gradient.dots[0].color).hex;
1608                 }
1609                 if (typeof gradient.dots[gradient.dots.length - 1].color != "undefined") {
1610                     fill.color2 = R.getRGB(gradient.dots[gradient.dots.length - 1].color).hex;
1611                 }
1612                 var clrs = [];
1613                 for (var i = 0, ii = gradient.dots.length; i < ii; i++) {
1614                     if (gradient.dots[i].offset) {
1615                         clrs.push(gradient.dots[i].offset + " " + R.getRGB(gradient.dots[i].color).hex);
1616                     }
1617                 };
1618                 var fillOpacity = typeof gradient.dots[gradient.dots.length - 1].opacity == "undefined" ? (typeof attrs.opacity == "undefined" ? 1 : attrs.opacity) : gradient.dots[gradient.dots.length - 1].opacity;
1619                 if (clrs.length) {
1620                     fill.colors.value = clrs.join(",");
1621                     fillOpacity = typeof attrs.opacity == "undefined" ? 1 : attrs.opacity;
1622                 } else {
1623                     fill.colors && (fill.colors.value = "0% " + fill.color);
1624                 }
1625                 fill.opacity = fillOpacity;
1626                 if (typeof gradient.angle != "undefined") {
1627                     fill.angle = (-gradient.angle + 270) % 360;
1628                 } else if (gradient.vector) {
1629                     fill.angle = getAngle.apply(null, gradient.vector);
1630                 }
1631                 if ((gradient.type + "").toLowerCase() == "radial") {
1632                     fill.focus = "100%";
1633                     fill.focusposition = "0.5 0.5";
1634                 }
1635             }
1636         };
1637         var Element = function (node, group, vml) {
1638             var Rotation = 0,
1639                 RotX = 0,
1640                 RotY = 0,
1641                 Scale = 1;
1642             this[0] = node;
1643             this.node = node;
1644             this.X = 0;
1645             this.Y = 0;
1646             this.attrs = {};
1647             this.Group = group;
1648             this.paper = vml;
1649             this._ = {
1650                 tx: 0,
1651                 ty: 0,
1652                 rt: {deg:0},
1653                 sx: 1,
1654                 sy: 1
1655             };
1656         };
1657         Element.prototype.rotate = function (deg, cx, cy) {
1658             if (deg == null) {
1659                 if (this._.rt.cx) {
1660                     return [this._.rt.deg, this._.rt.cx, this._.rt.cy].join(" ");
1661                 }
1662                 return this._.rt.deg;
1663             }
1664             deg = (deg + "").split(separator);
1665             if (deg.length - 1) {
1666                 cx = parseFloat(deg[1]);
1667                 cy = parseFloat(deg[2]);
1668             }
1669             deg = parseFloat(deg[0]);
1670             if (cx != null) {
1671                 this._.rt.deg = deg;
1672             } else {
1673                 this._.rt.deg += deg;
1674             }
1675             (cy == null) && (cx = null);
1676             this._.rt.cx = cx;
1677             this._.rt.cy = cy;
1678             this.setBox(this.attrs, cx, cy);
1679             this.Group.style.rotation = this._.rt.deg;
1680             // gradient fix for rotation. TODO
1681             // var fill = (this.shape || this.node).getElementsByTagName("fill");
1682             // fill = fill[0] || {};
1683             // var b = ((360 - this._.rt.deg) - 270) % 360;
1684             // typeof fill.angle != "undefined" && (fill.angle = b);
1685             return this;
1686         };
1687         Element.prototype.setBox = function (params, cx, cy) {
1688             var gs = this.Group.style,
1689                 os = (this.shape && this.shape.style) || this.node.style;
1690             params = params || {};
1691             for (var i in params) {
1692                 this.attrs[i] = params[i];
1693             }
1694             cx = cx || this._.rt.cx;
1695             cy = cy || this._.rt.cy;
1696             var attr = this.attrs,
1697                 x,
1698                 y,
1699                 w,
1700                 h;
1701             switch (this.type) {
1702                 case "circle":
1703                     x = attr.cx - attr.r;
1704                     y = attr.cy - attr.r;
1705                     w = h = attr.r * 2;
1706                     break;
1707                 case "ellipse":
1708                     x = attr.cx - attr.rx;
1709                     y = attr.cy - attr.ry;
1710                     w = attr.rx * 2;
1711                     h = attr.ry * 2;
1712                     break;
1713                 case "rect":
1714                 case "image":
1715                     x = attr.x;
1716                     y = attr.y;
1717                     w = attr.width || 0;
1718                     h = attr.height || 0;
1719                     break;
1720                 case "text":
1721                     this.textpath.v = ["m", Math.round(attr.x), ", ", Math.round(attr.y - 2), "l", Math.round(attr.x) + 1, ", ", Math.round(attr.y - 2)].join("");
1722                     x = attr.x - Math.round(this.W / 2);
1723                     y = attr.y - this.H / 2;
1724                     w = this.W;
1725                     h = this.H;
1726                     break;
1727                 case "path":
1728                     if (!this.attrs.path) {
1729                         x = 0;
1730                         y = 0;
1731                         w = this.paper.width;
1732                         h = this.paper.height;
1733                     } else {
1734                         var dim = pathDimensions(this.attrs.path),
1735                         x = dim.x;
1736                         y = dim.y;
1737                         w = dim.width;
1738                         h = dim.height;
1739                     }
1740                     break;
1741                 default:
1742                     x = 0;
1743                     y = 0;
1744                     w = this.paper.width;
1745                     h = this.paper.height;
1746                     break;
1747             }
1748             cx = (cx == null) ? x + w / 2 : cx;
1749             cy = (cy == null) ? y + h / 2 : cy;
1750             var left = cx - this.paper.width / 2,
1751                 top = cy - this.paper.height / 2;
1752             if (this.type == "path" || this.type == "text") {
1753                 (gs.left != left + "px") && (gs.left = left + "px");
1754                 (gs.top != top + "px") && (gs.top = top + "px");
1755                 this.X = this.type == "text" ? x : -left;
1756                 this.Y = this.type == "text" ? y : -top;
1757                 this.W = w;
1758                 this.H = h;
1759                 (os.left != -left + "px") && (os.left = -left + "px");
1760                 (os.top != -top + "px") && (os.top = -top + "px");
1761             } else {
1762                 (gs.left != left + "px") && (gs.left = left + "px");
1763                 (gs.top != top + "px") && (gs.top = top + "px");
1764                 this.X = x;
1765                 this.Y = y;
1766                 this.W = w;
1767                 this.H = h;
1768                 (gs.width != this.paper.width + "px") && (gs.width = this.paper.width + "px");
1769                 (gs.height != this.paper.height + "px") && (gs.height = this.paper.height + "px");
1770                 (os.left != x - left + "px") && (os.left = x - left + "px");
1771                 (os.top != y - top + "px") && (os.top = y - top + "px");
1772                 (os.width != w + "px") && (os.width = w + "px");
1773                 (os.height != h + "px") && (os.height = h + "px");
1774                 var arcsize = (+params.r || 0) / (Math.min(w, h));
1775                 if (this.type == "rect" && this.arcsize != arcsize && (arcsize || this.arcsize)) {
1776                     // We should replace element with the new one
1777                     var o = createNode(arcsize ? "roundrect" : "rect");
1778                     o.arcsize = arcsize;
1779                     this.Group.appendChild(o);
1780                     this.node.parentNode.removeChild(this.node);
1781                     this.node = o;
1782                     this.arcsize = arcsize;
1783                     setFillAndStroke(this, this.attrs);
1784                     this.setBox(this.attrs);
1785                 }
1786             }
1787         };
1788         Element.prototype.hide = function () {
1789             this.Group.style.display = "none";
1790             return this;
1791         };
1792         Element.prototype.show = function () {
1793             this.Group.style.display = "block";
1794             return this;
1795         };
1796         Element.prototype.getBBox = function () {
1797             if (this.type == "path") {
1798                 return pathDimensions(this.attrs.path);
1799             }
1800             return {
1801                 x: this.X + (this.bbx || 0),
1802                 y: this.Y,
1803                 width: this.W,
1804                 height: this.H
1805             };
1806         };
1807         Element.prototype.remove = function () {
1808             this[0].parentNode.removeChild(this[0]);
1809             this.Group.parentNode.removeChild(this.Group);
1810             this.shape && this.shape.parentNode.removeChild(this.shape);
1811         };
1812         Element.prototype.attr = function () {
1813             if (arguments.length == 1 && typeof arguments[0] == "string") {
1814                 if (arguments[0] == "translation") {
1815                     return this.translate();
1816                 }
1817                 if (arguments[0] == "rotation") {
1818                     return this.rotate();
1819                 }
1820                 if (arguments[0] == "scale") {
1821                     return this.scale();
1822                 }
1823                 return this.attrs[arguments[0]];
1824             }
1825             if (this.attrs && arguments.length == 1 && R.isArray(arguments[0])) {
1826                 var values = {};
1827                 for (var i = 0, ii = arguments[0].length; i < ii; i++) {
1828                     values[arguments[0][i]] = this.attrs[arguments[0][i]];
1829                 };
1830                 return values;
1831             }
1832             var params;
1833             if (arguments.length == 2) {
1834                 params = {};
1835                 params[arguments[0]] = arguments[1];
1836             }
1837             if (arguments.length == 1 && typeof arguments[0] == "object") {
1838                 params = arguments[0];
1839             }
1840             if (params) {
1841                 if (params.gradient) {
1842                     addGradientFill(this, params.gradient);
1843                 }
1844                 if (params.text && this.type == "text") {
1845                     this.node.string = params.text;
1846                 }
1847                 setFillAndStroke(this, params);
1848                 this.setBox(this.attrs);
1849             }
1850             return this;
1851         };
1852         Element.prototype.toFront = function () {
1853             this.Group.parentNode.appendChild(this.Group);
1854             return this;
1855         };
1856         Element.prototype.toBack = function () {
1857             if (this.Group.parentNode.firstChild != this.Group) {
1858                 this.Group.parentNode.insertBefore(this.Group, this.Group.parentNode.firstChild);
1859             }
1860             return this;
1861         };
1862         Element.prototype.insertAfter = function (element) {
1863             if (element.Group.nextSibling) {
1864                 element.Group.parentNode.insertBefore(this.Group, element.Group.nextSibling);
1865             } else {
1866                 element.Group.parentNode.appendChild(this.Group);
1867             }
1868             return this;
1869         };
1870         Element.prototype.insertBefore = function (element) {
1871             element.Group.parentNode.insertBefore(this.Group, element.Group);
1872             return this;
1873         };
1874         var theCircle = function (vml, x, y, r) {
1875             var g = createNode("group"),
1876                 gl = g.style,
1877                 o = createNode("oval"),
1878                 ol = o.style;
1879             gl.position = "absolute";
1880             gl.left = 0;
1881             gl.top = 0;
1882             gl.width = vml.width + "px";
1883             gl.height = vml.height + "px";
1884             g.coordsize = vml.coordsize;
1885             g.coordorigin = vml.coordorigin;
1886             g.appendChild(o);
1887             var res = new Element(o, g, vml);
1888             res.type = "circle";
1889             setFillAndStroke(res, {stroke: "#000", fill: "none"});
1890             res.attrs.cx = x;
1891             res.attrs.cy = y;
1892             res.attrs.r = r;
1893             res.setBox({x: x - r, y: y - r, width: r * 2, height: r * 2});
1894             vml.canvas.appendChild(g);
1895             return res;
1896         };
1897         var theRect = function (vml, x, y, w, h, r) {
1898             var g = createNode("group"),
1899                 gl = g.style,
1900                 o = createNode(r ? "roundrect" : "rect"),
1901                 arcsize = (+r || 0) / (Math.min(w, h));
1902             o.arcsize = arcsize;
1903             gl.position = "absolute";
1904             gl.left = 0;
1905             gl.top = 0;
1906             gl.width = vml.width + "px";
1907             gl.height = vml.height + "px";
1908             g.coordsize = vml.coordsize;
1909             g.coordorigin = vml.coordorigin;
1910             g.appendChild(o);
1911             var res = new Element(o, g, vml);
1912             res.type = "rect";
1913             setFillAndStroke(res, {stroke: "#000"});
1914             res.arcsize = arcsize;
1915             res.setBox({x: x, y: y, width: w, height: h, r: +r});
1916             vml.canvas.appendChild(g);
1917             return res;
1918         };
1919         var theEllipse = function (vml, x, y, rx, ry) {
1920             var g = createNode("group"),
1921                 gl = g.style,
1922                 o = createNode("oval"),
1923                 ol = o.style;
1924             gl.position = "absolute";
1925             gl.left = 0;
1926             gl.top = 0;
1927             gl.width = vml.width + "px";
1928             gl.height = vml.height + "px";
1929             g.coordsize = vml.coordsize;
1930             g.coordorigin = vml.coordorigin;
1931             g.appendChild(o);
1932             var res = new Element(o, g, vml);
1933             res.type = "ellipse";
1934             setFillAndStroke(res, {stroke: "#000"});
1935             res.attrs.cx = x;
1936             res.attrs.cy = y;
1937             res.attrs.rx = rx;
1938             res.attrs.ry = ry;
1939             res.setBox({x: x - rx, y: y - ry, width: rx * 2, height: ry * 2});
1940             vml.canvas.appendChild(g);
1941             return res;
1942         };
1943         var theImage = function (vml, src, x, y, w, h) {
1944             var g = createNode("group"),
1945                 gl = g.style,
1946                 o = createNode("image"),
1947                 ol = o.style;
1948             gl.position = "absolute";
1949             gl.left = 0;
1950             gl.top = 0;
1951             gl.width = vml.width + "px";
1952             gl.height = vml.height + "px";
1953             g.coordsize = vml.coordsize;
1954             g.coordorigin = vml.coordorigin;
1955             o.src = src;
1956             g.appendChild(o);
1957             var res = new Element(o, g, vml);
1958             res.type = "image";
1959             res.attrs.src = src;
1960             res.attrs.x = x;
1961             res.attrs.y = y;
1962             res.attrs.w = w;
1963             res.attrs.h = h;
1964             res.setBox({x: x, y: y, width: w, height: h});
1965             vml.canvas.appendChild(g);
1966             return res;
1967         };
1968         var theText = function (vml, x, y, text) {
1969             var g = createNode("group"),
1970                 gs = g.style,
1971                 el = createNode("shape"),
1972                 ol = el.style,
1973                 path = createNode("path"),
1974                 ps = path.style,
1975                 o = createNode("textpath");
1976             gs.position = "absolute";
1977             gs.left = 0;
1978             gs.top = 0;
1979             gs.width = vml.width + "px";
1980             gs.height = vml.height + "px";
1981             g.coordsize = vml.coordsize;
1982             g.coordorigin = vml.coordorigin;
1983             path.v = ["m", Math.round(x), ", ", Math.round(y), "l", Math.round(x) + 1, ", ", Math.round(y)].join("");
1984             path.textpathok = true;
1985             ol.width = vml.width;
1986             ol.height = vml.height;
1987             gs.position = "absolute";
1988             gs.left = 0;
1989             gs.top = 0;
1990             gs.width = vml.width;
1991             gs.height = vml.height;
1992             o.string = text;
1993             o.on = true;
1994             el.appendChild(o);
1995             el.appendChild(path);
1996             g.appendChild(el);
1997             var res = new Element(o, g, vml);
1998             res.shape = el;
1999             res.textpath = path;
2000             res.type = "text";
2001             res.attrs.text = text;
2002             res.attrs.x = x;
2003             res.attrs.y = y;
2004             res.attrs.w = 1;
2005             res.attrs.h = 1;
2006             setFillAndStroke(res, {font: availableAttrs.font, stroke: "none", fill: "#000"});
2007             res.setBox();
2008             vml.canvas.appendChild(g);
2009             return res;
2010         };
2011         var setSize = function (width, height) {
2012             var cs = this.canvas.style;
2013             this.width = width || this.width;
2014             this.height = height || this.height;
2015             cs.width = this.width + "px";
2016             cs.height = this.height + "px";
2017             cs.clip = "rect(0 " + this.width + "px " + this.height + "px 0)";
2018             this.canvas.coordsize = this.width + " " + this.height;
2019             return this;
2020         };
2021         doc.createStyleSheet().addRule(".rvml", "behavior:url(#default#VML)");
2022         try {
2023             if (!doc.namespaces.rvml) {
2024                 doc.namespaces.add("rvml", "urn:schemas-microsoft-com:vml");
2025             }
2026             var createNode = function (tagName) {
2027                 return doc.createElement('<rvml:' + tagName + ' class="rvml">');
2028             };
2029         } catch (e) {
2030             var createNode = function (tagName) {
2031                 return doc.createElement('<' + tagName + ' xmlns="urn:schemas-microsoft.com:vml" class="rvml">');
2032             };
2033         }
2034         var create = function () {
2035             var con = getContainer.apply(null, arguments),
2036                 container = con.container,
2037                 x = con.x,
2038                 y = con.y,
2039                 width = con.width,
2040                 s,
2041                 height = con.height;
2042             if (!container) {
2043                 throw new Error("VML container not found.");
2044             }
2045             var c = paper.canvas = doc.createElement("div"),
2046                 cs = c.style;
2047             width = parseFloat(width) || "512px";
2048             height = parseFloat(height) || "342px";
2049             paper.width = width;
2050             paper.height = height;
2051             paper.coordsize = width + " " + height;
2052             paper.coordorigin = "0 0";
2053             paper.span = doc.createElement("span");
2054             s = paper.span.style;
2055             c.appendChild(paper.span);
2056             s.position = "absolute";
2057             s.left = "-99999px";
2058             s.top = "-99999px";
2059             s.padding = 0;
2060             s.margin = 0;
2061             s.lineHeight = 1;
2062             s.display = "inline";
2063             cs.width  = width + "px";
2064             cs.height = height + "px";
2065             cs.position = "absolute";
2066             cs.clip = "rect(0 " + width + "px " + height + "px 0)";
2067             if (container == 1) {
2068                 doc.body.appendChild(c);
2069                 cs.left = x + "px";
2070                 cs.top = y + "px";
2071                 container = {
2072                     style: {
2073                         width: width,
2074                         height: height
2075                     }
2076                 };
2077             } else {
2078                 container.style.width = width;
2079                 container.style.height = height;
2080                 if (container.firstChild) {
2081                     container.insertBefore(c, container.firstChild);
2082                 } else {
2083                     container.appendChild(c);
2084                 }
2085             }
2086             for (var prop in paper) {
2087                 container[prop] = paper[prop];
2088             }
2089             plugins.call(container, container, R.fn);
2090             container.clear = function () {
2091                 while (c.firstChild) {
2092                     c.removeChild(c.firstChild);
2093                 }
2094             };
2095             container.raphael = R;
2096             return container;
2097         };
2098         paper.remove = function () {
2099             this.canvas.parentNode.removeChild(this.canvas);
2100         };
2101         paper.safari = function () {};
2102     }
2103
2104     // rest
2105
2106     // Events
2107     var addEvent = (function () {
2108         if (doc.addEventListener) {
2109             return function (obj, type, fn, element) {
2110                 var f = function (e) {
2111                     return fn.call(element, e);
2112                 };
2113                 obj.addEventListener(type, f, false);
2114                 return function () {
2115                     obj.removeEventListener(type, f, false);
2116                     return true;
2117                 };
2118             };
2119         } else if (doc.attachEvent) {
2120             return function (obj, type, fn, element) {
2121                 var f = function (e) {
2122                     return fn.call(element, e || win.event);
2123                 };
2124                 obj.attachEvent("on" + type, f);
2125                 var detacher = function () {
2126                     obj.detachEvent("on" + type, f);
2127                     return true;
2128                 };
2129                 if (type == "mouseover") {
2130                     obj.attachEvent("onmouseenter", f);
2131                     return function () {
2132                         obj.detachEvent("onmouseenter", f);
2133                         return detacher();
2134                     };
2135                 } else if (type == "mouseout") {
2136                     obj.attachEvent("onmouseleave", f);
2137                     return function () {
2138                         obj.detachEvent("onmouseleave", f);
2139                         return detacher();
2140                     };
2141                 }
2142                 return detacher;
2143             };
2144         }
2145     })();
2146     for (var i = events.length; i--;) {
2147         (function (eventName) {
2148             Element.prototype[eventName] = function (fn) {
2149                 if (typeof fn == "function") {
2150                     this.events = this.events || {};
2151                     this.events[eventName] = this.events[eventName] || {};
2152                     this.events[eventName][fn] = this.events[eventName][fn] || [];
2153                     this.events[eventName][fn].push(addEvent(this.shape || this.node, eventName, fn, this));
2154                 }
2155                 return this;
2156             };
2157             Element.prototype["un" + eventName] = function (fn) {
2158                 this.events &&
2159                 this.events[eventName] &&
2160                 this.events[eventName][fn] &&
2161                 this.events[eventName][fn].length &&
2162                 this.events[eventName][fn].shift()() &&
2163                 !this.events[eventName][fn].length &&
2164                 delete this.events[eventName][fn];
2165             };
2166
2167         })(events[i]);
2168     }
2169     paper.circle = function (x, y, r) {
2170         return theCircle(this, x, y, r);
2171     };
2172     paper.rect = function (x, y, w, h, r) {
2173         return theRect(this, x, y, w, h, r);
2174     };
2175     paper.ellipse = function (x, y, rx, ry) {
2176         return theEllipse(this, x, y, rx, ry);
2177     };
2178     paper.path = function (pathString) {
2179         return thePath(pathString, this);
2180     };
2181     paper.image = function (src, x, y, w, h) {
2182         return theImage(this, src, x, y, w, h);
2183     };
2184     paper.text = function (x, y, text) {
2185         return theText(this, x, y, text);
2186     };
2187     paper.drawGrid = function (x, y, w, h, wv, hv, color) {
2188         color = color || "#000";
2189         var path = ["M", x, y, "L", x + w, y, x + w, y + h, x, y + h, x, y],
2190             rowHeight = h / hv,
2191             columnWidth = w / wv;
2192         for (var i = 1; i < hv; i++) {
2193             path = path.concat(["M", x, y + i * rowHeight, "L", x + w, y + i * rowHeight]);
2194         }
2195         for (var i = 1; i < wv; i++) {
2196             path = path.concat(["M", x + i * columnWidth, y, "L", x + i * columnWidth, y + h]);
2197         }
2198         return this.path({stroke: color, "stroke-width": 1}, path.join(","));
2199     };
2200     paper.set = function (itemsArray) {
2201         return new Set(itemsArray);
2202     };
2203     paper.setSize = setSize;
2204     Element.prototype.stop = function () {
2205         clearTimeout(this.animation_in_progress);
2206         return this;
2207     };
2208     Element.prototype.scale = function (x, y, cx, cy) {
2209         if (x == null && y == null) {
2210             return {x: this._.sx, y: this._.sy, toString: function () { return +this.x.toFixed(3) + " " + (+this.y.toFixed(3)); }};
2211         }
2212         y = y || x;
2213         !+y && (y = x);
2214         var dx,
2215             dy,
2216             dcx,
2217             dcy,
2218             a = this.attrs;
2219         if (x != 0) {
2220             var bb = this.type == "path" ? pathDimensions(a.path) : this.getBBox(),
2221                 rcx = bb.x + bb.width / 2,
2222                 rcy = bb.y + bb.height / 2,
2223                 kx = x / this._.sx,
2224                 ky = y / this._.sy;
2225             cx = (+cx || cx == 0) ? cx : rcx;
2226             cy = (+cy || cy == 0) ? cy : rcy;
2227             var dirx = Math.round(x / Math.abs(x)),
2228                 diry = Math.round(y / Math.abs(y)),
2229                 s = this.node.style,
2230                 ncx = cx + (rcx - cx) * dirx * kx,
2231                 ncy = cy + (rcy - cy) * diry * ky;
2232             switch (this.type) {
2233                 case "rect":
2234                 case "image":
2235                     var neww = a.width * dirx * kx,
2236                         newh = a.height * diry * ky,
2237                         newx = ncx - neww / 2,
2238                         newy = ncy - newh / 2;
2239                     this.attr({
2240                         width: neww,
2241                         height: newh,
2242                         x: newx,
2243                         y: newy
2244                     });
2245                     break;
2246                 case "circle":
2247                 case "ellipse":
2248                     this.attr({
2249                         rx: a.rx * kx,
2250                         ry: a.ry * ky,
2251                         r: a.r * kx,
2252                         cx: ncx,
2253                         cy: ncy
2254                     });
2255                     break;
2256                 case "path":
2257                     var path = pathToRelative(a.path),
2258                         skip = true;
2259                     for (var i = 0, ii = path.length; i < ii; i++) {
2260                         var p = path[i];
2261                         if (p[0].toUpperCase() == "M" && skip) {
2262                             continue;
2263                         } else {
2264                             skip = false;
2265                         }
2266                         if (R.svg && p[0].toUpperCase() == "A") {
2267                             p[path[i].length - 2] *= kx;
2268                             p[path[i].length - 1] *= ky;
2269                             p[1] *= kx;
2270                             p[2] *= ky;
2271                             p[5] = +(dirx + diry ? !!+p[5] : !+p[5]);
2272                         } else {
2273                             for (var j = 1, jj = p.length; j < jj; j++) {
2274                                 p[j] *= (j % 2) ? kx : ky;
2275                             }
2276                         }
2277                     }
2278                     var dim2 = pathDimensions(path),
2279                         dx = ncx - dim2.x - dim2.width / 2,
2280                         dy = ncy - dim2.y - dim2.height / 2;
2281                     path = pathToRelative(path);
2282                     path[0][1] += dx;
2283                     path[0][2] += dy;
2284                     
2285                     this.attr({path: path.join(" ")});
2286                 break;
2287             }
2288             if (this.type in {text: 1, image:1} && (dirx != 1 || diry != 1)) {
2289                 if (this.transformations) {
2290                     this.transformations[2] = "scale(".concat(dirx, ",", diry, ")");
2291                     this.node.setAttribute("transform", this.transformations.join(" "));
2292                     dx = (dirx == -1) ? -a.x - (neww || 0) : a.x;
2293                     dy = (diry == -1) ? -a.y - (newh || 0) : a.y;
2294                     this.attr({x: dx, y: dy});
2295                     a.fx = dirx - 1;
2296                     a.fy = diry - 1;
2297                 } else {
2298                     this.node.filterMatrix = " progid:DXImageTransform.Microsoft.Matrix(M11=".concat(dirx,
2299                         ", M12=0, M21=0, M22=", diry,
2300                         ", Dx=0, Dy=0, sizingmethod='auto expand', filtertype='bilinear')");
2301                     s.filter = (this.node.filterMatrix || "") + (this.node.filterOpacity || "");
2302                 }
2303             } else {
2304                 if (this.transformations) {
2305                     this.transformations[2] = "";
2306                     this.node.setAttribute("transform", this.transformations.join(" "));
2307                     a.fx = 0;
2308                     a.fy = 0;
2309                 } else {
2310                     this.node.filterMatrix = "";
2311                     s.filter = (this.node.filterMatrix || "") + (this.node.filterOpacity || "");
2312                 }
2313             }
2314             a.scale = [x, y, cx, cy].join(" ");
2315             this._.sx = x;
2316             this._.sy = y;
2317         }
2318         return this;
2319     };
2320
2321     R.easing_formulas = {
2322         linear: function (n) {
2323             return n;
2324         },
2325         "<": function (n) {
2326             return Math.pow(n, 3);
2327         },
2328         ">": function (n) {
2329             return Math.pow(n - 1, 3) + 1;
2330         },
2331         "<>": function (n) {
2332             n = n * 2;
2333             if (n < 1) {
2334                 return Math.pow(n, 3) / 2;
2335             }
2336             n -= 2;
2337             return (Math.pow(n, 3) + 2) / 2;
2338         },
2339         backIn: function (n) {
2340             var s = 1.70158;
2341             return Math.pow(n, 2) * ((s + 1) * n - s);
2342         },
2343         backOut: function (n) {
2344             n = n - 1;
2345             var s = 1.70158;
2346             return Math.pow(n, 2) * ((s + 1) * n + s) + 1;
2347         },
2348         elastic: function (n) {
2349             if (n == 0 || n == 1) {
2350                 return n;
2351             }
2352             var p = .3,
2353                 s = p / 4;
2354             return Math.pow(2, -10 * n) * Math.sin((n - s) * (2 * Math.PI) / p) + 1;
2355         },
2356         bounce: function (n) {
2357             var s = 7.5625,
2358                 p = 2.75,
2359                 l;
2360             if (n < (1 / p)) {
2361                 l = s * Math.pow(n, 2);
2362             } else {
2363                 if (n < (2 / p)) {
2364                     n -= (1.5 / p);
2365                     l = s * Math.pow(n, 2) + .75;
2366                 } else {
2367                     if (n < (2.5 / p)) {
2368                         n -= (2.25 / p);
2369                         l = s * Math.pow(n, 2) + .9375;
2370                     } else {
2371                         n -= (2.625 / p);
2372                         l = s * Math.pow(n, 2) + .984375;
2373                     }
2374                 }
2375             }
2376             return l;
2377         }
2378     };
2379
2380     // animation easing formulas
2381     R.easing = function(easing, n) {
2382         return R.easing_formulas[easing] ? R.easing_formulas[easing](n) : n;
2383     };
2384
2385     Element.prototype.animate = function (params, ms, easing, callback) {
2386         clearTimeout(this.animation_in_progress);
2387         if (typeof easing == "function" || !easing) {
2388             callback = easing || null;
2389             easing = "linear";
2390         }
2391         var from = {},
2392             to = {},
2393             diff = {},
2394             t = {x: 0, y: 0};
2395         for (var attr in params) {
2396             if (attr in availableAnimAttrs) {
2397                 from[attr] = this.attr(attr);
2398                 (typeof from[attr] == "undefined") && (from[attr] = availableAttrs[attr]);
2399                 to[attr] = params[attr];
2400                 switch (availableAnimAttrs[attr]) {
2401                     case "number":
2402                         diff[attr] = (to[attr] - from[attr]) / ms;
2403                         break;
2404                     case "colour":
2405                         from[attr] = R.getRGB(from[attr]);
2406                         var toColour = R.getRGB(to[attr]);
2407                         diff[attr] = {
2408                             r: (toColour.r - from[attr].r) / ms,
2409                             g: (toColour.g - from[attr].g) / ms,
2410                             b: (toColour.b - from[attr].b) / ms
2411                         };
2412                         break;
2413                     case "path":
2414                         var pathes = path2curve(from[attr], to[attr]);
2415                         from[attr] = pathes[0];
2416                         to[attr] = pathes[1];
2417                         diff[attr] = [];
2418                         for (var i = 0, ii = from[attr].length; i < ii; i++) {
2419                             diff[attr][i] = [0];
2420                             for (var j = 1, jj = from[attr][i].length; j < jj; j++) {
2421                                 diff[attr][i][j] = (to[attr][i][j] - from[attr][i][j]) / ms;
2422                             }
2423                         }
2424                         break;
2425                     case "csv":
2426                         var values = (params[attr] + "").split(separator),
2427                             from2 = (from[attr] + "").split(separator);
2428                         switch (attr) {
2429                             case "translation":
2430                                 from[attr] = [0, 0];
2431                                 diff[attr] = [values[0] / ms, values[1] / ms];
2432                             break;
2433                             case "rotation":
2434                                 from[attr] = (from2[1] == values[1] && from2[2] == values[2]) ? from2 : [0, values[1], values[2]];
2435                                 diff[attr] = [(values[0] - from[attr][0]) / ms, 0, 0];
2436                             break;
2437                             case "scale":
2438                                 params[attr] = values;
2439                                 from[attr] = (from[attr] + "").split(separator);
2440                                 diff[attr] = [(values[0] - from[attr][0]) / ms, (values[1] - from[attr][1]) / ms, 0, 0];
2441                         }
2442                         to[attr] = values;
2443                 }
2444             }
2445         }
2446         var start = +new Date,
2447             prev = 0,
2448             that = this;
2449         (function tick() {
2450             var time = new Date - start,
2451                 set = {},
2452                 now;
2453             if (time < ms) {
2454                 pos = R.easing(easing, time / ms);
2455                 for (var attr in from) {
2456                     switch (availableAnimAttrs[attr]) {
2457                         case "number":
2458                             now = +from[attr] + pos * ms * diff[attr];
2459                             break;
2460                         case "colour":
2461                             now = "rgb(" + [
2462                                 Math.round(from[attr].r + pos * ms * diff[attr].r),
2463                                 Math.round(from[attr].g + pos * ms * diff[attr].g),
2464                                 Math.round(from[attr].b + pos * ms * diff[attr].b)
2465                             ].join(",") + ")";
2466                             break;
2467                         case "path":
2468                             now = [];
2469                             for (var i = 0, ii = from[attr].length; i < ii; i++) {
2470                                 now[i] = [from[attr][i][0]];
2471                                 for (var j = 1, jj = from[attr][i].length; j < jj; j++) {
2472                                     now[i][j] = +from[attr][i][j] + pos * ms * diff[attr][i][j];
2473                                 }
2474                                 now[i] = now[i].join(" ");
2475                             }
2476                             now = now.join(" ");
2477                             break;
2478                         case "csv":
2479                             switch (attr) {
2480                                 case "translation":
2481                                     var x = diff[attr][0] * (time - prev),
2482                                         y = diff[attr][1] * (time - prev);
2483                                     t.x += x;
2484                                     t.y += y;
2485                                     now = [x, y].join(" ");
2486                                 break;
2487                                 case "rotation":
2488                                     now = +from[attr][0] + pos * ms * diff[attr][0];
2489                                     from[attr][1] && (now += "," + from[attr][1] + "," + from[attr][2]);
2490                                 break;
2491                                 case "scale":
2492                                     now = [+from[attr][0] + pos * ms * diff[attr][0], +from[attr][1] + pos * ms * diff[attr][1], (2 in params[attr] ? params[attr][2] : ""), (3 in params[attr] ? params[attr][3] : "")].join(" ");
2493                             }
2494                             break;
2495                     }
2496                     if (attr == "font-size") {
2497                         set[attr] = now + "px";
2498                     } else {
2499                         set[attr] = now;
2500                     }
2501                 }
2502                 that.attr(set);
2503                 that.animation_in_progress = setTimeout(tick);
2504                 R.svg && paper.safari();
2505             } else {
2506                 (t.x || t.y) && that.translate(-t.x, -t.y);
2507                 that.attr(params);
2508                 clearTimeout(that.animation_in_progress);
2509                 R.svg && paper.safari();
2510                 (typeof callback == "function") && callback.call(that);
2511             }
2512             prev = time;
2513         })();
2514         return this;
2515     };
2516     Element.prototype.translate = function (x, y) {
2517         if (x == null) {
2518             return {x: this._.tx, y: this._.ty};
2519         }
2520         this._.tx += +x;
2521         this._.ty += +y;
2522         switch (this.type) {
2523             case "circle":
2524             case "ellipse":
2525                 this.attr({cx: +x + this.attrs.cx, cy: +y + this.attrs.cy});
2526                 break;
2527             case "rect":
2528             case "image":
2529             case "text":
2530                 this.attr({x: +x + this.attrs.x, y: +y + this.attrs.y});
2531                 break;
2532             case "path":
2533                 var path = pathToRelative(this.attrs.path);
2534                 path[0][1] += +x;
2535                 path[0][2] += +y;
2536                 this.attr({path: path});
2537             break;
2538         }
2539         return this;
2540     };
2541     
2542     // Set
2543     var Set = function (items) {
2544         this.items = [];
2545         this.length = 0;
2546         if (items) {
2547             for (var i = 0, ii = items.length; i < ii; i++) {
2548                 if (items[i] && (items[i].constructor == Element || items[i].constructor == Set)) {
2549                     this[this.items.length] = this.items[this.items.length] = items[i];
2550                     this.length++;
2551                 }
2552             }
2553         }
2554     };
2555     Set.prototype.push = function () {
2556         var item,
2557             len;
2558         for (var i = 0, ii = arguments.length; i < ii; i++) {
2559             item = arguments[i];
2560             if (item && (item.constructor == Element || item.constructor == Set)) {
2561                 len = this.items.length;
2562                 this[len] = this.items[len] = item;
2563                 this.length++;
2564             }
2565         }
2566         return this;
2567     };
2568     Set.prototype.pop = function (id) {
2569         var res = this.items.splice(id, 1)[0];
2570         for (var j = id, jj = this.items.length; j < jj; j++) {
2571             this[j] = this[j + 1];
2572         }
2573         delete this[jj + 1];
2574         this.length--;
2575         return res;
2576     };
2577     for (var method in Element.prototype) {
2578         Set.prototype[method] = (function (methodname) {
2579             return function () {
2580                 for (var i = 0, ii = this.items.length; i < ii; i++) {
2581                     this.items[i][methodname].apply(this.items[i], arguments);
2582                 }
2583                 return this;
2584             };
2585         })(method);
2586     }
2587     Set.prototype.attr = function (name, value) {
2588         if (name && R.isArray(name) && typeof name[0] == "object") {
2589             for (var j = 0, jj = name.length; j < jj; j++) {
2590                 this.items[j].attr(name[j]);
2591             }
2592         } else {
2593             for (var i = 0, ii = this.items.length; i < ii; i++) {
2594                 this.items[i].attr.apply(this.items[i], arguments);
2595             }
2596         }
2597         return this;
2598     };
2599     
2600     Set.prototype.getBBox = function () {
2601         var x = [],
2602             y = [],
2603             w = [],
2604             h = [];
2605         for (var i = this.items.length; i--;) {
2606             var box = this.items[i].getBBox();
2607             x.push(box.x);
2608             y.push(box.y);
2609             w.push(box.x + box.width);
2610             h.push(box.y + box.height);
2611         }
2612         x = Math.min.apply(Math, x);
2613         y = Math.min.apply(Math, y);
2614         return {
2615             x: x,
2616             y: y,
2617             width: Math.max.apply(Math, w) - x,
2618             height: Math.max.apply(Math, h) - y
2619         };
2620     };
2621
2622     R.registerFont = function (font) {
2623         if (!font.face) {
2624             return font;
2625         }
2626         this.fonts = this.fonts || {};
2627         var fontcopy = {
2628                 w: font.w,
2629                 face: {},
2630                 glyphs: {}
2631             },
2632             family = font.face["font-family"];
2633         for (var prop in font.face) {
2634             fontcopy.face[prop] = font.face[prop];
2635         }
2636         if (this.fonts[family]) {
2637             this.fonts[family].push(fontcopy);
2638         } else {
2639             this.fonts[family] = [fontcopy];
2640         }
2641         if (!font.svg) {
2642             fontcopy.face["units-per-em"] = parseInt(font.face["units-per-em"], 10);
2643             for (var glyph in font.glyphs) {
2644                 var path = font.glyphs[glyph];
2645                 fontcopy.glyphs[glyph] = {
2646                     w: path.w,
2647                     k: {},
2648                     d: path.d && "M" + path.d.replace(/[mlcxtrv]/g, function (command) {
2649                             return {l: "L", c: "C", x: "z", t: "m", r: "l", v: "c"}[command] || "M";
2650                         }) + "z"
2651                 };
2652                 if (path.k) {
2653                     for (var k in path.k) {
2654                         fontcopy.glyphs[glyph].k[k] = path.k[k];
2655                     }
2656                 }
2657             }
2658         }
2659         return font;
2660     };
2661     paper.getFont = function (family, weight, style, stretch) {
2662         stretch = stretch || "normal";
2663         style = style || "normal";
2664         weight = +weight || {normal: 400, bold: 700, lighter: 300, bolder: 800}[weight] || 400;
2665         var font = R.fonts[family];
2666         if (!font) {
2667             var name = new RegExp("(^|\\s)" + family.replace(/[^\w\d\s+!~.:_-]/g, "") + "(\\s|$)", "i");
2668             for (var fontName in R.fonts) {
2669                 if (name.test(fontName)) {
2670                     font = R.fonts[fontName];
2671                     break;
2672                 }
2673             }
2674         }
2675         var thefont;
2676         if (font) {
2677             for (var i = 0, ii = font.length; i < ii; i++) {
2678                 thefont = font[i];
2679                 if (thefont.face["font-weight"] == weight && (thefont.face["font-style"] == style || !thefont.face["font-style"]) && thefont.face["font-stretch"] == stretch) {
2680                     break;
2681                 }
2682             }
2683         }
2684         return thefont;
2685     };
2686     paper.print = function (x, y, string, font, size) {
2687         var out = this.set(),
2688             letters = (string + "").split(""),
2689             shift = 0,
2690             path = "",
2691             scale;
2692         if (font) {
2693             scale = (size || 16) / font.face["units-per-em"];
2694             for (var i = 0, ii = letters.length; i < ii; i++) {
2695                 var prev = i && font.glyphs[letters[i - 1]] || {},
2696                     curr = font.glyphs[letters[i]];
2697                 shift += i ? (prev.w || font.w) + (prev.k && prev.k[letters[i]] || 0) : 0;
2698                 curr && curr.d && out.push(this.path({fill: "#000", stroke: "none"}, curr.d).translate(shift, 0));
2699             }
2700             out.scale(scale, scale, 0, y).translate(x, (size || 16) / 2);
2701         }
2702         return out;
2703     };
2704
2705     R.ninja = function () {
2706         var r = window.Raphael;
2707         if (oldRaphael.was) {
2708             window.Raphael = oldRaphael.is;
2709         } else {
2710             try {
2711                 delete window.Raphael;
2712             } catch (e) {
2713                 window.Raphael = void(0);
2714             }
2715         }
2716         return r;
2717     };
2718     R.el = Element.prototype;
2719     return R;
2720 })();
Rapheal SVG IE compatible library