From e78d730ed7e214ee48561b3f91f29d722f8f0c53 Mon Sep 17 00:00:00 2001 From: Dmitry Baranovskiy Date: Wed, 27 Jul 2011 16:37:35 +1000 Subject: [PATCH] Documentation fixes --- raphael-min.js | 9 +- raphael.core.js | 480 +++++++++++++----------------- raphael.js | 768 ++++++++++++++++++++++++++++++------------------ raphael.svg.js | 2 + reference.html | 563 +++++++++++++++++++++++++++++------ 5 files changed, 1162 insertions(+), 660 deletions(-) diff --git a/raphael-min.js b/raphael-min.js index 29a95de..6b72c9a 100644 --- a/raphael-min.js +++ b/raphael-min.js @@ -1 +1,8 @@ -(function(){function cq(b,d,e,f,h,i){e=Q(e);var j,k,l,m=[],n,o,p,q=b.ms,s={},t={},u={};if(f)for(w=0,x=ck.length;wf*b.top){e=b.percents[w],o=b.percents[w-1]||0,q=q/b.top*(e-o),n=b.percents[w+1],j=b.anim[e];break}f&&d.attr(b.anim[b.percents[w]])}if(!!j){if(!k){for(attr in j)if(j[g](attr))if(V[g](attr)||d.paper.customAttributes[g](attr)){s[attr]=d.attr(attr),s[attr]==null&&(s[attr]=U[attr]),t[attr]=j[attr];switch(V[attr]){case C:u[attr]=(t[attr]-s[attr])/q;break;case"colour":s[attr]=a.getRGB(s[attr]);var y=a.getRGB(t[attr]);u[attr]={r:(y.r-s[attr].r)/q,g:(y.g-s[attr].g)/q,b:(y.b-s[attr].b)/q};break;case"path":var z=bF(s[attr],t[attr]),A=z[1];s[attr]=z[0],u[attr]=[];for(w=0,x=s[attr].length;wd)return d;while(cf?c=e:d=e,e=(d-c)/2+c}return e}function n(a,b){var c=o(a,b);return((l*c+k)*c+j)*c}function m(a){return((i*a+h)*a+g)*a}var g=3*b,h=3*(d-b)-g,i=1-g-h,j=3*c,k=3*(e-c)-j,l=1-j-k;return n(a,1/(200*f))}function cc(){return this.x+q+this.y+q+this.width+" × "+this.height}function cb(){return this.x+q+this.y}function bQ(a,b,c,d,e,f){a!=null?(this.a=+a,this.b=+b,this.c=+c,this.d=+d,this.e=+e,this.f=+f):(this.a=1,this.b=0,this.c=0,this.d=1,this.e=0,this.f=0)}function bv(){return this.hex}function bt(a,b,c){function d(){var e=Array.prototype.slice.call(arguments,0),f=e.join("␀"),h=d.cache=d.cache||{},i=d.count=d.count||[];if(h[g](f)){bs(i,f);return c?c(h[f]):h[f]}i.length>=1e3&&delete h[i.shift()],i.push(f),h[f]=a[m](b,e);return c?c(h[f]):h[f]}return d}function bs(a,b){for(var c=0,d=a.length;c',bk=bj.firstChild,bk.style.behavior="url(#default#VML)";if(!bk||typeof bk.adj!="object")return a.type=p;bj=null}a.svg=!(a.vml=a.type=="VML"),a._Paper=j,a.fn=k=j.prototype=a.prototype,k.customAttributes={},a._id=0,a._oid=0,a.is=function(a,b){b=v.call(b);if(b=="finite")return!M[g](+a);if(b=="array")return a instanceof Array;return b=="null"&&a===null||b==typeof a||b=="object"&&a===Object(a)||b=="array"&&Array.isArray&&Array.isArray(a)||H.call(a).slice(8,-1).toLowerCase()==b},a.angle=function(b,c,d,e,f,g){if(f==null){var h=b-d,i=c-e;if(!h&&!i)return 0;return(180+w.atan2(-i,-h)*180/B+360)%360}return a.angle(b,c,f,g)-a.angle(d,e,f,g)},a.rad=function(a){return a%360*B/180},a.deg=function(a){return a*180/B%360},a.snapTo=function(b,c,d){d=a.is(d,"finite")?d:10;if(a.is(b,E)){var e=b.length;while(e--)if(z(b[e]-c)<=d)return b[e]}else{b=+b;var f=c%b;if(fb-d)return c-f+b}return c};var bl=a._createUUID=function(a,b){return function(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(a,b).toUpperCase()}}(/[xy]/g,function(a){var b=w.random()*16|0,c=a=="x"?b:b&3|8;return c.toString(16)});a.setWindow=function(b){cu("setWindow",a,h.win,b),h.win=b,h.doc=h.win.document,initWin&&initWin(h.win)};var bm=function(b){if(a.vml){var c=/^\s+|\s+$/g,d;try{var e=new ActiveXObject("htmlfile");e.write(""),e.close(),d=e.body}catch(f){d=createPopup().document.body}var g=d.createTextRange();bm=bt(function(a){try{d.style.color=r(a).replace(c,p);var b=g.queryCommandValue("ForeColor");b=(b&255)<<16|b&65280|(b&16711680)>>>16;return"#"+("000000"+b.toString(16)).slice(-6)}catch(e){return"none"}})}else{var i=h.doc.createElement("i");i.title="Raphaël Colour Picker",i.style.display="none",h.doc.body.appendChild(i),bm=bt(function(a){i.style.color=a;return h.doc.defaultView.getComputedStyle(i,p).getPropertyValue("color")})}return bm(b)},bn=function(){return"hsb("+[this.h,this.s,this.b]+")"},bo=function(){return"hsl("+[this.h,this.s,this.l]+")"},bp=function(){return this.hex},bq=function(b,c,d){c==null&&a.is(b,"object")&&"r"in b&&"g"in b&&"b"in b&&(d=b.b,c=b.g,b=b.r);if(c==null&&a.is(b,D)){var e=a.getRGB(b);b=e.r,c=e.g,d=e.b}if(b>1||c>1||d>1)b/=255,c/=255,d/=255;return[b,c,d]},br=function(b,c,d,e){b*=255,c*=255,d*=255;var f={r:b,g:c,b:d,hex:a.rgb(b,c,d),toString:bp};a.is(e,"finite")&&(f.opacity=e);return f};a.color=function(b){var c;a.is(b,"object")&&"h"in b&&"s"in b&&"b"in b?(c=a.hsb2rgb(b),b.r=c.r,b.g=c.g,b.b=c.b,b.hex=c.hex):a.is(b,"object")&&"h"in b&&"s"in b&&"l"in b?(c=a.hsl2rgb(b),b.r=c.r,b.g=c.g,b.b=c.b,b.hex=c.hex):(a.is(b,"string")&&(b=a.getRGB(b)),a.is(b,"object")&&"r"in b&&"g"in b&&"b"in b?(c=a.rgb2hsl(b),b.h=c.h,b.s=c.s,b.l=c.l,c=a.rgb2hsb(b),b.v=c.b):(b={hex:"none"},crl.r=b.g=b.b=b.h=b.s=b.v=b.l=-1)),b.toString=bp;return b},a.hsb2rgb=function(a,b,c,d){this.is(a,"object")&&"h"in a&&"s"in a&&"b"in a&&(c=a.b,b=a.s,a=a.h,d=a.o),a*=360;var e,f,g,h,i;a=a%360/60,i=c*b,h=i*(1-z(a%2-1)),e=f=g=c-i,a=~~a,e+=[i,h,0,0,h,i][a],f+=[h,i,i,h,0,0][a],g+=[0,0,h,i,i,h][a];return br(e,f,g,d)},a.hsl2rgb=function(a,b,c,d){this.is(a,"object")&&"h"in a&&"s"in a&&"l"in a&&(c=a.l,b=a.s,a=a.h);if(a>1||b>1||c>1)a/=360,b/=100,c/=100;a*=360;var e,f,g,h,i;a=a%360/60,i=2*b*(c<.5?c:1-c),h=i*(1-z(a%2-1)),e=f=g=c-i/2,a=~~a,e+=[i,h,0,0,h,i][a],f+=[h,i,i,h,0,0][a],g+=[0,0,h,i,i,h][a];return br(e,f,g,d)},a.rgb2hsb=function(a,b,c){c=bq(a,b,c),a=c[0],b=c[1],c=c[2];var d,e,f,g;f=x(a,b,c),g=f-y(a,b,c),d=g==0?null:f==a?(b-c)/g:f==b?(c-a)/g+2:(a-b)/g+4,d=(d+360)%6*60/360,e=g==0?0:g/f;return{h:d,s:e,b:f,toString:bn}},a.rgb2hsl=function(a,b,c){c=bq(a,b,c),a=c[0],b=c[1],c=c[2];var d,e,f,g,h,i;g=x(a,b,c),h=y(a,b,c),i=g-h,d=i==0?null:g==a?(b-c)/i:g==b?(c-a)/i+2:(a-b)/i+4,d=(d+360)%6*60/360,f=(g+h)/2,e=i==0?0:f<.5?i/(2*f):i/(2-2*f);return{h:d,s:e,l:f,toString:bo}},a._path2string=function(){return this.join(",").replace(Y,"$1")};var bu=a._preload=function(a,b){var c=h.doc.createElement("img");c.style.cssText="position:absolute;left:-9999em;top-9999em",c.onload=function(){b.call(this),this.onload=null,h.doc.body.removeChild(this)},c.onerror=function(){h.doc.body.removeChild(this)},h.doc.body.appendChild(c),c.src=a};a.getRGB=bt(function(b){if(!b||!!((b=r(b)).indexOf("-")+1))return{r:-1,g:-1,b:-1,hex:"none",error:1,toString:bv};if(b=="none")return{r:-1,g:-1,b:-1,hex:"none",toString:bv};!X[g](b.toLowerCase().substring(0,2))&&b.charAt()!="#"&&(b=bm(b));var c,d,e,f,h,i,j,k=b.match(L);if(k){k[2]&&(f=R(k[2].substring(5),16),e=R(k[2].substring(3,5),16),d=R(k[2].substring(1,3),16)),k[3]&&(f=R((i=k[3].charAt(3))+i,16),e=R((i=k[3].charAt(2))+i,16),d=R((i=k[3].charAt(1))+i,16)),k[4]&&(j=k[4].split(W),d=Q(j[0]),j[0].slice(-1)=="%"&&(d*=2.55),e=Q(j[1]),j[1].slice(-1)=="%"&&(e*=2.55),f=Q(j[2]),j[2].slice(-1)=="%"&&(f*=2.55),k[1].toLowerCase().slice(0,4)=="rgba"&&(h=Q(j[3])),j[3]&&j[3].slice(-1)=="%"&&(h/=100));if(k[5]){j=k[5].split(W),d=Q(j[0]),j[0].slice(-1)=="%"&&(d*=2.55),e=Q(j[1]),j[1].slice(-1)=="%"&&(e*=2.55),f=Q(j[2]),j[2].slice(-1)=="%"&&(f*=2.55),(j[0].slice(-3)=="deg"||j[0].slice(-1)=="°")&&(d/=360),k[1].toLowerCase().slice(0,4)=="hsba"&&(h=Q(j[3])),j[3]&&j[3].slice(-1)=="%"&&(h/=100);return a.hsb2rgb(d,e,f,h)}if(k[6]){j=k[6].split(W),d=Q(j[0]),j[0].slice(-1)=="%"&&(d*=2.55),e=Q(j[1]),j[1].slice(-1)=="%"&&(e*=2.55),f=Q(j[2]),j[2].slice(-1)=="%"&&(f*=2.55),(j[0].slice(-3)=="deg"||j[0].slice(-1)=="°")&&(d/=360),k[1].toLowerCase().slice(0,4)=="hsla"&&(h=Q(j[3])),j[3]&&j[3].slice(-1)=="%"&&(h/=100);return a.hsl2rgb(d,e,f,h)}k={r:d,g:e,b:f,toString:bv},k.hex="#"+(16777216|f|e<<8|d<<16).toString(16).slice(1),a.is(h,"finite")&&(k.opacity=h);return k}return{r:-1,g:-1,b:-1,hex:"none",error:1,toString:bv}},a),a.hsb=bt(function(b,c,d){return a.hsb2rgb(b,c,d).hex}),a.hsl=bt(function(b,c,d){return a.hsl2rgb(b,c,d).hex}),a.rgb=bt(function(a,b,c){return"#"+(16777216|c|b<<8|a<<16).toString(16).slice(1)}),a.getColor=function(a){var b=this.getColor.start=this.getColor.start||{h:0,s:1,b:a||.75},c=this.hsb2rgb(b.h,b.s,b.b);b.h+=.075,b.h>1&&(b.h=0,b.s-=.2,b.s<=0&&(this.getColor.start={h:0,s:1,b:b.b}));return c.hex},a.getColor.reset=function(){delete this.start},a.parsePathString=bt(function(b){if(!b)return null;var c={a:7,c:6,h:1,l:2,m:2,q:4,s:4,t:2,v:1,z:0},d=[];a.is(b,E)&&a.is(b[0],E)&&(d=bx(b)),d.length||r(b).replace(Z,function(a,b,e){var f=[],g=v.call(b);e.replace(_,function(a,b){b&&f.push(+b)}),g=="m"&&f.length>2&&(d.push([b][n](f.splice(0,2))),g="l",b=b=="m"?"l":"L");while(f.length>=c[g]){d.push([b][n](f.splice(0,c[g])));if(!c[g])break}}),d.toString=a._path2string;return d}),a.parseTransformString=bt(function(b){if(!b)return null;var c={r:3,s:4,t:2,m:6},d=[];a.is(b,E)&&a.is(b[0],E)&&(d=bx(b)),d.length||r(b).replace($,function(a,b,c){var e=[],f=v.call(b);c.replace(_,function(a,b){b&&e.push(+b)}),d.push([f][n](e))}),d.toString=a._path2string;return d}),a.findDotsAtSegment=function(a,b,c,d,e,f,g,h,i){var j=1-i,k=A(j,3)*a+A(j,2)*3*i*c+j*3*i*i*e+A(i,3)*g,l=A(j,3)*b+A(j,2)*3*i*d+j*3*i*i*f+A(i,3)*h,m=a+2*i*(c-a)+i*i*(e-2*c+a),n=b+2*i*(d-b)+i*i*(f-2*d+b),o=c+2*i*(e-c)+i*i*(g-2*e+c),p=d+2*i*(f-d)+i*i*(h-2*f+d),q=(1-i)*a+i*c,r=(1-i)*b+i*d,s=(1-i)*e+i*g,t=(1-i)*f+i*h,u=90-w.atan2(m-o,n-p)*180/B;(m>o||n1&&(u=w.sqrt(u),c=u*c,d=u*d);var v=c*c,x=d*d,y=(f==g?-1:1)*w.sqrt(z((v*x-v*t*t-x*s*s)/(v*t*t+x*s*s))),A=y*c*t/d+(a+h)/2,C=y*-d*s/c+(b+i)/2,D=w.asin(((b-C)/d).toFixed(9)),E=w.asin(((i-C)/d).toFixed(9));D=aE&&(D=D-B*2),!g&&E>D&&(E=E-B*2)}else D=j[0],E=j[1],A=j[2],C=j[3];var F=E-D;if(z(F)>k){var G=E,H=h,I=i;E=D+k*(g&&E>D?1:-1),h=A+c*w.cos(E),i=C+d*w.sin(E),m=bC(h,i,c,d,e,0,g,H,I,[E,G,A,C])}F=E-D;var J=w.cos(D),K=w.sin(D),L=w.cos(E),M=w.sin(E),N=w.tan(F/4),O=4/3*c*N,P=4/3*d*N,Q=[a,b],R=[a+O*K,b-P*J],S=[h+O*M,i-P*L],T=[h,i];R[0]=2*Q[0]-R[0],R[1]=2*Q[1]-R[1];if(j)return[R,S,T][n](m);m=[R,S,T][n](m).join().split(",");var U=[];for(var V=0,W=m.length;V"1e12"&&(l=.5),z(n)>"1e12"&&(n=.5),l>0&&l<1&&(q=bD(a,b,c,d,e,f,g,h,l),p.push(q.x),o.push(q.y)),n>0&&n<1&&(q=bD(a,b,c,d,e,f,g,h,n),p.push(q.x),o.push(q.y)),i=f-2*d+b-(h-2*f+d),j=2*(d-b)-2*(f-d),k=b-d,l=(-j+w.sqrt(j*j-4*i*k))/2/i,n=(-j-w.sqrt(j*j-4*i*k))/2/i,z(l)>"1e12"&&(l=.5),z(n)>"1e12"&&(n=.5),l>0&&l<1&&(q=bD(a,b,c,d,e,f,g,h,l),p.push(q.x),o.push(q.y)),n>0&&n<1&&(q=bD(a,b,c,d,e,f,g,h,n),p.push(q.x),o.push(q.y));return{min:{x:y[m](0,p),y:y[m](0,o)},max:{x:x[m](0,p),y:x[m](0,o)}}}),bF=bt(function(a,b){var c=bz(a),d=b&&bz(b),e={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},f={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},g=function(a,b){var c,d;if(!a)return["C",b.x,b.y,b.x,b.y,b.x,b.y];!(a[0]in{T:1,Q:1})&&(b.qx=b.qy=null);switch(a[0]){case"M":b.X=a[1],b.Y=a[2];break;case"A":a=["C"][n](bC[m](0,[b.x,b.y][n](a.slice(1))));break;case"S":c=b.x+(b.x-(b.bx||b.x)),d=b.y+(b.y-(b.by||b.y)),a=["C",c,d][n](a.slice(1));break;case"T":b.qx=b.x+(b.x-(b.qx||b.x)),b.qy=b.y+(b.y-(b.qy||b.y)),a=["C"][n](bB(b.x,b.y,b.qx,b.qy,a[1],a[2]));break;case"Q":b.qx=a[1],b.qy=a[2],a=["C"][n](bB(b.x,b.y,a[1],a[2],a[3],a[4]));break;case"L":a=["C"][n](bA(b.x,b.y,a[1],a[2]));break;case"H":a=["C"][n](bA(b.x,b.y,a[1],b.y));break;case"V":a=["C"][n](bA(b.x,b.y,b.x,a[1]));break;case"Z":a=["C"][n](bA(b.x,b.y,b.X,b.Y))}return a},h=function(a,b){if(a[b].length>7){a[b].shift();var e=a[b];while(e.length)a.splice(b++,0,["C"][n](e.splice(0,6)));a.splice(b,1),k=x(c.length,d&&d.length||0)}},i=function(a,b,e,f,g){a&&b&&a[g][0]=="M"&&b[g][0]!="M"&&(b.splice(g,0,["M",f.x,f.y]),e.bx=0,e.by=0,e.x=a[g][1],e.y=a[g][2],k=x(c.length,d&&d.length||0))};for(var j=0,k=x(c.length,d&&d.length||0);j=j)return p;o=p}if(j==null)return k},cf=function(b,c){return function(d,e,f){d=bF(d);var g,h,i,j,k="",l={},m,n=0;for(var o=0,p=d.length;oe){if(c&&!l.start){m=ce(g,h,i[1],i[2],i[3],i[4],i[5],i[6],e-n),k+=["C"+m.start.x,m.start.y,m.m.x,m.m.y,m.x,m.y];if(f)return k;l.start=k,k=["M"+m.x,m.y+"C"+m.n.x,m.n.y,m.end.x,m.end.y,i[5],i[6]].join(),n+=j,g=+i[5],h=+i[6];continue}if(!b&&!c){m=ce(g,h,i[1],i[2],i[3],i[4],i[5],i[6],e-n);return{x:m.x,y:m.y,alpha:m.alpha}}}n+=j,g=+i[5],h=+i[6]}k+=i.shift()+i}l.end=k,m=b?n:c?l:a.findDotsAtSegment(g,h,i[1],i[2],i[3],i[4],i[5],i[6],1),m.alpha&&(m={x:m.x,y:m.y,alpha:m.alpha});return m}},cg=cf(1),ch=cf(),ci=cf(0,1);a.getTotalLength=cg,a.getPointAtLength=ch,a.getSubpath=function(a,b,c){if(z(this.getTotalLength(a)-c)<1e-6)return ci(a,b).end;var d=ci(a,c,1);return b?ci(d,b).end:d},b$.getTotalLength=function(){if(this.type=="path"){if(this.node.getTotalLength)return this.node.getTotalLength();return cg(this.attrs.path)}},b$.getPointAtLength=function(a){if(this.type=="path")return ch(this.attrs.path,a)},b$.getSubpath=function(b,c){if(this.type=="path")return a.getSubpath(this.attrs.path,b,c)};var cj=a.easing_formulas={linear:function(a){return a},"<":function(a){return A(a,1.7)},">":function(a){return A(a,.48)},"<>":function(a){var b=.48-a/1.04,c=w.sqrt(.1734+b*b),d=c-b,e=A(z(d),1/3)*(d<0?-1:1),f=-c-b,g=A(z(f),1/3)*(f<0?-1:1),h=e+g+.5;return(1-h)*3*h*h+h*h*h},backIn:function(a){var b=1.70158;return a*a*((b+1)*a-b)},backOut:function(a){a=a-1;var b=1.70158;return a*a*((b+1)*a+b)+1},elastic:function(a){if(a==!!a)return a;return A(2,-10*a)*w.sin((a-.075)*2*B/.3)+1},bounce:function(a){var b=7.5625,c=2.75,d;a<1/c?d=b*a*a:a<2/c?(a-=1.5/c,d=b*a*a+.75):a<2.5/c?(a-=2.25/c,d=b*a*a+.9375):(a-=2.625/c,d=b*a*a+.984375);return d}};cj.easeIn=cj["ease-in"]=cj["<"],cj.easeOut=cj["ease-out"]=cj[">"],cj.easeInOut=cj["ease-in-out"]=cj["<>"],cj["back-in"]=cj.backIn,cj["back-out"]=cj.backOut;var ck=[],cl=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(a){setTimeout(a,16)},cm=function(){var b=+(new Date),c=0;for(;c1&&!d.next&&cq(d.anim,d.el,d.anim.percents[0],null,d.totalOrigin,d.repeat-1),d.next&&!d.stop&&cq(d.anim,d.el,d.next,null,d.totalOrigin,d.repeat)}a.svg&&m&&m.paper&&m.paper.safari(),ck.length&&cl(cm)},cn=function(a){return a>255?255:a<0?0:a};b$.animateWith=function(a,b,c,d,e){this.animate(b,c,d,e);var f,g;for(var h=0,i=ck.length;h.5)*2-1;i(m-.5,2)+i(n-.5,2)>.25&&(n=f.sqrt(.25-i(m-.5,2))*e+.5)&&n!=.5&&(n=n.toFixed(5)-1e-5*e)}return l}),e=e.split(/\s*\-\s*/);if(j=="linear"){var t=e.shift();t=-d(t);if(isNaN(t))return null;var u=[0,0,f.cos(a.rad(t)),f.sin(a.rad(t))],v=1/(g(h(u[2]),h(u[3]))||1);u[2]*=v,u[3]*=v,u[2]<0&&(u[0]=-u[2],u[2]=0),u[3]<0&&(u[1]=-u[3],u[3]=0)}var w=a._parseDots(e);if(!w)return null;b.gradient&&(q.defs.removeChild(b.gradient),delete b.gradient),k=k.replace(/[\(\)\s,\xb0#]/g,"-"),s=p(j+"Gradient",{id:k}),b.gradient=s,p(s,j=="radial"?{fx:m,fy:n}:{x1:u[0],y1:u[1],x2:u[2],y2:u[3],gradientTransform:b.matrix.invert()}),q.defs.appendChild(s);for(var x=0,y=w.length;x1?F.opacity/100:F.opacity});case"stroke":F=a.getRGB(r),k.setAttribute(q,F.hex),q=="stroke"&&F[b]("opacity")&&p(k,{"stroke-opacity":F.opacity>1?F.opacity/100:F.opacity}),q=="stroke"&&d._.arrows&&("startString"in d._.arrows&&v(d,d._.arrows.startString),"endString"in d._.arrows&&v(d,d._.arrows.endString,1));break;case"gradient":(d.type=="circle"||d.type=="ellipse"||c(r).charAt()!="r")&&t(d,r);break;case"opacity":n.gradient&&!n[b]("stroke-opacity")&&p(k,{"stroke-opacity":r>1?r/100:r});case"fill-opacity":if(n.gradient){G=a._g.doc.getElementById(k.getAttribute("fill").replace(/^url\(#|\)$/g,l)),G&&(H=G.getElementsByTagName("stop"),p(H[H.length-1],{"stop-opacity":r}));break};default:q=="font-size"&&(r=e(r,10)+"px");var I=q.replace(/(\-.)/g,function(a){return a.substring(1).toUpperCase()});k.style[I]=r,d._.dirty=1,k.setAttribute(q,r)}}y(d,f)},x=1.2,y=function(d,f){if(d.type=="text"&&!!(f[b]("text")||f[b]("font")||f[b]("font-size")||f[b]("x")||f[b]("y"))){var g=d.attrs,h=d.node,i=h.firstChild?e(a._g.doc.defaultView.getComputedStyle(h.firstChild,l).getPropertyValue("font-size"),10):10;if(f[b]("text")){g.text=f.text;while(h.firstChild)h.removeChild(h.firstChild);var j=c(f.text).split("\n"),k=[],m;for(var n=0,o=j.length;n"));var Z=W.getBoundingClientRect();x.W=o.w=(Z.right-Z.left)/X,x.H=o.h=(Z.bottom-Z.top)/X,x.paper.canvas.style.display="none",x.X=o.x,x.Y=o.y+x.H/2,("x"in i||"y"in i)&&(x.path.v=a.format("m{0},{1}l{2},{1}",f(o.x*t),f(o.y*t),f(o.x*t)+1));var $=["x","y","text","font","font-family","font-weight","font-style","font-size"];for(var _=0,ba=$.length;_.25&&(c=e.sqrt(.25-pow(b-.5,2))*((c>.5)*2-1)+.5),l=b+m+c);return n}),f=f.split(/\s*\-\s*/);if(k=="linear"){var o=f.shift();o=-d(o);if(isNaN(o))return null}var p=a._parseDots(f);if(!p)return null;b=b.shape||b.node;if(p.length){b.removeChild(g),g.on=!0,g.method="none",g.color=p[0].color,g.color2=p[p.length-1].color;var q=[];for(var r=0,s=p.length;r')}}catch(c){A=function(a){return b.createElement("<"+a+' xmlns="urn:schemas-microsoft.com:vml" class="rvml">')}}};B(a._g.win),a._engine.create=function(){var b=a._getContainer.apply(0,arguments),c=b.container,d=b.height,e,f=b.width,g=b.x,h=b.y;if(!c)throw new Error("VML container not found.");var i=new a._Paper,j=i.canvas=a._g.doc.createElement("div"),k=j.style;g=g||0,h=h||0,f=f||512,d=d||342,i.width=f,i.height=d,f==+f&&(f+="px"),d==+d&&(d+="px"),i.coordsize=t*1e3+m+t*1e3,i.coordorigin="0 0",i.span=a._g.doc.createElement("span"),i.span.style.cssText="position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;",j.appendChild(i.span),k.cssText=a.format("top:0;left:0;width:{0};height:{1};display:inline-block;position:relative;clip:rect(0 {0} {1} 0);overflow:hidden",f,d),c==1?(a._g.doc.body.appendChild(j),k.left=g+"px",k.top=h+"px",k.position="absolute"):c.firstChild?c.insertBefore(j,c.firstChild):c.appendChild(j),i.renderfix=function(){};return i},a.prototype.clear=function(){a.eve("clear",this),this.canvas.innerHTML=n,this.span=a._g.doc.createElement("span"),this.span.style.cssText="position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;display:inline;",this.canvas.appendChild(this.span),this.bottom=this.top=null},a.prototype.remove=function(){a.eve("remove",this),this.canvas.parentNode.removeChild(this.canvas);for(var b in this)this[b]=removed(b);return!0}}(window.Raphael) \ No newline at end of file +// ┌─────────────────────────────────────────────────────────────────────┐ \\ +// │ "Raphaël 2.0" - JavaScript Vector Library │ \\ +// ├─────────────────────────────────────────────────────────────────────┤ \\ +// │ Copyright (c) 2008-2011 Dmitry Baranovskiy (http://raphaeljs.com) │ \\ +// │ Copyright (c) 2008-2011 Sencha Labs (http://sencha.com) │ \\ +// │ Licensed under the MIT (http://raphaeljs.com/license.html) license. │ \\ +// └─────────────────────────────────────────────────────────────────────┘ \\ +(function(a){var b="0.3.0",c="hasOwnProperty",d=/[\.\/]/,e="*",f=function(){},g=function(a,b){return a-b},h,i,j={n:{}},k=function(a,b){var c=j,d=Array.prototype.slice.call(arguments,2),e=k.listeners(a),f=0,l=!1,m,n=[],o={},p=[],q=[];h=a,i=0;for(var r=0,s=e.length;rf*b.top){e=b.percents[w],o=b.percents[w-1]||0,q=q/b.top*(e-o),n=b.percents[w+1],j=b.anim[e];break}f&&d.attr(b.anim[b.percents[w]])}if(!!j){if(!k){for(attr in j)if(j[g](attr))if(V[g](attr)||d.paper.customAttributes[g](attr)){s[attr]=d.attr(attr),s[attr]==null&&(s[attr]=U[attr]),t[attr]=j[attr];switch(V[attr]){case C:u[attr]=(t[attr]-s[attr])/q;break;case"colour":s[attr]=a.getRGB(s[attr]);var y=a.getRGB(t[attr]);u[attr]={r:(y.r-s[attr].r)/q,g:(y.g-s[attr].g)/q,b:(y.b-s[attr].b)/q};break;case"path":var z=bF(s[attr],t[attr]),A=z[1];s[attr]=z[0],u[attr]=[];for(w=0,x=s[attr].length;wd)return d;while(cf?c=e:d=e,e=(d-c)/2+c}return e}function n(a,b){var c=o(a,b);return((l*c+k)*c+j)*c}function m(a){return((i*a+h)*a+g)*a}var g=3*b,h=3*(d-b)-g,i=1-g-h,j=3*c,k=3*(e-c)-j,l=1-j-k;return n(a,1/(200*f))}function cc(){return this.x+q+this.y+q+this.width+" × "+this.height}function cb(){return this.x+q+this.y}function bQ(a,b,c,d,e,f){a!=null?(this.a=+a,this.b=+b,this.c=+c,this.d=+d,this.e=+e,this.f=+f):(this.a=1,this.b=0,this.c=0,this.d=1,this.e=0,this.f=0)}function bv(){return this.hex}function bt(a,b,c){function d(){var e=Array.prototype.slice.call(arguments,0),f=e.join("␀"),h=d.cache=d.cache||{},i=d.count=d.count||[];if(h[g](f)){bs(i,f);return c?c(h[f]):h[f]}i.length>=1e3&&delete h[i.shift()],i.push(f),h[f]=a[m](b,e);return c?c(h[f]):h[f]}return d}function bs(a,b){for(var c=0,d=a.length;c',bk=bj.firstChild,bk.style.behavior="url(#default#VML)";if(!bk||typeof bk.adj!="object")return a.type=p;bj=null}a.svg=!(a.vml=a.type=="VML"),a._Paper=j,a.fn=k=j.prototype=a.prototype,k.customAttributes={},a._id=0,a._oid=0,a.is=function(a,b){b=v.call(b);if(b=="finite")return!M[g](+a);if(b=="array")return a instanceof Array;return b=="null"&&a===null||b==typeof a||b=="object"&&a===Object(a)||b=="array"&&Array.isArray&&Array.isArray(a)||H.call(a).slice(8,-1).toLowerCase()==b},a.angle=function(b,c,d,e,f,g){if(f==null){var h=b-d,i=c-e;if(!h&&!i)return 0;return(180+w.atan2(-i,-h)*180/B+360)%360}return a.angle(b,c,f,g)-a.angle(d,e,f,g)},a.rad=function(a){return a%360*B/180},a.deg=function(a){return a*180/B%360},a.snapTo=function(b,c,d){d=a.is(d,"finite")?d:10;if(a.is(b,E)){var e=b.length;while(e--)if(z(b[e]-c)<=d)return b[e]}else{b=+b;var f=c%b;if(fb-d)return c-f+b}return c};var bl=a._createUUID=function(a,b){return function(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(a,b).toUpperCase()}}(/[xy]/g,function(a){var b=w.random()*16|0,c=a=="x"?b:b&3|8;return c.toString(16)});a.setWindow=function(b){eve("setWindow",a,h.win,b),h.win=b,h.doc=h.win.document,initWin&&initWin(h.win)};var bm=function(b){if(a.vml){var c=/^\s+|\s+$/g,d;try{var e=new ActiveXObject("htmlfile");e.write(""),e.close(),d=e.body}catch(f){d=createPopup().document.body}var g=d.createTextRange();bm=bt(function(a){try{d.style.color=r(a).replace(c,p);var b=g.queryCommandValue("ForeColor");b=(b&255)<<16|b&65280|(b&16711680)>>>16;return"#"+("000000"+b.toString(16)).slice(-6)}catch(e){return"none"}})}else{var i=h.doc.createElement("i");i.title="Raphaël Colour Picker",i.style.display="none",h.doc.body.appendChild(i),bm=bt(function(a){i.style.color=a;return h.doc.defaultView.getComputedStyle(i,p).getPropertyValue("color")})}return bm(b)},bn=function(){return"hsb("+[this.h,this.s,this.b]+")"},bo=function(){return"hsl("+[this.h,this.s,this.l]+")"},bp=function(){return this.hex},bq=function(b,c,d){c==null&&a.is(b,"object")&&"r"in b&&"g"in b&&"b"in b&&(d=b.b,c=b.g,b=b.r);if(c==null&&a.is(b,D)){var e=a.getRGB(b);b=e.r,c=e.g,d=e.b}if(b>1||c>1||d>1)b/=255,c/=255,d/=255;return[b,c,d]},br=function(b,c,d,e){b*=255,c*=255,d*=255;var f={r:b,g:c,b:d,hex:a.rgb(b,c,d),toString:bp};a.is(e,"finite")&&(f.opacity=e);return f};a.color=function(b){var c;a.is(b,"object")&&"h"in b&&"s"in b&&"b"in b?(c=a.hsb2rgb(b),b.r=c.r,b.g=c.g,b.b=c.b,b.hex=c.hex):a.is(b,"object")&&"h"in b&&"s"in b&&"l"in b?(c=a.hsl2rgb(b),b.r=c.r,b.g=c.g,b.b=c.b,b.hex=c.hex):(a.is(b,"string")&&(b=a.getRGB(b)),a.is(b,"object")&&"r"in b&&"g"in b&&"b"in b?(c=a.rgb2hsl(b),b.h=c.h,b.s=c.s,b.l=c.l,c=a.rgb2hsb(b),b.v=c.b):(b={hex:"none"},crl.r=b.g=b.b=b.h=b.s=b.v=b.l=-1)),b.toString=bp;return b},a.hsb2rgb=function(a,b,c,d){this.is(a,"object")&&"h"in a&&"s"in a&&"b"in a&&(c=a.b,b=a.s,a=a.h,d=a.o),a*=360;var e,f,g,h,i;a=a%360/60,i=c*b,h=i*(1-z(a%2-1)),e=f=g=c-i,a=~~a,e+=[i,h,0,0,h,i][a],f+=[h,i,i,h,0,0][a],g+=[0,0,h,i,i,h][a];return br(e,f,g,d)},a.hsl2rgb=function(a,b,c,d){this.is(a,"object")&&"h"in a&&"s"in a&&"l"in a&&(c=a.l,b=a.s,a=a.h);if(a>1||b>1||c>1)a/=360,b/=100,c/=100;a*=360;var e,f,g,h,i;a=a%360/60,i=2*b*(c<.5?c:1-c),h=i*(1-z(a%2-1)),e=f=g=c-i/2,a=~~a,e+=[i,h,0,0,h,i][a],f+=[h,i,i,h,0,0][a],g+=[0,0,h,i,i,h][a];return br(e,f,g,d)},a.rgb2hsb=function(a,b,c){c=bq(a,b,c),a=c[0],b=c[1],c=c[2];var d,e,f,g;f=x(a,b,c),g=f-y(a,b,c),d=g==0?null:f==a?(b-c)/g:f==b?(c-a)/g+2:(a-b)/g+4,d=(d+360)%6*60/360,e=g==0?0:g/f;return{h:d,s:e,b:f,toString:bn}},a.rgb2hsl=function(a,b,c){c=bq(a,b,c),a=c[0],b=c[1],c=c[2];var d,e,f,g,h,i;g=x(a,b,c),h=y(a,b,c),i=g-h,d=i==0?null:g==a?(b-c)/i:g==b?(c-a)/i+2:(a-b)/i+4,d=(d+360)%6*60/360,f=(g+h)/2,e=i==0?0:f<.5?i/(2*f):i/(2-2*f);return{h:d,s:e,l:f,toString:bo}},a._path2string=function(){return this.join(",").replace(Y,"$1")};var bu=a._preload=function(a,b){var c=h.doc.createElement("img");c.style.cssText="position:absolute;left:-9999em;top-9999em",c.onload=function(){b.call(this),this.onload=null,h.doc.body.removeChild(this)},c.onerror=function(){h.doc.body.removeChild(this)},h.doc.body.appendChild(c),c.src=a};a.getRGB=bt(function(b){if(!b||!!((b=r(b)).indexOf("-")+1))return{r:-1,g:-1,b:-1,hex:"none",error:1,toString:bv};if(b=="none")return{r:-1,g:-1,b:-1,hex:"none",toString:bv};!X[g](b.toLowerCase().substring(0,2))&&b.charAt()!="#"&&(b=bm(b));var c,d,e,f,h,i,j,k=b.match(L);if(k){k[2]&&(f=R(k[2].substring(5),16),e=R(k[2].substring(3,5),16),d=R(k[2].substring(1,3),16)),k[3]&&(f=R((i=k[3].charAt(3))+i,16),e=R((i=k[3].charAt(2))+i,16),d=R((i=k[3].charAt(1))+i,16)),k[4]&&(j=k[4].split(W),d=Q(j[0]),j[0].slice(-1)=="%"&&(d*=2.55),e=Q(j[1]),j[1].slice(-1)=="%"&&(e*=2.55),f=Q(j[2]),j[2].slice(-1)=="%"&&(f*=2.55),k[1].toLowerCase().slice(0,4)=="rgba"&&(h=Q(j[3])),j[3]&&j[3].slice(-1)=="%"&&(h/=100));if(k[5]){j=k[5].split(W),d=Q(j[0]),j[0].slice(-1)=="%"&&(d*=2.55),e=Q(j[1]),j[1].slice(-1)=="%"&&(e*=2.55),f=Q(j[2]),j[2].slice(-1)=="%"&&(f*=2.55),(j[0].slice(-3)=="deg"||j[0].slice(-1)=="°")&&(d/=360),k[1].toLowerCase().slice(0,4)=="hsba"&&(h=Q(j[3])),j[3]&&j[3].slice(-1)=="%"&&(h/=100);return a.hsb2rgb(d,e,f,h)}if(k[6]){j=k[6].split(W),d=Q(j[0]),j[0].slice(-1)=="%"&&(d*=2.55),e=Q(j[1]),j[1].slice(-1)=="%"&&(e*=2.55),f=Q(j[2]),j[2].slice(-1)=="%"&&(f*=2.55),(j[0].slice(-3)=="deg"||j[0].slice(-1)=="°")&&(d/=360),k[1].toLowerCase().slice(0,4)=="hsla"&&(h=Q(j[3])),j[3]&&j[3].slice(-1)=="%"&&(h/=100);return a.hsl2rgb(d,e,f,h)}k={r:d,g:e,b:f,toString:bv},k.hex="#"+(16777216|f|e<<8|d<<16).toString(16).slice(1),a.is(h,"finite")&&(k.opacity=h);return k}return{r:-1,g:-1,b:-1,hex:"none",error:1,toString:bv}},a),a.hsb=bt(function(b,c,d){return a.hsb2rgb(b,c,d).hex}),a.hsl=bt(function(b,c,d){return a.hsl2rgb(b,c,d).hex}),a.rgb=bt(function(a,b,c){return"#"+(16777216|c|b<<8|a<<16).toString(16).slice(1)}),a.getColor=function(a){var b=this.getColor.start=this.getColor.start||{h:0,s:1,b:a||.75},c=this.hsb2rgb(b.h,b.s,b.b);b.h+=.075,b.h>1&&(b.h=0,b.s-=.2,b.s<=0&&(this.getColor.start={h:0,s:1,b:b.b}));return c.hex},a.getColor.reset=function(){delete this.start},a.parsePathString=bt(function(b){if(!b)return null;var c={a:7,c:6,h:1,l:2,m:2,q:4,s:4,t:2,v:1,z:0},d=[];a.is(b,E)&&a.is(b[0],E)&&(d=bx(b)),d.length||r(b).replace(Z,function(a,b,e){var f=[],g=v.call(b);e.replace(_,function(a,b){b&&f.push(+b)}),g=="m"&&f.length>2&&(d.push([b][n](f.splice(0,2))),g="l",b=b=="m"?"l":"L");while(f.length>=c[g]){d.push([b][n](f.splice(0,c[g])));if(!c[g])break}}),d.toString=a._path2string;return d}),a.parseTransformString=bt(function(b){if(!b)return null;var c={r:3,s:4,t:2,m:6},d=[];a.is(b,E)&&a.is(b[0],E)&&(d=bx(b)),d.length||r(b).replace($,function(a,b,c){var e=[],f=v.call(b);c.replace(_,function(a,b){b&&e.push(+b)}),d.push([f][n](e))}),d.toString=a._path2string;return d}),a.findDotsAtSegment=function(a,b,c,d,e,f,g,h,i){var j=1-i,k=A(j,3)*a+A(j,2)*3*i*c+j*3*i*i*e+A(i,3)*g,l=A(j,3)*b+A(j,2)*3*i*d+j*3*i*i*f+A(i,3)*h,m=a+2*i*(c-a)+i*i*(e-2*c+a),n=b+2*i*(d-b)+i*i*(f-2*d+b),o=c+2*i*(e-c)+i*i*(g-2*e+c),p=d+2*i*(f-d)+i*i*(h-2*f+d),q=(1-i)*a+i*c,r=(1-i)*b+i*d,s=(1-i)*e+i*g,t=(1-i)*f+i*h,u=90-w.atan2(m-o,n-p)*180/B;(m>o||n1&&(u=w.sqrt(u),c=u*c,d=u*d);var v=c*c,x=d*d,y=(f==g?-1:1)*w.sqrt(z((v*x-v*t*t-x*s*s)/(v*t*t+x*s*s))),A=y*c*t/d+(a+h)/2,C=y*-d*s/c+(b+i)/2,D=w.asin(((b-C)/d).toFixed(9)),E=w.asin(((i-C)/d).toFixed(9));D=aE&&(D=D-B*2),!g&&E>D&&(E=E-B*2)}else D=j[0],E=j[1],A=j[2],C=j[3];var F=E-D;if(z(F)>k){var G=E,H=h,I=i;E=D+k*(g&&E>D?1:-1),h=A+c*w.cos(E),i=C+d*w.sin(E),m=bC(h,i,c,d,e,0,g,H,I,[E,G,A,C])}F=E-D;var J=w.cos(D),K=w.sin(D),L=w.cos(E),M=w.sin(E),N=w.tan(F/4),O=4/3*c*N,P=4/3*d*N,Q=[a,b],R=[a+O*K,b-P*J],S=[h+O*M,i-P*L],T=[h,i];R[0]=2*Q[0]-R[0],R[1]=2*Q[1]-R[1];if(j)return[R,S,T][n](m);m=[R,S,T][n](m).join().split(",");var U=[];for(var V=0,W=m.length;V"1e12"&&(l=.5),z(n)>"1e12"&&(n=.5),l>0&&l<1&&(q=bD(a,b,c,d,e,f,g,h,l),p.push(q.x),o.push(q.y)),n>0&&n<1&&(q=bD(a,b,c,d,e,f,g,h,n),p.push(q.x),o.push(q.y)),i=f-2*d+b-(h-2*f+d),j=2*(d-b)-2*(f-d),k=b-d,l=(-j+w.sqrt(j*j-4*i*k))/2/i,n=(-j-w.sqrt(j*j-4*i*k))/2/i,z(l)>"1e12"&&(l=.5),z(n)>"1e12"&&(n=.5),l>0&&l<1&&(q=bD(a,b,c,d,e,f,g,h,l),p.push(q.x),o.push(q.y)),n>0&&n<1&&(q=bD(a,b,c,d,e,f,g,h,n),p.push(q.x),o.push(q.y));return{min:{x:y[m](0,p),y:y[m](0,o)},max:{x:x[m](0,p),y:x[m](0,o)}}}),bF=bt(function(a,b){var c=bz(a),d=b&&bz(b),e={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},f={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},g=function(a,b){var c,d;if(!a)return["C",b.x,b.y,b.x,b.y,b.x,b.y];!(a[0]in{T:1,Q:1})&&(b.qx=b.qy=null);switch(a[0]){case"M":b.X=a[1],b.Y=a[2];break;case"A":a=["C"][n](bC[m](0,[b.x,b.y][n](a.slice(1))));break;case"S":c=b.x+(b.x-(b.bx||b.x)),d=b.y+(b.y-(b.by||b.y)),a=["C",c,d][n](a.slice(1));break;case"T":b.qx=b.x+(b.x-(b.qx||b.x)),b.qy=b.y+(b.y-(b.qy||b.y)),a=["C"][n](bB(b.x,b.y,b.qx,b.qy,a[1],a[2]));break;case"Q":b.qx=a[1],b.qy=a[2],a=["C"][n](bB(b.x,b.y,a[1],a[2],a[3],a[4]));break;case"L":a=["C"][n](bA(b.x,b.y,a[1],a[2]));break;case"H":a=["C"][n](bA(b.x,b.y,a[1],b.y));break;case"V":a=["C"][n](bA(b.x,b.y,b.x,a[1]));break;case"Z":a=["C"][n](bA(b.x,b.y,b.X,b.Y))}return a},h=function(a,b){if(a[b].length>7){a[b].shift();var e=a[b];while(e.length)a.splice(b++,0,["C"][n](e.splice(0,6)));a.splice(b,1),k=x(c.length,d&&d.length||0)}},i=function(a,b,e,f,g){a&&b&&a[g][0]=="M"&&b[g][0]!="M"&&(b.splice(g,0,["M",f.x,f.y]),e.bx=0,e.by=0,e.x=a[g][1],e.y=a[g][2],k=x(c.length,d&&d.length||0))};for(var j=0,k=x(c.length,d&&d.length||0);j=j)return p;o=p}if(j==null)return k},cf=function(b,c){return function(d,e,f){d=bF(d);var g,h,i,j,k="",l={},m,n=0;for(var o=0,p=d.length;oe){if(c&&!l.start){m=ce(g,h,i[1],i[2],i[3],i[4],i[5],i[6],e-n),k+=["C"+m.start.x,m.start.y,m.m.x,m.m.y,m.x,m.y];if(f)return k;l.start=k,k=["M"+m.x,m.y+"C"+m.n.x,m.n.y,m.end.x,m.end.y,i[5],i[6]].join(),n+=j,g=+i[5],h=+i[6];continue}if(!b&&!c){m=ce(g,h,i[1],i[2],i[3],i[4],i[5],i[6],e-n);return{x:m.x,y:m.y,alpha:m.alpha}}}n+=j,g=+i[5],h=+i[6]}k+=i.shift()+i}l.end=k,m=b?n:c?l:a.findDotsAtSegment(g,h,i[1],i[2],i[3],i[4],i[5],i[6],1),m.alpha&&(m={x:m.x,y:m.y,alpha:m.alpha});return m}},cg=cf(1),ch=cf(),ci=cf(0,1);a.getTotalLength=cg,a.getPointAtLength=ch,a.getSubpath=function(a,b,c){if(z(this.getTotalLength(a)-c)<1e-6)return ci(a,b).end;var d=ci(a,c,1);return b?ci(d,b).end:d},b$.getTotalLength=function(){if(this.type=="path"){if(this.node.getTotalLength)return this.node.getTotalLength();return cg(this.attrs.path)}},b$.getPointAtLength=function(a){if(this.type=="path")return ch(this.attrs.path,a)},b$.getSubpath=function(b,c){if(this.type=="path")return a.getSubpath(this.attrs.path,b,c)};var cj=a.easing_formulas={linear:function(a){return a},"<":function(a){return A(a,1.7)},">":function(a){return A(a,.48)},"<>":function(a){var b=.48-a/1.04,c=w.sqrt(.1734+b*b),d=c-b,e=A(z(d),1/3)*(d<0?-1:1),f=-c-b,g=A(z(f),1/3)*(f<0?-1:1),h=e+g+.5;return(1-h)*3*h*h+h*h*h},backIn:function(a){var b=1.70158;return a*a*((b+1)*a-b)},backOut:function(a){a=a-1;var b=1.70158;return a*a*((b+1)*a+b)+1},elastic:function(a){if(a==!!a)return a;return A(2,-10*a)*w.sin((a-.075)*2*B/.3)+1},bounce:function(a){var b=7.5625,c=2.75,d;a<1/c?d=b*a*a:a<2/c?(a-=1.5/c,d=b*a*a+.75):a<2.5/c?(a-=2.25/c,d=b*a*a+.9375):(a-=2.625/c,d=b*a*a+.984375);return d}};cj.easeIn=cj["ease-in"]=cj["<"],cj.easeOut=cj["ease-out"]=cj[">"],cj.easeInOut=cj["ease-in-out"]=cj["<>"],cj["back-in"]=cj.backIn,cj["back-out"]=cj.backOut;var ck=[],cl=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(a){setTimeout(a,16)},cm=function(){var b=+(new Date),c=0;for(;c1&&!d.next&&cq(d.anim,d.el,d.anim.percents[0],null,d.totalOrigin,d.repeat-1),d.next&&!d.stop&&cq(d.anim,d.el,d.next,null,d.totalOrigin,d.repeat)}a.svg&&m&&m.paper&&m.paper.safari(),ck.length&&cl(cm)},cn=function(a){return a>255?255:a<0?0:a};b$.animateWith=function(a,b,c,d,e){this.animate(b,c,d,e);var f,g;for(var h=0,i=ck.length;h.5)*2-1;i(m-.5,2)+i(n-.5,2)>.25&&(n=f.sqrt(.25-i(m-.5,2))*e+.5)&&n!=.5&&(n=n.toFixed(5)-1e-5*e)}return l}),e=e.split(/\s*\-\s*/);if(j=="linear"){var t=e.shift();t=-d(t);if(isNaN(t))return null;var u=[0,0,f.cos(a.rad(t)),f.sin(a.rad(t))],v=1/(g(h(u[2]),h(u[3]))||1);u[2]*=v,u[3]*=v,u[2]<0&&(u[0]=-u[2],u[2]=0),u[3]<0&&(u[1]=-u[3],u[3]=0)}var w=a._parseDots(e);if(!w)return null;b.gradient&&(q.defs.removeChild(b.gradient),delete b.gradient),k=k.replace(/[\(\)\s,\xb0#]/g,"-"),s=p(j+"Gradient",{id:k}),b.gradient=s,p(s,j=="radial"?{fx:m,fy:n}:{x1:u[0],y1:u[1],x2:u[2],y2:u[3],gradientTransform:b.matrix.invert()}),q.defs.appendChild(s);for(var x=0,y=w.length;x1?F.opacity/100:F.opacity});case"stroke":F=a.getRGB(r),k.setAttribute(q,F.hex),q=="stroke"&&F[b]("opacity")&&p(k,{"stroke-opacity":F.opacity>1?F.opacity/100:F.opacity}),q=="stroke"&&d._.arrows&&("startString"in d._.arrows&&v(d,d._.arrows.startString),"endString"in d._.arrows&&v(d,d._.arrows.endString,1));break;case"gradient":(d.type=="circle"||d.type=="ellipse"||c(r).charAt()!="r")&&t(d,r);break;case"opacity":n.gradient&&!n[b]("stroke-opacity")&&p(k,{"stroke-opacity":r>1?r/100:r});case"fill-opacity":if(n.gradient){G=a._g.doc.getElementById(k.getAttribute("fill").replace(/^url\(#|\)$/g,l)),G&&(H=G.getElementsByTagName("stop"),p(H[H.length-1],{"stop-opacity":r}));break};default:q=="font-size"&&(r=e(r,10)+"px");var I=q.replace(/(\-.)/g,function(a){return a.substring(1).toUpperCase()});k.style[I]=r,d._.dirty=1,k.setAttribute(q,r)}}y(d,f)},x=1.2,y=function(d,f){if(d.type=="text"&&!!(f[b]("text")||f[b]("font")||f[b]("font-size")||f[b]("x")||f[b]("y"))){var g=d.attrs,h=d.node,i=h.firstChild?e(a._g.doc.defaultView.getComputedStyle(h.firstChild,l).getPropertyValue("font-size"),10):10;if(f[b]("text")){g.text=f.text;while(h.firstChild)h.removeChild(h.firstChild);var j=c(f.text).split("\n"),k=[],m;for(var n=0,o=j.length;n"));var Z=W.getBoundingClientRect();x.W=o.w=(Z.right-Z.left)/X,x.H=o.h=(Z.bottom-Z.top)/X,x.paper.canvas.style.display="none",x.X=o.x,x.Y=o.y+x.H/2,("x"in i||"y"in i)&&(x.path.v=a.format("m{0},{1}l{2},{1}",f(o.x*t),f(o.y*t),f(o.x*t)+1));var $=["x","y","text","font","font-family","font-weight","font-style","font-size"];for(var _=0,ba=$.length;_.25&&(c=e.sqrt(.25-pow(b-.5,2))*((c>.5)*2-1)+.5),l=b+m+c);return n}),f=f.split(/\s*\-\s*/);if(k=="linear"){var o=f.shift();o=-d(o);if(isNaN(o))return null}var p=a._parseDots(f);if(!p)return null;b=b.shape||b.node;if(p.length){b.removeChild(g),g.on=!0,g.method="none",g.color=p[0].color,g.color2=p[p.length-1].color;var q=[];for(var r=0,s=p.length;r')}}catch(c){A=function(a){return b.createElement("<"+a+' xmlns="urn:schemas-microsoft.com:vml" class="rvml">')}}};B(a._g.win),a._engine.create=function(){var b=a._getContainer.apply(0,arguments),c=b.container,d=b.height,e,f=b.width,g=b.x,h=b.y;if(!c)throw new Error("VML container not found.");var i=new a._Paper,j=i.canvas=a._g.doc.createElement("div"),k=j.style;g=g||0,h=h||0,f=f||512,d=d||342,i.width=f,i.height=d,f==+f&&(f+="px"),d==+d&&(d+="px"),i.coordsize=t*1e3+m+t*1e3,i.coordorigin="0 0",i.span=a._g.doc.createElement("span"),i.span.style.cssText="position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;",j.appendChild(i.span),k.cssText=a.format("top:0;left:0;width:{0};height:{1};display:inline-block;position:relative;clip:rect(0 {0} {1} 0);overflow:hidden",f,d),c==1?(a._g.doc.body.appendChild(j),k.left=g+"px",k.top=h+"px",k.position="absolute"):c.firstChild?c.insertBefore(j,c.firstChild):c.appendChild(j),i.renderfix=function(){};return i},a.prototype.clear=function(){a.eve("clear",this),this.canvas.innerHTML=n,this.span=a._g.doc.createElement("span"),this.span.style.cssText="position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;display:inline;",this.canvas.appendChild(this.span),this.bottom=this.top=null},a.prototype.remove=function(){a.eve("remove",this),this.canvas.parentNode.removeChild(this.canvas);for(var b in this)this[b]=removed(b);return!0}}(window.Raphael) \ No newline at end of file diff --git a/raphael.core.js b/raphael.core.js index ce38d5b..b7d54a0 100644 --- a/raphael.core.js +++ b/raphael.core.js @@ -1,5 +1,5 @@ // ┌─────────────────────────────────────────────────────────────────────┐ \\ -// │ Raphaël 2 - JavaScript Vector Library │ \\ +// │ "Raphaël 2.0" - JavaScript Vector Library │ \\ // ├─────────────────────────────────────────────────────────────────────┤ \\ // │ Copyright (c) 2008-2011 Dmitry Baranovskiy (http://raphaeljs.com) │ \\ // │ Copyright (c) 2008-2011 Sencha Labs (http://sencha.com) │ \\ @@ -84,6 +84,7 @@ } } R.version = "2.0.0"; + R.eve = eve; var loaded, separator = /[, ]+/, elements = {circle: 1, rect: 1, path: 1, ellipse: 1, text: 1, image: 1}, @@ -1869,6 +1870,21 @@ } } (function (matrixproto) { + /*\ + * Matrix.add + [ method ] + ** + * Adds given matrix to existing one. + > Parameters + - a (number) + - b (number) + - c (number) + - d (number) + - e (number) + - f (number) + or + - matrix (object) @Matrix + \*/ matrixproto.add = function (a, b, c, d, e, f) { var out = [[], [], []], m = [[this.a, this.c, this.e], [this.b, this.d, this.f], [0, 0, 1]], @@ -1895,33 +1911,99 @@ this.e = out[0][2]; this.f = out[1][2]; }; + /*\ + * Matrix.invert + [ method ] + ** + * Returns inverted version of the matrix + = (object) @Matrix + \*/ matrixproto.invert = function () { var me = this, x = me.a * me.d - me.b * me.c; 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); }; + /*\ + * Matrix.clone + [ method ] + ** + * Returns copy of the matrix + = (object) @Matrix + \*/ matrixproto.clone = function () { return new Matrix(this.a, this.b, this.c, this.d, this.e, this.f); }; + /*\ + * Matrix.translate + [ method ] + ** + * Translate the matrix + > Parameters + - x (number) + - y (number) + \*/ matrixproto.translate = function (x, y) { this.add(1, 0, 0, 1, x, y); }; + /*\ + * Matrix.scale + [ method ] + ** + * Scales the matrix + > Parameters + - x (number) + - y (number) #optional + - cx (number) #optional + - cy (number) #optional + \*/ matrixproto.scale = function (x, y, cx, cy) { y == null && (y = x); - this.add(1, 0, 0, 1, cx, cy); + cx || cy && this.add(1, 0, 0, 1, cx, cy); this.add(x, 0, 0, y, 0, 0); - this.add(1, 0, 0, 1, -cx, -cy); + cx || cy && this.add(1, 0, 0, 1, -cx, -cy); }; + /*\ + * Matrix.rotate + [ method ] + ** + * Rotates the matrix + > Parameters + - a (number) + - x (number) + - y (number) + \*/ matrixproto.rotate = function (a, x, y) { a = R.rad(a); + x = x || 0; + y = y || 0; var cos = +math.cos(a).toFixed(9), sin = +math.sin(a).toFixed(9); this.add(cos, sin, -sin, cos, x, y); this.add(1, 0, 0, 1, -x, -y); }; + /*\ + * Matrix.x + [ method ] + ** + * Return x coordinate for given point after transformation described by the matrix. See also @Matrix.y + > Parameters + - x (number) + - y (number) + = (number) x + \*/ matrixproto.x = function (x, y) { return x * this.a + y * this.c + this.e; }; + /*\ + * Matrix.y + [ method ] + ** + * Return y coordinate for given point after transformation described by the matrix. See also @Matrix.x + > Parameters + - x (number) + - y (number) + = (number) y + \*/ matrixproto.y = function (x, y) { return x * this.b + y * this.d + this.f; }; @@ -1949,6 +2031,20 @@ a[0] && (a[0] /= mag); a[1] && (a[1] /= mag); } + /*\ + * Matrix.split + [ method ] + ** + * Splits matrix into primitive transformations + = (object) in format: + o dx (number) translation by x + o dy (number) translation by y + o scalex (number) scale by x + o scaley (number) scale by y + o shear (number) shear + o rotate (number) rotation in deg + o isSimple (boolean) could it be represented via simple transformations + \*/ matrixproto.split = function () { var out = {}; // translation @@ -1984,6 +2080,13 @@ out.noRotation = !+out.shear.toFixed(9) && !out.rotate; return out; }; + /*\ + * Matrix.toTransformString + [ method ] + ** + * Return transform string that represents given matrix + = (string) transform string + \*/ matrixproto.toTransformString = function () { var s = this.split(); if (s.isSimple) { @@ -2687,10 +2790,10 @@ o { o width (number) size of the glow, default is `10` o fill (boolean) will it be filled, default is `false` - o opacity: opacity, default is `0.5` - o offsetx: horizontal offset, default is `0` - o offsety: vertical offset, default is `0` - o color: glow colour, default is `black` + o opacity (number) opacity, default is `0.5` + o offsetx (number) horizontal offset, default is `0` + o offsety (number) vertical offset, default is `0` + o color (string) glow colour, default is `black` o } = (object) @Paper.set of elements that represents glow \*/ @@ -3902,11 +4005,29 @@ })); } out.transform(["...s", scale, scale, top, height, "t", (x - top) / scale, (y - height) / scale]); - // out.scale(scale, scale, top, height).translate(x - top, y - height); } return out; }; + /*\ + * Raphael.format + [ method ] + ** + * Simple format function. Replaces construction of type “`{}`” to the corresponding argument. + ** + > Parameters + ** + - token (string) string to format + - … (string) rest of arguments will be treated as parameters for replacement + = (string) formated string + > Usage + | var x = 10, + | y = 20, + | width = 40, + | height = 50; + | // this will draw a rectangular shape equivalent to "M10,20h40v50h-40z" + | paper.path(Raphael.format("M{1},{2}h{3}v{4}h{5}z", x, y, width, height, -width)); + \*/ R.format = function (token, params) { var args = R.is(params, array) ? [0][concat](params) : arguments; token && R.is(token, string) && args.length - 1 && (token = token.replace(formatrg, function (str, i) { @@ -3914,6 +4035,66 @@ })); return token || E; }; + /*\ + * Raphael.fullfill + [ method ] + ** + * A little bit more advanced format function than @Raphael.format. Replaces construction of type “`{}`” to the corresponding argument. + ** + > Parameters + ** + - token (string) string to format + - json (object) object which properties will be used as a replacement + = (string) formated string + > Usage + | // this will draw a rectangular shape equivalent to "M10,20h40v50h-40z" + | paper.path(Raphael.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']}z", { + | x: 10, + | y: 20, + | dim: { + | width: 40, + | height: 50, + | "negative width": -40 + | } + | })); + \*/ + R.fullfill = (function () { + var tokenRegex = /\{([^\}]+)\}/g, + objNotationRegex = /(?:(?:^|\.)(.+?)(?=\[|\.|$|\()|\[('|")(.+?)\2\])(\(\))?/g, // matches .xxxxx or ["xxxxx"] to run over object properties + replacer = function (all, key, obj) { + var res = obj; + key.replace(objNotationRegex, function (all, name, quote, quotedName, isFunc) { + name = name || quotedName; + if (res) { + if (name in res) { + res = res[name]; + } + typeof res == "function" && isFunc && (res = res()); + } + }); + res = (res == null || res == obj ? all : res) + ""; + return res; + }; + return function (str, obj) { + return String(str).replace(tokenRegex, function (all, key) { + return replacer(all, key, obj); + }); + }; + })(); + /*\ + * Raphael.ninja + [ method ] + ** + * 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. + * Beware, that in this case plugins could stop working, because they are depending on global variable existance. + ** + = (object) Raphael object + > Usage + | (function (local_raphael) { + | var paper = local_raphael(10, 10, 320, 200); + | … + | })(Raphael.ninja()); + \*/ R.ninja = function () { oldRaphael.was ? (g.win.Raphael = oldRaphael.is) : delete Raphael; return R; @@ -3922,15 +4103,21 @@ * Raphael.st [ property (object) ] ** - * You can add your own method to elements. This is usefull when you want to hack default functionality or - * want to wrap some common transformation or attributes in one method. In difference to canvas methods, - * you can redefine element method at any time. Expending element methods wouldn’t affect set. + * You can add your own method to elements and sets. It is wise to add a set method for each element method + * you added, so you will be able to call the same method on sets too. + ** + * See also @Raphael.el. > Usage | Raphael.el.red = function () { | this.attr({fill: "#f00"}); | }; + | Raphael.st.red = function () { + | this.forEach(function () { + | this.red(); + | }); + | }; | // then use it - | paper.circle(100, 100, 20).red(); + | paper.set(paper.circle(100, 100, 20), paper.circle(110, 100, 20)).red(); \*/ R.st = setproto; // Firefox <3.6 fix: http://webreflection.blogspot.com/2009/11/195-chars-to-help-lazy-loading.html @@ -3949,275 +4136,6 @@ })(document, "DOMContentLoaded"); oldRaphael.was ? (g.win.Raphael = R) : (Raphael = R); - - /* - * Eve 0.2.3 - JavaScript Events Library - * - * Copyright (c) 2010 Dmitry Baranovskiy (http://dmitry.baranovskiy.com/) - * Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license. - */ - - var eve = R.eve = (function () { - var version = "0.2.3", - has = "hasOwnProperty", - separator = /[\.\/]/, - wildcard = "*", - fun = function () {}, - numsort = function (a, b) { - return a - b; - }, - current_event, - events = {n: {}}, - /*\ - * eve - [ method ] - ** - * Fires event with given `name`, given scope and other parameters. - ** - > Arguments - ** - - name (string) name of the event, dot (`.`) or slash (`/`) separated - - scope (object) context for the event handlers - - varargs (...) the rest of arguments will be sent to event handlers - ** - = (array) array of errors, if any. Each element of the array is in format: - o { - o error (string) error message - o func (function) handler that caused error - o } - \*/ - eve = function (name, scope) { - var e = events, - args = Array.prototype.slice.call(arguments, 2), - listeners = eve.listeners(name), - z = 0, - f = false, - l, - indexed = [], - queue = {}, - errors = []; - current_event = name; - for (var i = 0, ii = listeners.length; i < ii; i++) if ("zIndex" in listeners[i]) { - indexed.push(listeners[i].zIndex); - if (listeners[i].zIndex < 0) { - queue[listeners[i].zIndex] = listeners[i]; - } - } - indexed.sort(numsort); - while (indexed[z] < 0) { - l = queue[indexed[z++]]; - if (l.apply(scope, args) === f) { - return f; - } - } - for (i = 0; i < ii; i++) { - l = listeners[i]; - if ("zIndex" in l) { - if (l.zIndex == indexed[z]) { - if (l.apply(scope, args) === f) { - return f; - } - do { - z++; - l = queue[indexed[z]]; - if (l) { - if (l.apply(scope, args) === f) { - return f; - } - } - } while (l) - } else { - queue[l.zIndex] = l; - } - } else { - if (l.apply(scope, args) === f) { - return f; - } - } - } - }; - /*\ - * eve.listeners - [ method ] - ** - * Internal method which gives you array of all event handlers that will be triggered by the given `name`. - ** - > Arguments - ** - - name (string) name of the event, dot (`.`) or slash (`/`) separated - ** - = (array) array of event handlers - \*/ - eve.listeners = function (name) { - var names = name.split(separator), - e = events, - item, - items, - k, - i, - ii, - j, - jj, - nes, - es = [e], - out = []; - for (i = 0, ii = names.length; i < ii; i++) { - nes = []; - for (j = 0, jj = es.length; j < jj; j++) { - e = es[j].n; - items = [e[names[i]], e[wildcard]]; - k = 2; - while (k--) { - item = items[k]; - if (item) { - nes.push(item); - out = out.concat(item.f || []); - } - } - } - es = nes; - } - return out; - }; - - /*\ - * eve.on - [ method ] - ** - * Binds given event handler with a given name. You can use wildcards “`*`” for the names: - | eve.on("*.under.*", f); - | eve("mouse.under.floor"); // triggers f - * Use @eve to trigger the listener. - ** - > Arguments - ** - - name (string) name of the event, dot (`.`) or slash (`/`) separated, with optional wildcards - - f (function) event handler function - ** - = (function) returned function accept one number parameter that represents z-index of the handler. It is optional feature and only used when you need to ensure that some subset of handlers will be invoked in a given order, despite of the order of assignment. - > Example: - | eve.on("mouse", eat)(2); - | eve.on("mouse", scream); - | eve.on("mouse", catch)(1); - * This will ensure that `catch` function will be called before `eat`. - * If you want to put you hadler before not indexed handlers specify negative value. - * Note: I assume most of the time you don’t need to worry about z-index, but it’s nice to have this feature “just in case”. - \*/ - eve.on = function (name, f) { - var names = name.split(separator), - e = events; - for (var i = 0, ii = names.length; i < ii; i++) { - e = e.n; - !e[names[i]] && (e[names[i]] = {n: {}}); - e = e[names[i]]; - } - e.f = e.f || []; - for (i = 0, ii = e.f.length; i < ii; i++) if (e.f[i] == f) { - return fun; - } - e.f.push(f); - return function (zIndex) { - if (+zIndex == +zIndex) { - f.zIndex = +zIndex; - } - }; - }; - /*\ - * eve.nt - [ method ] - ** - * Could be used inside event handler to figure out actual name of the event. - ** - > Arguments - ** - - subname (string) #optional subname of the event - ** - = (string) name of the event, if `subname` is not specified - * or - = (boolean) `true`, if current event’s name contains `subname` - \*/ - eve.nt = function (subname) { - if (subname) { - return new RegExp("(?:\\.|\\/|^)" + subname + "(?:\\.|\\/|$)").test(current_event); - } - return current_event; - }; - /*\ - * eve.unbind - [ method ] - ** - * Removes given function from the list of event listeners assigned to given name. - ** - > Arguments - ** - - name (string) name of the event, dot (`.`) or slash (`/`) separated, with optional wildcards - - f (function) event handler function - \*/ - eve.unbind = function (name, f) { - var names = name.split(separator), - e, - key, - splice, - cur = [events]; - for (var i = 0, ii = names.length; i < ii; i++) { - for (var j = 0; j < cur.length; j += splice.length - 2) { - splice = [j, 1]; - e = cur[j].n; - if (names[i] != wildcard) { - if (e[names[i]]) { - splice.push(e[names[i]]); - } - } else { - for (key in e) if (e[has](key)) { - splice.push(e[key]); - } - } - cur.splice.apply(cur, splice); - } - } - for (i = 0, ii = cur.length; i < ii; i++) { - e = cur[i]; - while (e.n) { - if (f) { - if (e.f) { - for (i = 0, ii = e.f.length; i < ii; i++) if (e.f[i] == f) { - e.f.splice(i, 1); - break; - } - !e.f.length && delete e.f; - } - for (key in e.n) if (e.n[has](key) && e.n[key].f) { - var funcs = e.n[key].f; - for (i = 0, ii = funcs.length; i < ii; i++) if (funcs[i] == f) { - funcs.splice(i, 1); - break; - } - !funcs.length && delete e.n[key].f; - } - } else { - delete e.f; - for (key in e.n) if (e.n[has](key) && e.n[key].f) { - delete e.n[key].f; - } - } - e = e.n; - } - } - }; - /*\ - * eve.version - [ property (string) ] - ** - * Current version of the library. - \*/ - eve.version = version; - eve.toString = function () { - return "You are running Eve " + version; - }; - return eve; - })(); - - // Eve finished eve.on("DOMload", function () { loaded = true; diff --git a/raphael.js b/raphael.js index 2f48123..ba4028c 100644 --- a/raphael.js +++ b/raphael.js @@ -1,5 +1,291 @@ // ┌─────────────────────────────────────────────────────────────────────┐ \\ -// │ Raphaël 2 - JavaScript Vector Library │ \\ +// │ "Raphaël 2.0" - JavaScript Vector Library │ \\ +// ├─────────────────────────────────────────────────────────────────────┤ \\ +// │ Copyright (c) 2008-2011 Dmitry Baranovskiy (http://raphaeljs.com) │ \\ +// │ Copyright (c) 2008-2011 Sencha Labs (http://sencha.com) │ \\ +// │ Licensed under the MIT (http://raphaeljs.com/license.html) license. │ \\ +// └─────────────────────────────────────────────────────────────────────┘ \\ + +/* + * Eve 0.3.0 - JavaScript Events Library + * + * Copyright (c) 2011 Dmitry Baranovskiy (http://dmitry.baranovskiy.com/) + * Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license. + */ + +(function (glob) { + var version = "0.3.0", + has = "hasOwnProperty", + separator = /[\.\/]/, + wildcard = "*", + fun = function () {}, + numsort = function (a, b) { + return a - b; + }, + current_event, + stop, + events = {n: {}}, + /*\ + * eve + [ method ] + ** + * Fires event with given `name`, given scope and other parameters. + ** + > Arguments + ** + - name (string) name of the event, dot (`.`) or slash (`/`) separated + - scope (object) context for the event handlers + - varargs (...) the rest of arguments will be sent to event handlers + ** + = (boolean) `false` if any of callbacks return false, `true` otherwise + \*/ + eve = function (name, scope) { + var e = events, + args = Array.prototype.slice.call(arguments, 2), + listeners = eve.listeners(name), + z = 0, + f = false, + l, + indexed = [], + queue = {}, + out = [], + errors = []; + current_event = name; + stop = 0; + for (var i = 0, ii = listeners.length; i < ii; i++) if ("zIndex" in listeners[i]) { + indexed.push(listeners[i].zIndex); + if (listeners[i].zIndex < 0) { + queue[listeners[i].zIndex] = listeners[i]; + } + } + indexed.sort(numsort); + while (indexed[z] < 0) { + l = queue[indexed[z++]]; + out.push(l.apply(scope, args)); + if (stop) { + return out; + } + } + for (i = 0; i < ii; i++) { + l = listeners[i]; + if ("zIndex" in l) { + if (l.zIndex == indexed[z]) { + out.push(l.apply(scope, args)); + if (stop) { + return out; + } + do { + z++; + l = queue[indexed[z]]; + l && out.push(l.apply(scope, args)); + if (stop) { + return out; + } + } while (l) + } else { + queue[l.zIndex] = l; + } + } else { + out.push(l.apply(scope, args)); + if (stop) { + return out; + } + } + } + return out.length ? out : null; + }; + /*\ + * eve.listeners + [ method ] + ** + * Internal method which gives you array of all event handlers that will be triggered by the given `name`. + ** + > Arguments + ** + - name (string) name of the event, dot (`.`) or slash (`/`) separated + ** + = (array) array of event handlers + \*/ + eve.listeners = function (name) { + var names = name.split(separator), + e = events, + item, + items, + k, + i, + ii, + j, + jj, + nes, + es = [e], + out = []; + for (i = 0, ii = names.length; i < ii; i++) { + nes = []; + for (j = 0, jj = es.length; j < jj; j++) { + e = es[j].n; + items = [e[names[i]], e[wildcard]]; + k = 2; + while (k--) { + item = items[k]; + if (item) { + nes.push(item); + out = out.concat(item.f || []); + } + } + } + es = nes; + } + return out; + }; + + /*\ + * eve.on + [ method ] + ** + * Binds given event handler with a given name. You can use wildcards “`*`” for the names: + | eve.on("*.under.*", f); + | eve("mouse.under.floor"); // triggers f + * Use @eve to trigger the listener. + ** + > Arguments + ** + - name (string) name of the event, dot (`.`) or slash (`/`) separated, with optional wildcards + - f (function) event handler function + ** + = (function) returned function accept one number parameter that represents z-index of the handler. It is optional feature and only used when you need to ensure that some subset of handlers will be invoked in a given order, despite of the order of assignment. + > Example: + | eve.on("mouse", eat)(2); + | eve.on("mouse", scream); + | eve.on("mouse", catch)(1); + * This will ensure that `catch` function will be called before `eat`. + * If you want to put you hadler before not indexed handlers specify negative value. + * Note: I assume most of the time you don’t need to worry about z-index, but it’s nice to have this feature “just in case”. + \*/ + eve.on = function (name, f) { + var names = name.split(separator), + e = events; + for (var i = 0, ii = names.length; i < ii; i++) { + e = e.n; + !e[names[i]] && (e[names[i]] = {n: {}}); + e = e[names[i]]; + } + e.f = e.f || []; + for (i = 0, ii = e.f.length; i < ii; i++) if (e.f[i] == f) { + return fun; + } + e.f.push(f); + return function (zIndex) { + if (+zIndex == +zIndex) { + f.zIndex = +zIndex; + } + }; + }; + /*\ + * eve.stop + [ method ] + ** + * Is used inside event handler to stop event + \*/ + eve.stop = function () { + stop = 1; + }; + /*\ + * eve.nt + [ method ] + ** + * Could be used inside event handler to figure out actual name of the event. + ** + > Arguments + ** + - subname (string) #optional subname of the event + ** + = (string) name of the event, if `subname` is not specified + * or + = (boolean) `true`, if current event’s name contains `subname` + \*/ + eve.nt = function (subname) { + if (subname) { + return new RegExp("(?:\\.|\\/|^)" + subname + "(?:\\.|\\/|$)").test(current_event); + } + return current_event; + }; + /*\ + * eve.unbind + [ method ] + ** + * Removes given function from the list of event listeners assigned to given name. + ** + > Arguments + ** + - name (string) name of the event, dot (`.`) or slash (`/`) separated, with optional wildcards + - f (function) event handler function + \*/ + eve.unbind = function (name, f) { + var names = name.split(separator), + e, + key, + splice, + cur = [events]; + for (var i = 0, ii = names.length; i < ii; i++) { + for (var j = 0; j < cur.length; j += splice.length - 2) { + splice = [j, 1]; + e = cur[j].n; + if (names[i] != wildcard) { + if (e[names[i]]) { + splice.push(e[names[i]]); + } + } else { + for (key in e) if (e[has](key)) { + splice.push(e[key]); + } + } + cur.splice.apply(cur, splice); + } + } + for (i = 0, ii = cur.length; i < ii; i++) { + e = cur[i]; + while (e.n) { + if (f) { + if (e.f) { + for (i = 0, ii = e.f.length; i < ii; i++) if (e.f[i] == f) { + e.f.splice(i, 1); + break; + } + !e.f.length && delete e.f; + } + for (key in e.n) if (e.n[has](key) && e.n[key].f) { + var funcs = e.n[key].f; + for (i = 0, ii = funcs.length; i < ii; i++) if (funcs[i] == f) { + funcs.splice(i, 1); + break; + } + !funcs.length && delete e.n[key].f; + } + } else { + delete e.f; + for (key in e.n) if (e.n[has](key) && e.n[key].f) { + delete e.n[key].f; + } + } + e = e.n; + } + } + }; + /*\ + * eve.version + [ property (string) ] + ** + * Current version of the library. + \*/ + eve.version = version; + eve.toString = function () { + return "You are running Eve " + version; + }; + (typeof module != "undefined" && module.exports) ? (module.exports = eve) : (glob.eve = eve); +})(this); + +// ┌─────────────────────────────────────────────────────────────────────┐ \\ +// │ "Raphaël 2.0" - JavaScript Vector Library │ \\ // ├─────────────────────────────────────────────────────────────────────┤ \\ // │ Copyright (c) 2008-2011 Dmitry Baranovskiy (http://raphaeljs.com) │ \\ // │ Copyright (c) 2008-2011 Sencha Labs (http://sencha.com) │ \\ @@ -84,6 +370,7 @@ } } R.version = "2.0.0"; + R.eve = eve; var loaded, separator = /[, ]+/, elements = {circle: 1, rect: 1, path: 1, ellipse: 1, text: 1, image: 1}, @@ -1869,6 +2156,21 @@ } } (function (matrixproto) { + /*\ + * Matrix.add + [ method ] + ** + * Adds given matrix to existing one. + > Parameters + - a (number) + - b (number) + - c (number) + - d (number) + - e (number) + - f (number) + or + - matrix (object) @Matrix + \*/ matrixproto.add = function (a, b, c, d, e, f) { var out = [[], [], []], m = [[this.a, this.c, this.e], [this.b, this.d, this.f], [0, 0, 1]], @@ -1895,33 +2197,99 @@ this.e = out[0][2]; this.f = out[1][2]; }; + /*\ + * Matrix.invert + [ method ] + ** + * Returns inverted version of the matrix + = (object) @Matrix + \*/ matrixproto.invert = function () { var me = this, x = me.a * me.d - me.b * me.c; 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); }; + /*\ + * Matrix.clone + [ method ] + ** + * Returns copy of the matrix + = (object) @Matrix + \*/ matrixproto.clone = function () { return new Matrix(this.a, this.b, this.c, this.d, this.e, this.f); }; + /*\ + * Matrix.translate + [ method ] + ** + * Translate the matrix + > Parameters + - x (number) + - y (number) + \*/ matrixproto.translate = function (x, y) { this.add(1, 0, 0, 1, x, y); }; + /*\ + * Matrix.scale + [ method ] + ** + * Scales the matrix + > Parameters + - x (number) + - y (number) #optional + - cx (number) #optional + - cy (number) #optional + \*/ matrixproto.scale = function (x, y, cx, cy) { y == null && (y = x); - this.add(1, 0, 0, 1, cx, cy); + cx || cy && this.add(1, 0, 0, 1, cx, cy); this.add(x, 0, 0, y, 0, 0); - this.add(1, 0, 0, 1, -cx, -cy); + cx || cy && this.add(1, 0, 0, 1, -cx, -cy); }; + /*\ + * Matrix.rotate + [ method ] + ** + * Rotates the matrix + > Parameters + - a (number) + - x (number) + - y (number) + \*/ matrixproto.rotate = function (a, x, y) { a = R.rad(a); + x = x || 0; + y = y || 0; var cos = +math.cos(a).toFixed(9), sin = +math.sin(a).toFixed(9); this.add(cos, sin, -sin, cos, x, y); this.add(1, 0, 0, 1, -x, -y); }; + /*\ + * Matrix.x + [ method ] + ** + * Return x coordinate for given point after transformation described by the matrix. See also @Matrix.y + > Parameters + - x (number) + - y (number) + = (number) x + \*/ matrixproto.x = function (x, y) { return x * this.a + y * this.c + this.e; }; + /*\ + * Matrix.y + [ method ] + ** + * Return y coordinate for given point after transformation described by the matrix. See also @Matrix.x + > Parameters + - x (number) + - y (number) + = (number) y + \*/ matrixproto.y = function (x, y) { return x * this.b + y * this.d + this.f; }; @@ -1949,6 +2317,20 @@ a[0] && (a[0] /= mag); a[1] && (a[1] /= mag); } + /*\ + * Matrix.split + [ method ] + ** + * Splits matrix into primitive transformations + = (object) in format: + o dx (number) translation by x + o dy (number) translation by y + o scalex (number) scale by x + o scaley (number) scale by y + o shear (number) shear + o rotate (number) rotation in deg + o isSimple (boolean) could it be represented via simple transformations + \*/ matrixproto.split = function () { var out = {}; // translation @@ -1984,6 +2366,13 @@ out.noRotation = !+out.shear.toFixed(9) && !out.rotate; return out; }; + /*\ + * Matrix.toTransformString + [ method ] + ** + * Return transform string that represents given matrix + = (string) transform string + \*/ matrixproto.toTransformString = function () { var s = this.split(); if (s.isSimple) { @@ -2687,10 +3076,10 @@ o { o width (number) size of the glow, default is `10` o fill (boolean) will it be filled, default is `false` - o opacity: opacity, default is `0.5` - o offsetx: horizontal offset, default is `0` - o offsety: vertical offset, default is `0` - o color: glow colour, default is `black` + o opacity (number) opacity, default is `0.5` + o offsetx (number) horizontal offset, default is `0` + o offsety (number) vertical offset, default is `0` + o color (string) glow colour, default is `black` o } = (object) @Paper.set of elements that represents glow \*/ @@ -3902,11 +4291,29 @@ })); } out.transform(["...s", scale, scale, top, height, "t", (x - top) / scale, (y - height) / scale]); - // out.scale(scale, scale, top, height).translate(x - top, y - height); } return out; }; + /*\ + * Raphael.format + [ method ] + ** + * Simple format function. Replaces construction of type “`{}`” to the corresponding argument. + ** + > Parameters + ** + - token (string) string to format + - … (string) rest of arguments will be treated as parameters for replacement + = (string) formated string + > Usage + | var x = 10, + | y = 20, + | width = 40, + | height = 50; + | // this will draw a rectangular shape equivalent to "M10,20h40v50h-40z" + | paper.path(Raphael.format("M{1},{2}h{3}v{4}h{5}z", x, y, width, height, -width)); + \*/ R.format = function (token, params) { var args = R.is(params, array) ? [0][concat](params) : arguments; token && R.is(token, string) && args.length - 1 && (token = token.replace(formatrg, function (str, i) { @@ -3914,6 +4321,66 @@ })); return token || E; }; + /*\ + * Raphael.fullfill + [ method ] + ** + * A little bit more advanced format function than @Raphael.format. Replaces construction of type “`{}`” to the corresponding argument. + ** + > Parameters + ** + - token (string) string to format + - json (object) object which properties will be used as a replacement + = (string) formated string + > Usage + | // this will draw a rectangular shape equivalent to "M10,20h40v50h-40z" + | paper.path(Raphael.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']}z", { + | x: 10, + | y: 20, + | dim: { + | width: 40, + | height: 50, + | "negative width": -40 + | } + | })); + \*/ + R.fullfill = (function () { + var tokenRegex = /\{([^\}]+)\}/g, + objNotationRegex = /(?:(?:^|\.)(.+?)(?=\[|\.|$|\()|\[('|")(.+?)\2\])(\(\))?/g, // matches .xxxxx or ["xxxxx"] to run over object properties + replacer = function (all, key, obj) { + var res = obj; + key.replace(objNotationRegex, function (all, name, quote, quotedName, isFunc) { + name = name || quotedName; + if (res) { + if (name in res) { + res = res[name]; + } + typeof res == "function" && isFunc && (res = res()); + } + }); + res = (res == null || res == obj ? all : res) + ""; + return res; + }; + return function (str, obj) { + return String(str).replace(tokenRegex, function (all, key) { + return replacer(all, key, obj); + }); + }; + })(); + /*\ + * Raphael.ninja + [ method ] + ** + * 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. + * Beware, that in this case plugins could stop working, because they are depending on global variable existance. + ** + = (object) Raphael object + > Usage + | (function (local_raphael) { + | var paper = local_raphael(10, 10, 320, 200); + | … + | })(Raphael.ninja()); + \*/ R.ninja = function () { oldRaphael.was ? (g.win.Raphael = oldRaphael.is) : delete Raphael; return R; @@ -3922,15 +4389,21 @@ * Raphael.st [ property (object) ] ** - * You can add your own method to elements. This is usefull when you want to hack default functionality or - * want to wrap some common transformation or attributes in one method. In difference to canvas methods, - * you can redefine element method at any time. Expending element methods wouldn’t affect set. + * You can add your own method to elements and sets. It is wise to add a set method for each element method + * you added, so you will be able to call the same method on sets too. + ** + * See also @Raphael.el. > Usage | Raphael.el.red = function () { | this.attr({fill: "#f00"}); | }; + | Raphael.st.red = function () { + | this.forEach(function () { + | this.red(); + | }); + | }; | // then use it - | paper.circle(100, 100, 20).red(); + | paper.set(paper.circle(100, 100, 20), paper.circle(110, 100, 20)).red(); \*/ R.st = setproto; // Firefox <3.6 fix: http://webreflection.blogspot.com/2009/11/195-chars-to-help-lazy-loading.html @@ -3949,275 +4422,6 @@ })(document, "DOMContentLoaded"); oldRaphael.was ? (g.win.Raphael = R) : (Raphael = R); - - /* - * Eve 0.2.3 - JavaScript Events Library - * - * Copyright (c) 2010 Dmitry Baranovskiy (http://dmitry.baranovskiy.com/) - * Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license. - */ - - var eve = R.eve = (function () { - var version = "0.2.3", - has = "hasOwnProperty", - separator = /[\.\/]/, - wildcard = "*", - fun = function () {}, - numsort = function (a, b) { - return a - b; - }, - current_event, - events = {n: {}}, - /*\ - * eve - [ method ] - ** - * Fires event with given `name`, given scope and other parameters. - ** - > Arguments - ** - - name (string) name of the event, dot (`.`) or slash (`/`) separated - - scope (object) context for the event handlers - - varargs (...) the rest of arguments will be sent to event handlers - ** - = (array) array of errors, if any. Each element of the array is in format: - o { - o error (string) error message - o func (function) handler that caused error - o } - \*/ - eve = function (name, scope) { - var e = events, - args = Array.prototype.slice.call(arguments, 2), - listeners = eve.listeners(name), - z = 0, - f = false, - l, - indexed = [], - queue = {}, - errors = []; - current_event = name; - for (var i = 0, ii = listeners.length; i < ii; i++) if ("zIndex" in listeners[i]) { - indexed.push(listeners[i].zIndex); - if (listeners[i].zIndex < 0) { - queue[listeners[i].zIndex] = listeners[i]; - } - } - indexed.sort(numsort); - while (indexed[z] < 0) { - l = queue[indexed[z++]]; - if (l.apply(scope, args) === f) { - return f; - } - } - for (i = 0; i < ii; i++) { - l = listeners[i]; - if ("zIndex" in l) { - if (l.zIndex == indexed[z]) { - if (l.apply(scope, args) === f) { - return f; - } - do { - z++; - l = queue[indexed[z]]; - if (l) { - if (l.apply(scope, args) === f) { - return f; - } - } - } while (l) - } else { - queue[l.zIndex] = l; - } - } else { - if (l.apply(scope, args) === f) { - return f; - } - } - } - }; - /*\ - * eve.listeners - [ method ] - ** - * Internal method which gives you array of all event handlers that will be triggered by the given `name`. - ** - > Arguments - ** - - name (string) name of the event, dot (`.`) or slash (`/`) separated - ** - = (array) array of event handlers - \*/ - eve.listeners = function (name) { - var names = name.split(separator), - e = events, - item, - items, - k, - i, - ii, - j, - jj, - nes, - es = [e], - out = []; - for (i = 0, ii = names.length; i < ii; i++) { - nes = []; - for (j = 0, jj = es.length; j < jj; j++) { - e = es[j].n; - items = [e[names[i]], e[wildcard]]; - k = 2; - while (k--) { - item = items[k]; - if (item) { - nes.push(item); - out = out.concat(item.f || []); - } - } - } - es = nes; - } - return out; - }; - - /*\ - * eve.on - [ method ] - ** - * Binds given event handler with a given name. You can use wildcards “`*`” for the names: - | eve.on("*.under.*", f); - | eve("mouse.under.floor"); // triggers f - * Use @eve to trigger the listener. - ** - > Arguments - ** - - name (string) name of the event, dot (`.`) or slash (`/`) separated, with optional wildcards - - f (function) event handler function - ** - = (function) returned function accept one number parameter that represents z-index of the handler. It is optional feature and only used when you need to ensure that some subset of handlers will be invoked in a given order, despite of the order of assignment. - > Example: - | eve.on("mouse", eat)(2); - | eve.on("mouse", scream); - | eve.on("mouse", catch)(1); - * This will ensure that `catch` function will be called before `eat`. - * If you want to put you hadler before not indexed handlers specify negative value. - * Note: I assume most of the time you don’t need to worry about z-index, but it’s nice to have this feature “just in case”. - \*/ - eve.on = function (name, f) { - var names = name.split(separator), - e = events; - for (var i = 0, ii = names.length; i < ii; i++) { - e = e.n; - !e[names[i]] && (e[names[i]] = {n: {}}); - e = e[names[i]]; - } - e.f = e.f || []; - for (i = 0, ii = e.f.length; i < ii; i++) if (e.f[i] == f) { - return fun; - } - e.f.push(f); - return function (zIndex) { - if (+zIndex == +zIndex) { - f.zIndex = +zIndex; - } - }; - }; - /*\ - * eve.nt - [ method ] - ** - * Could be used inside event handler to figure out actual name of the event. - ** - > Arguments - ** - - subname (string) #optional subname of the event - ** - = (string) name of the event, if `subname` is not specified - * or - = (boolean) `true`, if current event’s name contains `subname` - \*/ - eve.nt = function (subname) { - if (subname) { - return new RegExp("(?:\\.|\\/|^)" + subname + "(?:\\.|\\/|$)").test(current_event); - } - return current_event; - }; - /*\ - * eve.unbind - [ method ] - ** - * Removes given function from the list of event listeners assigned to given name. - ** - > Arguments - ** - - name (string) name of the event, dot (`.`) or slash (`/`) separated, with optional wildcards - - f (function) event handler function - \*/ - eve.unbind = function (name, f) { - var names = name.split(separator), - e, - key, - splice, - cur = [events]; - for (var i = 0, ii = names.length; i < ii; i++) { - for (var j = 0; j < cur.length; j += splice.length - 2) { - splice = [j, 1]; - e = cur[j].n; - if (names[i] != wildcard) { - if (e[names[i]]) { - splice.push(e[names[i]]); - } - } else { - for (key in e) if (e[has](key)) { - splice.push(e[key]); - } - } - cur.splice.apply(cur, splice); - } - } - for (i = 0, ii = cur.length; i < ii; i++) { - e = cur[i]; - while (e.n) { - if (f) { - if (e.f) { - for (i = 0, ii = e.f.length; i < ii; i++) if (e.f[i] == f) { - e.f.splice(i, 1); - break; - } - !e.f.length && delete e.f; - } - for (key in e.n) if (e.n[has](key) && e.n[key].f) { - var funcs = e.n[key].f; - for (i = 0, ii = funcs.length; i < ii; i++) if (funcs[i] == f) { - funcs.splice(i, 1); - break; - } - !funcs.length && delete e.n[key].f; - } - } else { - delete e.f; - for (key in e.n) if (e.n[has](key) && e.n[key].f) { - delete e.n[key].f; - } - } - e = e.n; - } - } - }; - /*\ - * eve.version - [ property (string) ] - ** - * Current version of the library. - \*/ - eve.version = version; - eve.toString = function () { - return "You are running Eve " + version; - }; - return eve; - })(); - - // Eve finished eve.on("DOMload", function () { loaded = true; @@ -4827,6 +5031,8 @@ window.Raphael.svg && function (R) { [ property (object) ] ** * Gives you a reference to the DOM object, so you can assign event handlers or just mess around. + ** + * Note: Don’t mess with it. > Usage | // draw a circle at coordinate 10,10 with radius of 10 | var c = paper.circle(10, 10, 10); diff --git a/raphael.svg.js b/raphael.svg.js index 4fb1a62..9d77c0b 100644 --- a/raphael.svg.js +++ b/raphael.svg.js @@ -601,6 +601,8 @@ window.Raphael.svg && function (R) { [ property (object) ] ** * Gives you a reference to the DOM object, so you can assign event handlers or just mess around. + ** + * Note: Don’t mess with it. > Usage | // draw a circle at coordinate 10,10 with radius of 10 | var c = paper.circle(10, 10, 10); diff --git a/reference.html b/reference.html index d715e93..6dcbbad 100644 --- a/reference.html +++ b/reference.html @@ -1,7 +1,7 @@ -Raphaël Reference
  1. Animation
  2. Animation.delay()
  3. Animation.repeat()
  4. Element
  5. Element.animate()
  6. Element.animateWith()
  7. Element.attr()
  8. Element.clone()
  9. Element.drag()
  10. Element.getBBox()
  11. Element.getPointAtLength()
  12. Element.getSubpath()
  13. Element.getTotalLength()
  14. Element.glow()
  15. Element.hide()
  16. Element.hover()
  17. Element.id
  18. Element.insertAfter()
  19. Element.insertBefore()
  20. Element.next
  21. Element.node
  22. Element.onDragOver()
  23. Element.paper
  24. Element.pause()
  25. Element.prev
  26. Element.raphael
  27. Element.remove()
  28. Element.resume()
  29. Element.rotate()
  30. Element.scale()
  31. Element.setTime()
  32. Element.show()
  33. Element.status()
  34. Element.stop()
  35. Element.toBack()
  36. Element.toFront()
  37. Element.transform()
  38. Element.translate()
  39. Element.undrag()
  40. Element.unhover()
  41. Paper
  42. Paper.bottom
  43. Paper.circle()
  44. Paper.clear()
  45. Paper.customAttributes
  46. Paper.ellipse()
  47. Paper.forEach()
  48. Paper.getById()
  49. Paper.getElementByPoint()
  50. Paper.image()
  51. Paper.path()
  52. Paper.raphael
  53. Paper.rect()
  54. Paper.remove()
  55. Paper.renderfix()
  56. Paper.safari()
  57. Paper.set()
  58. Paper.setSize()
  59. Paper.setViewBox()
  60. Paper.text()
  61. Paper.top
  62. Raphael()
  63. Raphael.angle()
  64. Raphael.animation()
  65. Raphael.deg()
  66. Raphael.easing_formulas
  67. Raphael.el
  68. Raphael.findDotsAtSegment()
  69. Raphael.fn
  70. Raphael.getColor()
  71. Raphael.getColor.reset()
  72. Raphael.getPointAtLength()
  73. Raphael.getRGB()
  74. Raphael.getSubpath()
  75. Raphael.getTotalLength()
  76. Raphael.hsb()
  77. Raphael.hsb2rgb()
  78. Raphael.hsl()
  79. Raphael.hsl2rgb()
  80. Raphael.is()
  81. Raphael.parsePathString()
  82. Raphael.parseTransformString()
  83. Raphael.path2curve()
  84. Raphael.pathToRelative()
  85. Raphael.rad()
  86. Raphael.rgb()
  87. Raphael.rgb2hsb()
  88. Raphael.rgb2hsl()
  89. Raphael.setWindow()
  90. Raphael.snapTo()
  91. Raphael.svg
  92. Raphael.type
  93. Raphael.vml
  94. Set
  95. Set.forEach()
  96. Set.pop()
  97. Set.push()

Raphaël Reference

Check out the source: raphael.js

 Animation⚓

-

 Animation.delay(delay)⚓➭

+Raphaël 2.0 Reference
  1. Animation
  2. Animation.delay()
  3. Animation.repeat()
  4. Element
  5. Element.animate()
  6. Element.animateWith()
  7. Element.attr()
  8. Element.clone()
  9. Element.drag()
  10. Element.getBBox()
  11. Element.getPointAtLength()
  12. Element.getSubpath()
  13. Element.getTotalLength()
  14. Element.glow()
  15. Element.hide()
  16. Element.hover()
  17. Element.id
  18. Element.insertAfter()
  19. Element.insertBefore()
  20. Element.next
  21. Element.node
  22. Element.onDragOver()
  23. Element.paper
  24. Element.pause()
  25. Element.prev
  26. Element.raphael
  27. Element.remove()
  28. Element.resume()
  29. Element.rotate()
  30. Element.scale()
  31. Element.setTime()
  32. Element.show()
  33. Element.status()
  34. Element.stop()
  35. Element.toBack()
  36. Element.toFront()
  37. Element.transform()
  38. Element.translate()
  39. Element.undrag()
  40. Element.unhover()
  41. Matrix
  42. Matrix.add()
  43. Matrix.clone()
  44. Matrix.invert()
  45. Matrix.rotate()
  46. Matrix.scale()
  47. Matrix.split()
  48. Matrix.toTransformString()
  49. Matrix.translate()
  50. Matrix.x()
  51. Matrix.y()
  52. Paper
  53. Paper.bottom
  54. Paper.circle()
  55. Paper.clear()
  56. Paper.customAttributes
  57. Paper.ellipse()
  58. Paper.forEach()
  59. Paper.getById()
  60. Paper.getElementByPoint()
  61. Paper.image()
  62. Paper.path()
  63. Paper.raphael
  64. Paper.rect()
  65. Paper.remove()
  66. Paper.renderfix()
  67. Paper.safari()
  68. Paper.set()
  69. Paper.setFinish()
  70. Paper.setSize()
  71. Paper.setStart()
  72. Paper.setViewBox()
  73. Paper.text()
  74. Paper.top
  75. Raphael()
  76. Raphael.angle()
  77. Raphael.animation()
  78. Raphael.color()
  79. Raphael.deg()
  80. Raphael.easing_formulas
  81. Raphael.el
  82. Raphael.findDotsAtSegment()
  83. Raphael.fn
  84. Raphael.format()
  85. Raphael.fullfill()
  86. Raphael.getColor()
  87. Raphael.getColor.reset()
  88. Raphael.getPointAtLength()
  89. Raphael.getRGB()
  90. Raphael.getSubpath()
  91. Raphael.getTotalLength()
  92. Raphael.hsb()
  93. Raphael.hsb2rgb()
  94. Raphael.hsl()
  95. Raphael.hsl2rgb()
  96. Raphael.is()
  97. Raphael.matrix()
  98. Raphael.ninja()
  99. Raphael.parsePathString()
  100. Raphael.parseTransformString()
  101. Raphael.path2curve()
  102. Raphael.pathToRelative()
  103. Raphael.rad()
  104. Raphael.rgb()
  105. Raphael.rgb2hsb()
  106. Raphael.rgb2hsl()
  107. Raphael.setWindow()
  108. Raphael.snapTo()
  109. Raphael.st
  110. Raphael.svg
  111. Raphael.type
  112. Raphael.vml
  113. Set
  114. Set.forEach()
  115. Set.pop()
  116. Set.push()
  117. eve()
  118. eve.listeners()
  119. eve.nt()
  120. eve.on()
  121. eve.stop()
  122. eve.unbind()
  123. eve.version

Raphaël 2.0 Reference

 Animation⚓

+

 Animation.delay(delay)⚓➭

Creates a copy of existing animation object with given delay.

Parameters @@ -11,7 +11,7 @@

number of ms to pass between animation start and actual animation

Returns: object new altered Animation object

-

 Animation.repeat(repeat)⚓➭

+

 Animation.repeat(repeat)⚓➭

Creates a copy of existing animation object with given repetition.

Parameters @@ -22,7 +22,7 @@

Returns: object new altered Animation object

 Element⚓

-

 Element.animate(…)⚓➭

+

 Element.animate(…)⚓➭

Creates and starts animation for given element.

Parameters @@ -49,7 +49,7 @@

animation object, see Raphael.animation

Returns: object original element

-

 Element.animateWith(…)⚓➭

+

 Element.animateWith(…)⚓➭

Acts similar to Element.animate, but ensure that given animation runs in sync with another given element.

Parameters @@ -76,7 +76,7 @@

animation object, see Raphael.animation

Returns: object original element

-

 Element.attr(…)⚓➭

+

 Element.attr(…)⚓➭

Sets the attributes of the element.

Parameters @@ -177,9 +177,9 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o

  • hsla(•••, •••, •••) — same as above, but with opacity
  • Optionally for hsb and hsl you could specify hue as a degree: “hsl(240deg, 1, .5)” or, if you want to go fancy, “hsl(240°, 1, .5)”
    • -

     Element.clone()⚓➭

    +

     Element.clone()⚓➭

    Returns: object clone of a given element

    -

     Element.drag(onmove, onstart, onend, [mcontext], [scontext], [econtext])⚓➭

    +

     Element.drag(onmove, onstart, onend, [mcontext], [scontext], [econtext])⚓➭

    Adds event handlers for drag of the element.

    Parameters @@ -229,7 +229,7 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o

    1. eventobjectDOM event object

    Returns: object Element

    -

     Element.getBBox(isWithoutTransform)⚓➭

    +

     Element.getBBox(isWithoutTransform)⚓➭

    Return bounding box for a given element

    Parameters @@ -244,7 +244,7 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o

  • width:numberwidth
  • height:numberheight
  • }
    • -

     Element.getPointAtLength(length)⚓➭

    +

     Element.getPointAtLength(length)⚓➭

    Return coordinates of the point located at the given length on the given path. Only works for element of “path” type.

    Parameters @@ -258,7 +258,7 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o

  • y:numbery coordinate
  • alpha:numberangle of derivative
  • }
    • -

     Element.getSubpath(from, to)⚓➭

    +

     Element.getSubpath(from, to)⚓➭

    Return subpath of a given element from given length to given length. Only works for element of “path” type.

    Parameters @@ -271,11 +271,11 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o

    position of the end of the segment

    Returns: string pathstring for the segment

    -

     Element.getTotalLength()⚓➭

    +

     Element.getTotalLength()⚓➭

    Returns length of the path in pixels. Only works for element of “path” type.

    Returns: number length.

    -

     Element.glow([glow])⚓➭

    +

     Element.glow([glow])⚓➭

    Return set of elements that create glow-like effect around given element. See Paper.set.

    Note: Glow is not connected to the element. If you change element attributes it won’t adjust itself. @@ -289,13 +289,17 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o

    1. {
      1. widthnumbersize of the glow, default is 10
      2. fillbooleanwill it be filled, default is false -
      3. opacity: opacity, default is `0.5`
      4. offsetx: horizontal offset, default is `0`
      5. offsety: vertical offset, default is `0`
      6. color: glow colour, default is `black`
    2. }
    +
  • opacitynumberopacity, default is 0.5 +
  • offsetxnumberhorizontal offset, default is 0 +
  • offsetynumbervertical offset, default is 0 +
  • colorstringglow colour, default is black +
  • }

    • Returns: object Paper.set of elements that represents glow

    -

     Element.hide()⚓➭

    +

     Element.hide()⚓➭

    Makes element invisible. See Element.show.

    Returns: object Element

    -

     Element.hover(f_in, f_out, [icontext], [ocontext])⚓➭

    +

     Element.hover(f_in, f_out, [icontext], [ocontext])⚓➭

    Adds event handlers for hover for the element.

    Parameters @@ -316,23 +320,24 @@ at 0.25, 0.75. Focus point coordinates are in 0..1 range. Radial gradients can o

    context for hover out handler

    Returns: object Element

    -

     Element.id⚓➭

    +

     Element.id⚓➭

    number

    Unique id of the element. Especially usesful when you want to listen to events of the element, because all events are fired in format <module>.<action>.<id>. Also useful for Paper.getById method.

    -

     Element.insertAfter()⚓➭

    +

     Element.insertAfter()⚓➭

    Inserts current object after the given one.

    Returns: object Element

    -

     Element.insertBefore()⚓➭

    +

     Element.insertBefore()⚓➭

    Inserts current object before the given one.

    Returns: object Element

    -

     Element.next⚓➭

    +

     Element.next⚓➭

    object

    Reference to the next element in the hierarchy.

    -

     Element.node⚓➭

    +

     Element.node⚓➭

    object

    Gives you a reference to the DOM object, so you can assign event handlers or just mess around. +Note: Don’t mess with it.

    Usage

    @@ -342,7 +347,7 @@ c.node.onclick = function () { c.attr("fill", "red"); }; -

     Element.onDragOver(f)⚓➭

    +

     Element.onDragOver(f)⚓➭

    Shortcut for assigning event handler for drag.over.<id> event, where id is id of the element (see Element.id).

    Parameters @@ -351,7 +356,7 @@ c.node.onclick = function () {

    function
    handler for event
    -

     Element.paper⚓➭

    +

     Element.paper⚓➭

    object

    Internal reference to “paper” where object drawn. Mainly for use in plugins and element extensions.

    Usage @@ -362,7 +367,7 @@ c.node.onclick = function () { .attr({stroke: "red"}); } -

     Element.pause([anim])⚓➭

    +

     Element.pause([anim])⚓➭

    Stops animation of the element with ability to resume it later on.

    Parameters @@ -373,10 +378,10 @@ c.node.onclick = function () {

    animation object

    Returns: object original element

    -

     Element.prev⚓➭

    +

     Element.prev⚓➭

    object

    Reference to the previous element in the hierarchy.

    -

     Element.raphael⚓➭

    +

     Element.raphael⚓➭

    object

    Internal reference to Raphael object. In case it is not available.

    Usage @@ -387,10 +392,10 @@ c.node.onclick = function () { this.attr({fill: this.paper.raphael.hsb2rgb(hsb).hex}); } -

     Element.remove()⚓➭

    +

     Element.remove()⚓➭

    Removes element form the paper.

    -

     Element.resume([anim])⚓➭

    +

     Element.resume([anim])⚓➭

    Resumes animation if it was paused with Element.pause method.

    Parameters @@ -401,7 +406,7 @@ c.node.onclick = function () {

    animation object

    Returns: object original element

    -

     Element.rotate(deg, [cx], [cy])⚓➭

    +

     Element.rotate(deg, [cx], [cy])⚓➭

    Adds rotation by given angle around given point to the list of transformations of the element.

    @@ -422,7 +427,7 @@ transformations of the element.

    If cx & cy aren’t specified centre of the shape is used as a point of rotation.

    Returns: object Element

    -

     Element.scale(sx, sy, [cx], [cy])⚓➭

    +

     Element.scale(sx, sy, [cx], [cy])⚓➭

    Adds scale by given amount relative to given point to the list of transformations of the element.

    @@ -446,7 +451,7 @@ transformations of the element.

    If cx & cy aren’t specified centre of the shape is used instead.

    Returns: object Element

    -

     Element.setTime(anim, value)⚓➭

    +

     Element.setTime(anim, value)⚓➭

    Sets the status of animation of the element in milliseconds. Similar to Element.status method.

    Parameters @@ -463,11 +468,11 @@ transformations of the element.

    On each animation frame event anim.frame.<id>, on start anim.start.<id> and on end anim.finish.<id>.

    -

     Element.show()⚓➭

    +

     Element.show()⚓➭

    Makes element visible. See Element.hide.

    Returns: object Element

    -

     Element.status([anim], [value])⚓➭

    +

     Element.status([anim], [value])⚓➭

    Gets or sets the status of animation of the element.

    Parameters @@ -491,7 +496,7 @@ transformations of the element.

    or

    Returns: object original element if value is specified

    -

     Element.stop([anim])⚓➭

    +

     Element.stop([anim])⚓➭

    Stops animation of the element.

    Parameters @@ -502,15 +507,15 @@ transformations of the element.

    animation object

    Returns: object original element

    -

     Element.toBack()⚓➭

    +

     Element.toBack()⚓➭

    Moves the element so it is the furthest from the viewer’s eyes, behind other elements.

    Returns: object Element

    -

     Element.toFront()⚓➭

    +

     Element.toFront()⚓➭

    Moves the element so it is the closest to the viewer’s eyes, on top of other elements.

    Returns: object Element

    -

     Element.transform([tstr])⚓➭

    +

     Element.transform([tstr])⚓➭

    Adds transformation to the element which is separate to other attributes, i.e. translation doesn’t change x or y of the rectange. The format of transformation string is similar to the path string syntax: @@ -553,7 +558,7 @@ console.log(el.transform());

    else

    Returns: object Element

    -

     Element.translate(dx, dy)⚓➭

    +

     Element.translate(dx, dy)⚓➭

    Adds translation by given amount to the list of transformations of the element.

    Parameters @@ -566,10 +571,10 @@ console.log(el.transform());

    vertical shift

    Returns: object Element

    -

     Element.undrag()⚓➭

    +

     Element.undrag()⚓➭

    Removes all drag event handlers from given element.

    -

     Element.unhover(f_in, f_out)⚓➭

    +

     Element.unhover(f_in, f_out)⚓➭

    Removes event handlers for hover for the element.

    Parameters @@ -582,11 +587,137 @@ console.log(el.transform());

    handler for hover out

    Returns: object Element

    +

     Matrix⚓

    +

     Matrix.add(a, b, c, d, e, f, matrix)⚓➭

    +

    Adds given matrix to existing one. +

    +

    Parameters +

    +
    a
    +
    number
    +
     
    +
    b
    +
    number
    +
     
    +
    c
    +
    number
    +
     
    +
    d
    +
    number
    +
     
    +
    e
    +
    number
    +
     
    +
    f
    +
    number
    +
     
    +
    matrix
    +
    object
    +
    Matrix
    +
    +

     Matrix.clone()⚓➭

    +

    Returns copy of the matrix +

    +

    Returns: object Matrix

    +

     Matrix.invert()⚓➭

    +

    Returns inverted version of the matrix +

    +

    Returns: object Matrix

    +

     Matrix.rotate(a, x, y)⚓➭

    +

    Rotates the matrix +

    +

    Parameters +

    +
    a
    +
    number
    +
     
    +
    x
    +
    number
    +
     
    +
    y
    +
    number
    +
     
    +
    +

     Matrix.scale(x, [y], [cx], [cy])⚓➭

    +

    Scales the matrix +

    +

    Parameters +

    +
    x
    +
    number
    +
     
    +
    y
    +
    optional
    +
    number
    +
     
    +
    cx
    +
    optional
    +
    number
    +
     
    +
    cy
    +
    optional
    +
    number
    +
     
    +
    +

     Matrix.split()⚓➭

    +

    Splits matrix into primitive transformations +

    +

    Returns: object in format:

    +
    1. dxnumbertranslation by x +
    2. dynumbertranslation by y +
    3. scalexnumberscale by x +
    4. scaleynumberscale by y +
    5. shearnumbershear +
    6. rotatenumberrotation in deg +
    7. isSimplebooleancould it be represented via simple transformations +
    +

     Matrix.toTransformString()⚓➭

    +

    Return transform string that represents given matrix +

    +

    Returns: string transform string

    +

     Matrix.translate(x, y)⚓➭

    +

    Translate the matrix +

    +

    Parameters +

    +
    x
    +
    number
    +
     
    +
    y
    +
    number
    +
     
    +
    +

     Matrix.x(x, y)⚓➭

    +

    Return x coordinate for given point after transformation described by the matrix. See also Matrix.y +

    +

    Parameters +

    +
    x
    +
    number
    +
     
    +
    y
    +
    number
    +
     
    +
    +

    Returns: number x

    +

     Matrix.y(x, y)⚓➭

    +

    Return y coordinate for given point after transformation described by the matrix. See also Matrix.x +

    +

    Parameters +

    +
    x
    +
    number
    +
     
    +
    y
    +
    number
    +
     
    +
    +

    Returns: number y

     Paper⚓

    -

     Paper.bottom⚓➭

    +

     Paper.bottom⚓➭

    Points to the bottom element on the paper

    -

     Paper.circle(x, y, r)⚓➭

    +

     Paper.circle(x, y, r)⚓➭

    Draws a circle.

    Parameters @@ -606,10 +737,10 @@ console.log(el.transform()); 

    var c = paper.circle(50, 50, 40);
    -

     Paper.clear()⚓➭

    +

     Paper.clear()⚓➭

    Clears the paper, i.e. removes all the elements.

    -

     Paper.customAttributes⚓➭

    +

     Paper.customAttributes⚓➭

    object

    If you have a set of attributes that you would like to represent as a function of some number you can do it easily with custom attributes:

    @@ -634,7 +765,7 @@ paper.customAttributes.hsb = function (h, s, b) { c.attr({hsb: ".5 .8 1"}); c.animate({hsb: "1 0 .5"}, 1e3); -

     Paper.ellipse(x, y, rx, ry)⚓➭

    +

     Paper.ellipse(x, y, rx, ry)⚓➭

    Draws an ellipse.

    Parameters @@ -657,7 +788,7 @@ c.animate({hsb: "1 0 

    var c = paper.ellipse(50, 50, 40, 20);
    -

     Paper.forEach(callback, thisArg)⚓➭

    +

     Paper.forEach(callback, thisArg)⚓➭

    Executes given function for each element on the paper

    If callback function returns false it will stop loop running. @@ -672,7 +803,7 @@ c.animate({hsb: "1 0 context object for the callback

    Returns: object Paper object

    -

     Paper.getById(id)⚓➭

    +

     Paper.getById(id)⚓➭

    Returns you element by its internal ID.

    Parameters @@ -682,7 +813,7 @@ c.animate({hsb: "1 0 id

    Returns: object Raphaël element object

    -

     Paper.getElementByPoint(x, y)⚓➭

    +

     Paper.getElementByPoint(x, y)⚓➭

    Returns you topmost element under given point.

    Returns: object Raphaël element object

    @@ -699,7 +830,7 @@ c.animate({hsb: "1 0 
    paper.getElementByPoint(mouseX, mouseY).attr({stroke: "#f00"});
    -

     Paper.image(src, x, y, width, height)⚓➭

    +

     Paper.image(src, x, y, width, height)⚓➭

    Embeds an image into the surface.

    Parameters @@ -725,7 +856,7 @@ c.animate({hsb: "1 0 

    var c = paper.image("apple.png", 10, 10, 80, 80);
    -

     Paper.path(pathString)⚓➭

    +

     Paper.path(pathString)⚓➭

    Creates a path element by given path data string.

    Parameters @@ -734,7 +865,7 @@ c.animate({hsb: "1 0 string

    path data in SVG path string format.
    -

    Returns: object Raphaël element object with type “ellipse”

    +

    Returns: object Raphaël element object with type “path”

    Details of a path's data attribute's format are described in the SVG specification.

    Usage

    @@ -742,10 +873,10 @@ Details of a path's data attribute's format are described in the // draw a diagonal line: // move to 10,10, line to 90,90 -

     Paper.raphael⚓➭

    +

     Paper.raphael⚓➭

    Points to the Raphael object/function

    -

     Paper.rect(x, y, width, height, [r])⚓➭

    +

     Paper.rect(x, y, width, height, [r])⚓➭

    Draws a rectangle.

    @@ -776,20 +907,20 @@ Details of a path's data attribute's format are described in the // rectangle with rounded corners var c = paper.rect(40, 40, 50, 50, 10); -

     Paper.remove()⚓➭

    +

     Paper.remove()⚓➭

    Removes the paper from the DOM.

    -

     Paper.renderfix()⚓➭

    +

     Paper.renderfix()⚓➭

    Fixes the issue of Firefox and IE9 regarding subpixel rendering. If paper is dependant on other elements after reflow it could shift half pixel which cause for lines to lost their crispness. This method fixes the issue.

    -

     Paper.safari()⚓➭

    +

     Paper.safari()⚓➭

    There is an inconvenient rendering bug in Safari (WebKit): sometimes the rendering should be forced. This method should help with dealing with this bug.

    -

     Paper.set()⚓➭

    +

     Paper.set()⚓➭

    Creates array-like object to keep and operate several elements at once. Warning: it doesn’t create any elements for itself in the page, it just groups existing elements. Sets act as pseudo elements — all methods available to an element can be used on a set. @@ -802,9 +933,13 @@ st.push( paper.circle(10, 10, 5), paper.circle(30, 10, 5) ); -st.attr({fill: "red"}); +st.attr({fill: "red"}); // changes the fill of both circles -

     Paper.setSize(width, height)⚓➭

    +

     Paper.setFinish()⚓➭

    +

    See Paper.setStart. This method finishes catching and returns resulting set. +

    +

    Returns: object set

    +

     Paper.setSize(width, height)⚓➭

    If you need to change dimensions of the canvas call this method

    Parameters @@ -825,7 +960,19 @@ st.push( ); st.attr({fill: "red"}); -

     Paper.setViewBox(x, y, w, h, fit)⚓➭

    +

     Paper.setStart()⚓➭

    +

    Creates Paper.set. All elements that will be created after calling this method and before calling +Paper.setFinish will be added to the set. +

    +

    Usage +

    +
    paper.setStart();
+paper.circle(10, 10, 5),
+paper.circle(30, 10, 5)
+var st = paper.setFinish();
+st.attr({fill: "red"}); // changes the fill of both circles
+
    +

     Paper.setViewBox(x, y, w, h, fit)⚓➭

    Sets the view box of the paper. Practically it gives you ability to zoom and pan whole paper surface by specifying new boundaries.

    @@ -847,7 +994,7 @@ specifying new boundaries.
    boolean
    true if you want graphics to fit into new boundary box
    -

     Paper.text(x, y, text)⚓➭

    +

     Paper.text(x, y, text)⚓➭

    Draws a text string. If you need line breaks, put “\n” in the string.

    Parameters @@ -867,10 +1014,10 @@ specifying new boundaries. 

    var t = paper.text(50, 50, "Raphaël\nkicks\nbutt!");
    -

     Paper.top⚓➭

    +

     Paper.top⚓➭

    Points to the topmost element on the paper

    -

     Raphael(…)⚓➭

    +

     Raphael(…)⚓➭

    Creates a canvas object on which to draw. You must do this first, as all future calls to drawing methods from this instance will be bound to this canvas. @@ -886,6 +1033,10 @@ from this instance will be bound to this canvas.

    height
    number
     
    +
    callback
    +
    optional
    +
    function
    +
    callback function which is going to be executed in the context of newly created paper

    or

    @@ -901,12 +1052,20 @@ from this instance will be bound to this canvas.
    height
    number
     
    +
    callback
    +
    optional
    +
    function
    +
    callback function which is going to be executed in the context of newly created paper

    or

    all
    array
    (first 3 or 4 elements in the array are equal to [containerID, width, height] or [x, y, width, height]. The rest are element descriptions in format {type: type, <attributes>})
    +
    callback
    +
    optional
    +
    function
    +
    callback function which is going to be executed in the context of newly created paper

    or

    @@ -941,7 +1100,7 @@ from this instance will be bound to this canvas. text: "Dump" }]); -

     Raphael.angle(x1, y1, x2, y2, [x3], [y3])⚓➭

    +

     Raphael.angle(x1, y1, x2, y2, [x3], [y3])⚓➭

    Returns angle between two or three points

    Parameters @@ -968,7 +1127,7 @@ from this instance will be bound to this canvas.

    y coord of third point

    Returns: number angle in degrees.

    -

     Raphael.animation(params, ms, [easing], [callback])⚓➭

    +

     Raphael.animation(params, ms, [easing], [callback])⚓➭

    Creates an animation object that can be passed to the Element.animate or Element.animateWith methods. See also Animation.delay and Animation.repeat methods.

    @@ -990,7 +1149,27 @@ See also Animation.delay and callback function. Will be called at the end of animation.

    Returns: object Animation

    -

     Raphael.deg(deg)⚓➭

    +

     Raphael.color(clr)⚓➭

    +

    Parses the color string and returns object with all values for the given color. +

    +

    Parameters +

    +
    clr
    +
    string
    +
    color string in one of the supported formats (see Raphael.getRGB)
    +
    +

    Returns: object Combined RGB & HSB object in format:

    +
    1. {
      1. rnumberred, +
      2. gnumbergreen, +
      3. bnumberblue, +
      4. hexstringcolor in HTML/CSS format: #••••••, +
      5. errorbooleantrue if string can’t be parsed, +
      6. hnumberhue, +
      7. snumbersaturation, +
      8. vnumbervalue (brightness), +
      9. lnumberlightness +
    2. }
    +

     Raphael.deg(deg)⚓➭

    Transform angle to degrees

    Parameters @@ -1000,7 +1179,7 @@ See also Animation.delay and angle in radians

    Returns: number angle in degrees.

    -

     Raphael.easing_formulas⚓➭

    +

     Raphael.easing_formulas⚓➭

    Object that contains easing formulas for animation. You could extend it with your own. By default it has following list of easing:

    See also Easing demo.

    -

     Raphael.el⚓➭

    +

     Raphael.el⚓➭

    object

    You can add your own method to elements. This is usefull when you want to hack default functionality or want to wrap some common transformation or attributes in one method. In difference to canvas methods, you can redefine element method at any time. Expending element methods wouldn’t affect set. @@ -1027,7 +1206,7 @@ you can redefine element method at any time. Expending element methods wouldn’ // then use it paper.circle(100, 100, 20).red(); -

     Raphael.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t)⚓➭

    +

     Raphael.findDotsAtSegment(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t)⚓➭

    Utility method Find dot coordinates on the given cubic bezier curve at the given t.

    @@ -1074,7 +1253,7 @@ Find dot coordinates on the given cubic bezier curve at the given t.
  • y:numbery coordinate of the end of the curve
  • }
  • alpha:numberangle of the curve derivative at the point
  • }
    • -

     Raphael.fn⚓➭

    +

     Raphael.fn⚓➭

    object

    You can add your own method to the canvas. For example if you want to draw a pie chart, you can create your own pie chart function and ship it as a Raphaël plugin. To do this you need to extend the Raphael.fn object. Please note that you can create your own namespaces @@ -1098,7 +1277,55 @@ paper.arrow(10, 10,  Raphael.getColor([value])⚓➭ +

     Raphael.format(token, …)⚓➭

    +

    Simple format function. Replaces construction of type “{<number>}” to the corresponding argument. +

    +

    Parameters +

    +
    token
    +
    string
    +
    string to format
    +
    …
    +
    string
    +
    rest of arguments will be treated as parameters for replacement
    +
    +

    Returns: string formated string

    +

    Usage +

    +
    var x = 10,
+    y = 20,
+    width = 40,
+    height = 50;
+// this will draw a rectangular shape equivalent to "M10,20h40v50h-40z"
+paper.path(Raphael.format("M{1},{2}h{3}v{4}h{5}z", x, y, width, height, -width));
+
    +

     Raphael.fullfill(token, json)⚓➭

    +

    A little bit more advanced format function than Raphael.format. Replaces construction of type “{<name>}” to the corresponding argument. +

    +

    Parameters +

    +
    token
    +
    string
    +
    string to format
    +
    json
    +
    object
    +
    object which properties will be used as a replacement
    +
    +

    Returns: string formated string

    +

    Usage +

    +
    // this will draw a rectangular shape equivalent to "M10,20h40v50h-40z"
+paper.path(Raphael.format("M{x},{y}h{dim.width}v{dim.height}h{dim['negative width']}z", {
+    x: 10,
+    y: 20,
+    dim: {
+        width: 40,
+        height: 50,
+        "negative width": -40
+    }
+}));
+
    +

     Raphael.getColor([value])⚓➭

    On each call returns next colour in the spectrum. To reset it back to red call Raphael.getColor.reset

    Parameters @@ -1109,10 +1336,10 @@ paper.mystuff.star();

    brightness, default is 0.75

    Returns: string hex representation of the colour.

    -

     Raphael.getColor.reset()⚓➭

    +

     Raphael.getColor.reset()⚓➭

    Resets spectrum position for Raphael.getColor back to red.

    -

     Raphael.getPointAtLength(path, length)⚓➭

    +

     Raphael.getPointAtLength(path, length)⚓➭

    Return coordinates of the point located at the given length on the given path.

    Parameters @@ -1129,7 +1356,7 @@ paper.mystuff.star();

  • y:numbery coordinate
  • alpha:numberangle of derivative
  • }
    • -

     Raphael.getRGB(colour)⚓➭

    +

     Raphael.getRGB(colour)⚓➭

    Parses colour string as RGB object

    Parameters @@ -1156,7 +1383,7 @@ paper.mystuff.star();

  • hexstringcolor in HTML/CSS format: #••••••,
  • errorbooleantrue if string can’t be parsed
  • }
    • -

     Raphael.getSubpath(path, from, to)⚓➭

    +

     Raphael.getSubpath(path, from, to)⚓➭

    Return subpath of a given path from given length to given length.

    Parameters @@ -1172,7 +1399,7 @@ paper.mystuff.star();

    position of the end of the segment

    Returns: string pathstring for the segment

    -

     Raphael.getTotalLength(path)⚓➭

    +

     Raphael.getTotalLength(path)⚓➭

    Returns length of the given path in pixels.

    Parameters @@ -1182,7 +1409,7 @@ paper.mystuff.star();

    SVG path string.

    Returns: number length.

    -

     Raphael.hsb(h, s, b)⚓➭

    +

     Raphael.hsb(h, s, b)⚓➭

    Converts HSB values to hex representation of the colour.

    Parameters @@ -1198,7 +1425,7 @@ paper.mystuff.star();

    value or brightness

    Returns: string hex representation of the colour.

    -

     Raphael.hsb2rgb(h, s, v)⚓➭

    +

     Raphael.hsb2rgb(h, s, v)⚓➭

    Converts HSB values to RGB object.

    Parameters @@ -1219,7 +1446,7 @@ paper.mystuff.star();

  • bnumberblue,
  • hexstringcolor in HTML/CSS format: #••••••
  • }
    • -

     Raphael.hsl(h, s, l)⚓➭

    +

     Raphael.hsl(h, s, l)⚓➭

    Converts HSL values to hex representation of the colour.

    Parameters @@ -1235,7 +1462,7 @@ paper.mystuff.star();

    luminosity

    Returns: string hex representation of the colour.

    -

     Raphael.hsl2rgb(h, s, l)⚓➭

    +

     Raphael.hsl2rgb(h, s, l)⚓➭

    Converts HSL values to RGB object.

    Parameters @@ -1256,7 +1483,7 @@ paper.mystuff.star();

  • bnumberblue,
  • hexstringcolor in HTML/CSS format: #••••••
  • }
    • -

     Raphael.is(o, type)⚓➭

    +

     Raphael.is(o, type)⚓➭

    Handfull replacement for typeof operator.

    Parameters @@ -1269,7 +1496,45 @@ paper.mystuff.star();

    name of the type, i.e. “string”, “function”, “number”, etc.

    Returns: boolean is given value is of given type

    -

     Raphael.parsePathString(pathString)⚓➭

    +

     Raphael.matrix(a, b, c, d, e, f)⚓➭

    +

    Utility method +Returns matrix based on given parameters. +

    +

    Parameters +

    +
    a
    +
    number
    +
     
    +
    b
    +
    number
    +
     
    +
    c
    +
    number
    +
     
    +
    d
    +
    number
    +
     
    +
    e
    +
    number
    +
     
    +
    f
    +
    number
    +
     
    +
    +

    Returns: object Matrix

    +

     Raphael.ninja()⚓➭

    +

    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. +Beware, that in this case plugins could stop working, because they are depending on global variable existance. +

    +

    Returns: object Raphael object

    +

    Usage +

    +
    (function (local_raphael) {
+    var paper = local_raphael(10, 10, 320, 200);
+    …
+})(Raphael.ninja());
+
    +

     Raphael.parsePathString(pathString)⚓➭

    Utility method Parses given path string into an array of arrays of path segments.

    @@ -1280,7 +1545,7 @@ Parses given path string into an array of arrays of path segments.
    path string or array of segments (in the last case it will be returned straight away)

    Returns: array array of segments.

    -

     Raphael.parseTransformString(TString)⚓➭

    +

     Raphael.parseTransformString(TString)⚓➭

    Utility method Parses given path string into an array of transformations.

    @@ -1291,7 +1556,7 @@ Parses given path string into an array of transformations.
    transform string or array of transformations (in the last case it will be returned straight away)

    Returns: array array of transformations.

    -

     Raphael.path2curve(pathString)⚓➭

    +

     Raphael.path2curve(pathString)⚓➭

    Utility method Converts path to a new path where all segments are cubic bezier curves.

    @@ -1302,7 +1567,7 @@ Converts path to a new path where all segments are cubic bezier curves.
    path string or array of segments

    Returns: array array of segments.

    -

     Raphael.pathToRelative(pathString)⚓➭

    +

     Raphael.pathToRelative(pathString)⚓➭

    Utility method Converts path to relative form

    @@ -1313,7 +1578,7 @@ Converts path to relative form
    path string or array of segments

    Returns: array array of segments.

    -

     Raphael.rad(deg)⚓➭

    +

     Raphael.rad(deg)⚓➭

    Transform angle to radians

    Parameters @@ -1323,7 +1588,7 @@ Converts path to relative form

    angle in degrees

    Returns: number angle in radians.

    -

     Raphael.rgb(r, g, b)⚓➭

    +

     Raphael.rgb(r, g, b)⚓➭

    Converts RGB values to hex representation of the colour.

    Parameters @@ -1339,7 +1604,7 @@ Converts path to relative form

    blue

    Returns: string hex representation of the colour.

    -

     Raphael.rgb2hsb(r, g, b)⚓➭

    +

     Raphael.rgb2hsb(r, g, b)⚓➭

    Converts RGB values to HSB object.

    Parameters @@ -1359,7 +1624,7 @@ Converts path to relative form

  • snumbersaturation
  • bnumberbrightness
  • }
    • -

     Raphael.rgb2hsl(r, g, b)⚓➭

    +

     Raphael.rgb2hsl(r, g, b)⚓➭

    Converts RGB values to HSL object.

    Parameters @@ -1379,7 +1644,7 @@ Converts path to relative form

  • snumbersaturation
  • lnumberluminosity
  • }
    • -

     Raphael.setWindow(newwin)⚓➭

    +

     Raphael.setWindow(newwin)⚓➭

    Used when you need to draw in <iframe>. Switched window to the iframe one.

    Parameters @@ -1388,7 +1653,7 @@ Converts path to relative form

    window
    new window object
    -

     Raphael.snapTo(values, value, [tolerance])⚓➭

    +

     Raphael.snapTo(values, value, [tolerance])⚓➭

    Snaps given value to given grid.

    Parameters @@ -1405,17 +1670,35 @@ Converts path to relative form

    tolerance for snapping. Default is 10.

    Returns: number adjusted value.

    -

     Raphael.svg⚓➭

    +

     Raphael.st⚓➭

    +
    object

    You can add your own method to elements and sets. It is wise to add a set method for each element method +you added, so you will be able to call the same method on sets too. +See also Raphael.el. +

    +

    Usage +

    +
    Raphael.el.red = function () {
+    this.attr({fill: "#f00"});
+};
+Raphael.st.red = function () {
+    this.forEach(function () {
+        this.red();
+    });
+};
+// then use it
+paper.set(paper.circle(100, 100, 20), paper.circle(110, 100, 20)).red();
+
    +

     Raphael.svg⚓➭

    boolean

    true if browser supports SVG.

    -

     Raphael.type⚓➭

    +

     Raphael.type⚓➭

    string

    Can be “SVG”, “VML” or empty, depending on browser support.

    -

     Raphael.vml⚓➭

    +

     Raphael.vml⚓➭

    boolean

    true if browser supports VML.

     Set⚓

    -

     Set.forEach(callback, thisArg)⚓➭

    +

     Set.forEach(callback, thisArg)⚓➭

    Executes given function for each element in the set.

    If function returns false it will stop loop running. @@ -1430,12 +1713,98 @@ Converts path to relative form

    context object for the callback

    Returns: object Set object

    -

     Set.pop()⚓➭

    +

     Set.pop()⚓➭

    Removes last element and returns it.

    Returns: object element

    -

     Set.push()⚓➭

    +

     Set.push()⚓➭

    Adds each argument to the current set.

    Returns: object original element

    +

     eve(name, scope, varargs)⚓➭

    +

    Fires event with given name, given scope and other parameters. +

    +

    Arguments +

    +
    name
    +
    string
    +
    name of the event, dot (.) or slash (/) separated
    +
    scope
    +
    object
    +
    context for the event handlers
    +
    varargs
    +
    ...
    +
    the rest of arguments will be sent to event handlers
    +
    +

    Returns: boolean false if any of callbacks return false, true otherwise

    +

     eve.listeners(name)⚓➭

    +

    Internal method which gives you array of all event handlers that will be triggered by the given name. +

    +

    Arguments +

    +
    name
    +
    string
    +
    name of the event, dot (.) or slash (/) separated
    +
    +

    Returns: array array of event handlers

    +

     eve.nt([subname])⚓➭

    +

    Could be used inside event handler to figure out actual name of the event. +

    +

    Arguments +

    +
    subname
    +
    optional
    +
    string
    +
    subname of the event
    +
    +

    Returns: string name of the event, if subname is not specified

    +

    or +

    +

    Returns: boolean true, if current event’s name contains subname

    +

     eve.on(name, f)⚓➭

    +

    Binds given event handler with a given name. You can use wildcards “*” for the names: +

    +
    eve.on("*.under.*", f);
+eve("mouse.under.floor"); // triggers f
+
    +

    Use eve to trigger the listener. +

    +

    Arguments +

    +
    name
    +
    string
    +
    name of the event, dot (.) or slash (/) separated, with optional wildcards
    +
    f
    +
    function
    +
    event handler function
    +
    +

    Returns: function returned function accept one number parameter that represents z-index of the handler. It is optional feature and only used when you need to ensure that some subset of handlers will be invoked in a given order, despite of the order of assignment.

    +

    Example: +

    +
    eve.on("mouse", eat)(2);
+eve.on("mouse", scream);
+eve.on("mouse", catch)(1);
+
    +

    This will ensure that catch function will be called before eat. +If you want to put you hadler before not indexed handlers specify negative value. +Note: I assume most of the time you don’t need to worry about z-index, but it’s nice to have this feature “just in case”. +

    +

     eve.stop()⚓➭

    +

    Is used inside event handler to stop event +

    +

     eve.unbind(name, f)⚓➭

    +

    Removes given function from the list of event listeners assigned to given name. +

    +

    Arguments +

    +
    name
    +
    string
    +
    name of the event, dot (.) or slash (/) separated, with optional wildcards
    +
    f
    +
    function
    +
    event handler function
    +
    +

     eve.version⚓➭

    +
    string

    Current version of the library. +

    \ No newline at end of file -- 2.39.2