diff --git a/jcanvas.js b/jcanvas.js index 8953d55..85ebcdc 100755 --- a/jcanvas.js +++ b/jcanvas.js @@ -927,9 +927,26 @@ $.fn.delayLayer = function(name, duration) { return $elems; }; +// Delay animation all layers in a layer group +$.fn.delayLayerGroup = function(name, duration) { + var $elems = this, $elem, e, + group, g; + duration = duration || 0; + + for (e=0; e<$elems.length; e+=1) { + $elem = $($elems[e]); + group = $elem.getLayerGroup(name); + // Delay all layers in the group + for (g=0; gb&&(c.now[b]=N(c.now[b]));1!==c.start[3]||1!==c.end[3]?c.now="rgba("+c.now.join(",")+")":(c.now.slice(0,3),c.now="rgb("+c.now.join(",")+")"); -c.elem.style?c.elem.style[c.prop]=c.now:c.elem[c.prop]=c.now}function J(c){A.events[c]=function(a,b){var e="mouseover"===c||"mouseout"===c?"mousemove":c,l=b.event;b[e]||(a.bind(e+".jCanvas",function(b){l.x=b.offsetX;l.y=b.offsetY;l.type=e;a.drawLayers(o);b.preventDefault()}),b[e]=o)}}function G(c,a,b){var c=P(c),e=c.event,a=a.isPointInPath(e.x,e.y);b.mouseX=e.x;b.mouseY=e.y;!a&&(b._hovered&&!b._fired)&&(b._mousedout=o);a&&c.intersects.push(b)}function ha(c,a,b){var e,l=/\b(\d*\.?\d*)\w\w\b/gi;if(R=== -b.text&&S===b.font)b.width=Y,b.height=Z;else{b.width=a.measureText(b.text).width;a=c.style.fontSize;if(e=b.font.match(l))c.style.fontSize=b.font.match(l)[0];b.height=X(d.css(c,"fontSize"));c.style.fontSize=a}}var M,$,w=d.extend,N=O.round,z=O.PI,ia=O.sin,T=O.cos,ka=d.event.fix;Z=Y=S=R=L=K=void 0;var I;d.fn.jCanvas=A;A.version="6.0b";A.events={};M={angle:0,align:"center",autosave:o,baseline:"middle",bringToFront:C,ccw:C,closed:C,compositing:"source-over",cornerRadius:0,cropFromCenter:o,draggable:!1, +c.translate(a.x,a.y);c.scale(a.scaleX,a.scaleY);c.translate(-a.x,-a.y)}function ca(c,a){a._toRad=a.inDegrees?z/180:1;a.rotate=a.rotate||a.angle;c.translate(a.x,a.y);c.rotate(a.rotate*a._toRad);c.translate(-a.x,-a.y)}function E(c,a,b,e,i){b._toRad=b.inDegrees?z/180:1;a.save();i=i||e;!c&&!b.fromCenter&&(b.x+=e/2,b.y+=i/2);(b.rotate||b.angle)&&ca(a,b);(1!==b.scale||1!==b.scaleX||1!==b.scaleY)&&ba(a,b);(b.translate||b.translateX||b.translateY)&&aa(a,b)}function P(c){var a;K===c?a=L:((a=d.data(c,"jCanvas"))|| +(a=d.data(c,"jCanvas",{layers:[],intersects:[],drag:{},event:{}})),K=c,L=a);return a}function da(c,a,b){b&&b.visible&&(b.method===d.fn.draw?b.fn.call(c[0],a):b.method&&b.method.call(c,b))}function D(c,a,b){var e,i,g,B="function"===typeof a,n,a=a||{};if(a.layer&&!a._layer){e=d(c);i=e.getLayers();B&&(a={method:d.fn.draw,fn:a});a=w(new x,a);if(!B){a.method=d.fn[a.method]||b;n=P(c);for(g in A.events)A.events.hasOwnProperty(g)&&a[g]&&(A.events[g](e,n),a._event=o);if(a.draggable){a._event=o;c=["mousedown", +"mousemove","mouseup"];for(b=0;bb&&(c.now[b]=N(c.now[b]));1!==c.start[3]||1!==c.end[3]?c.now="rgba("+c.now.join(",")+")":(c.now.slice(0,3),c.now="rgb("+c.now.join(",")+")"); +c.elem.style?c.elem.style[c.prop]=c.now:c.elem[c.prop]=c.now}function J(c){A.events[c]=function(a,b){var e="mouseover"===c||"mouseout"===c?"mousemove":c,i=b.event;b[e]||(a.bind(e+".jCanvas",function(b){i.x=b.offsetX;i.y=b.offsetY;i.type=e;a.drawLayers(o);b.preventDefault()}),b[e]=o)}}function G(c,a,b){var c=P(c),e=c.event,a=a.isPointInPath(e.x,e.y);b.mouseX=e.x;b.mouseY=e.y;!a&&(b._hovered&&!b._fired)&&(b._mousedout=o);a&&c.intersects.push(b)}function ha(c,a,b){var e,i=/\b(\d*\.?\d*)\w\w\b/gi;if(R=== +b.text&&S===b.font)b.width=T,b.height=U;else{b.width=a.measureText(b.text).width;a=c.style.fontSize;if(e=b.font.match(i))c.style.fontSize=b.font.match(i)[0];b.height=Z(d.css(c,"fontSize"));c.style.fontSize=a}}var M,$,w=d.extend,N=O.round,z=O.PI,ia=O.sin,V=O.cos,ka=d.event.fix;U=T=S=R=L=K=void 0;var I;d.fn.jCanvas=A;A.version="6.0b";A.events={};M={angle:0,align:"center",autosave:o,baseline:"middle",bringToFront:C,ccw:C,closed:C,compositing:"source-over",cornerRadius:0,cropFromCenter:o,draggable:!1, each:f,end:360,fillStyle:"transparent",font:"12pt sans-serif",fromCenter:o,height:f,inDegrees:o,load:f,mask:C,method:f,miterLimit:10,opacity:1,projection:0,r1:f,r2:f,radius:0,repeat:"repeat",rotate:0,rounded:C,scale:1,scaleX:1,scaleY:1,shadowBlur:0,shadowColor:"transparent",shadowX:0,shadowY:0,sHeight:f,sides:3,source:"",start:0,strokeCap:"butt",strokeJoin:"miter",strokeStyle:"transparent",strokeWidth:1,sWidth:f,sx:f,sy:f,text:"",translate:0,translateX:0,translateY:0,visible:o,width:f,x:0,y:0};A(); -A.extend=function(c){M=w(M,c.props);A();c.name&&(d.fn[c.name]=function(a){var b,e,l=w(new x,a);for(b=0;br-n-2*i&&(i=(r-n)/2),0>t-y-2*i&&(i=(t-y)/2),g.moveTo(n+i,y),g.lineTo(r-i,y),g.arc(r-i,y+i,i,3*z/2,2*z,C),g.lineTo(r,t-i),g.arc(r-i,t-i,i,0,z/2,C),g.lineTo(n+i,t),g.arc(n+i,t-i,i,z/2,z,C),g.lineTo(n,y+i),g.arc(n+ -i,y+i,i,z,3*z/2,C)):g.rect(n,y,d.width,d.height),d._event&&G(this[l],g,e),H(g,d);return this};d.fn.drawArc=function e(d){var g,f,n=w(new x,d);!n.inDegrees&&360===n.end&&(n.end=2*z);for(g=0;gu.width&&(h.sx=u.width-h.sWidth/2),0>h.sx-h.sWidth/ -2&&(h.sx=h.sWidth/2),0>h.sy-h.sHeight/2&&(h.sy=h.sHeight/2),h.sy+h.sHeight/2>u.height&&(h.sy=u.height-h.sHeight/2),h.width!==f&&h.height===f)?d.height=h.height=h.width/s:h.width===f&&h.height!==f?d.width=h.width=h.height*s:h.width===f&&h.height===f&&(d.width=h.width=u.width,d.height=h.height=u.height));E(t,j,h,h.width,h.height);j.drawImage(u,h.sx-h.sWidth/2,h.sy-h.sHeight/2,h.sWidth,h.sHeight,h.x-h.width/2,h.y-h.height/2,h.width,h.height);h._event?(j.beginPath(),j.rect(h.x-h.width/2,h.y-h.height/ -2,h.width,h.height),j.restore(),G(m[t],j,d),j.closePath()):j.restore();h.load&&h.load.call(k,d)}}var m=this,p,q,j,h=w(new x,d),u,o,s;o=h.source.getContext;h.source.src||o?(u=h.source,h.width=u.width,h.height=u.height):h.source&&(u=new W,u.src=h.source);for(q=0;qq&&(k[h]=k[j])}else k[j]===f&&(o+=1,k[j]=p+o*((q-p)/u));i.addColorStop(k[j],d["c"+(j+1)])}}else i=f;return i};d.fn.setPixels=function i(d){var f,p,q,j=w(new x,d),h={},u,o,s,z;for(p=0;pr-n-2*j&&(j=(r-n)/2),0>t-y-2*j&&(j=(t-y)/2),g.moveTo(n+j,y),g.lineTo(r-j,y),g.arc(r-j,y+j,j,3*z/2,2*z,C),g.lineTo(r,t-j),g.arc(r-j,t-j,j,0,z/2,C),g.lineTo(n+j,t),g.arc(n+j,t-j,j,z/2,z,C),g.lineTo(n,y+j),g.arc(n+j,y+j,j,z,3*z/2,C)):g.rect(n,y,d.width,d.height),d._event&&G(this[i],g,e),H(g,d);return this};d.fn.drawArc=function e(d){var g,f,n=w(new x,d);!n.inDegrees&&360===n.end&&(n.end=2*z);for(g=0;gu.width&&(h.sx=u.width-h.sWidth/2),0>h.sx-h.sWidth/2&&(h.sx=h.sWidth/2),0>h.sy-h.sHeight/2&&(h.sy=h.sHeight/2),h.sy+h.sHeight/2>u.height&&(h.sy=u.height-h.sHeight/2),h.width!==f&&h.height===f)?d.height=h.height=h.width/s:h.width===f&&h.height!==f?d.width=h.width=h.height*s:h.width===f&&h.height===f&&(d.width= +h.width=u.width,d.height=h.height=u.height));E(t,k,h,h.width,h.height);k.drawImage(u,h.sx-h.sWidth/2,h.sy-h.sHeight/2,h.sWidth,h.sHeight,h.x-h.width/2,h.y-h.height/2,h.width,h.height);h._event?(k.beginPath(),k.rect(h.x-h.width/2,h.y-h.height/2,h.width,h.height),k.restore(),G(m[t],k,d),k.closePath()):k.restore();h.load&&h.load.call(l,d)}}var m=this,p,q,k,h=w(new x,d),u,o,s;o=h.source.getContext;h.source.src||o?(u=h.source,h.width=u.width,h.height=u.height):h.source&&(u=new Y,u.src=h.source);for(q= +0;qq&&(l[h]=l[k])}else l[k]===f&&(o+=1,l[k]=p+o*((q-p)/u));j.addColorStop(l[k],d["c"+(k+1)])}}else j=f;return j};d.fn.setPixels=function j(d){var f,p,q,k=w(new x,d),h={},u,o,s,z;for(p=0;p