Added new data() and removeData() methods, similar to jQuery ones.
[raphael] / raphael.core.js
1 // ┌─────────────────────────────────────────────────────────────────────┐ \\
2 // │ "Raphaël 2.0" - JavaScript Vector Library                           │ \\
3 // ├─────────────────────────────────────────────────────────────────────┤ \\
4 // │ Copyright (c) 2008-2011 Dmitry Baranovskiy (http://raphaeljs.com)   │ \\
5 // │ Copyright (c) 2008-2011 Sencha Labs (http://sencha.com)             │ \\
6 // │ Licensed under the MIT (http://raphaeljs.com/license.html) license. │ \\
7 // └─────────────────────────────────────────────────────────────────────┘ \\
8 (function () {
9     /*\
10      * Raphael
11      [ method ]
12      **
13      * Creates a canvas object on which to draw.
14      * You must do this first, as all future calls to drawing methods
15      * from this instance will be bound to this canvas.
16      > Parameters
17      **
18      - container (HTMLElement|string) DOM element or its ID which is going to be a parent for drawing surface
19      - width (number)
20      - height (number)
21      - callback (function) #optional callback function which is going to be executed in the context of newly created paper
22      * or
23      - x (number)
24      - y (number)
25      - width (number)
26      - height (number)
27      - callback (function) #optional callback function which is going to be executed in the context of newly created paper
28      * or
29      - all (array) (first 3 or 4 elements in the array are equal to [containerID, width, height] or [x, y, width, height]. The rest are element descriptions in format {type: type, <attributes>})
30      - callback (function) #optional callback function which is going to be executed in the context of newly created paper
31      * or
32      - onReadyCallback (function) function that is going to be called on DOM ready event. You can also subscribe to this event via Eve’s “DOMLoad” event. In this case method returns `undefined`.
33      = (object) @Paper
34      > Usage
35      | // Each of the following examples create a canvas
36      | // that is 320px wide by 200px high.
37      | // Canvas is created at the viewport’s 10,50 coordinate.
38      | var paper = Raphael(10, 50, 320, 200);
39      | // Canvas is created at the top left corner of the #notepad element
40      | // (or its top right corner in dir="rtl" elements)
41      | var paper = Raphael(document.getElementById("notepad"), 320, 200);
42      | // Same as above
43      | var paper = Raphael("notepad", 320, 200);
44      | // Image dump
45      | var set = Raphael(["notepad", 320, 200, {
46      |     type: "rect",
47      |     x: 10,
48      |     y: 10,
49      |     width: 25,
50      |     height: 25,
51      |     stroke: "#f00"
52      | }, {
53      |     type: "text",
54      |     x: 30,
55      |     y: 40,
56      |     text: "Dump"
57      | }]);
58     \*/
59     function R(first) {
60         if (R.is(first, "function")) {
61             return loaded ? first() : eve.on("DOMload", first);
62         } else if (R.is(first, array)) {
63             var a = first,
64                 cnv = R._engine.create[apply](R, a.splice(0, 3 + R.is(a[0], nu))),
65                 res = cnv.set(),
66                 i = 0,
67                 ii = a.length,
68                 j;
69             for (; i < ii; i++) {
70                 j = a[i] || {};
71                 elements[has](j.type) && res.push(cnv[j.type]().attr(j));
72             }
73             return res;
74         } else {
75             var args = Array.prototype.slice.call(arguments, 0);
76             if (R.is(args[args.length - 1], "function")) {
77                 var f = args.pop();
78                 return loaded ? f.call(R._engine.create[apply](R, args)) : eve.on("DOMload", function () {
79                     f.call(R._engine.create[apply](R, args));
80                 });
81             } else {
82                 return R._engine.create[apply](R, arguments);
83             }
84         }
85     }
86     R.version = "2.0.0";
87     R.eve = eve;
88     var loaded,
89         separator = /[, ]+/,
90         elements = {circle: 1, rect: 1, path: 1, ellipse: 1, text: 1, image: 1},
91         formatrg = /\{(\d+)\}/g,
92         proto = "prototype",
93         has = "hasOwnProperty",
94         g = {
95             doc: document,
96             win: window
97         },
98         oldRaphael = {
99             was: Object.prototype[has].call(g.win, "Raphael"),
100             is: g.win.Raphael
101         },
102         Paper = function () {},
103         paperproto,
104         appendChild = "appendChild",
105         apply = "apply",
106         concat = "concat",
107         supportsTouch = "createTouch" in g.doc,
108         E = "",
109         S = " ",
110         Str = String,
111         split = "split",
112         events = "click dblclick mousedown mousemove mouseout mouseover mouseup touchstart touchmove touchend orientationchange touchcancel gesturestart gesturechange gestureend".split(S),
113         touchMap = {
114             mousedown: "touchstart",
115             mousemove: "touchmove",
116             mouseup: "touchend"
117         },
118         lowerCase = Str.prototype.toLowerCase,
119         math = Math,
120         mmax = math.max,
121         mmin = math.min,
122         abs = math.abs,
123         pow = math.pow,
124         PI = math.PI,
125         nu = "number",
126         string = "string",
127         array = "array",
128         toString = "toString",
129         fillString = "fill",
130         objectToString = Object.prototype.toString,
131         paper = {},
132         push = "push",
133         ISURL = R._ISURL = /^url\(['"]?([^\)]+?)['"]?\)$/i,
134         colourRegExp = /^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|rgba?\(\s*([\d\.]+%?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\)|hsba?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\)|hsla?\(\s*([\d\.]+(?:deg|\xb0|%)?\s*,\s*[\d\.]+%?\s*,\s*[\d\.]+(?:%?\s*,\s*[\d\.]+)?)%?\s*\))\s*$/i,
135         isnan = {"NaN": 1, "Infinity": 1, "-Infinity": 1},
136         bezierrg = /^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/,
137         round = math.round,
138         setAttribute = "setAttribute",
139         toFloat = parseFloat,
140         toInt = parseInt,
141         ms = " progid:DXImageTransform.Microsoft",
142         upperCase = Str.prototype.toUpperCase,
143         availableAttrs = R._availableAttrs = {
144             "arrow-end": "none",
145             "arrow-start": "none",
146             blur: 0,
147             "clip-rect": "0 0 1e9 1e9",
148             cursor: "default",
149             cx: 0,
150             cy: 0,
151             fill: "#fff",
152             "fill-opacity": 1,
153             font: '10px "Arial"',
154             "font-family": '"Arial"',
155             "font-size": "10",
156             "font-style": "normal",
157             "font-weight": 400,
158             gradient: 0,
159             height: 0,
160             href: "http://raphaeljs.com/",
161             opacity: 1,
162             path: "M0,0",
163             r: 0,
164             rx: 0,
165             ry: 0,
166             src: "",
167             stroke: "#000",
168             "stroke-dasharray": "",
169             "stroke-linecap": "butt",
170             "stroke-linejoin": "butt",
171             "stroke-miterlimit": 0,
172             "stroke-opacity": 1,
173             "stroke-width": 1,
174             target: "_blank",
175             "text-anchor": "middle",
176             title: "Raphael",
177             transform: "",
178             width: 0,
179             x: 0,
180             y: 0
181         },
182         availableAnimAttrs = R._availableAnimAttrs = {
183             blur: nu,
184             "clip-rect": "csv",
185             cx: nu,
186             cy: nu,
187             fill: "colour",
188             "fill-opacity": nu,
189             "font-size": nu,
190             height: nu,
191             opacity: nu,
192             path: "path",
193             r: nu,
194             rx: nu,
195             ry: nu,
196             stroke: "colour",
197             "stroke-opacity": nu,
198             "stroke-width": nu,
199             transform: "transform",
200             width: nu,
201             x: nu,
202             y: nu
203         },
204         commaSpaces = /\s*,\s*/,
205         hsrg = {hs: 1, rg: 1},
206         p2s = /,?([achlmqrstvxz]),?/gi,
207         pathCommand = /([achlmqstvz])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig,
208         tCommand = /([rstm])[\s,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?\s*,?\s*)+)/ig,
209         pathValues = /(-?\d*\.?\d*(?:e[\-+]?\d+)?)\s*,?\s*/ig,
210         radial_gradient = R._radial_gradient = /^r(?:\(([^,]+?)\s*,\s*([^\)]+?)\))?/,
211         eldata = {},
212         sortByKey = function (a, b) {
213             return a.key - b.key;
214         },
215         sortByNumber = function (a, b) {
216             return a - b;
217         },
218         fun = function () {},
219         pipe = function (x) {
220             return x;
221         },
222         rectPath = R._rectPath = function (x, y, w, h, r) {
223             if (r) {
224                 return [["M", x + r, y], ["l", w - r * 2, 0], ["a", r, r, 0, 0, 1, r, r], ["l", 0, h - r * 2], ["a", r, r, 0, 0, 1, -r, r], ["l", r * 2 - w, 0], ["a", r, r, 0, 0, 1, -r, -r], ["l", 0, r * 2 - h], ["a", r, r, 0, 0, 1, r, -r], ["z"]];
225             }
226             return [["M", x, y], ["l", w, 0], ["l", 0, h], ["l", -w, 0], ["z"]];
227         },
228         ellipsePath = function (x, y, rx, ry) {
229             if (ry == null) {
230                 ry = rx;
231             }
232             return [["M", x, y], ["m", 0, -ry], ["a", rx, ry, 0, 1, 1, 0, 2 * ry], ["a", rx, ry, 0, 1, 1, 0, -2 * ry], ["z"]];
233         },
234         getPath = R._getPath = {
235             path: function (el) {
236                 return el.attr("path");
237             },
238             circle: function (el) {
239                 var a = el.attrs;
240                 return ellipsePath(a.cx, a.cy, a.r);
241             },
242             ellipse: function (el) {
243                 var a = el.attrs;
244                 return ellipsePath(a.cx, a.cy, a.rx, a.ry);
245             },
246             rect: function (el) {
247                 var a = el.attrs;
248                 return rectPath(a.x, a.y, a.width, a.height, a.r);
249             },
250             image: function (el) {
251                 var a = el.attrs;
252                 return rectPath(a.x, a.y, a.width, a.height);
253             },
254             text: function (el) {
255                 var bbox = el._getBBox();
256                 return rectPath(bbox.x, bbox.y, bbox.width, bbox.height);
257             }
258         },
259         mapPath = function (path, matrix) {
260             if (!matrix) {
261                 return path;
262             }
263             var x, y, i, j, pathi;
264             path = path2curve(path);
265             for (i = 0, ii = path.length; i < ii; i++) {
266                 pathi = path[i];
267                 for (j = 1, jj = pathi.length; j < jj; j += 2) {
268                     x = matrix.x(pathi[j], pathi[j + 1]);
269                     y = matrix.y(pathi[j], pathi[j + 1]);
270                     pathi[j] = x;
271                     pathi[j + 1] = y;
272                 }
273             }
274             return path;
275         };
276
277     R._g = g;
278     /*\
279      * Raphael.type
280      [ property (string) ]
281      **
282      * Can be “SVG”, “VML” or empty, depending on browser support.
283     \*/
284     R.type = (g.win.SVGAngle || g.doc.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure", "1.1") ? "SVG" : "VML");
285     if (R.type == "VML") {
286         var d = g.doc.createElement("div"),
287             b;
288         d.innerHTML = '<v:shape adj="1"/>';
289         b = d.firstChild;
290         b.style.behavior = "url(#default#VML)";
291         if (!(b && typeof b.adj == "object")) {
292             return (R.type = E);
293         }
294         d = null;
295     }
296     /*\
297      * Raphael.svg
298      [ property (boolean) ]
299      **
300      * `true` if browser supports SVG.
301     \*/
302     /*\
303      * Raphael.vml
304      [ property (boolean) ]
305      **
306      * `true` if browser supports VML.
307     \*/
308     R.svg = !(R.vml = R.type == "VML");
309     R._Paper = Paper;
310     /*\
311      * Raphael.fn
312      [ property (object) ]
313      **
314      * You can add your own method to the canvas. For example if you want to draw a pie chart,
315      * you can create your own pie chart function and ship it as a Raphaël plugin. To do this
316      * you need to extend the `Raphael.fn` object. Please note that you can create your own namespaces
317      * inside the `fn` object — methods will be run in the context of canvas anyway. You should alter
318      * the `fn` object before a Raphaël instance is created, otherwise it will take no effect.
319      > Usage
320      | Raphael.fn.arrow = function (x1, y1, x2, y2, size) {
321      |     return this.path( ... );
322      | };
323      | // or create namespace
324      | Raphael.fn.mystuff = {
325      |     arrow: function () {…},
326      |     star: function () {…},
327      |     // etc…
328      | };
329      | var paper = Raphael(10, 10, 630, 480);
330      | // then use it
331      | paper.arrow(10, 10, 30, 30, 5).attr({fill: "#f00"});
332      | paper.mystuff.arrow();
333      | paper.mystuff.star();
334     \*/
335     R.fn = paperproto = Paper.prototype = R.prototype;
336     /*\
337      * Paper.customAttributes
338      [ property (object) ]
339      **
340      * If you have a set of attributes that you would like to represent
341      * as a function of some number you can do it easily with custom attributes:
342      > Usage
343      | paper.customAttributes.hue = function (num) {
344      |     num = num % 1;
345      |     return {fill: "hsb(" + num + ", .75, 1)"};
346      | };
347      | // Custom attribute “hue” will change fill
348      | // to be given hue with fixed saturation and brightness.
349      | // Now you can use it like this:
350      | var c = paper.circle(10, 10, 10).attr({hue: .45});
351      | // or even like this:
352      | c.animate({hue: 1}, 1e3);
353      | 
354      | // You could also create custom attribute
355      | // with multiple parameters:
356      | paper.customAttributes.hsb = function (h, s, b) {
357      |     return {fill: "hsb(" + [h, s, b].join(",") + ")"};
358      | };
359      | c.attr({hsb: ".5 .8 1"});
360      | c.animate({hsb: "1 0 .5"}, 1e3);
361     \*/
362     paperproto.customAttributes = {};
363     R._id = 0;
364     R._oid = 0;
365     /*\
366      * Raphael.is
367      [ method ]
368      **
369      * Handfull replacement for `typeof` operator.
370      > Parameters
371      - o (…) any object or primitive
372      - type (string) name of the type, i.e. “string”, “function”, “number”, etc.
373      = (boolean) is given value is of given type
374     \*/
375     R.is = function (o, type) {
376         type = lowerCase.call(type);
377         if (type == "finite") {
378             return !isnan[has](+o);
379         }
380         if (type == "array") {
381             return o instanceof Array;
382         }
383         return  (type == "null" && o === null) ||
384                 (type == typeof o) ||
385                 (type == "object" && o === Object(o)) ||
386                 (type == "array" && Array.isArray && Array.isArray(o)) ||
387                 objectToString.call(o).slice(8, -1).toLowerCase() == type;
388     };
389     /*\
390      * Raphael.angle
391      [ method ]
392      **
393      * Returns angle between two or three points
394      > Parameters
395      - x1 (number) x coord of first point
396      - y1 (number) y coord of first point
397      - x2 (number) x coord of second point
398      - y2 (number) y coord of second point
399      - x3 (number) #optional x coord of third point
400      - y3 (number) #optional y coord of third point
401      = (number) angle in degrees.
402     \*/
403     R.angle = function (x1, y1, x2, y2, x3, y3) {
404         if (x3 == null) {
405             var x = x1 - x2,
406                 y = y1 - y2;
407             if (!x && !y) {
408                 return 0;
409             }
410             return (180 + math.atan2(-y, -x) * 180 / PI + 360) % 360;
411         } else {
412             return R.angle(x1, y1, x3, y3) - R.angle(x2, y2, x3, y3);
413         }
414     };
415     /*\
416      * Raphael.rad
417      [ method ]
418      **
419      * Transform angle to radians
420      > Parameters
421      - deg (number) angle in degrees
422      = (number) angle in radians.
423     \*/
424     R.rad = function (deg) {
425         return deg % 360 * PI / 180;
426     };
427     /*\
428      * Raphael.deg
429      [ method ]
430      **
431      * Transform angle to degrees
432      > Parameters
433      - deg (number) angle in radians
434      = (number) angle in degrees.
435     \*/
436     R.deg = function (rad) {
437         return rad * 180 / PI % 360;
438     };
439     /*\
440      * Raphael.snapTo
441      [ method ]
442      **
443      * Snaps given value to given grid.
444      > Parameters
445      - values (array|number) given array of values or step of the grid
446      - value (number) value to adjust
447      - tolerance (number) #optional tolerance for snapping. Default is `10`.
448      = (number) adjusted value.
449     \*/
450     R.snapTo = function (values, value, tolerance) {
451         tolerance = R.is(tolerance, "finite") ? tolerance : 10;
452         if (R.is(values, array)) {
453             var i = values.length;
454             while (i--) if (abs(values[i] - value) <= tolerance) {
455                 return values[i];
456             }
457         } else {
458             values = +values;
459             var rem = value % values;
460             if (rem < tolerance) {
461                 return value - rem;
462             }
463             if (rem > values - tolerance) {
464                 return value - rem + values;
465             }
466         }
467         return value;
468     };
469     
470     var createUUID = R._createUUID = (function (uuidRegEx, uuidReplacer) {
471         return function () {
472             return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(uuidRegEx, uuidReplacer).toUpperCase();
473         };
474     })(/[xy]/g, function (c) {
475         var r = math.random() * 16 | 0,
476             v = c == "x" ? r : (r & 3 | 8);
477         return v.toString(16);
478     });
479
480     /*\
481      * Raphael.setWindow
482      [ method ]
483      **
484      * Used when you need to draw in `&lt;iframe>`. Switched window to the iframe one.
485      > Parameters
486      - newwin (window) new window object
487     \*/
488     R.setWindow = function (newwin) {
489         eve("setWindow", R, g.win, newwin);
490         g.win = newwin;
491         g.doc = g.win.document;
492         if (initWin) {
493             initWin(g.win);
494         }
495     };
496     // colour utilities
497     var toHex = function (color) {
498         if (R.vml) {
499             // http://dean.edwards.name/weblog/2009/10/convert-any-colour-value-to-hex-in-msie/
500             var trim = /^\s+|\s+$/g;
501             var bod;
502             try {
503                 var docum = new ActiveXObject("htmlfile");
504                 docum.write("<body>");
505                 docum.close();
506                 bod = docum.body;
507             } catch(e) {
508                 bod = createPopup().document.body;
509             }
510             var range = bod.createTextRange();
511             toHex = cacher(function (color) {
512                 try {
513                     bod.style.color = Str(color).replace(trim, E);
514                     var value = range.queryCommandValue("ForeColor");
515                     value = ((value & 255) << 16) | (value & 65280) | ((value & 16711680) >>> 16);
516                     return "#" + ("000000" + value.toString(16)).slice(-6);
517                 } catch(e) {
518                     return "none";
519                 }
520             });
521         } else {
522             var i = g.doc.createElement("i");
523             i.title = "Rapha\xebl Colour Picker";
524             i.style.display = "none";
525             g.doc.body.appendChild(i);
526             toHex = cacher(function (color) {
527                 i.style.color = color;
528                 return g.doc.defaultView.getComputedStyle(i, E).getPropertyValue("color");
529             });
530         }
531         return toHex(color);
532     },
533     hsbtoString = function () {
534         return "hsb(" + [this.h, this.s, this.b] + ")";
535     },
536     hsltoString = function () {
537         return "hsl(" + [this.h, this.s, this.l] + ")";
538     },
539     rgbtoString = function () {
540         return this.hex;
541     },
542     prepareRGB = function (r, g, b) {
543         if (g == null && R.is(r, "object") && "r" in r && "g" in r && "b" in r) {
544             b = r.b;
545             g = r.g;
546             r = r.r;
547         }
548         if (g == null && R.is(r, string)) {
549             var clr = R.getRGB(r);
550             r = clr.r;
551             g = clr.g;
552             b = clr.b;
553         }
554         if (r > 1 || g > 1 || b > 1) {
555             r /= 255;
556             g /= 255;
557             b /= 255;
558         }
559         
560         return [r, g, b];
561     },
562     packageRGB = function (r, g, b, o) {
563         r *= 255;
564         g *= 255;
565         b *= 255;
566         var rgb = {
567             r: r,
568             g: g,
569             b: b,
570             hex: R.rgb(r, g, b),
571             toString: rgbtoString
572         };
573         R.is(o, "finite") && (rgb.opacity = o);
574         return rgb;
575     };
576     
577     /*\
578      * Raphael.color
579      [ method ]
580      **
581      * Parses the color string and returns object with all values for the given color.
582      > Parameters
583      - clr (string) color string in one of the supported formats (see @Raphael.getRGB)
584      = (object) Combined RGB & HSB object in format:
585      o {
586      o     r (number) red,
587      o     g (number) green,
588      o     b (number) blue,
589      o     hex (string) color in HTML/CSS format: #••••••,
590      o     error (boolean) `true` if string can’t be parsed,
591      o     h (number) hue,
592      o     s (number) saturation,
593      o     v (number) value (brightness),
594      o     l (number) lightness
595      o }
596     \*/
597     R.color = function (clr) {
598         var rgb;
599         if (R.is(clr, "object") && "h" in clr && "s" in clr && "b" in clr) {
600             rgb = R.hsb2rgb(clr);
601             clr.r = rgb.r;
602             clr.g = rgb.g;
603             clr.b = rgb.b;
604             clr.hex = rgb.hex;
605         } else if (R.is(clr, "object") && "h" in clr && "s" in clr && "l" in clr) {
606             rgb = R.hsl2rgb(clr);
607             clr.r = rgb.r;
608             clr.g = rgb.g;
609             clr.b = rgb.b;
610             clr.hex = rgb.hex;
611         } else {
612             if (R.is(clr, "string")) {
613                 clr = R.getRGB(clr);
614             }
615             if (R.is(clr, "object") && "r" in clr && "g" in clr && "b" in clr) {
616                 rgb = R.rgb2hsl(clr);
617                 clr.h = rgb.h;
618                 clr.s = rgb.s;
619                 clr.l = rgb.l;
620                 rgb = R.rgb2hsb(clr);
621                 clr.v = rgb.b;
622             } else {
623                 clr = {hex: "none"};
624                 crl.r = clr.g = clr.b = clr.h = clr.s = clr.v = clr.l = -1;
625             }
626         }
627         clr.toString = rgbtoString;
628         return clr;
629     };
630     /*\
631      * Raphael.hsb2rgb
632      [ method ]
633      **
634      * Converts HSB values to RGB object.
635      > Parameters
636      - h (number) hue
637      - s (number) saturation
638      - v (number) value or brightness
639      = (object) RGB object in format:
640      o {
641      o     r (number) red,
642      o     g (number) green,
643      o     b (number) blue,
644      o     hex (string) color in HTML/CSS format: #••••••
645      o }
646     \*/
647     R.hsb2rgb = function (h, s, v, o) {
648         if (this.is(h, "object") && "h" in h && "s" in h && "b" in h) {
649             v = h.b;
650             s = h.s;
651             h = h.h;
652             o = h.o;
653         }
654         h *= 360;
655         var R, G, B, X, C;
656         h = (h % 360) / 60;
657         C = v * s;
658         X = C * (1 - abs(h % 2 - 1));
659         R = G = B = v - C;
660
661         h = ~~h;
662         R += [C, X, 0, 0, X, C][h];
663         G += [X, C, C, X, 0, 0][h];
664         B += [0, 0, X, C, C, X][h];
665         return packageRGB(R, G, B, o);
666     };
667     /*\
668      * Raphael.hsl2rgb
669      [ method ]
670      **
671      * Converts HSL values to RGB object.
672      > Parameters
673      - h (number) hue
674      - s (number) saturation
675      - l (number) luminosity
676      = (object) RGB object in format:
677      o {
678      o     r (number) red,
679      o     g (number) green,
680      o     b (number) blue,
681      o     hex (string) color in HTML/CSS format: #••••••
682      o }
683     \*/
684     R.hsl2rgb = function (h, s, l, o) {
685         if (this.is(h, "object") && "h" in h && "s" in h && "l" in h) {
686             l = h.l;
687             s = h.s;
688             h = h.h;
689         }
690         if (h > 1 || s > 1 || l > 1) {
691             h /= 360;
692             s /= 100;
693             l /= 100;
694         }
695         h *= 360;
696         var R, G, B, X, C;
697         h = (h % 360) / 60;
698         C = 2 * s * (l < .5 ? l : 1 - l);
699         X = C * (1 - abs(h % 2 - 1));
700         R = G = B = l - C / 2;
701
702         h = ~~h;
703         R += [C, X, 0, 0, X, C][h];
704         G += [X, C, C, X, 0, 0][h];
705         B += [0, 0, X, C, C, X][h];
706         return packageRGB(R, G, B, o);
707     };
708     /*\
709      * Raphael.rgb2hsb
710      [ method ]
711      **
712      * Converts RGB values to HSB object.
713      > Parameters
714      - r (number) red
715      - g (number) green
716      - b (number) blue
717      = (object) HSB object in format:
718      o {
719      o     h (number) hue
720      o     s (number) saturation
721      o     b (number) brightness
722      o }
723     \*/
724     R.rgb2hsb = function (r, g, b) {
725         b = prepareRGB(r, g, b);
726         r = b[0];
727         g = b[1];
728         b = b[2];
729
730         var H, S, V, C;
731         V = mmax(r, g, b);
732         C = V - mmin(r, g, b);
733         H = (C == 0 ? null :
734              V == r ? (g - b) / C :
735              V == g ? (b - r) / C + 2 :
736                       (r - g) / C + 4
737             );
738         H = ((H + 360) % 6) * 60 / 360;
739         S = C == 0 ? 0 : C / V;
740         return {h: H, s: S, b: V, toString: hsbtoString};
741     };
742     /*\
743      * Raphael.rgb2hsl
744      [ method ]
745      **
746      * Converts RGB values to HSL object.
747      > Parameters
748      - r (number) red
749      - g (number) green
750      - b (number) blue
751      = (object) HSL object in format:
752      o {
753      o     h (number) hue
754      o     s (number) saturation
755      o     l (number) luminosity
756      o }
757     \*/
758     R.rgb2hsl = function (r, g, b) {
759         b = prepareRGB(r, g, b);
760         r = b[0];
761         g = b[1];
762         b = b[2];
763
764         var H, S, L, M, m, C;
765         M = mmax(r, g, b);
766         m = mmin(r, g, b);
767         C = M - m;
768         H = (C == 0 ? null :
769              M == r ? (g - b) / C :
770              M == g ? (b - r) / C + 2 :
771                       (r - g) / C + 4);
772         H = ((H + 360) % 6) * 60 / 360;
773         L = (M + m) / 2;
774         S = (C == 0 ? 0 :
775              L < .5 ? C / (2 * L) :
776                       C / (2 - 2 * L));
777         return {h: H, s: S, l: L, toString: hsltoString};
778     };
779     R._path2string = function () {
780         return this.join(",").replace(p2s, "$1");
781     };
782     function repush(array, item) {
783         for (var i = 0, ii = array.length; i < ii; i++) if (array[i] === item) {
784             return array.push(array.splice(i, 1)[0]);
785         }
786     }
787     function cacher(f, scope, postprocessor) {
788         function newf() {
789             var arg = Array.prototype.slice.call(arguments, 0),
790                 args = arg.join("\u2400"),
791                 cache = newf.cache = newf.cache || {},
792                 count = newf.count = newf.count || [];
793             if (cache[has](args)) {
794                 repush(count, args);
795                 return postprocessor ? postprocessor(cache[args]) : cache[args];
796             }
797             count.length >= 1e3 && delete cache[count.shift()];
798             count.push(args);
799             cache[args] = f[apply](scope, arg);
800             return postprocessor ? postprocessor(cache[args]) : cache[args];
801         }
802         return newf;
803     }
804
805     var preload = R._preload = function (src, f) {
806         var img = g.doc.createElement("img");
807         img.style.cssText = "position:absolute;left:-9999em;top-9999em";
808         img.onload = function () {
809             f.call(this);
810             this.onload = null;
811             g.doc.body.removeChild(this);
812         };
813         img.onerror = function () {
814             g.doc.body.removeChild(this);
815         };
816         g.doc.body.appendChild(img);
817         img.src = src;
818     };
819     
820     function clrToString() {
821         return this.hex;
822     }
823
824     /*\
825      * Raphael.getRGB
826      [ method ]
827      **
828      * Parses colour string as RGB object
829      > Parameters
830      - colour (string) colour string in one of formats:
831      # <ul>
832      #     <li>Colour name (“<code>red</code>”, “<code>green</code>”, “<code>cornflowerblue</code>”, etc)</li>
833      #     <li>#••• — shortened HTML colour: (“<code>#000</code>”, “<code>#fc0</code>”, etc)</li>
834      #     <li>#•••••• — full length HTML colour: (“<code>#000000</code>”, “<code>#bd2300</code>”)</li>
835      #     <li>rgb(•••, •••, •••) — red, green and blue channels’ values: (“<code>rgb(200,&nbsp;100,&nbsp;0)</code>”)</li>
836      #     <li>rgb(•••%, •••%, •••%) — same as above, but in %: (“<code>rgb(100%,&nbsp;175%,&nbsp;0%)</code>”)</li>
837      #     <li>hsb(•••, •••, •••) — hue, saturation and brightness values: (“<code>hsb(0.5,&nbsp;0.25,&nbsp;1)</code>”)</li>
838      #     <li>hsb(•••%, •••%, •••%) — same as above, but in %</li>
839      #     <li>hsl(•••, •••, •••) — same as hsb</li>
840      #     <li>hsl(•••%, •••%, •••%) — same as hsb</li>
841      # </ul>
842      = (object) RGB object in format:
843      o {
844      o     r (number) red,
845      o     g (number) green,
846      o     b (number) blue
847      o     hex (string) color in HTML/CSS format: #••••••,
848      o     error (boolean) true if string can’t be parsed
849      o }
850     \*/
851     R.getRGB = cacher(function (colour) {
852         if (!colour || !!((colour = Str(colour)).indexOf("-") + 1)) {
853             return {r: -1, g: -1, b: -1, hex: "none", error: 1, toString: clrToString};
854         }
855         if (colour == "none") {
856             return {r: -1, g: -1, b: -1, hex: "none", toString: clrToString};
857         }
858         !(hsrg[has](colour.toLowerCase().substring(0, 2)) || colour.charAt() == "#") && (colour = toHex(colour));
859         var res,
860             red,
861             green,
862             blue,
863             opacity,
864             t,
865             values,
866             rgb = colour.match(colourRegExp);
867         if (rgb) {
868             if (rgb[2]) {
869                 blue = toInt(rgb[2].substring(5), 16);
870                 green = toInt(rgb[2].substring(3, 5), 16);
871                 red = toInt(rgb[2].substring(1, 3), 16);
872             }
873             if (rgb[3]) {
874                 blue = toInt((t = rgb[3].charAt(3)) + t, 16);
875                 green = toInt((t = rgb[3].charAt(2)) + t, 16);
876                 red = toInt((t = rgb[3].charAt(1)) + t, 16);
877             }
878             if (rgb[4]) {
879                 values = rgb[4].split(commaSpaces);
880                 red = toFloat(values[0]);
881                 values[0].slice(-1) == "%" && (red *= 2.55);
882                 green = toFloat(values[1]);
883                 values[1].slice(-1) == "%" && (green *= 2.55);
884                 blue = toFloat(values[2]);
885                 values[2].slice(-1) == "%" && (blue *= 2.55);
886                 rgb[1].toLowerCase().slice(0, 4) == "rgba" && (opacity = toFloat(values[3]));
887                 values[3] && values[3].slice(-1) == "%" && (opacity /= 100);
888             }
889             if (rgb[5]) {
890                 values = rgb[5].split(commaSpaces);
891                 red = toFloat(values[0]);
892                 values[0].slice(-1) == "%" && (red *= 2.55);
893                 green = toFloat(values[1]);
894                 values[1].slice(-1) == "%" && (green *= 2.55);
895                 blue = toFloat(values[2]);
896                 values[2].slice(-1) == "%" && (blue *= 2.55);
897                 (values[0].slice(-3) == "deg" || values[0].slice(-1) == "\xb0") && (red /= 360);
898                 rgb[1].toLowerCase().slice(0, 4) == "hsba" && (opacity = toFloat(values[3]));
899                 values[3] && values[3].slice(-1) == "%" && (opacity /= 100);
900                 return R.hsb2rgb(red, green, blue, opacity);
901             }
902             if (rgb[6]) {
903                 values = rgb[6].split(commaSpaces);
904                 red = toFloat(values[0]);
905                 values[0].slice(-1) == "%" && (red *= 2.55);
906                 green = toFloat(values[1]);
907                 values[1].slice(-1) == "%" && (green *= 2.55);
908                 blue = toFloat(values[2]);
909                 values[2].slice(-1) == "%" && (blue *= 2.55);
910                 (values[0].slice(-3) == "deg" || values[0].slice(-1) == "\xb0") && (red /= 360);
911                 rgb[1].toLowerCase().slice(0, 4) == "hsla" && (opacity = toFloat(values[3]));
912                 values[3] && values[3].slice(-1) == "%" && (opacity /= 100);
913                 return R.hsl2rgb(red, green, blue, opacity);
914             }
915             rgb = {r: red, g: green, b: blue, toString: clrToString};
916             rgb.hex = "#" + (16777216 | blue | (green << 8) | (red << 16)).toString(16).slice(1);
917             R.is(opacity, "finite") && (rgb.opacity = opacity);
918             return rgb;
919         }
920         return {r: -1, g: -1, b: -1, hex: "none", error: 1, toString: clrToString};
921     }, R);
922     /*\
923      * Raphael.hsb
924      [ method ]
925      **
926      * Converts HSB values to hex representation of the colour.
927      > Parameters
928      - h (number) hue
929      - s (number) saturation
930      - b (number) value or brightness
931      = (string) hex representation of the colour.
932     \*/
933     R.hsb = cacher(function (h, s, b) {
934         return R.hsb2rgb(h, s, b).hex;
935     });
936     /*\
937      * Raphael.hsl
938      [ method ]
939      **
940      * Converts HSL values to hex representation of the colour.
941      > Parameters
942      - h (number) hue
943      - s (number) saturation
944      - l (number) luminosity
945      = (string) hex representation of the colour.
946     \*/
947     R.hsl = cacher(function (h, s, l) {
948         return R.hsl2rgb(h, s, l).hex;
949     });
950     /*\
951      * Raphael.rgb
952      [ method ]
953      **
954      * Converts RGB values to hex representation of the colour.
955      > Parameters
956      - r (number) red
957      - g (number) green
958      - b (number) blue
959      = (string) hex representation of the colour.
960     \*/
961     R.rgb = cacher(function (r, g, b) {
962         return "#" + (16777216 | b | (g << 8) | (r << 16)).toString(16).slice(1);
963     });
964     /*\
965      * Raphael.getColor
966      [ method ]
967      **
968      * On each call returns next colour in the spectrum. To reset it back to red call @Raphael.getColor.reset
969      > Parameters
970      - value (number) #optional brightness, default is `0.75`
971      = (string) hex representation of the colour.
972     \*/
973     R.getColor = function (value) {
974         var start = this.getColor.start = this.getColor.start || {h: 0, s: 1, b: value || .75},
975             rgb = this.hsb2rgb(start.h, start.s, start.b);
976         start.h += .075;
977         if (start.h > 1) {
978             start.h = 0;
979             start.s -= .2;
980             start.s <= 0 && (this.getColor.start = {h: 0, s: 1, b: start.b});
981         }
982         return rgb.hex;
983     };
984     /*\
985      * Raphael.getColor.reset
986      [ method ]
987      **
988      * Resets spectrum position for @Raphael.getColor back to red.
989     \*/
990     R.getColor.reset = function () {
991         delete this.start;
992     };
993
994     /*\
995      * Raphael.parsePathString
996      [ method ]
997      **
998      * Utility method
999      **
1000      * Parses given path string into an array of arrays of path segments.
1001      > Parameters
1002      - pathString (string|array) path string or array of segments (in the last case it will be returned straight away)
1003      = (array) array of segments.
1004     \*/
1005     R.parsePathString = cacher(function (pathString) {
1006         if (!pathString) {
1007             return null;
1008         }
1009         var paramCounts = {a: 7, c: 6, h: 1, l: 2, m: 2, q: 4, s: 4, t: 2, v: 1, z: 0},
1010             data = [];
1011         if (R.is(pathString, array) && R.is(pathString[0], array)) { // rough assumption
1012             data = pathClone(pathString);
1013         }
1014         if (!data.length) {
1015             Str(pathString).replace(pathCommand, function (a, b, c) {
1016                 var params = [],
1017                     name = lowerCase.call(b);
1018                 c.replace(pathValues, function (a, b) {
1019                     b && params.push(+b);
1020                 });
1021                 if (name == "m" && params.length > 2) {
1022                     data.push([b][concat](params.splice(0, 2)));
1023                     name = "l";
1024                     b = b == "m" ? "l" : "L";
1025                 }
1026                 while (params.length >= paramCounts[name]) {
1027                     data.push([b][concat](params.splice(0, paramCounts[name])));
1028                     if (!paramCounts[name]) {
1029                         break;
1030                     }
1031                 }
1032             });
1033         }
1034         data.toString = R._path2string;
1035         return data;
1036     });
1037     /*\
1038      * Raphael.parseTransformString
1039      [ method ]
1040      **
1041      * Utility method
1042      **
1043      * Parses given path string into an array of transformations.
1044      > Parameters
1045      - TString (string|array) transform string or array of transformations (in the last case it will be returned straight away)
1046      = (array) array of transformations.
1047     \*/
1048     R.parseTransformString = cacher(function (TString) {
1049         if (!TString) {
1050             return null;
1051         }
1052         var paramCounts = {r: 3, s: 4, t: 2, m: 6},
1053             data = [];
1054         if (R.is(TString, array) && R.is(TString[0], array)) { // rough assumption
1055             data = pathClone(TString);
1056         }
1057         if (!data.length) {
1058             Str(TString).replace(tCommand, function (a, b, c) {
1059                 var params = [],
1060                     name = lowerCase.call(b);
1061                 c.replace(pathValues, function (a, b) {
1062                     b && params.push(+b);
1063                 });
1064                 data.push([name][concat](params));
1065             });
1066         }
1067         data.toString = R._path2string;
1068         return data;
1069     });
1070     /*\
1071      * Raphael.findDotsAtSegment
1072      [ method ]
1073      **
1074      * Utility method
1075      **
1076      * Find dot coordinates on the given cubic bezier curve at the given t.
1077      > Parameters
1078      - p1x (number) x of the first point of the curve
1079      - p1y (number) y of the first point of the curve
1080      - c1x (number) x of the first anchor of the curve
1081      - c1y (number) y of the first anchor of the curve
1082      - c2x (number) x of the second anchor of the curve
1083      - c2y (number) y of the second anchor of the curve
1084      - p2x (number) x of the second point of the curve
1085      - p2y (number) y of the second point of the curve
1086      - t (number) position on the curve (0..1)
1087      = (object) point information in format:
1088      o {
1089      o     x: (number) x coordinate of the point
1090      o     y: (number) y coordinate of the point
1091      o     m: {
1092      o         x: (number) x coordinate of the left anchor
1093      o         y: (number) y coordinate of the left anchor
1094      o     }
1095      o     n: {
1096      o         x: (number) x coordinate of the right anchor
1097      o         y: (number) y coordinate of the right anchor
1098      o     }
1099      o     start: {
1100      o         x: (number) x coordinate of the start of the curve
1101      o         y: (number) y coordinate of the start of the curve
1102      o     }
1103      o     end: {
1104      o         x: (number) x coordinate of the end of the curve
1105      o         y: (number) y coordinate of the end of the curve
1106      o     }
1107      o     alpha: (number) angle of the curve derivative at the point
1108      o }
1109     \*/
1110     R.findDotsAtSegment = function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) {
1111         var t1 = 1 - t,
1112             x = pow(t1, 3) * p1x + pow(t1, 2) * 3 * t * c1x + t1 * 3 * t * t * c2x + pow(t, 3) * p2x,
1113             y = pow(t1, 3) * p1y + pow(t1, 2) * 3 * t * c1y + t1 * 3 * t * t * c2y + pow(t, 3) * p2y,
1114             mx = p1x + 2 * t * (c1x - p1x) + t * t * (c2x - 2 * c1x + p1x),
1115             my = p1y + 2 * t * (c1y - p1y) + t * t * (c2y - 2 * c1y + p1y),
1116             nx = c1x + 2 * t * (c2x - c1x) + t * t * (p2x - 2 * c2x + c1x),
1117             ny = c1y + 2 * t * (c2y - c1y) + t * t * (p2y - 2 * c2y + c1y),
1118             ax = (1 - t) * p1x + t * c1x,
1119             ay = (1 - t) * p1y + t * c1y,
1120             cx = (1 - t) * c2x + t * p2x,
1121             cy = (1 - t) * c2y + t * p2y,
1122             alpha = (90 - math.atan2(mx - nx, my - ny) * 180 / PI);
1123         (mx > nx || my < ny) && (alpha += 180);
1124         return {
1125             x: x,
1126             y: y,
1127             m: {x: mx, y: my},
1128             n: {x: nx, y: ny},
1129             start: {x: ax, y: ay},
1130             end: {x: cx, y: cy},
1131             alpha: alpha
1132         };
1133     };
1134     var pathDimensions = cacher(function (path) {
1135         if (!path) {
1136             return {x: 0, y: 0, width: 0, height: 0};
1137         }
1138         path = path2curve(path);
1139         var x = 0, 
1140             y = 0,
1141             X = [],
1142             Y = [],
1143             p;
1144         for (var i = 0, ii = path.length; i < ii; i++) {
1145             p = path[i];
1146             if (p[0] == "M") {
1147                 x = p[1];
1148                 y = p[2];
1149                 X.push(x);
1150                 Y.push(y);
1151             } else {
1152                 var dim = curveDim(x, y, p[1], p[2], p[3], p[4], p[5], p[6]);
1153                 X = X[concat](dim.min.x, dim.max.x);
1154                 Y = Y[concat](dim.min.y, dim.max.y);
1155                 x = p[5];
1156                 y = p[6];
1157             }
1158         }
1159         var xmin = mmin[apply](0, X),
1160             ymin = mmin[apply](0, Y);
1161         return {
1162             x: xmin,
1163             y: ymin,
1164             width: mmax[apply](0, X) - xmin,
1165             height: mmax[apply](0, Y) - ymin
1166         };
1167     }, null, function (o) {
1168         return {
1169             x: o.x,
1170             y: o.y,
1171             width: o.width,
1172             height: o.height
1173         };
1174     }),
1175         pathClone = function (pathArray) {
1176             var res = [];
1177             if (!R.is(pathArray, array) || !R.is(pathArray && pathArray[0], array)) { // rough assumption
1178                 pathArray = R.parsePathString(pathArray);
1179             }
1180             for (var i = 0, ii = pathArray.length; i < ii; i++) {
1181                 res[i] = [];
1182                 for (var j = 0, jj = pathArray[i].length; j < jj; j++) {
1183                     res[i][j] = pathArray[i][j];
1184                 }
1185             }
1186             res.toString = R._path2string;
1187             return res;
1188         },
1189         pathToRelative = R._pathToRelative = cacher(function (pathArray) {
1190             if (!R.is(pathArray, array) || !R.is(pathArray && pathArray[0], array)) { // rough assumption
1191                 pathArray = R.parsePathString(pathArray);
1192             }
1193             var res = [],
1194                 x = 0,
1195                 y = 0,
1196                 mx = 0,
1197                 my = 0,
1198                 start = 0;
1199             if (pathArray[0][0] == "M") {
1200                 x = pathArray[0][1];
1201                 y = pathArray[0][2];
1202                 mx = x;
1203                 my = y;
1204                 start++;
1205                 res.push(["M", x, y]);
1206             }
1207             for (var i = start, ii = pathArray.length; i < ii; i++) {
1208                 var r = res[i] = [],
1209                     pa = pathArray[i];
1210                 if (pa[0] != lowerCase.call(pa[0])) {
1211                     r[0] = lowerCase.call(pa[0]);
1212                     switch (r[0]) {
1213                         case "a":
1214                             r[1] = pa[1];
1215                             r[2] = pa[2];
1216                             r[3] = pa[3];
1217                             r[4] = pa[4];
1218                             r[5] = pa[5];
1219                             r[6] = +(pa[6] - x).toFixed(3);
1220                             r[7] = +(pa[7] - y).toFixed(3);
1221                             break;
1222                         case "v":
1223                             r[1] = +(pa[1] - y).toFixed(3);
1224                             break;
1225                         case "m":
1226                             mx = pa[1];
1227                             my = pa[2];
1228                         default:
1229                             for (var j = 1, jj = pa.length; j < jj; j++) {
1230                                 r[j] = +(pa[j] - ((j % 2) ? x : y)).toFixed(3);
1231                             }
1232                     }
1233                 } else {
1234                     r = res[i] = [];
1235                     if (pa[0] == "m") {
1236                         mx = pa[1] + x;
1237                         my = pa[2] + y;
1238                     }
1239                     for (var k = 0, kk = pa.length; k < kk; k++) {
1240                         res[i][k] = pa[k];
1241                     }
1242                 }
1243                 var len = res[i].length;
1244                 switch (res[i][0]) {
1245                     case "z":
1246                         x = mx;
1247                         y = my;
1248                         break;
1249                     case "h":
1250                         x += +res[i][len - 1];
1251                         break;
1252                     case "v":
1253                         y += +res[i][len - 1];
1254                         break;
1255                     default:
1256                         x += +res[i][len - 2];
1257                         y += +res[i][len - 1];
1258                 }
1259             }
1260             res.toString = R._path2string;
1261             return res;
1262         }, 0, pathClone),
1263         pathToAbsolute = R._pathToAbsolute = cacher(function (pathArray) {
1264             if (!R.is(pathArray, array) || !R.is(pathArray && pathArray[0], array)) { // rough assumption
1265                 pathArray = R.parsePathString(pathArray);
1266             }
1267             if (!pathArray || !pathArray.length) {
1268                 return [["M", 0, 0]];
1269             }
1270             var res = [],
1271                 x = 0,
1272                 y = 0,
1273                 mx = 0,
1274                 my = 0,
1275                 start = 0;
1276             if (pathArray[0][0] == "M") {
1277                 x = +pathArray[0][1];
1278                 y = +pathArray[0][2];
1279                 mx = x;
1280                 my = y;
1281                 start++;
1282                 res[0] = ["M", x, y];
1283             }
1284             for (var i = start, ii = pathArray.length; i < ii; i++) {
1285                 var r = res[i] = [],
1286                     pa = pathArray[i];
1287                 if (pa[0] != upperCase.call(pa[0])) {
1288                     r[0] = upperCase.call(pa[0]);
1289                     switch (r[0]) {
1290                         case "A":
1291                             r[1] = pa[1];
1292                             r[2] = pa[2];
1293                             r[3] = pa[3];
1294                             r[4] = pa[4];
1295                             r[5] = pa[5];
1296                             r[6] = +(pa[6] + x);
1297                             r[7] = +(pa[7] + y);
1298                             break;
1299                         case "V":
1300                             r[1] = +pa[1] + y;
1301                             break;
1302                         case "H":
1303                             r[1] = +pa[1] + x;
1304                             break;
1305                         case "M":
1306                             mx = +pa[1] + x;
1307                             my = +pa[2] + y;
1308                         default:
1309                             for (var j = 1, jj = pa.length; j < jj; j++) {
1310                                 r[j] = +pa[j] + ((j % 2) ? x : y);
1311                             }
1312                     }
1313                 } else {
1314                     for (var k = 0, kk = pa.length; k < kk; k++) {
1315                         res[i][k] = pa[k];
1316                     }
1317                 }
1318                 switch (r[0]) {
1319                     case "Z":
1320                         x = mx;
1321                         y = my;
1322                         break;
1323                     case "H":
1324                         x = r[1];
1325                         break;
1326                     case "V":
1327                         y = r[1];
1328                         break;
1329                     case "M":
1330                         mx = res[i][res[i].length - 2];
1331                         my = res[i][res[i].length - 1];
1332                     default:
1333                         x = res[i][res[i].length - 2];
1334                         y = res[i][res[i].length - 1];
1335                 }
1336             }
1337             res.toString = R._path2string;
1338             return res;
1339         }, null, pathClone),
1340         l2c = function (x1, y1, x2, y2) {
1341             return [x1, y1, x2, y2, x2, y2];
1342         },
1343         q2c = function (x1, y1, ax, ay, x2, y2) {
1344             var _13 = 1 / 3,
1345                 _23 = 2 / 3;
1346             return [
1347                     _13 * x1 + _23 * ax,
1348                     _13 * y1 + _23 * ay,
1349                     _13 * x2 + _23 * ax,
1350                     _13 * y2 + _23 * ay,
1351                     x2,
1352                     y2
1353                 ];
1354         },
1355         a2c = function (x1, y1, rx, ry, angle, large_arc_flag, sweep_flag, x2, y2, recursive) {
1356             // for more information of where this math came from visit:
1357             // http://www.w3.org/TR/SVG11/implnote.html#ArcImplementationNotes
1358             var _120 = PI * 120 / 180,
1359                 rad = PI / 180 * (+angle || 0),
1360                 res = [],
1361                 xy,
1362                 rotate = cacher(function (x, y, rad) {
1363                     var X = x * math.cos(rad) - y * math.sin(rad),
1364                         Y = x * math.sin(rad) + y * math.cos(rad);
1365                     return {x: X, y: Y};
1366                 });
1367             if (!recursive) {
1368                 xy = rotate(x1, y1, -rad);
1369                 x1 = xy.x;
1370                 y1 = xy.y;
1371                 xy = rotate(x2, y2, -rad);
1372                 x2 = xy.x;
1373                 y2 = xy.y;
1374                 var cos = math.cos(PI / 180 * angle),
1375                     sin = math.sin(PI / 180 * angle),
1376                     x = (x1 - x2) / 2,
1377                     y = (y1 - y2) / 2;
1378                 var h = (x * x) / (rx * rx) + (y * y) / (ry * ry);
1379                 if (h > 1) {
1380                     h = math.sqrt(h);
1381                     rx = h * rx;
1382                     ry = h * ry;
1383                 }
1384                 var rx2 = rx * rx,
1385                     ry2 = ry * ry,
1386                     k = (large_arc_flag == sweep_flag ? -1 : 1) *
1387                         math.sqrt(abs((rx2 * ry2 - rx2 * y * y - ry2 * x * x) / (rx2 * y * y + ry2 * x * x))),
1388                     cx = k * rx * y / ry + (x1 + x2) / 2,
1389                     cy = k * -ry * x / rx + (y1 + y2) / 2,
1390                     f1 = math.asin(((y1 - cy) / ry).toFixed(9)),
1391                     f2 = math.asin(((y2 - cy) / ry).toFixed(9));
1392
1393                 f1 = x1 < cx ? PI - f1 : f1;
1394                 f2 = x2 < cx ? PI - f2 : f2;
1395                 f1 < 0 && (f1 = PI * 2 + f1);
1396                 f2 < 0 && (f2 = PI * 2 + f2);
1397                 if (sweep_flag && f1 > f2) {
1398                     f1 = f1 - PI * 2;
1399                 }
1400                 if (!sweep_flag && f2 > f1) {
1401                     f2 = f2 - PI * 2;
1402                 }
1403             } else {
1404                 f1 = recursive[0];
1405                 f2 = recursive[1];
1406                 cx = recursive[2];
1407                 cy = recursive[3];
1408             }
1409             var df = f2 - f1;
1410             if (abs(df) > _120) {
1411                 var f2old = f2,
1412                     x2old = x2,
1413                     y2old = y2;
1414                 f2 = f1 + _120 * (sweep_flag && f2 > f1 ? 1 : -1);
1415                 x2 = cx + rx * math.cos(f2);
1416                 y2 = cy + ry * math.sin(f2);
1417                 res = a2c(x2, y2, rx, ry, angle, 0, sweep_flag, x2old, y2old, [f2, f2old, cx, cy]);
1418             }
1419             df = f2 - f1;
1420             var c1 = math.cos(f1),
1421                 s1 = math.sin(f1),
1422                 c2 = math.cos(f2),
1423                 s2 = math.sin(f2),
1424                 t = math.tan(df / 4),
1425                 hx = 4 / 3 * rx * t,
1426                 hy = 4 / 3 * ry * t,
1427                 m1 = [x1, y1],
1428                 m2 = [x1 + hx * s1, y1 - hy * c1],
1429                 m3 = [x2 + hx * s2, y2 - hy * c2],
1430                 m4 = [x2, y2];
1431             m2[0] = 2 * m1[0] - m2[0];
1432             m2[1] = 2 * m1[1] - m2[1];
1433             if (recursive) {
1434                 return [m2, m3, m4][concat](res);
1435             } else {
1436                 res = [m2, m3, m4][concat](res).join().split(",");
1437                 var newres = [];
1438                 for (var i = 0, ii = res.length; i < ii; i++) {
1439                     newres[i] = i % 2 ? rotate(res[i - 1], res[i], rad).y : rotate(res[i], res[i + 1], rad).x;
1440                 }
1441                 return newres;
1442             }
1443         },
1444         findDotAtSegment = function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) {
1445             var t1 = 1 - t;
1446             return {
1447                 x: pow(t1, 3) * p1x + pow(t1, 2) * 3 * t * c1x + t1 * 3 * t * t * c2x + pow(t, 3) * p2x,
1448                 y: pow(t1, 3) * p1y + pow(t1, 2) * 3 * t * c1y + t1 * 3 * t * t * c2y + pow(t, 3) * p2y
1449             };
1450         },
1451         curveDim = cacher(function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y) {
1452             var a = (c2x - 2 * c1x + p1x) - (p2x - 2 * c2x + c1x),
1453                 b = 2 * (c1x - p1x) - 2 * (c2x - c1x),
1454                 c = p1x - c1x,
1455                 t1 = (-b + math.sqrt(b * b - 4 * a * c)) / 2 / a,
1456                 t2 = (-b - math.sqrt(b * b - 4 * a * c)) / 2 / a,
1457                 y = [p1y, p2y],
1458                 x = [p1x, p2x],
1459                 dot;
1460             abs(t1) > "1e12" && (t1 = .5);
1461             abs(t2) > "1e12" && (t2 = .5);
1462             if (t1 > 0 && t1 < 1) {
1463                 dot = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t1);
1464                 x.push(dot.x);
1465                 y.push(dot.y);
1466             }
1467             if (t2 > 0 && t2 < 1) {
1468                 dot = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t2);
1469                 x.push(dot.x);
1470                 y.push(dot.y);
1471             }
1472             a = (c2y - 2 * c1y + p1y) - (p2y - 2 * c2y + c1y);
1473             b = 2 * (c1y - p1y) - 2 * (c2y - c1y);
1474             c = p1y - c1y;
1475             t1 = (-b + math.sqrt(b * b - 4 * a * c)) / 2 / a;
1476             t2 = (-b - math.sqrt(b * b - 4 * a * c)) / 2 / a;
1477             abs(t1) > "1e12" && (t1 = .5);
1478             abs(t2) > "1e12" && (t2 = .5);
1479             if (t1 > 0 && t1 < 1) {
1480                 dot = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t1);
1481                 x.push(dot.x);
1482                 y.push(dot.y);
1483             }
1484             if (t2 > 0 && t2 < 1) {
1485                 dot = findDotAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t2);
1486                 x.push(dot.x);
1487                 y.push(dot.y);
1488             }
1489             return {
1490                 min: {x: mmin[apply](0, x), y: mmin[apply](0, y)},
1491                 max: {x: mmax[apply](0, x), y: mmax[apply](0, y)}
1492             };
1493         }),
1494         path2curve = cacher(function (path, path2) {
1495             var p = pathToAbsolute(path),
1496                 p2 = path2 && pathToAbsolute(path2),
1497                 attrs = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null},
1498                 attrs2 = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null},
1499                 processPath = function (path, d) {
1500                     var nx, ny;
1501                     if (!path) {
1502                         return ["C", d.x, d.y, d.x, d.y, d.x, d.y];
1503                     }
1504                     !(path[0] in {T:1, Q:1}) && (d.qx = d.qy = null);
1505                     switch (path[0]) {
1506                         case "M":
1507                             d.X = path[1];
1508                             d.Y = path[2];
1509                             break;
1510                         case "A":
1511                             path = ["C"][concat](a2c[apply](0, [d.x, d.y][concat](path.slice(1))));
1512                             break;
1513                         case "S":
1514                             nx = d.x + (d.x - (d.bx || d.x));
1515                             ny = d.y + (d.y - (d.by || d.y));
1516                             path = ["C", nx, ny][concat](path.slice(1));
1517                             break;
1518                         case "T":
1519                             d.qx = d.x + (d.x - (d.qx || d.x));
1520                             d.qy = d.y + (d.y - (d.qy || d.y));
1521                             path = ["C"][concat](q2c(d.x, d.y, d.qx, d.qy, path[1], path[2]));
1522                             break;
1523                         case "Q":
1524                             d.qx = path[1];
1525                             d.qy = path[2];
1526                             path = ["C"][concat](q2c(d.x, d.y, path[1], path[2], path[3], path[4]));
1527                             break;
1528                         case "L":
1529                             path = ["C"][concat](l2c(d.x, d.y, path[1], path[2]));
1530                             break;
1531                         case "H":
1532                             path = ["C"][concat](l2c(d.x, d.y, path[1], d.y));
1533                             break;
1534                         case "V":
1535                             path = ["C"][concat](l2c(d.x, d.y, d.x, path[1]));
1536                             break;
1537                         case "Z":
1538                             path = ["C"][concat](l2c(d.x, d.y, d.X, d.Y));
1539                             break;
1540                     }
1541                     return path;
1542                 },
1543                 fixArc = function (pp, i) {
1544                     if (pp[i].length > 7) {
1545                         pp[i].shift();
1546                         var pi = pp[i];
1547                         while (pi.length) {
1548                             pp.splice(i++, 0, ["C"][concat](pi.splice(0, 6)));
1549                         }
1550                         pp.splice(i, 1);
1551                         ii = mmax(p.length, p2 && p2.length || 0);
1552                     }
1553                 },
1554                 fixM = function (path1, path2, a1, a2, i) {
1555                     if (path1 && path2 && path1[i][0] == "M" && path2[i][0] != "M") {
1556                         path2.splice(i, 0, ["M", a2.x, a2.y]);
1557                         a1.bx = 0;
1558                         a1.by = 0;
1559                         a1.x = path1[i][1];
1560                         a1.y = path1[i][2];
1561                         ii = mmax(p.length, p2 && p2.length || 0);
1562                     }
1563                 };
1564             for (var i = 0, ii = mmax(p.length, p2 && p2.length || 0); i < ii; i++) {
1565                 p[i] = processPath(p[i], attrs);
1566                 fixArc(p, i);
1567                 p2 && (p2[i] = processPath(p2[i], attrs2));
1568                 p2 && fixArc(p2, i);
1569                 fixM(p, p2, attrs, attrs2, i);
1570                 fixM(p2, p, attrs2, attrs, i);
1571                 var seg = p[i],
1572                     seg2 = p2 && p2[i],
1573                     seglen = seg.length,
1574                     seg2len = p2 && seg2.length;
1575                 attrs.x = seg[seglen - 2];
1576                 attrs.y = seg[seglen - 1];
1577                 attrs.bx = toFloat(seg[seglen - 4]) || attrs.x;
1578                 attrs.by = toFloat(seg[seglen - 3]) || attrs.y;
1579                 attrs2.bx = p2 && (toFloat(seg2[seg2len - 4]) || attrs2.x);
1580                 attrs2.by = p2 && (toFloat(seg2[seg2len - 3]) || attrs2.y);
1581                 attrs2.x = p2 && seg2[seg2len - 2];
1582                 attrs2.y = p2 && seg2[seg2len - 1];
1583             }
1584             return p2 ? [p, p2] : p;
1585         }, null, pathClone),
1586         parseDots = R._parseDots = cacher(function (gradient) {
1587             var dots = [];
1588             for (var i = 0, ii = gradient.length; i < ii; i++) {
1589                 var dot = {},
1590                     par = gradient[i].match(/^([^:]*):?([\d\.]*)/);
1591                 dot.color = R.getRGB(par[1]);
1592                 if (dot.color.error) {
1593                     return null;
1594                 }
1595                 dot.color = dot.color.hex;
1596                 par[2] && (dot.offset = par[2] + "%");
1597                 dots.push(dot);
1598             }
1599             for (i = 1, ii = dots.length - 1; i < ii; i++) {
1600                 if (!dots[i].offset) {
1601                     var start = toFloat(dots[i - 1].offset || 0),
1602                         end = 0;
1603                     for (var j = i + 1; j < ii; j++) {
1604                         if (dots[j].offset) {
1605                             end = dots[j].offset;
1606                             break;
1607                         }
1608                     }
1609                     if (!end) {
1610                         end = 100;
1611                         j = ii;
1612                     }
1613                     end = toFloat(end);
1614                     var d = (end - start) / (j - i + 1);
1615                     for (; i < j; i++) {
1616                         start += d;
1617                         dots[i].offset = start + "%";
1618                     }
1619                 }
1620             }
1621             return dots;
1622         }),
1623         tear = R._tear = function (el, paper) {
1624             el == paper.top && (paper.top = el.prev);
1625             el == paper.bottom && (paper.bottom = el.next);
1626             el.next && (el.next.prev = el.prev);
1627             el.prev && (el.prev.next = el.next);
1628         },
1629         tofront = R._tofront = function (el, paper) {
1630             if (paper.top === el) {
1631                 return;
1632             }
1633             tear(el, paper);
1634             el.next = null;
1635             el.prev = paper.top;
1636             paper.top.next = el;
1637             paper.top = el;
1638         },
1639         toback = R._toback = function (el, paper) {
1640             if (paper.bottom === el) {
1641                 return;
1642             }
1643             tear(el, paper);
1644             el.next = paper.bottom;
1645             el.prev = null;
1646             paper.bottom.prev = el;
1647             paper.bottom = el;
1648         },
1649         insertafter = R._insertafter = function (el, el2, paper) {
1650             tear(el, paper);
1651             el2 == paper.top && (paper.top = el);
1652             el2.next && (el2.next.prev = el);
1653             el.next = el2.next;
1654             el.prev = el2;
1655             el2.next = el;
1656         },
1657         insertbefore = R._insertbefore = function (el, el2, paper) {
1658             tear(el, paper);
1659             el2 == paper.bottom && (paper.bottom = el);
1660             el2.prev && (el2.prev.next = el);
1661             el.prev = el2.prev;
1662             el2.prev = el;
1663             el.next = el2;
1664         },
1665         removed = function (methodname) {
1666             return function () {
1667                 throw new Error("Rapha\xebl: you are calling to method \u201c" + methodname + "\u201d of removed object");
1668             };
1669         },
1670         extractTransform = R._extractTransform = function (el, tstr) {
1671             if (tstr == null) {
1672                 return el._.transform;
1673             }
1674             tstr = Str(tstr).replace(/\.{3}|\u2026/g, el._.transform || E);
1675             var tdata = R.parseTransformString(tstr),
1676                 deg = 0,
1677                 dx = 0,
1678                 dy = 0,
1679                 sx = 1,
1680                 sy = 1,
1681                 _ = el._,
1682                 m = new Matrix;
1683             _.transform = tdata || [];
1684             if (tdata) {
1685                 for (var i = 0, ii = tdata.length; i < ii; i++) {
1686                     var t = tdata[i],
1687                         tlen = t.length,
1688                         bb;
1689                     t[0] = Str(t[0]).toLowerCase();
1690                     if (t[0] == "t" && tlen == 3) {
1691                         m.translate(t[1], t[2]);
1692                     } else if (t[0] == "r") {
1693                         if (tlen == 2) {
1694                             bb = bb || el.getBBox(1);
1695                             m.rotate(t[1], bb.x + bb.width / 2, bb.y + bb.height / 2);
1696                             deg += t[1];
1697                         } else if (tlen == 4) {
1698                             m.rotate(t[1], t[2], t[3]);
1699                             deg += t[1];
1700                         }
1701                     } else if (t[0] == "s") {
1702                         if (tlen == 2 || tlen == 3) {
1703                             bb = bb || el.getBBox(1);
1704                             m.scale(t[1], t[tlen - 1], bb.x + bb.width / 2, bb.y + bb.height / 2);
1705                             sx *= t[1];
1706                             sy *= t[tlen - 1];
1707                         } else if (tlen == 5) {
1708                             m.scale(t[1], t[2], t[3], t[4]);
1709                             sx *= t[1];
1710                             sy *= t[2];
1711                         }
1712                     } else if (t[0] == "m" && tlen == 7) {
1713                         m.add(t[1], t[2], t[3], t[4], t[5], t[6]);
1714                     }
1715                     _.dirtyT = 1;
1716                     el.matrix = m;
1717                 }
1718             }
1719
1720             el.matrix = m;
1721
1722             _.sx = sx;
1723             _.sy = sy;
1724             _.deg = deg;
1725             _.dx = dx = m.e;
1726             _.dy = dy = m.f;
1727
1728             if (sx == 1 && sy == 1 && !deg && _.bbox) {
1729                 _.bbox.x += +dx;
1730                 _.bbox.y += +dy;
1731             } else {
1732                 _.dirtyT = 1;
1733             }
1734         },
1735         getEmpty = function (item) {
1736             switch (item[0]) {
1737                 case "t": return ["t", 0, 0];
1738                 case "m": return ["m", 1, 0, 0, 1, 0, 0];
1739                 case "r": if (item.length == 4) {
1740                     return ["r", 0, item[2], item[3]];
1741                 } else {
1742                     return ["r", 0];
1743                 }
1744                 case "s": if (item.length == 5) {
1745                     return ["s", 1, 1, item[3], item[4]];
1746                 } else if (item.length == 3) {
1747                     return ["s", 1, 1];
1748                 } else {
1749                     return ["s", 1];
1750                 }
1751             }
1752         },
1753         equaliseTransform = R._equaliseTransform = function (t1, t2) {
1754             t2 = Str(t2).replace(/\.{3}|\u2026/g, t1);
1755             t1 = R.parseTransformString(t1) || [];
1756             t2 = R.parseTransformString(t2) || [];
1757             var maxlength = mmax(t1.length, t2.length),
1758                 from = [],
1759                 to = [],
1760                 i = 0, j, jj,
1761                 tt1, tt2;
1762             for (; i < maxlength; i++) {
1763                 tt1 = t1[i] || getEmpty(t2[i]);
1764                 tt2 = t2[i] || getEmpty(tt1);
1765                 if ((tt1[0] != tt2[0]) ||
1766                     (tt1[0] == "r" && (tt1[2] != tt2[2] || tt1[3] != tt2[3])) ||
1767                     (tt1[0] == "s" && (tt1[3] != tt2[3] || tt1[4] != tt2[4]))
1768                     ) {
1769                     return;
1770                 }
1771                 from[i] = [];
1772                 to[i] = [];
1773                 for (j = 0, jj = mmax(tt1.length, tt2.length); j < jj; j++) {
1774                     j in tt1 && (from[i][j] = tt1[j]);
1775                     j in tt2 && (to[i][j] = tt2[j]);
1776                 }
1777             }
1778             return {
1779                 from: from,
1780                 to: to
1781             };
1782         };
1783     R._getContainer = function (x, y, w, h) {
1784         var container;
1785         container = h == null && !R.is(x, "object") ? g.doc.getElementById(x) : x;
1786         if (container == null) {
1787             return;
1788         }
1789         if (container.tagName) {
1790             if (y == null) {
1791                 return {
1792                     container: container,
1793                     width: container.style.pixelWidth || container.offsetWidth,
1794                     height: container.style.pixelHeight || container.offsetHeight
1795                 };
1796             } else {
1797                 return {
1798                     container: container,
1799                     width: y,
1800                     height: w
1801                 };
1802             }
1803         }
1804         return {
1805             container: 1,
1806             x: x,
1807             y: y,
1808             width: w,
1809             height: h
1810         };
1811     };
1812     /*\
1813      * Raphael.pathToRelative
1814      [ method ]
1815      **
1816      * Utility method
1817      **
1818      * Converts path to relative form
1819      > Parameters
1820      - pathString (string|array) path string or array of segments
1821      = (array) array of segments.
1822     \*/
1823     R.pathToRelative = pathToRelative;
1824     R._engine = {};
1825     /*\
1826      * Raphael.path2curve
1827      [ method ]
1828      **
1829      * Utility method
1830      **
1831      * Converts path to a new path where all segments are cubic bezier curves.
1832      > Parameters
1833      - pathString (string|array) path string or array of segments
1834      = (array) array of segments.
1835     \*/
1836     R.path2curve = path2curve;
1837     /*\
1838      * Raphael.matrix
1839      [ method ]
1840      **
1841      * Utility method
1842      **
1843      * Returns matrix based on given parameters.
1844      > Parameters
1845      - a (number)
1846      - b (number)
1847      - c (number)
1848      - d (number)
1849      - e (number)
1850      - f (number)
1851      = (object) @Matrix
1852     \*/
1853     R.matrix = function (a, b, c, d, e, f) {
1854         return new Matrix(a, b, c, d, e, f);
1855     };
1856     function Matrix(a, b, c, d, e, f) {
1857         if (a != null) {
1858             this.a = +a;
1859             this.b = +b;
1860             this.c = +c;
1861             this.d = +d;
1862             this.e = +e;
1863             this.f = +f;
1864         } else {
1865             this.a = 1;
1866             this.b = 0;
1867             this.c = 0;
1868             this.d = 1;
1869             this.e = 0;
1870             this.f = 0;
1871         }
1872     }
1873     (function (matrixproto) {
1874         /*\
1875          * Matrix.add
1876          [ method ]
1877          **
1878          * Adds given matrix to existing one.
1879          > Parameters
1880          - a (number)
1881          - b (number)
1882          - c (number)
1883          - d (number)
1884          - e (number)
1885          - f (number)
1886          or
1887          - matrix (object) @Matrix
1888         \*/
1889         matrixproto.add = function (a, b, c, d, e, f) {
1890             var out = [[], [], []],
1891                 m = [[this.a, this.c, this.e], [this.b, this.d, this.f], [0, 0, 1]],
1892                 matrix = [[a, c, e], [b, d, f], [0, 0, 1]],
1893                 x, y, z, res;
1894
1895             if (a && a instanceof Matrix) {
1896                 matrix = [[a.a, a.c, a.e], [a.b, a.d, a.f], [0, 0, 1]];
1897             }
1898
1899             for (x = 0; x < 3; x++) {
1900                 for (y = 0; y < 3; y++) {
1901                     res = 0;
1902                     for (z = 0; z < 3; z++) {
1903                         res += m[x][z] * matrix[z][y];
1904                     }
1905                     out[x][y] = res;
1906                 }
1907             }
1908             this.a = out[0][0];
1909             this.b = out[1][0];
1910             this.c = out[0][1];
1911             this.d = out[1][1];
1912             this.e = out[0][2];
1913             this.f = out[1][2];
1914         };
1915         /*\
1916          * Matrix.invert
1917          [ method ]
1918          **
1919          * Returns inverted version of the matrix
1920          = (object) @Matrix
1921         \*/
1922         matrixproto.invert = function () {
1923             var me = this,
1924                 x = me.a * me.d - me.b * me.c;
1925             return new Matrix(me.d / x, -me.b / x, -me.c / x, me.a / x, (me.c * me.f - me.d * me.e) / x, (me.b * me.e - me.a * me.f) / x);
1926         };
1927         /*\
1928          * Matrix.clone
1929          [ method ]
1930          **
1931          * Returns copy of the matrix
1932          = (object) @Matrix
1933         \*/
1934         matrixproto.clone = function () {
1935             return new Matrix(this.a, this.b, this.c, this.d, this.e, this.f);
1936         };
1937         /*\
1938          * Matrix.translate
1939          [ method ]
1940          **
1941          * Translate the matrix
1942          > Parameters
1943          - x (number)
1944          - y (number)
1945         \*/
1946         matrixproto.translate = function (x, y) {
1947             this.add(1, 0, 0, 1, x, y);
1948         };
1949         /*\
1950          * Matrix.scale
1951          [ method ]
1952          **
1953          * Scales the matrix
1954          > Parameters
1955          - x (number)
1956          - y (number) #optional
1957          - cx (number) #optional
1958          - cy (number) #optional
1959         \*/
1960         matrixproto.scale = function (x, y, cx, cy) {
1961             y == null && (y = x);
1962             cx || cy && this.add(1, 0, 0, 1, cx, cy);
1963             this.add(x, 0, 0, y, 0, 0);
1964             cx || cy && this.add(1, 0, 0, 1, -cx, -cy);
1965         };
1966         /*\
1967          * Matrix.rotate
1968          [ method ]
1969          **
1970          * Rotates the matrix
1971          > Parameters
1972          - a (number)
1973          - x (number)
1974          - y (number)
1975         \*/
1976         matrixproto.rotate = function (a, x, y) {
1977             a = R.rad(a);
1978             x = x || 0;
1979             y = y || 0;
1980             var cos = +math.cos(a).toFixed(9),
1981                 sin = +math.sin(a).toFixed(9);
1982             this.add(cos, sin, -sin, cos, x, y);
1983             this.add(1, 0, 0, 1, -x, -y);
1984         };
1985         /*\
1986          * Matrix.x
1987          [ method ]
1988          **
1989          * Return x coordinate for given point after transformation described by the matrix. See also @Matrix.y
1990          > Parameters
1991          - x (number)
1992          - y (number)
1993          = (number) x
1994         \*/
1995         matrixproto.x = function (x, y) {
1996             return x * this.a + y * this.c + this.e;
1997         };
1998         /*\
1999          * Matrix.y
2000          [ method ]
2001          **
2002          * Return y coordinate for given point after transformation described by the matrix. See also @Matrix.x
2003          > Parameters
2004          - x (number)
2005          - y (number)
2006          = (number) y
2007         \*/
2008         matrixproto.y = function (x, y) {
2009             return x * this.b + y * this.d + this.f;
2010         };
2011         matrixproto.get = function (i) {
2012             return +this[Str.fromCharCode(97 + i)].toFixed(4);
2013         };
2014         matrixproto.toString = function () {
2015             return R.svg ?
2016                 "matrix(" + [this.get(0), this.get(1), this.get(2), this.get(3), this.get(4), this.get(5)].join() + ")" :
2017                 [this.get(0), this.get(2), this.get(1), this.get(3), 0, 0].join();
2018         };
2019         matrixproto.toFilter = function () {
2020             return "progid:DXImageTransform.Microsoft.Matrix(M11=" + this.get(0) +
2021                 ", M12=" + this.get(2) + ", M21=" + this.get(1) + ", M22=" + this.get(3) +
2022                 ", Dx=" + this.get(4) + ", Dy=" + this.get(5) + ", sizingmethod='auto expand')";
2023         };
2024         matrixproto.offset = function () {
2025             return [this.e.toFixed(4), this.f.toFixed(4)];
2026         };
2027         function norm(a) {
2028             return a[0] * a[0] + a[1] * a[1];
2029         }
2030         function normalize(a) {
2031             var mag = math.sqrt(norm(a));
2032             a[0] && (a[0] /= mag);
2033             a[1] && (a[1] /= mag);
2034         }
2035         /*\
2036          * Matrix.split
2037          [ method ]
2038          **
2039          * Splits matrix into primitive transformations
2040          = (object) in format:
2041          o dx (number) translation by x
2042          o dy (number) translation by y
2043          o scalex (number) scale by x
2044          o scaley (number) scale by y
2045          o shear (number) shear
2046          o rotate (number) rotation in deg
2047          o isSimple (boolean) could it be represented via simple transformations
2048         \*/
2049         matrixproto.split = function () {
2050             var out = {};
2051             // translation
2052             out.dx = this.e;
2053             out.dy = this.f;
2054
2055             // scale and shear
2056             var row = [[this.a, this.c], [this.b, this.d]];
2057             out.scalex = math.sqrt(norm(row[0]));
2058             normalize(row[0]);
2059
2060             out.shear = row[0][0] * row[1][0] + row[0][1] * row[1][1];
2061             row[1] = [row[1][0] - row[0][0] * out.shear, row[1][1] - row[0][1] * out.shear];
2062
2063             out.scaley = math.sqrt(norm(row[1]));
2064             normalize(row[1]);
2065             out.shear /= out.scaley;
2066
2067             // rotation
2068             var sin = -row[0][1],
2069                 cos = row[1][1];
2070             if (cos < 0) {
2071                 out.rotate = R.deg(math.acos(cos));
2072                 if (sin < 0) {
2073                     out.rotate = 360 - out.rotate;
2074                 }
2075             } else {
2076                 out.rotate = R.deg(math.asin(sin));
2077             }
2078
2079             out.isSimple = !+out.shear.toFixed(9) && (out.scalex.toFixed(9) == out.scaley.toFixed(9) || !out.rotate);
2080             out.isSuperSimple = !+out.shear.toFixed(9) && out.scalex.toFixed(9) == out.scaley.toFixed(9) && !out.rotate;
2081             out.noRotation = !+out.shear.toFixed(9) && !out.rotate;
2082             return out;
2083         };
2084         /*\
2085          * Matrix.toTransformString
2086          [ method ]
2087          **
2088          * Return transform string that represents given matrix
2089          = (string) transform string
2090         \*/
2091         matrixproto.toTransformString = function () {
2092             var s = this.split();
2093             if (s.isSimple) {
2094                 return "t" + [s.dx, s.dy] + "s" + [s.scalex, s.scaley, 0, 0] + "r" + [s.rotate, 0, 0];
2095             } else {
2096                 return "m" + [this.get(0), this.get(1), this.get(2), this.get(3), this.get(4), this.get(5)];
2097             }
2098         };
2099     })(Matrix.prototype);
2100
2101     // WebKit rendering bug workaround method
2102     var version = navigator.userAgent.match(/Version\/(.*?)\s/) || navigator.userAgent.match(/Chrome\/(\d+)/);
2103     if ((navigator.vendor == "Apple Computer, Inc.") && (version && version[1] < 4 || navigator.platform.slice(0, 2) == "iP") ||
2104         (navigator.vendor == "Google Inc." && version && version[1] < 8)) {
2105         /*\
2106          * Paper.safari
2107          [ method ]
2108          **
2109          * There is an inconvenient rendering bug in Safari (WebKit):
2110          * sometimes the rendering should be forced.
2111          * This method should help with dealing with this bug.
2112         \*/
2113         paperproto.safari = function () {
2114             var rect = this.rect(-99, -99, this.width + 99, this.height + 99).attr({stroke: "none"});
2115             setTimeout(function () {rect.remove();});
2116         };
2117     } else {
2118         paperproto.safari = fun;
2119     }
2120  
2121     // Events
2122     var preventDefault = function () {
2123         this.returnValue = false;
2124     },
2125     preventTouch = function () {
2126         return this.originalEvent.preventDefault();
2127     },
2128     stopPropagation = function () {
2129         this.cancelBubble = true;
2130     },
2131     stopTouch = function () {
2132         return this.originalEvent.stopPropagation();
2133     },
2134     addEvent = (function () {
2135         if (g.doc.addEventListener) {
2136             return function (obj, type, fn, element) {
2137                 var realName = supportsTouch && touchMap[type] ? touchMap[type] : type,
2138                     f = function (e) {
2139                         var scrollY = g.doc.documentElement.scrollTop || g.doc.body.scrollTop,
2140                             scrollX = g.doc.documentElement.scrollLeft || g.doc.body.scrollLeft,
2141                             x = e.clientX + scrollX,
2142                             y = e.clientY + scrollY;
2143                     if (supportsTouch && touchMap[has](type)) {
2144                         for (var i = 0, ii = e.targetTouches && e.targetTouches.length; i < ii; i++) {
2145                             if (e.targetTouches[i].target == obj) {
2146                                 var olde = e;
2147                                 e = e.targetTouches[i];
2148                                 e.originalEvent = olde;
2149                                 e.preventDefault = preventTouch;
2150                                 e.stopPropagation = stopTouch;
2151                                 break;
2152                             }
2153                         }
2154                     }
2155                     return fn.call(element, e, x, y);
2156                 };
2157                 obj.addEventListener(realName, f, false);
2158                 return function () {
2159                     obj.removeEventListener(realName, f, false);
2160                     return true;
2161                 };
2162             };
2163         } else if (g.doc.attachEvent) {
2164             return function (obj, type, fn, element) {
2165                 var f = function (e) {
2166                     e = e || g.win.event;
2167                     var scrollY = g.doc.documentElement.scrollTop || g.doc.body.scrollTop,
2168                         scrollX = g.doc.documentElement.scrollLeft || g.doc.body.scrollLeft,
2169                         x = e.clientX + scrollX,
2170                         y = e.clientY + scrollY;
2171                     e.preventDefault = e.preventDefault || preventDefault;
2172                     e.stopPropagation = e.stopPropagation || stopPropagation;
2173                     return fn.call(element, e, x, y);
2174                 };
2175                 obj.attachEvent("on" + type, f);
2176                 var detacher = function () {
2177                     obj.detachEvent("on" + type, f);
2178                     return true;
2179                 };
2180                 return detacher;
2181             };
2182         }
2183     })(),
2184     drag = [],
2185     dragMove = function (e) {
2186         var x = e.clientX,
2187             y = e.clientY,
2188             scrollY = g.doc.documentElement.scrollTop || g.doc.body.scrollTop,
2189             scrollX = g.doc.documentElement.scrollLeft || g.doc.body.scrollLeft,
2190             dragi,
2191             j = drag.length;
2192         while (j--) {
2193             dragi = drag[j];
2194             if (supportsTouch) {
2195                 var i = e.touches.length,
2196                     touch;
2197                 while (i--) {
2198                     touch = e.touches[i];
2199                     if (touch.identifier == dragi.el._drag.id) {
2200                         x = touch.clientX;
2201                         y = touch.clientY;
2202                         (e.originalEvent ? e.originalEvent : e).preventDefault();
2203                         break;
2204                     }
2205                 }
2206             } else {
2207                 e.preventDefault();
2208             }
2209             var node = dragi.el.node,
2210                 o,
2211                 next = node.nextSibling,
2212                 parent = node.parentNode,
2213                 display = node.style.display;
2214             g.win.opera && parent.removeChild(node);
2215             node.style.display = "none";
2216             o = dragi.el.paper.getElementByPoint(x, y);
2217             node.style.display = display;
2218             g.win.opera && (next ? parent.insertBefore(node, next) : parent.appendChild(node));
2219             o && eve("drag.over." + dragi.el.id, dragi.el, o);
2220             x += scrollX;
2221             y += scrollY;
2222             eve("drag.move." + dragi.el.id, dragi.move_scope || dragi.el, x - dragi.el._drag.x, y - dragi.el._drag.y, x, y, e);
2223         }
2224     },
2225     dragUp = function (e) {
2226         R.unmousemove(dragMove).unmouseup(dragUp);
2227         var i = drag.length,
2228             dragi;
2229         while (i--) {
2230             dragi = drag[i];
2231             dragi.el._drag = {};
2232             eve("drag.end." + dragi.el.id, dragi.end_scope || dragi.start_scope || dragi.move_scope || dragi.el, e);
2233         }
2234         drag = [];
2235     },
2236     /*\
2237      * Raphael.el
2238      [ property (object) ]
2239      **
2240      * You can add your own method to elements. This is usefull when you want to hack default functionality or
2241      * want to wrap some common transformation or attributes in one method. In difference to canvas methods,
2242      * you can redefine element method at any time. Expending element methods wouldn’t affect set.
2243      > Usage
2244      | Raphael.el.red = function () {
2245      |     this.attr({fill: "#f00"});
2246      | };
2247      | // then use it
2248      | paper.circle(100, 100, 20).red();
2249     \*/
2250     elproto = R.el = {};
2251     for (var i = events.length; i--;) {
2252         (function (eventName) {
2253             R[eventName] = elproto[eventName] = function (fn, scope) {
2254                 if (R.is(fn, "function")) {
2255                     this.events = this.events || [];
2256                     this.events.push({name: eventName, f: fn, unbind: addEvent(this.shape || this.node || g.doc, eventName, fn, scope || this)});
2257                 }
2258                 return this;
2259             };
2260             R["un" + eventName] = elproto["un" + eventName] = function (fn) {
2261                 var events = this.events,
2262                     l = events.length;
2263                 while (l--) if (events[l].name == eventName && events[l].f == fn) {
2264                     events[l].unbind();
2265                     events.splice(l, 1);
2266                     !events.length && delete this.events;
2267                     return this;
2268                 }
2269                 return this;
2270             };
2271         })(events[i]);
2272     }
2273     
2274     /*\
2275      * Element.data
2276      [ method ]
2277      **
2278      * Adds or retrieves given value asociated with given key.
2279      ** 
2280      * See also @Element.removeData
2281      > Parameters
2282      - key (string) key to store data
2283      - value (any) #optional value to store
2284      = (object) @Element
2285      * or, if value is not specified:
2286      = (any) value
2287      > Usage
2288      | for (var i = 0, i < 5, i++) {
2289      |     paper.circle(10 + 15 * i, 10, 10)
2290      |          .attr({fill: "#000"})
2291      |          .data("i", i)
2292      |          .click(function () {
2293      |             alert(this.data("i"));
2294      |          });
2295      | }
2296     \*/
2297     elproto.data = function (key, value) {
2298         var data = eldata[this.id] = eldata[this.id] || {};
2299         if (arguments.length == 1) {
2300             if (R.is(key, "object")) {
2301                 for (var i in key) if (key[has](i)) {
2302                     this.data(i, key[i]);
2303                 }
2304                 return this;
2305             }
2306             eve("data.get." + this.id, this, data[key], key);
2307             return data[key];
2308         }
2309         data[key] = value;
2310         eve("data.set." + this.id, this, value, key);
2311         return this;
2312     };
2313     /*\
2314      * Element.removeData
2315      [ method ]
2316      **
2317      * Removes value associated with an element by given key.
2318      * If key is not provided, removes all the data of the element.
2319      > Parameters
2320      - key (string) #optional key
2321      = (object) @Element
2322     \*/
2323     elproto.removeData = function (key) {
2324         if (key == null) {
2325             eldata[this.id] = {};
2326         } else {
2327             eldata[this.id] && delete eldata[this.id][key];
2328         }
2329         return this;
2330     };
2331     /*\
2332      * Element.hover
2333      [ method ]
2334      **
2335      * Adds event handlers for hover for the element.
2336      > Parameters
2337      - f_in (function) handler for hover in
2338      - f_out (function) handler for hover out
2339      - icontext (object) #optional context for hover in handler
2340      - ocontext (object) #optional context for hover out handler
2341      = (object) @Element
2342     \*/
2343     elproto.hover = function (f_in, f_out, scope_in, scope_out) {
2344         return this.mouseover(f_in, scope_in).mouseout(f_out, scope_out || scope_in);
2345     };
2346     /*\
2347      * Element.unhover
2348      [ method ]
2349      **
2350      * Removes event handlers for hover for the element.
2351      > Parameters
2352      - f_in (function) handler for hover in
2353      - f_out (function) handler for hover out
2354      = (object) @Element
2355     \*/
2356     elproto.unhover = function (f_in, f_out) {
2357         return this.unmouseover(f_in).unmouseout(f_out);
2358     };
2359     /*\
2360      * Element.drag
2361      [ method ]
2362      **
2363      * Adds event handlers for drag of the element.
2364      > Parameters
2365      - onmove (function) handler for moving
2366      - onstart (function) handler for drag start
2367      - onend (function) handler for drag end
2368      - mcontext (object) #optional context for moving handler
2369      - scontext (object) #optional context for drag start handler
2370      - econtext (object) #optional context for drag end handler
2371      * Additionaly following `drag` events will be triggered: `drag.start.<id>` on start, 
2372      * `drag.end.<id>` on end and `drag.move.<id>` on every move. When element will be dragged over another element 
2373      * `drag.over.<id>` will be fired as well.
2374      *
2375      * Start event and start handler will be called in specified context or in context of the element with following parameters:
2376      o x (number) x position of the mouse
2377      o y (number) y position of the mouse
2378      o event (object) DOM event object
2379      * Move event and move handler will be called in specified context or in context of the element with following parameters:
2380      o dx (number) shift by x from the start point
2381      o dy (number) shift by y from the start point
2382      o x (number) x position of the mouse
2383      o y (number) y position of the mouse
2384      o event (object) DOM event object
2385      * End event and end handler will be called in specified context or in context of the element with following parameters:
2386      o event (object) DOM event object
2387      = (object) @Element
2388     \*/
2389     elproto.drag = function (onmove, onstart, onend, move_scope, start_scope, end_scope) {
2390         function start(e) {
2391             (e.originalEvent || e).preventDefault();
2392             var scrollY = g.doc.documentElement.scrollTop || g.doc.body.scrollTop,
2393                 scrollX = g.doc.documentElement.scrollLeft || g.doc.body.scrollLeft;
2394             this._drag.x = e.clientX + scrollX;
2395             this._drag.y = e.clientY + scrollY;
2396             this._drag.id = e.identifier;
2397             !drag.length && R.mousemove(dragMove).mouseup(dragUp);
2398             drag.push({el: this, move_scope: move_scope, start_scope: start_scope, end_scope: end_scope});
2399             onstart && eve.on("drag.start." + this.id, onstart);
2400             onmove && eve.on("drag.move." + this.id, onmove);
2401             onend && eve.on("drag.end." + this.id, onend);
2402             eve("drag.start." + this.id, start_scope || move_scope || this, e.clientX + scrollX, e.clientY + scrollY, e);
2403         }
2404         this._drag = {};
2405         this.mousedown(start);
2406         return this;
2407     };
2408     /*\
2409      * Element.onDragOver
2410      [ method ]
2411      **
2412      * Shortcut for assigning event handler for `drag.over.<id>` event, where id is id of the element (see @Element.id).
2413      > Parameters
2414      - f (function) handler for event
2415     \*/
2416     elproto.onDragOver = function (f) {
2417         f ? eve.on("drag.over." + this.id, f) : eve.unbind("drag.over." + this.id);
2418     };
2419     /*\
2420      * Element.undrag
2421      [ method ]
2422      **
2423      * Removes all drag event handlers from given element.
2424     \*/
2425     elproto.undrag = function () {
2426         var i = drag.length;
2427         while (i--) if (drag[i].el == this) {
2428             R.unmousedown(drag[i].start);
2429             drag.splice(i++, 1);
2430             eve.unbind("drag.*." + this.id);
2431         }
2432         !drag.length && R.unmousemove(dragMove).unmouseup(dragUp);
2433     };
2434     /*\
2435      * Paper.circle
2436      [ method ]
2437      **
2438      * Draws a circle.
2439      **
2440      > Parameters
2441      **
2442      - x (number) x coordinate of the centre
2443      - y (number) y coordinate of the centre
2444      - r (number) radius
2445      = (object) Raphaël element object with type “circle”
2446      **
2447      > Usage
2448      | var c = paper.circle(50, 50, 40);
2449     \*/
2450     paperproto.circle = function (x, y, r) {
2451         var out = R._engine.circle(this, x || 0, y || 0, r || 0);
2452         this.__set__ && this.__set__.push(out);
2453         return out;
2454     };
2455     /*\
2456      * Paper.rect
2457      [ method ]
2458      *
2459      * Draws a rectangle.
2460      **
2461      > Parameters
2462      **
2463      - x (number) x coordinate of the top left corner
2464      - y (number) y coordinate of the top left corner
2465      - width (number) width
2466      - height (number) height
2467      - r (number) #optional radius for rounded corners, default is 0
2468      = (object) Raphaël element object with type “rect”
2469      **
2470      > Usage
2471      | // regular rectangle
2472      | var c = paper.rect(10, 10, 50, 50);
2473      | // rectangle with rounded corners
2474      | var c = paper.rect(40, 40, 50, 50, 10);
2475     \*/
2476     paperproto.rect = function (x, y, w, h, r) {
2477         var out = R._engine.rect(this, x || 0, y || 0, w || 0, h || 0, r || 0);
2478         this.__set__ && this.__set__.push(out);
2479         return out;
2480     };
2481     /*\
2482      * Paper.ellipse
2483      [ method ]
2484      **
2485      * Draws an ellipse.
2486      **
2487      > Parameters
2488      **
2489      - x (number) x coordinate of the centre
2490      - y (number) y coordinate of the centre
2491      - rx (number) horizontal radius
2492      - ry (number) vertical radius
2493      = (object) Raphaël element object with type “ellipse”
2494      **
2495      > Usage
2496      | var c = paper.ellipse(50, 50, 40, 20);
2497     \*/
2498     paperproto.ellipse = function (x, y, rx, ry) {
2499         var out = R._engine.ellipse(this, x || 0, y || 0, rx || 0, ry || 0);
2500         this.__set__ && this.__set__.push(out);
2501         return out;
2502     };
2503     /*\
2504      * Paper.path
2505      [ method ]
2506      **
2507      * Creates a path element by given path data string.
2508      **
2509      > Parameters
2510      **
2511      - pathString (string) path data in SVG path string format.
2512      = (object) Raphaël element object with type “path”
2513      # Details of a path's data attribute's format are described in the <a href="http://www.w3.org/TR/SVG/paths.html#PathData">SVG specification</a>.
2514      **
2515      > Usage
2516      | var c = paper.path("M10 10L90 90");
2517      | // draw a diagonal line:
2518      | // move to 10,10, line to 90,90
2519     \*/
2520     paperproto.path = function (pathString) {
2521         pathString && !R.is(pathString, string) && !R.is(pathString[0], array) && (pathString += E);
2522         var out = R._engine.path(R.format[apply](R, arguments), this);
2523         this.__set__ && this.__set__.push(out);
2524         return out;
2525     };
2526     /*\
2527      * Paper.image
2528      [ method ]
2529      **
2530      * Embeds an image into the surface.
2531      **
2532      > Parameters
2533      **
2534      - src (string) URI of the source image
2535      - x (number) x coordinate position
2536      - y (number) y coordinate position
2537      - width (number) width of the image
2538      - height (number) height of the image
2539      = (object) Raphaël element object with type “image”
2540      **
2541      > Usage
2542      | var c = paper.image("apple.png", 10, 10, 80, 80);
2543     \*/
2544     paperproto.image = function (src, x, y, w, h) {
2545         var out = R._engine.image(this, src || "about:blank", x || 0, y || 0, w || 0, h || 0);
2546         this.__set__ && this.__set__.push(out);
2547         return out;
2548     };
2549     /*\
2550      * Paper.text
2551      [ method ]
2552      **
2553      * Draws a text string. If you need line breaks, put “\n” in the string.
2554      **
2555      > Parameters
2556      **
2557      - x (number) x coordinate position
2558      - y (number) y coordinate position
2559      - text (string) The text string to draw
2560      = (object) Raphaël element object with type “text”
2561      **
2562      > Usage
2563      | var t = paper.text(50, 50, "Raphaël\nkicks\nbutt!");
2564     \*/
2565     paperproto.text = function (x, y, text) {
2566         var out = R._engine.text(this, x || 0, y || 0, Str(text));
2567         this.__set__ && this.__set__.push(out);
2568         return out;
2569     };
2570     /*\
2571      * Paper.set
2572      [ method ]
2573      **
2574      * Creates array-like object to keep and operate several elements at once.
2575      * Warning: it doesn’t create any elements for itself in the page, it just groups existing elements.
2576      * Sets act as pseudo elements — all methods available to an element can be used on a set.
2577      = (object) array-like object that represents set of elements
2578      **
2579      > Usage
2580      | var st = paper.set();
2581      | st.push(
2582      |     paper.circle(10, 10, 5),
2583      |     paper.circle(30, 10, 5)
2584      | );
2585      | st.attr({fill: "red"}); // changes the fill of both circles
2586     \*/
2587     paperproto.set = function (itemsArray) {
2588         !R.is(itemsArray, "array") && (itemsArray = Array.prototype.splice.call(arguments, 0, arguments.length));
2589         var out = new Set(itemsArray);
2590         this.__set__ && this.__set__.push(out);
2591         return out;
2592     };
2593     /*\
2594      * Paper.setStart
2595      [ method ]
2596      **
2597      * Creates @Paper.set. All elements that will be created after calling this method and before calling
2598      * @Paper.setFinish will be added to the set.
2599      **
2600      > Usage
2601      | paper.setStart();
2602      | paper.circle(10, 10, 5),
2603      | paper.circle(30, 10, 5)
2604      | var st = paper.setFinish();
2605      | st.attr({fill: "red"}); // changes the fill of both circles
2606     \*/
2607     paperproto.setStart = function (set) {
2608         this.__set__ = set || this.set();
2609     };
2610     /*\
2611      * Paper.setFinish
2612      [ method ]
2613      **
2614      * See @Paper.setStart. This method finishes catching and returns resulting set.
2615      **
2616      = (object) set
2617     \*/
2618     paperproto.setFinish = function (set) {
2619         var out = this.__set__;
2620         delete this.__set__;
2621         return out;
2622     };
2623     /*\
2624      * Paper.setSize
2625      [ method ]
2626      **
2627      * If you need to change dimensions of the canvas call this method
2628      **
2629      > Parameters
2630      **
2631      - width (number) new width of the canvas
2632      - height (number) new height of the canvas
2633      > Usage
2634      | var st = paper.set();
2635      | st.push(
2636      |     paper.circle(10, 10, 5),
2637      |     paper.circle(30, 10, 5)
2638      | );
2639      | st.attr({fill: "red"});
2640     \*/
2641     paperproto.setSize = R._engine.setSize;
2642     /*\
2643      * Paper.setViewBox
2644      [ method ]
2645      **
2646      * Sets the view box of the paper. Practically it gives you ability to zoom and pan whole paper surface by 
2647      * specifying new boundaries.
2648      **
2649      > Parameters
2650      **
2651      x, y, w, h, fit
2652      - x (number) new x position, default is `0`
2653      - y (number) new y position, default is `0`
2654      - w (number) new width of the canvas
2655      - h (number) new height of the canvas
2656      - fit (boolean) `true` if you want graphics to fit into new boundary box
2657     \*/
2658     paperproto.setViewBox = R._engine.setViewBox;
2659     /*\
2660      * Paper.top
2661      [ property ]
2662      **
2663      * Points to the topmost element on the paper
2664     \*/
2665     /*\
2666      * Paper.bottom
2667      [ property ]
2668      **
2669      * Points to the bottom element on the paper
2670     \*/
2671     paperproto.top = paperproto.bottom = null;
2672     /*\
2673      * Paper.raphael
2674      [ property ]
2675      **
2676      * Points to the @Raphael object/function
2677     \*/
2678     paperproto.raphael = R;
2679     var getOffset = function (elem) {
2680         var box = elem.getBoundingClientRect(),
2681             doc = elem.ownerDocument,
2682             body = doc.body,
2683             docElem = doc.documentElement,
2684             clientTop = docElem.clientTop || body.clientTop || 0, clientLeft = docElem.clientLeft || body.clientLeft || 0,
2685             top  = box.top  + (g.win.pageYOffset || docElem.scrollTop || body.scrollTop ) - clientTop,
2686             left = box.left + (g.win.pageXOffset || docElem.scrollLeft || body.scrollLeft) - clientLeft;
2687         return {
2688             y: top,
2689             x: left
2690         };
2691     };
2692     /*\
2693      * Paper.getElementByPoint
2694      [ method ]
2695      **
2696      * Returns you topmost element under given point.
2697      **
2698      = (object) Raphaël element object
2699      > Parameters
2700      **
2701      - x (number) x coordinate from the top left corner of the window
2702      - y (number) y coordinate from the top left corner of the window
2703      > Usage
2704      | paper.getElementByPoint(mouseX, mouseY).attr({stroke: "#f00"});
2705     \*/
2706     paperproto.getElementByPoint = function (x, y) {
2707         var paper = this,
2708             svg = paper.canvas,
2709             target = g.doc.elementFromPoint(x, y);
2710         if (g.win.opera && target.tagName == "svg") {
2711             var so = getOffset(svg),
2712                 sr = svg.createSVGRect();
2713             sr.x = x - so.x;
2714             sr.y = y - so.y;
2715             sr.width = sr.height = 1;
2716             var hits = svg.getIntersectionList(sr, null);
2717             if (hits.length) {
2718                 target = hits[hits.length - 1];
2719             }
2720         }
2721         if (!target) {
2722             return null;
2723         }
2724         while (target.parentNode && target != svg.parentNode && !target.raphael) {
2725             target = target.parentNode;
2726         }
2727         target == paper.canvas.parentNode && (target = svg);
2728         target = target && target.raphael ? paper.getById(target.raphaelid) : null;
2729         return target;
2730     };
2731     /*\
2732      * Paper.getById
2733      [ method ]
2734      **
2735      * Returns you element by its internal ID.
2736      **
2737      > Parameters
2738      **
2739      - id (number) id
2740      = (object) Raphaël element object
2741     \*/
2742     paperproto.getById = function (id) {
2743         var bot = this.bottom;
2744         while (bot) {
2745             if (bot.id == id) {
2746                 return bot;
2747             }
2748             bot = bot.next;
2749         }
2750         return null;
2751     };
2752     /*\
2753      * Paper.forEach
2754      [ method ]
2755      **
2756      * Executes given function for each element on the paper
2757      *
2758      * If callback function returns `false` it will stop loop running.
2759      **
2760      > Parameters
2761      **
2762      - callback (function) function to run
2763      - thisArg (object) context object for the callback
2764      = (object) Paper object
2765     \*/
2766     paperproto.forEach = function (callback, thisArg) {
2767         var bot = this.bottom;
2768         while (bot) {
2769             if (callback.call(thisArg, bot) === false) {
2770                 return this;
2771             }
2772             bot = bot.next;
2773         }
2774         return this;
2775     };
2776     function x_y() {
2777         return this.x + S + this.y;
2778     }
2779     function x_y_w_h() {
2780         return this.x + S + this.y + S + this.width + " \xd7 " + this.height;
2781     }
2782     /*\
2783      * Element.getBBox
2784      [ method ]
2785      **
2786      * Return bounding box for a given element
2787      **
2788      > Parameters
2789      **
2790      - isWithoutTransform (boolean) flag, `true` if you want to have bounding box before transformations. Default is `false`.
2791      = (object) Bounding box object:
2792      o {
2793      o     x: (number) top left corner x
2794      o     y: (number) top left corner y
2795      o     width: (number) width
2796      o     height: (number) height
2797      o }
2798     \*/
2799     elproto.getBBox = function (isWithoutTransform) {
2800         if (this.removed) {
2801             return {};
2802         }
2803         var _ = this._;
2804         if (isWithoutTransform) {
2805             if (_.dirty || !_.bboxwt) {
2806                 this.realPath = getPath[this.type](this);
2807                 _.bboxwt = pathDimensions(this.realPath);
2808                 _.bboxwt.toString = x_y_w_h;
2809                 _.dirty = 0;
2810             }
2811             return _.bboxwt;
2812         }
2813         if (_.dirty || _.dirtyT || !_.bbox) {
2814             if (_.dirty || !this.realPath) {
2815                 _.bboxwt = 0;
2816                 this.realPath = getPath[this.type](this);
2817             }
2818             _.bbox = pathDimensions(mapPath(this.realPath, this.matrix));
2819             _.bbox.toString = x_y_w_h;
2820             _.dirty = _.dirtyT = 0;
2821         }
2822         return _.bbox;
2823     };
2824     /*\
2825      * Element.clone
2826      [ method ]
2827      **
2828      = (object) clone of a given element
2829      **
2830     \*/
2831     elproto.clone = function () {
2832         if (this.removed) {
2833             return null;
2834         }
2835         return this.paper[this.type]().attr(this.attr());
2836     };
2837     /*\
2838      * Element.glow
2839      [ method ]
2840      **
2841      * Return set of elements that create glow-like effect around given element. See @Paper.set.
2842      *
2843      * Note: Glow is not connected to the element. If you change element attributes it won’t adjust itself.
2844      **
2845      > Parameters
2846      **
2847      - glow (object) #optional parameters object with all properties optional:
2848      o {
2849      o     width (number) size of the glow, default is `10`
2850      o     fill (boolean) will it be filled, default is `false`
2851      o     opacity (number) opacity, default is `0.5`
2852      o     offsetx (number) horizontal offset, default is `0`
2853      o     offsety (number) vertical offset, default is `0`
2854      o     color (string) glow colour, default is `black`
2855      o }
2856      = (object) @Paper.set of elements that represents glow
2857     \*/
2858     elproto.glow = function (glow) {
2859         if (this.type == "text") {
2860             return null;
2861         }
2862         glow = glow || {};
2863         var s = {
2864             width: (glow.width || 10) + (+this.attr("stroke-width") || 1),
2865             fill: glow.fill || false,
2866             opacity: glow.opacity || .5,
2867             offsetx: glow.offsetx || 0,
2868             offsety: glow.offsety || 0,
2869             color: glow.color || "#000"
2870         },
2871             c = s.width / 2,
2872             r = this.paper,
2873             out = r.set(),
2874             path = this.realPath || getPath[this.type](this);
2875         path = this.matrix ? mapPath(path, this.matrix) : path;
2876         for (var i = 1; i < c + 1; i++) {
2877             out.push(r.path(path).attr({
2878                 stroke: s.color,
2879                 fill: s.fill ? s.color : "none",
2880                 "stroke-linejoin": "round",
2881                 "stroke-linecap": "round",
2882                 "stroke-width": +(s.width / c * i).toFixed(3),
2883                 opacity: +(s.opacity / c).toFixed(3)
2884             }));
2885         }
2886         return out.insertBefore(this).translate(s.offsetx, s.offsety);
2887     };
2888     var curveslengths = {},
2889     getPointAtSegmentLength = function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, length) {
2890         var len = 0,
2891             precision = 100,
2892             name = [p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y].join(),
2893             cache = curveslengths[name],
2894             old, dot;
2895         !cache && (curveslengths[name] = cache = {data: []});
2896         cache.timer && clearTimeout(cache.timer);
2897         cache.timer = setTimeout(function () {delete curveslengths[name];}, 2e3);
2898         if (length != null && !cache.precision) {
2899             var total = getPointAtSegmentLength(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y);
2900             cache.precision = ~~total * 10;
2901             cache.data = [];
2902         }
2903         precision = cache.precision || precision;
2904         for (var i = 0; i < precision + 1; i++) {
2905             if (cache.data[i * precision]) {
2906                 dot = cache.data[i * precision];
2907             } else {
2908                 dot = R.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, i / precision);
2909                 cache.data[i * precision] = dot;
2910             }
2911             i && (len += pow(pow(old.x - dot.x, 2) + pow(old.y - dot.y, 2), .5));
2912             if (length != null && len >= length) {
2913                 return dot;
2914             }
2915             old = dot;
2916         }
2917         if (length == null) {
2918             return len;
2919         }
2920     },
2921     getLengthFactory = function (istotal, subpath) {
2922         return function (path, length, onlystart) {
2923             path = path2curve(path);
2924             var x, y, p, l, sp = "", subpaths = {}, point,
2925                 len = 0;
2926             for (var i = 0, ii = path.length; i < ii; i++) {
2927                 p = path[i];
2928                 if (p[0] == "M") {
2929                     x = +p[1];
2930                     y = +p[2];
2931                 } else {
2932                     l = getPointAtSegmentLength(x, y, p[1], p[2], p[3], p[4], p[5], p[6]);
2933                     if (len + l > length) {
2934                         if (subpath && !subpaths.start) {
2935                             point = getPointAtSegmentLength(x, y, p[1], p[2], p[3], p[4], p[5], p[6], length - len);
2936                             sp += ["C" + point.start.x, point.start.y, point.m.x, point.m.y, point.x, point.y];
2937                             if (onlystart) {return sp;}
2938                             subpaths.start = sp;
2939                             sp = ["M" + point.x, point.y + "C" + point.n.x, point.n.y, point.end.x, point.end.y, p[5], p[6]].join();
2940                             len += l;
2941                             x = +p[5];
2942                             y = +p[6];
2943                             continue;
2944                         }
2945                         if (!istotal && !subpath) {
2946                             point = getPointAtSegmentLength(x, y, p[1], p[2], p[3], p[4], p[5], p[6], length - len);
2947                             return {x: point.x, y: point.y, alpha: point.alpha};
2948                         }
2949                     }
2950                     len += l;
2951                     x = +p[5];
2952                     y = +p[6];
2953                 }
2954                 sp += p.shift() + p;
2955             }
2956             subpaths.end = sp;
2957             point = istotal ? len : subpath ? subpaths : R.findDotsAtSegment(x, y, p[1], p[2], p[3], p[4], p[5], p[6], 1);
2958             point.alpha && (point = {x: point.x, y: point.y, alpha: point.alpha});
2959             return point;
2960         };
2961     };
2962     var getTotalLength = getLengthFactory(1),
2963         getPointAtLength = getLengthFactory(),
2964         getSubpathsAtLength = getLengthFactory(0, 1);
2965     /*\
2966      * Raphael.getTotalLength
2967      [ method ]
2968      **
2969      * Returns length of the given path in pixels.
2970      **
2971      > Parameters
2972      **
2973      - path (string) SVG path string.
2974      **
2975      = (number) length.
2976     \*/
2977     R.getTotalLength = getTotalLength;
2978     /*\
2979      * Raphael.getPointAtLength
2980      [ method ]
2981      **
2982      * Return coordinates of the point located at the given length on the given path.
2983      **
2984      > Parameters
2985      **
2986      - path (string) SVG path string
2987      - length (number)
2988      **
2989      = (object) representation of the point:
2990      o {
2991      o     x: (number) x coordinate
2992      o     y: (number) y coordinate
2993      o     alpha: (number) angle of derivative
2994      o }
2995     \*/
2996     R.getPointAtLength = getPointAtLength;
2997     /*\
2998      * Raphael.getSubpath
2999      [ method ]
3000      **
3001      * Return subpath of a given path from given length to given length.
3002      **
3003      > Parameters
3004      **
3005      - path (string) SVG path string
3006      - from (number) position of the start of the segment
3007      - to (number) position of the end of the segment
3008      **
3009      = (string) pathstring for the segment
3010     \*/
3011     R.getSubpath = function (path, from, to) {
3012         if (abs(this.getTotalLength(path) - to) < 1e-6) {
3013             return getSubpathsAtLength(path, from).end;
3014         }
3015         var a = getSubpathsAtLength(path, to, 1);
3016         return from ? getSubpathsAtLength(a, from).end : a;
3017     };
3018     /*\
3019      * Element.getTotalLength
3020      [ method ]
3021      **
3022      * Returns length of the path in pixels. Only works for element of “path” type.
3023      = (number) length.
3024     \*/
3025     elproto.getTotalLength = function () {
3026         if (this.type != "path") {return;}
3027         if (this.node.getTotalLength) {
3028             return this.node.getTotalLength();
3029         }
3030         return getTotalLength(this.attrs.path);
3031     };
3032     /*\
3033      * Element.getPointAtLength
3034      [ method ]
3035      **
3036      * Return coordinates of the point located at the given length on the given path. Only works for element of “path” type.
3037      **
3038      > Parameters
3039      **
3040      - length (number)
3041      **
3042      = (object) representation of the point:
3043      o {
3044      o     x: (number) x coordinate
3045      o     y: (number) y coordinate
3046      o     alpha: (number) angle of derivative
3047      o }
3048     \*/
3049     elproto.getPointAtLength = function (length) {
3050         if (this.type != "path") {return;}
3051         return getPointAtLength(this.attrs.path, length);
3052     };
3053     /*\
3054      * Element.getSubpath
3055      [ method ]
3056      **
3057      * Return subpath of a given element from given length to given length. Only works for element of “path” type.
3058      **
3059      > Parameters
3060      **
3061      - from (number) position of the start of the segment
3062      - to (number) position of the end of the segment
3063      **
3064      = (string) pathstring for the segment
3065     \*/
3066     elproto.getSubpath = function (from, to) {
3067         if (this.type != "path") {return;}
3068         return R.getSubpath(this.attrs.path, from, to);
3069     };
3070     /*\
3071      * Raphael.easing_formulas
3072      [ property ]
3073      **
3074      * Object that contains easing formulas for animation. You could extend it with your own. By default it has following list of easing:
3075      # <ul>
3076      #     <li>“linear”</li>
3077      #     <li>“&lt;” or “easeIn” or “ease-in”</li>
3078      #     <li>“>” or “easeOut” or “ease-out”</li>
3079      #     <li>“&lt;>” or “easeInOut” or “ease-in-out”</li>
3080      #     <li>“backIn” or “back-in”</li>
3081      #     <li>“backOut” or “back-out”</li>
3082      #     <li>“elastic”</li>
3083      #     <li>“bounce”</li>
3084      # </ul>
3085      # <p>See also <a href="http://raphaeljs.com/easing.html">Easing demo</a>.</p>
3086     \*/
3087     var ef = R.easing_formulas = {
3088         linear: function (n) {
3089             return n;
3090         },
3091         "<": function (n) {
3092             return pow(n, 1.7);
3093         },
3094         ">": function (n) {
3095             return pow(n, .48);
3096         },
3097         "<>": function (n) {
3098             var q = .48 - n / 1.04,
3099                 Q = math.sqrt(.1734 + q * q),
3100                 x = Q - q,
3101                 X = pow(abs(x), 1 / 3) * (x < 0 ? -1 : 1),
3102                 y = -Q - q,
3103                 Y = pow(abs(y), 1 / 3) * (y < 0 ? -1 : 1),
3104                 t = X + Y + .5;
3105             return (1 - t) * 3 * t * t + t * t * t;
3106         },
3107         backIn: function (n) {
3108             var s = 1.70158;
3109             return n * n * ((s + 1) * n - s);
3110         },
3111         backOut: function (n) {
3112             n = n - 1;
3113             var s = 1.70158;
3114             return n * n * ((s + 1) * n + s) + 1;
3115         },
3116         elastic: function (n) {
3117             if (n == !!n) {
3118                 return n;
3119             }
3120             return pow(2, -10 * n) * math.sin((n - .075) * (2 * PI) / .3) + 1;
3121         },
3122         bounce: function (n) {
3123             var s = 7.5625,
3124                 p = 2.75,
3125                 l;
3126             if (n < (1 / p)) {
3127                 l = s * n * n;
3128             } else {
3129                 if (n < (2 / p)) {
3130                     n -= (1.5 / p);
3131                     l = s * n * n + .75;
3132                 } else {
3133                     if (n < (2.5 / p)) {
3134                         n -= (2.25 / p);
3135                         l = s * n * n + .9375;
3136                     } else {
3137                         n -= (2.625 / p);
3138                         l = s * n * n + .984375;
3139                     }
3140                 }
3141             }
3142             return l;
3143         }
3144     };
3145     ef.easeIn = ef["ease-in"] = ef["<"];
3146     ef.easeOut = ef["ease-out"] = ef[">"];
3147     ef.easeInOut = ef["ease-in-out"] = ef["<>"];
3148     ef["back-in"] = ef.backIn;
3149     ef["back-out"] = ef.backOut;
3150
3151     var animationElements = [],
3152         requestAnimFrame = window.requestAnimationFrame       ||
3153                            window.webkitRequestAnimationFrame ||
3154                            window.mozRequestAnimationFrame    ||
3155                            window.oRequestAnimationFrame      ||
3156                            window.msRequestAnimationFrame     ||
3157                            function (callback) {
3158                                setTimeout(callback, 16);
3159                            },
3160         animation = function () {
3161             var Now = +new Date,
3162                 l = 0;
3163             for (; l < animationElements.length; l++) {
3164                 var e = animationElements[l];
3165                 if (e.el.removed || e.paused) {
3166                     continue;
3167                 }
3168                 var time = Now - e.start,
3169                     ms = e.ms,
3170                     easing = e.easing,
3171                     from = e.from,
3172                     diff = e.diff,
3173                     to = e.to,
3174                     t = e.t,
3175                     that = e.el,
3176                     set = {},
3177                     now;
3178                 if (e.initstatus) {
3179                     time = (e.initstatus * e.anim.top - e.prev) / (e.percent - e.prev) * ms;
3180                     e.status = e.initstatus;
3181                     delete e.initstatus;
3182                     e.stop && animationElements.splice(l--, 1);
3183                 } else {
3184                     e.status = (e.prev + (e.percent - e.prev) * (time / ms)) / e.anim.top;
3185                 }
3186                 if (time < 0) {
3187                     continue;
3188                 }
3189                 if (time < ms) {
3190                     var pos = easing(time / ms);
3191                     for (var attr in from) if (from[has](attr)) {
3192                         switch (availableAnimAttrs[attr]) {
3193                             case nu:
3194                                 now = +from[attr] + pos * ms * diff[attr];
3195                                 break;
3196                             case "colour":
3197                                 now = "rgb(" + [
3198                                     upto255(round(from[attr].r + pos * ms * diff[attr].r)),
3199                                     upto255(round(from[attr].g + pos * ms * diff[attr].g)),
3200                                     upto255(round(from[attr].b + pos * ms * diff[attr].b))
3201                                 ].join(",") + ")";
3202                                 break;
3203                             case "path":
3204                                 now = [];
3205                                 for (var i = 0, ii = from[attr].length; i < ii; i++) {
3206                                     now[i] = [from[attr][i][0]];
3207                                     for (var j = 1, jj = from[attr][i].length; j < jj; j++) {
3208                                         now[i][j] = +from[attr][i][j] + pos * ms * diff[attr][i][j];
3209                                     }
3210                                     now[i] = now[i].join(S);
3211                                 }
3212                                 now = now.join(S);
3213                                 break;
3214                             case "transform":
3215                                 if (diff[attr].real) {
3216                                     now = [];
3217                                     for (i = 0, ii = from[attr].length; i < ii; i++) {
3218                                         now[i] = [from[attr][i][0]];
3219                                         for (j = 1, jj = from[attr][i].length; j < jj; j++) {
3220                                             now[i][j] = from[attr][i][j] + pos * ms * diff[attr][i][j];
3221                                         }
3222                                     }
3223                                 } else {
3224                                     var get = function (i) {
3225                                         return +from[attr][i] + pos * ms * diff[attr][i];
3226                                     };
3227                                     // now = [["r", get(2), 0, 0], ["t", get(3), get(4)], ["s", get(0), get(1), 0, 0]];
3228                                     now = [["m", get(0), get(1), get(2), get(3), get(4), get(5)]];
3229                                 }
3230                                 break;
3231                             case "csv":
3232                                 if (attr == "clip-rect") {
3233                                     now = [];
3234                                     i = 4;
3235                                     while (i--) {
3236                                         now[i] = +from[attr][i] + pos * ms * diff[attr][i];
3237                                     }
3238                                 }
3239                                 break;
3240                             default:
3241                                 var from2 = [].concat(from[attr]);
3242                                 now = [];
3243                                 i = that.paper.customAttributes[attr].length;
3244                                 while (i--) {
3245                                     now[i] = +from2[i] + pos * ms * diff[attr][i];
3246                                 }
3247                                 break;
3248                         }
3249                         set[attr] = now;
3250                     }
3251                     that.attr(set);
3252                     (function (id, that, anim) {
3253                         setTimeout(function () {
3254                             eve("anim.frame." + id, that, anim);
3255                         });
3256                     })(that.id, that, e.anim);
3257                 } else {
3258                     (function(f, el, a) {
3259                         setTimeout(function() {
3260                             eve("anim.frame." + el.id, el, a);
3261                             eve("anim.finish." + el.id, el, a);
3262                             R.is(f, "function") && f.call(el);
3263                         });
3264                     })(e.callback, that, e.anim);
3265                     that.attr(to);
3266                     animationElements.splice(l--, 1);
3267                     if (e.repeat > 1 && !e.next) {
3268                         runAnimation(e.anim, e.el, e.anim.percents[0], null, e.totalOrigin, e.repeat - 1);
3269                     }
3270                     if (e.next && !e.stop) {
3271                         runAnimation(e.anim, e.el, e.next, null, e.totalOrigin, e.repeat);
3272                     }
3273                 }
3274             }
3275             R.svg && that && that.paper && that.paper.safari();
3276             animationElements.length && requestAnimFrame(animation);
3277         },
3278         upto255 = function (color) {
3279             return color > 255 ? 255 : color < 0 ? 0 : color;
3280         };
3281     /*\
3282      * Element.animateWith
3283      [ method ]
3284      **
3285      * Acts similar to @Element.animate, but ensure that given animation runs in sync with another given element.
3286      **
3287      > Parameters
3288      **
3289      - params (object) final attributes for the element, see also @Element.attr
3290      - ms (number) number of milliseconds for animation to run
3291      - easing (string) #optional easing type. Accept on of @Raphael.easing_formulas or CSS format: `cubic&#x2010;bezier(XX,&#160;XX,&#160;XX,&#160;XX)`
3292      - callback (function) #optional callback function. Will be called at the end of animation.
3293      * or
3294      - animation (object) animation object, see @Raphael.animation
3295      **
3296      = (object) original element
3297     \*/
3298     elproto.animateWith = function (element, params, ms, easing, callback) {
3299         this.animate(params, ms, easing, callback);
3300         var start, el;
3301         for (var i = 0, ii = animationElements.length; i < ii; i++) {
3302             el = animationElements[i];
3303             if (el.el.id == element.id) {
3304                 start = el.timestamp;
3305             } else if (el.el.id == this.id) {
3306                 el.start = start;
3307             }
3308         }
3309         return this.animate(params, ms, easing, callback);
3310     };
3311     function CubicBezierAtTime(t, p1x, p1y, p2x, p2y, duration) {
3312         var cx = 3 * p1x,
3313             bx = 3 * (p2x - p1x) - cx,
3314             ax = 1 - cx - bx,
3315             cy = 3 * p1y,
3316             by = 3 * (p2y - p1y) - cy,
3317             ay = 1 - cy - by;
3318         function sampleCurveX(t) {
3319             return ((ax * t + bx) * t + cx) * t;
3320         }
3321         function solve(x, epsilon) {
3322             var t = solveCurveX(x, epsilon);
3323             return ((ay * t + by) * t + cy) * t;
3324         }
3325         function solveCurveX(x, epsilon) {
3326             var t0, t1, t2, x2, d2, i;
3327             for(t2 = x, i = 0; i < 8; i++) {
3328                 x2 = sampleCurveX(t2) - x;
3329                 if (abs(x2) < epsilon) {
3330                     return t2;
3331                 }
3332                 d2 = (3 * ax * t2 + 2 * bx) * t2 + cx;
3333                 if (abs(d2) < 1e-6) {
3334                     break;
3335                 }
3336                 t2 = t2 - x2 / d2;
3337             }
3338             t0 = 0;
3339             t1 = 1;
3340             t2 = x;
3341             if (t2 < t0) {
3342                 return t0;
3343             }
3344             if (t2 > t1) {
3345                 return t1;
3346             }
3347             while (t0 < t1) {
3348                 x2 = sampleCurveX(t2);
3349                 if (abs(x2 - x) < epsilon) {
3350                     return t2;
3351                 }
3352                 if (x > x2) {
3353                     t0 = t2;
3354                 } else {
3355                     t1 = t2;
3356                 }
3357                 t2 = (t1 - t0) / 2 + t0;
3358             }
3359             return t2;
3360         }
3361         return solve(t, 1 / (200 * duration));
3362     }
3363     elproto.onAnimation = function (f) {
3364         f ? eve.on("anim.frame." + this.id, f) : eve.unbind("anim.frame." + this.id);
3365         return this;
3366     };
3367     function Animation(anim, ms) {
3368         var percents = [];
3369         this.anim = anim;
3370         this.ms = ms;
3371         this.times = 1;
3372         if (this.anim) {
3373             for (var attr in this.anim) if (this.anim[has](attr)) {
3374                 percents.push(+attr);
3375             }
3376             percents.sort(sortByNumber);
3377         }
3378         this.top = percents[percents.length - 1];
3379         this.percents = percents;
3380     }
3381     /*\
3382      * Animation.delay
3383      [ method ]
3384      **
3385      * Creates a copy of existing animation object with given delay.
3386      **
3387      > Parameters
3388      **
3389      - delay (number) number of ms to pass between animation start and actual animation
3390      **
3391      = (object) new altered Animation object
3392     \*/
3393     Animation.prototype.delay = function (delay) {
3394         var a = new Animation(this.anim, this.ms);
3395         a.times = this.times;
3396         a.del = +delay || 0;
3397         return a;
3398     };
3399     /*\
3400      * Animation.repeat
3401      [ method ]
3402      **
3403      * Creates a copy of existing animation object with given repetition.
3404      **
3405      > Parameters
3406      **
3407      - repeat (number) number iterations of animation. For infinite animation pass `Infinity`
3408      **
3409      = (object) new altered Animation object
3410     \*/
3411     Animation.prototype.repeat = function (times) { 
3412         var a = new Animation(this.anim, this.ms);
3413         a.del = this.del;
3414         a.times = math.floor(mmax(times, 0)) || 1;
3415         return a;
3416     };
3417     function runAnimation(anim, element, percent, status, totalOrigin, times) {
3418         percent = toFloat(percent);
3419         var params,
3420             isInAnim,
3421             isInAnimSet,
3422             percents = [],
3423             next,
3424             prev,
3425             timestamp,
3426             ms = anim.ms,
3427             from = {},
3428             to = {},
3429             diff = {};
3430         if (status) {
3431             for (i = 0, ii = animationElements.length; i < ii; i++) {
3432                 var e = animationElements[i];
3433                 if (e.el.id == element.id && e.anim == anim) {
3434                     if (e.percent != percent) {
3435                         animationElements.splice(i, 1);
3436                         isInAnimSet = 1;
3437                     } else {
3438                         isInAnim = e;
3439                     }
3440                     element.attr(e.totalOrigin);
3441                     break;
3442                 }
3443             }
3444         } else {
3445             status = +to; // NaN
3446         }
3447         for (var i = 0, ii = anim.percents.length; i < ii; i++) {
3448             if (anim.percents[i] == percent || anim.percents[i] > status * anim.top) {
3449                 percent = anim.percents[i];
3450                 prev = anim.percents[i - 1] || 0;
3451                 ms = ms / anim.top * (percent - prev);
3452                 next = anim.percents[i + 1];
3453                 params = anim.anim[percent];
3454                 break;
3455             } else if (status) {
3456                 element.attr(anim.anim[anim.percents[i]]);
3457             }
3458         }
3459         if (!params) {
3460             return;
3461         }
3462         if (!isInAnim) {
3463             for (attr in params) if (params[has](attr)) {
3464                 if (availableAnimAttrs[has](attr) || element.paper.customAttributes[has](attr)) {
3465                     from[attr] = element.attr(attr);
3466                     (from[attr] == null) && (from[attr] = availableAttrs[attr]);
3467                     to[attr] = params[attr];
3468                     switch (availableAnimAttrs[attr]) {
3469                         case nu:
3470                             diff[attr] = (to[attr] - from[attr]) / ms;
3471                             break;
3472                         case "colour":
3473                             from[attr] = R.getRGB(from[attr]);
3474                             var toColour = R.getRGB(to[attr]);
3475                             diff[attr] = {
3476                                 r: (toColour.r - from[attr].r) / ms,
3477                                 g: (toColour.g - from[attr].g) / ms,
3478                                 b: (toColour.b - from[attr].b) / ms
3479                             };
3480                             break;
3481                         case "path":
3482                             var pathes = path2curve(from[attr], to[attr]),
3483                                 toPath = pathes[1];
3484                             from[attr] = pathes[0];
3485                             diff[attr] = [];
3486                             for (i = 0, ii = from[attr].length; i < ii; i++) {
3487                                 diff[attr][i] = [0];
3488                                 for (var j = 1, jj = from[attr][i].length; j < jj; j++) {
3489                                     diff[attr][i][j] = (toPath[i][j] - from[attr][i][j]) / ms;
3490                                 }
3491                             }
3492                             break;
3493                         case "transform":
3494                             var _ = element._,
3495                                 eq = equaliseTransform(_[attr], to[attr]);
3496                             if (eq) {
3497                                 from[attr] = eq.from;
3498                                 to[attr] = eq.to;
3499                                 diff[attr] = [];
3500                                 diff[attr].real = true;
3501                                 for (i = 0, ii = from[attr].length; i < ii; i++) {
3502                                     diff[attr][i] = [from[attr][i][0]];
3503                                     for (j = 1, jj = from[attr][i].length; j < jj; j++) {
3504                                         diff[attr][i][j] = (to[attr][i][j] - from[attr][i][j]) / ms;
3505                                     }
3506                                 }
3507                             } else {
3508                                 var m = (element.matrix || new Matrix),
3509                                     to2 = {
3510                                         _: {transform: _.transform},
3511                                         getBBox: function () {
3512                                             return element.getBBox(1);
3513                                         }
3514                                     };
3515                                 from[attr] = [
3516                                     m.a,
3517                                     m.b,
3518                                     m.c,
3519                                     m.d,
3520                                     m.e,
3521                                     m.f
3522                                 ];
3523                                 extractTransform(to2, to[attr]);
3524                                 to[attr] = to2._.transform;
3525                                 diff[attr] = [
3526                                     (to2.matrix.a - m.a) / ms,
3527                                     (to2.matrix.b - m.b) / ms,
3528                                     (to2.matrix.c - m.c) / ms,
3529                                     (to2.matrix.d - m.d) / ms,
3530                                     (to2.matrix.e - m.e) / ms,
3531                                     (to2.matrix.e - m.f) / ms
3532                                 ];
3533                                 // from[attr] = [_.sx, _.sy, _.deg, _.dx, _.dy];
3534                                 // var to2 = {_:{}, getBBox: function () { return element.getBBox(); }};
3535                                 // extractTransform(to2, to[attr]);
3536                                 // diff[attr] = [
3537                                 //     (to2._.sx - _.sx) / ms,
3538                                 //     (to2._.sy - _.sy) / ms,
3539                                 //     (to2._.deg - _.deg) / ms,
3540                                 //     (to2._.dx - _.dx) / ms,
3541                                 //     (to2._.dy - _.dy) / ms
3542                                 // ];
3543                             }
3544                             break;
3545                         case "csv":
3546                             var values = Str(params[attr]).split(separator),
3547                                 from2 = Str(from[attr]).split(separator);
3548                             if (attr == "clip-rect") {
3549                                 from[attr] = from2;
3550                                 diff[attr] = [];
3551                                 i = from2.length;
3552                                 while (i--) {
3553                                     diff[attr][i] = (values[i] - from[attr][i]) / ms;
3554                                 }
3555                             }
3556                             to[attr] = values;
3557                             break;
3558                         default:
3559                             values = [].concat(params[attr]);
3560                             from2 = [].concat(from[attr]);
3561                             diff[attr] = [];
3562                             i = element.paper.customAttributes[attr].length;
3563                             while (i--) {
3564                                 diff[attr][i] = ((values[i] || 0) - (from2[i] || 0)) / ms;
3565                             }
3566                             break;
3567                     }
3568                 }
3569             }
3570             var easing = params.easing,
3571                 easyeasy = R.easing_formulas[easing];
3572             if (!easyeasy) {
3573                 easyeasy = Str(easing).match(bezierrg);
3574                 if (easyeasy && easyeasy.length == 5) {
3575                     var curve = easyeasy;
3576                     easyeasy = function (t) {
3577                         return CubicBezierAtTime(t, +curve[1], +curve[2], +curve[3], +curve[4], ms);
3578                     };
3579                 } else {
3580                     easyeasy = pipe;
3581                 }
3582             }
3583             timestamp = params.start || anim.start || +new Date;
3584             e = {
3585                 anim: anim,
3586                 percent: percent,
3587                 timestamp: timestamp,
3588                 start: timestamp + (anim.del || 0),
3589                 status: 0,
3590                 initstatus: status || 0,
3591                 stop: false,
3592                 ms: ms,
3593                 easing: easyeasy,
3594                 from: from,
3595                 diff: diff,
3596                 to: to,
3597                 el: element,
3598                 callback: params.callback,
3599                 prev: prev,
3600                 next: next,
3601                 repeat: times || anim.times,
3602                 origin: element.attr(),
3603                 totalOrigin: totalOrigin
3604             };
3605             animationElements.push(e);
3606             if (status && !isInAnim) {
3607                 e.stop = true;
3608                 e.start = new Date - ms * status;
3609                 if (animationElements.length == 1) {
3610                     return animation();
3611                 }
3612             }
3613             animationElements.length == 1 && requestAnimFrame(animation);
3614         } else {
3615             isInAnim.initstatus = status;
3616             isInAnim.start = new Date - isInAnim.ms * status;
3617         }
3618         eve("anim.start." + element.id, element, anim);
3619     }
3620     /*\
3621      * Raphael.animation
3622      [ method ]
3623      **
3624      * Creates an animation object that can be passed to the @Element.animate or @Element.animateWith methods.
3625      * See also @Animation.delay and @Animation.repeat methods.
3626      **
3627      > Parameters
3628      **
3629      - params (object) final attributes for the element, see also @Element.attr
3630      - ms (number) number of milliseconds for animation to run
3631      - easing (string) #optional easing type. Accept one of @Raphael.easing_formulas or CSS format: `cubic&#x2010;bezier(XX,&#160;XX,&#160;XX,&#160;XX)`
3632      - callback (function) #optional callback function. Will be called at the end of animation.
3633      **
3634      = (object) @Animation
3635     \*/
3636     R.animation = function (params, ms, easing, callback) {
3637         if (R.is(easing, "function") || !easing) {
3638             callback = callback || easing || null;
3639             easing = null;
3640         }
3641         params = Object(params);
3642         ms = +ms || 0;
3643         var p = {},
3644             json,
3645             attr;
3646         for (attr in params) if (params[has](attr) && toFloat(attr) != attr) {
3647             json = true;
3648             p[attr] = params[attr];
3649         }
3650         if (!json) {
3651             return new Animation(params, ms);
3652         } else {
3653             easing && (p.easing = easing);
3654             callback && (p.callback = callback);
3655             return new Animation({100: p}, ms);
3656         }
3657     };
3658     /*\
3659      * Element.animate
3660      [ method ]
3661      **
3662      * Creates and starts animation for given element.
3663      **
3664      > Parameters
3665      **
3666      - params (object) final attributes for the element, see also @Element.attr
3667      - ms (number) number of milliseconds for animation to run
3668      - easing (string) #optional easing type. Accept one of @Raphael.easing_formulas or CSS format: `cubic&#x2010;bezier(XX,&#160;XX,&#160;XX,&#160;XX)`
3669      - callback (function) #optional callback function. Will be called at the end of animation.
3670      * or
3671      - animation (object) animation object, see @Raphael.animation
3672      **
3673      = (object) original element
3674     \*/
3675     elproto.animate = function (params, ms, easing, callback) {
3676         var element = this;
3677         if (element.removed) {
3678             callback && callback.call(element);
3679             return element;
3680         }
3681         var anim = params instanceof Animation ? params : R.animation(params, ms, easing, callback);
3682         runAnimation(anim, element, anim.percents[0], null, element.attr());
3683         return element;
3684     };
3685     /*\
3686      * Element.setTime
3687      [ method ]
3688      **
3689      * Sets the status of animation of the element in milliseconds. Similar to @Element.status method.
3690      **
3691      > Parameters
3692      **
3693      - anim (object) animation object
3694      - value (number) number of milliseconds from the beginning of the animation
3695      **
3696      = (object) original element if `value` is specified
3697      * Note, that during animation following events are triggered:
3698      *
3699      * On each animation frame event `anim.frame.<id>`, on start `anim.start.<id>` and on end `anim.finish.<id>`.
3700     \*/
3701     elproto.setTime = function (anim, value) {
3702         if (anim && value != null) {
3703             this.status(anim, mmin(value, anim.ms) / anim.ms);
3704         }
3705         return this;
3706     };
3707     /*\
3708      * Element.status
3709      [ method ]
3710      **
3711      * Gets or sets the status of animation of the element.
3712      **
3713      > Parameters
3714      **
3715      - anim (object) #optional animation object
3716      - value (number) #optional 0 – 1. If specified, method works like a setter and sets the status of a given animation to the value. This will cause animation to jump to the given position.
3717      **
3718      = (number) status
3719      * or
3720      = (array) status if `anim` is not specified. Array of objects in format:
3721      o {
3722      o     anim: (object) animation object
3723      o     status: (number) status
3724      o }
3725      * or
3726      = (object) original element if `value` is specified
3727     \*/
3728     elproto.status = function (anim, value) {
3729         var out = [],
3730             i = 0,
3731             len,
3732             e;
3733         if (value != null) {
3734             runAnimation(anim, this, -1, mmin(value, 1));
3735             return this;
3736         } else {
3737             len = animationElements.length;
3738             for (; i < len; i++) {
3739                 e = animationElements[i];
3740                 if (e.el.id == this.id && (!anim || e.anim == anim)) {
3741                     if (anim) {
3742                         return e.status;
3743                     }
3744                     out.push({anim: e.anim, status: e.status});
3745                 }
3746             }
3747             if (anim) {
3748                 return 0;
3749             }
3750             return out;
3751         }
3752     };
3753     /*\
3754      * Element.pause
3755      [ method ]
3756      **
3757      * Stops animation of the element with ability to resume it later on.
3758      **
3759      > Parameters
3760      **
3761      - anim (object) #optional animation object
3762      **
3763      = (object) original element
3764     \*/
3765     elproto.pause = function (anim) {
3766         for (var i = 0; i < animationElements.length; i++) if (animationElements[i].el.id == this.id && (!anim || animationElements[i].anim == anim)) {
3767             if (eve("anim.pause." + this.id, this, animationElements[i].anim) !== false) {
3768                 animationElements[i].paused = true;
3769             }
3770         }
3771         return this;
3772     };
3773     /*\
3774      * Element.resume
3775      [ method ]
3776      **
3777      * Resumes animation if it was paused with @Element.pause method.
3778      **
3779      > Parameters
3780      **
3781      - anim (object) #optional animation object
3782      **
3783      = (object) original element
3784     \*/
3785     elproto.resume = function (anim) {
3786         for (var i = 0; i < animationElements.length; i++) if (animationElements[i].el.id == this.id && (!anim || animationElements[i].anim == anim)) {
3787             var e = animationElements[i];
3788             if (eve("anim.resume." + this.id, this, e.anim) !== false) {
3789                 delete e.paused;
3790                 this.status(e.anim, e.status);
3791             }
3792         }
3793         return this;
3794     };
3795     /*\
3796      * Element.stop
3797      [ method ]
3798      **
3799      * Stops animation of the element.
3800      **
3801      > Parameters
3802      **
3803      - anim (object) #optional animation object
3804      **
3805      = (object) original element
3806     \*/
3807     elproto.stop = function (anim) {
3808         for (var i = 0; i < animationElements.length; i++) if (animationElements[i].el.id == this.id && (!anim || animationElements[i].anim == anim)) {
3809             if (eve("anim.stop." + this.id, this, animationElements[i].anim) !== false) {
3810                 animationElements.splice(i--, 1);
3811             }
3812         }
3813         return this;
3814     };
3815     elproto.toString = function () {
3816         return "Rapha\xebl\u2019s object";
3817     };
3818
3819     // Set
3820     var Set = function (items) {
3821         this.items = [];
3822         this.length = 0;
3823         this.type = "set";
3824         if (items) {
3825             for (var i = 0, ii = items.length; i < ii; i++) {
3826                 if (items[i] && (items[i].constructor == elproto.constructor || items[i].constructor == Set)) {
3827                     this[this.items.length] = this.items[this.items.length] = items[i];
3828                     this.length++;
3829                 }
3830             }
3831         }
3832     },
3833     setproto = Set.prototype;
3834     /*\
3835      * Set.push
3836      [ method ]
3837      **
3838      * Adds each argument to the current set.
3839      = (object) original element
3840     \*/
3841     setproto.push = function () {
3842         var item,
3843             len;
3844         for (var i = 0, ii = arguments.length; i < ii; i++) {
3845             item = arguments[i];
3846             if (item && (item.constructor == elproto.constructor || item.constructor == Set)) {
3847                 len = this.items.length;
3848                 this[len] = this.items[len] = item;
3849                 this.length++;
3850             }
3851         }
3852         return this;
3853     };
3854     /*\
3855      * Set.pop
3856      [ method ]
3857      **
3858      * Removes last element and returns it.
3859      = (object) element
3860     \*/
3861     setproto.pop = function () {
3862         this.length && delete this[this.length--];
3863         return this.items.pop();
3864     };
3865     /*\
3866      * Set.forEach
3867      [ method ]
3868      **
3869      * Executes given function for each element in the set.
3870      *
3871      * If function returns `false` it will stop loop running.
3872      **
3873      > Parameters
3874      **
3875      - callback (function) function to run
3876      - thisArg (object) context object for the callback
3877      = (object) Set object
3878     \*/
3879     setproto.forEach = function (callback, thisArg) {
3880         for (var i = 0, ii = this.items.length; i < ii; i++) {
3881             if (callback.call(thisArg, this.items[i]) === false) {
3882                 return this;
3883             }
3884         }
3885         return this;
3886     };
3887     for (var method in elproto) if (elproto[has](method)) {
3888         setproto[method] = (function (methodname) {
3889             return function () {
3890                 var arg = arguments;
3891                 return this.forEach(function (el) {
3892                     el[methodname][apply](el, arg);
3893                 });
3894             };
3895         })(method);
3896     }
3897     setproto.attr = function (name, value) {
3898         if (name && R.is(name, array) && R.is(name[0], "object")) {
3899             for (var j = 0, jj = name.length; j < jj; j++) {
3900                 this.items[j].attr(name[j]);
3901             }
3902         } else {
3903             for (var i = 0, ii = this.items.length; i < ii; i++) {
3904                 this.items[i].attr(name, value);
3905             }
3906         }
3907         return this;
3908     };
3909     setproto.clear = function () {
3910         while (this.length) {
3911             this.pop();
3912         }
3913     };
3914     setproto.animate = function (params, ms, easing, callback) {
3915         (R.is(easing, "function") || !easing) && (callback = easing || null);
3916         var len = this.items.length,
3917             i = len,
3918             item,
3919             set = this,
3920             collector;
3921         if (!len) {
3922             return this;
3923         }
3924         callback && (collector = function () {
3925             !--len && callback.call(set);
3926         });
3927         easing = R.is(easing, string) ? easing : collector;
3928         var anim = params instanceof Animation ? params : R.animation(params, ms, easing, collector);
3929         item = this.items[--i].animate(anim);
3930         while (i--) {
3931             this.items[i] && !this.items[i].removed && this.items[i].animateWith(item, anim);
3932         }
3933         return this;
3934     };
3935     setproto.insertAfter = function (el) {
3936         var i = this.items.length;
3937         while (i--) {
3938             this.items[i].insertAfter(el);
3939         }
3940         return this;
3941     };
3942     setproto.getBBox = function () {
3943         var x = [],
3944             y = [],
3945             w = [],
3946             h = [];
3947         for (var i = this.items.length; i--;) if (!this.items[i].removed) {
3948             var box = this.items[i].getBBox();
3949             x.push(box.x);
3950             y.push(box.y);
3951             w.push(box.x + box.width);
3952             h.push(box.y + box.height);
3953         }
3954         x = mmin[apply](0, x);
3955         y = mmin[apply](0, y);
3956         return {
3957             x: x,
3958             y: y,
3959             width: mmax[apply](0, w) - x,
3960             height: mmax[apply](0, h) - y
3961         };
3962     };
3963     setproto.clone = function (s) {
3964         s = new Set;
3965         for (var i = 0, ii = this.items.length; i < ii; i++) {
3966             s.push(this.items[i].clone());
3967         }
3968         return s;
3969     };
3970     setproto.toString = function () {
3971         return "Rapha\xebl\u2018s set";
3972     };
3973
3974     R.registerFont = function (font) {
3975         if (!font.face) {
3976             return font;
3977         }
3978         this.fonts = this.fonts || {};
3979         var fontcopy = {
3980                 w: font.w,
3981                 face: {},
3982                 glyphs: {}
3983             },
3984             family = font.face["font-family"];
3985         for (var prop in font.face) if (font.face[has](prop)) {
3986             fontcopy.face[prop] = font.face[prop];
3987         }
3988         if (this.fonts[family]) {
3989             this.fonts[family].push(fontcopy);
3990         } else {
3991             this.fonts[family] = [fontcopy];
3992         }
3993         if (!font.svg) {
3994             fontcopy.face["units-per-em"] = toInt(font.face["units-per-em"], 10);
3995             for (var glyph in font.glyphs) if (font.glyphs[has](glyph)) {
3996                 var path = font.glyphs[glyph];
3997                 fontcopy.glyphs[glyph] = {
3998                     w: path.w,
3999                     k: {},
4000                     d: path.d && "M" + path.d.replace(/[mlcxtrv]/g, function (command) {
4001                             return {l: "L", c: "C", x: "z", t: "m", r: "l", v: "c"}[command] || "M";
4002                         }) + "z"
4003                 };
4004                 if (path.k) {
4005                     for (var k in path.k) if (path[has](k)) {
4006                         fontcopy.glyphs[glyph].k[k] = path.k[k];
4007                     }
4008                 }
4009             }
4010         }
4011         return font;
4012     };
4013     paperproto.getFont = function (family, weight, style, stretch) {
4014         stretch = stretch || "normal";
4015         style = style || "normal";
4016         weight = +weight || {normal: 400, bold: 700, lighter: 300, bolder: 800}[weight] || 400;
4017         if (!R.fonts) {
4018             return;
4019         }
4020         var font = R.fonts[family];
4021         if (!font) {
4022             var name = new RegExp("(^|\\s)" + family.replace(/[^\w\d\s+!~.:_-]/g, E) + "(\\s|$)", "i");
4023             for (var fontName in R.fonts) if (R.fonts[has](fontName)) {
4024                 if (name.test(fontName)) {
4025                     font = R.fonts[fontName];
4026                     break;
4027                 }
4028             }
4029         }
4030         var thefont;
4031         if (font) {
4032             for (var i = 0, ii = font.length; i < ii; i++) {
4033                 thefont = font[i];
4034                 if (thefont.face["font-weight"] == weight && (thefont.face["font-style"] == style || !thefont.face["font-style"]) && thefont.face["font-stretch"] == stretch) {
4035                     break;
4036                 }
4037             }
4038         }
4039         return thefont;
4040     };
4041     paperproto.print = function (x, y, string, font, size, origin, letter_spacing) {
4042         origin = origin || "middle"; // baseline|middle
4043         letter_spacing = mmax(mmin(letter_spacing || 0, 1), -1);
4044         var out = this.set(),
4045             letters = Str(string).split(E),
4046             shift = 0,
4047             path = E,
4048             scale;
4049         R.is(font, string) && (font = this.getFont(font));
4050         if (font) {
4051             scale = (size || 16) / font.face["units-per-em"];
4052             var bb = font.face.bbox.split(separator),
4053                 top = +bb[0],
4054                 height = +bb[1] + (origin == "baseline" ? bb[3] - bb[1] + (+font.face.descent) : (bb[3] - bb[1]) / 2);
4055             for (var i = 0, ii = letters.length; i < ii; i++) {
4056                 var prev = i && font.glyphs[letters[i - 1]] || {},
4057                     curr = font.glyphs[letters[i]];
4058                 shift += i ? (prev.w || font.w) + (prev.k && prev.k[letters[i]] || 0) + (font.w * letter_spacing) : 0;
4059                 curr && curr.d && out.push(this.path(curr.d).attr({
4060                     fill: "#000",
4061                     stroke: "none",
4062                     transform: [["t", shift * scale, 0]]
4063                 }));
4064             }
4065             out.transform(["...s", scale, scale, top, height, "t", (x - top) / scale, (y - height) / scale]);
4066         }
4067         return out;
4068     };
4069
4070     /*\
4071      * Raphael.format
4072      [ method ]
4073      **
4074      * Simple format function. Replaces construction of type “`{<number>}`” to the corresponding argument.
4075      **
4076      > Parameters
4077      **
4078      - token (string) string to format
4079      - … (string) rest of arguments will be treated as parameters for replacement
4080      = (string) formated string
4081      > Usage
4082      | var x = 10,
4083      |     y = 20,
4084      |     width = 40,
4085      |     height = 50;
4086      | // this will draw a rectangular shape equivalent to "M10,20h40v50h-40z"
4087      | paper.path(Raphael.format("M{1},{2}h{3}v{4}h{5}z", x, y, width, height, -width));
4088     \*/
4089     R.format = function (token, params) {
4090         var args = R.is(params, array) ? [0][concat](params) : arguments;
4091         token && R.is(token, string) && args.length - 1 && (token = token.replace(formatrg, function (str, i) {
4092             return args[++i] == null ? E : args[i];
4093         }));
4094         return token || E;
4095     };
4096     /*\
4097      * Raphael.fullfill
4098      [ method ]
4099      **
4100      * A little bit more advanced format function than @Raphael.format. Replaces construction of type “`{<name>}`” to the corresponding argument.
4101      **
4102      > Parameters
4103      **
4104      - token (string) string to format
4105      - json (object) object which properties will be used as a replacement
4106      = (string) formated string
4107      > Usage
4108      | // this will draw a rectangular shape equivalent to "M10,20h40v50h-40z"
4109      | paper.path(Raphael.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']}z", {
4110      |     x: 10,
4111      |     y: 20,
4112      |     dim: {
4113      |         width: 40,
4114      |         height: 50,
4115      |         "negative width": -40
4116      |     }
4117      | }));
4118     \*/
4119     R.fullfill = (function () {
4120         var tokenRegex = /\{([^\}]+)\}/g,
4121             objNotationRegex = /(?:(?:^|\.)(.+?)(?=\[|\.|$|\()|\[('|")(.+?)\2\])(\(\))?/g, // matches .xxxxx or ["xxxxx"] to run over object properties
4122             replacer = function (all, key, obj) {
4123                 var res = obj;
4124                 key.replace(objNotationRegex, function (all, name, quote, quotedName, isFunc) {
4125                     name = name || quotedName;
4126                     if (res) {
4127                         if (name in res) {
4128                             res = res[name];
4129                         }
4130                         typeof res == "function" && isFunc && (res = res());
4131                     }
4132                 });
4133                 res = (res == null || res == obj ? all : res) + "";
4134                 return res;
4135             };
4136         return function (str, obj) {
4137             return String(str).replace(tokenRegex, function (all, key) {
4138                 return replacer(all, key, obj);
4139             });
4140         };
4141     })();
4142     /*\
4143      * Raphael.ninja
4144      [ method ]
4145      **
4146      * If you want to leave no trace of Raphaël (Well, Raphaël creates only one global variable `Raphael`, but anyway.) You can use `ninja` method.
4147      * Beware, that in this case plugins could stop working, because they are depending on global variable existance.
4148      **
4149      = (object) Raphael object
4150      > Usage
4151      | (function (local_raphael) {
4152      |     var paper = local_raphael(10, 10, 320, 200);
4153      |     …
4154      | })(Raphael.ninja());
4155     \*/
4156     R.ninja = function () {
4157         oldRaphael.was ? (g.win.Raphael = oldRaphael.is) : delete Raphael;
4158         return R;
4159     };
4160     /*\
4161      * Raphael.st
4162      [ property (object) ]
4163      **
4164      * You can add your own method to elements and sets. It is wise to add a set method for each element method
4165      * you added, so you will be able to call the same method on sets too.
4166      **
4167      * See also @Raphael.el.
4168      > Usage
4169      | Raphael.el.red = function () {
4170      |     this.attr({fill: "#f00"});
4171      | };
4172      | Raphael.st.red = function () {
4173      |     this.forEach(function () {
4174      |         this.red();
4175      |     });
4176      | };
4177      | // then use it
4178      | paper.set(paper.circle(100, 100, 20), paper.circle(110, 100, 20)).red();
4179     \*/
4180     R.st = setproto;
4181     // Firefox <3.6 fix: http://webreflection.blogspot.com/2009/11/195-chars-to-help-lazy-loading.html
4182     (function (doc, loaded, f) {
4183         if (doc.readyState == null && doc.addEventListener){
4184             doc.addEventListener(loaded, f = function () {
4185                 doc.removeEventListener(loaded, f, false);
4186                 doc.readyState = "complete";
4187             }, false);
4188             doc.readyState = "loading";
4189         }
4190         function isLoaded() {
4191             (/in/).test(doc.readyState) ? setTimeout(isLoaded, 9) : R.eve("DOMload");
4192         }
4193         isLoaded();
4194     })(document, "DOMContentLoaded");
4195
4196     oldRaphael.was ? (g.win.Raphael = R) : (Raphael = R);
4197     
4198     eve.on("DOMload", function () {
4199         loaded = true;
4200     });
4201 })();