diff --git a/jcanvas.js b/jcanvas.js index 1ca1034..5b5812b 100755 --- a/jcanvas.js +++ b/jcanvas.js @@ -252,7 +252,7 @@ function makePathDraggable(params) { jCanvas.extend = function(plugin) { // Merge properties with defaults - defaults = merge(defaults, plugin.props); + jCanvas.defaults = defaults = merge(defaults, plugin.props); jCanvas(); // Create plugin @@ -265,7 +265,7 @@ jCanvas.extend = function(plugin) { elem = $elems[e]; ctx = getContext(elem); if (ctx) { - addLayer($elems[e], args, self); + addLayer(elem, args, self); setGlobalProps(ctx, params); plugin.fn.call(elem, ctx, params); } @@ -907,7 +907,7 @@ $.fn.animateLayer = function() { // Bypass jQuery CSS Hooks for CSS properties (width, opacity, etc.) hideProps(layer); hideProps(args[1], TRUE); - + // Fix for jQuery's vendor prefixing support, which affects how width/height/opacity are animated layer.style = cssPropsObj; @@ -1581,7 +1581,9 @@ function wrapText(ctx, params) { } else { // Keep adding words to line until line is too long while (words.length > 0) { - if (ctx.measureText(line + words[0]).width < maxWidth) { + // Keep adding words to the current line until it is too long + // Also ensure that words longer than maxWidth will not crash the script + if (ctx.measureText(words[0]).width > maxWidth || ctx.measureText(line + words[0]).width < maxWidth) { line += words.shift() + " "; } else { // If line is too long, break and start a new line @@ -1694,7 +1696,7 @@ $.fn.measureText = function(args) { ctx = getContext($elems[0]); if (ctx && params.text !== UNDEFINED) { // Calculate width and height of text - measureText($elems[0], e, ctx, params, params.text.split('\n')); + measureText($elems[0], 0, ctx, params, params.text.split('\n')); } return params; }; diff --git a/jcanvas.min.js b/jcanvas.min.js index e661aac..c9167a0 100644 --- a/jcanvas.min.js +++ b/jcanvas.min.js @@ -3,40 +3,40 @@ Copyright 2012, Caleb Evans Licensed under the MIT license */ -(function(c,S,W,Q,X,w,F,j,A){function C(){}function G(b){b?B(Y,b):G.prefs=Y=C.prototype=B({},O);return this}function J(b,a){b.fillStyle=a.fillStyle;b.strokeStyle=a.strokeStyle;b.lineWidth=a.strokeWidth;a.rounded?(b.lineCap="round",b.lineJoin="round"):(b.lineCap=a.strokeCap,b.lineJoin=a.strokeJoin,b.miterLimit=a.miterLimit);b.shadowOffsetX=a.shadowX;b.shadowOffsetY=a.shadowY;b.shadowBlur=a.shadowBlur;b.shadowColor=a.shadowColor;b.globalAlpha=a.opacity;b.globalCompositeOperation=a.compositing}function z(b){return b&& -b.getContext?b.getContext("2d"):j}function M(b,a){a.closed&&b.closePath();b.fill();"transparent"!==a.fillStyle&&(b.shadowColor="transparent");b.stroke();a.closed||b.closePath();a._toRad&&b.restore();a.mask&&(a.autosave&&b.save(),b.clip())}function Z(b,a){if(!a.translateX&&!a.translateY&&(a.x||a.y))a.translateX=a.x,a.translateY=a.y;a.translate&&(a.translateX=a.translateY=a.translate);b.translate(a.translateX,a.translateY)}function $(b,a){1!==a.scale&&(a.scaleX=a.scaleY=a.scale);b.translate(a.x,a.y); -b.scale(a.scaleX,a.scaleY);b.translate(-a.x,-a.y)}function aa(b,a){a._toRad=a.inDegrees?D/180:1;a.rotate=a.rotate||a.angle;b.translate(a.x,a.y);b.rotate(a.rotate*a._toRad);b.translate(-a.x,-a.y)}function I(b,a,d,g,i){d._toRad=d.inDegrees?D/180:1;a.save();i=i||g;!b&&!d.fromCenter&&(d.x+=g/2,d.y+=i/2);(d.rotate||d.angle)&&aa(a,d);(1!==d.scale||1!==d.scaleX||1!==d.scaleY)&&$(a,d);(d.translate||d.translateX||d.translateY)&&Z(a,d)}function T(b){b.draggable&&(b.translateX+=b.x,b.translateY+=b.y)}function R(b){var a; -E.elem===b?a=E.data:((a=c.data(b,"jCanvas"))||(a=c.data(b,"jCanvas",{layers:[],intersects:[],drag:{},event:{}})),E.elem=b,E.data=a);return a}function ba(b,a,d){d&&d.visible&&(d.method===c.fn.draw?d.fn.call(b[0],a):d.method&&d.method.call(b,d))}function H(b,a,d){var g,i,f,t="function"===typeof a,o,a=a||{};if(a.layer&&!a._layer){g=c(b);i=g.getLayers();t&&(a={method:c.fn.draw,fn:a});a=B(new C,a);if(!t){a.method=c.fn[a.method]||d;o=R(b);for(f in G.events)G.events.hasOwnProperty(f)&&a[f]&&(G.events[f](g, -o),a._event=w);if(a.draggable||a.cursor){a._event=w;b=["mousedown","mousemove","mouseup"];for(d=0;dd&&(b.now[d]=P(b.now[d]));1!==b.start[3]||1!==b.end[3]?b.now= -"rgba("+b.now.join(",")+")":(b.now.slice(0,3),b.now="rgb("+b.now.join(",")+")");b.elem.nodeName?b.elem.style[b.prop]=b.now:b.elem[b.prop]=b.now}function N(b){G.events[b]=function(a,d){var g="mouseover"===b||"mouseout"===b?"mousemove":b,i=d.event;d[g]||(a.bind(g+".jCanvas",function(b){i.x=b.offsetX;i.y=b.offsetY;i.type=g;a.drawLayers(w);b.preventDefault()}),d[g]=w)}}function L(b,a,d){var b=R(b),g=b.event,a=a.isPointInPath(g.x,g.y);d.mouseX=g.x;d.mouseY=g.y;!a&&(d._hovered&&!d._fired)&&(d._mousedout= -w);a&&b.intersects.push(d)}function fa(b,a,d,g,i){var f=/\b(\d*\.?\d*)\w\w\b/gi,t;if(E.text===g.text&&E.font===g.font&&E.maxWidth===g.maxWidth&&E.lineHeight===g.lineHeight)g.width=E.width,g.height=E.height;else if(!a){g.width=d.measureText(i[0]).width;for(a=1;ag.width&&(g.width=t);d=b.style.fontSize;if(a=g.font.match(f))b.style.fontSize=g.font.match(f)[0];g.height=X(c.css(b,"fontSize"))*i.length*g.lineHeight;b.style.fontSize=d}}var O,Y,B=c.extend,P=Q.round, -D=Q.PI,ga=Q.sin,V=Q.cos,ia=c.event.fix,E={},K,U;c.fn.jCanvas=G;G.version="6.1b";G.events={};O={angle:0,align:"center",autosave:w,baseline:"middle",bringToFront:F,ccw:F,closed:F,compositing:"source-over",cornerRadius:0,cropFromCenter:w,draggable:F,disableDrag:F,each:j,end:360,fillStyle:"transparent",font:"12pt sans-serif",fromCenter:w,height:j,inDegrees:w,lineHeight:1,load:j,mask:F,maxWidth:j,method:j,miterLimit:10,opacity:1,projection:0,r1:j,r2:j,radius:0,repeat:"repeat",rotate:0,rounded:F,scale:1, -scaleX:1,scaleY:1,shadowBlur:0,shadowColor:"transparent",shadowX:0,shadowY:0,sHeight:j,sides:3,source:"",start:0,strokeCap:"butt",strokeJoin:"miter",strokeStyle:"transparent",strokeWidth:1,sWidth:j,sx:j,sy:j,text:"",translate:0,translateX:0,translateY:0,visible:w,width:j,x:0,y:0};G();G.extend=function(b){O=B(O,b.props);G();b.name&&(c.fn[b.name]=function d(g){var i,f,t,c=B(new C,g);for(f=0;fu-o-2*k&&(k=(u-o)/2),0>q-s-2*k&&(k=(q-s)/2),f.moveTo(o+k,s),f.lineTo(u-k,s),f.arc(u-k,s+k,k,3*D/2,2*D,F),f.lineTo(u,q-k),f.arc(u-k,q-k,k,0,D/2,F),f.lineTo(o+k,q),f.arc(o+k,q-k,k,D/2,D,F),f.lineTo(o,s+k),f.arc(o+k,s+k,k,D,3*D/2,F)):f.rect(o, -s,c.width,c.height),c._event&&L(this[i],f,g),M(f,c);return this};c.fn.drawArc=function g(i){var f,c,o=B(new C,i),i=i||{};!o.inDegrees&&360===o.end&&(i.end=o.end=2*D);for(f=0;fv.width&&(h.sx=v.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>v.height&&(h.sy=v.height-h.sHeight/2),h.width!==j&&h.height===j)?c.height=h.height=h.width/y:h.width===j&&h.height!==j?c.width=h.width=h.height*y:h.width===j&&h.height===j&&(c.width=h.width=v.width,c.height=h.height=v.height));I(l,m,h,h.width,h.height);m.drawImage(v,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?(m.beginPath(),m.rect(h.x-h.width/ -2,h.y-h.height/2,h.width,h.height),m.restore(),L(n[l],m,c),m.closePath()):m.restore();h.load&&h.load.call(q,c)}}var n=this,p,r,l,h=B(new C,c),v,x,y;x=h.source.getContext;h.source.src||x?(v=h.source,h.width=v.width,h.height=v.height):h.source&&(v=new W,v.src=h.source);for(r=0;rr&&(m[h]=m[l])}else m[l]===j&&(x+=1,m[l]=p+x*((r-p)/v));k.addColorStop(m[l],c["c"+(l+1)])}}else k=j;return k};c.fn.setPixels=function k(c){var j,p,r,l=B(new C,c),h={},v,x,y,w;for(p=0;pd&&(b.now[d]=O(b.now[d]));1!==b.start[3]||1!==b.end[3]?b.now= +"rgba("+b.now.join(",")+")":(b.now.slice(0,3),b.now="rgb("+b.now.join(",")+")");b.elem.nodeName?b.elem.style[b.prop]=b.now:b.elem[b.prop]=b.now}function M(b){C.events[b]=function(a,d){var f="mouseover"===b||"mouseout"===b?"mousemove":b,h=d.event;d[f]||(a.bind(f+".jCanvas",function(b){h.x=b.offsetX;h.y=b.offsetY;h.type=f;a.drawLayers(v);b.preventDefault()}),d[f]=v)}}function K(b,a,d){var b=Q(b),f=b.event,a=a.isPointInPath(f.x,f.y);d.mouseX=f.x;d.mouseY=f.y;!a&&(d._hovered&&!d._fired)&&(d._mousedout= +v);a&&b.intersects.push(d)}function ea(b,a,d,f,h){var e=/\b(\d*\.?\d*)\w\w\b/gi,s;if(E.text===f.text&&E.font===f.font&&E.maxWidth===f.maxWidth&&E.lineHeight===f.lineHeight)f.width=E.width,f.height=E.height;else if(!a){f.width=d.measureText(h[0]).width;for(a=1;af.width&&(f.width=s);d=b.style.fontSize;if(a=f.font.match(e))b.style.fontSize=f.font.match(e)[0];f.height=W(c.css(b,"fontSize"))*h.length*f.lineHeight;b.style.fontSize=d}}var N,X,A=c.extend,O=P.round, +D=P.PI,fa=P.sin,U=P.cos,ha=c.event.fix,E={},J,T;c.fn.jCanvas=C;C.version="6.1b";C.events={};N={angle:0,align:"center",autosave:v,baseline:"middle",bringToFront:F,ccw:F,closed:F,compositing:"source-over",cornerRadius:0,cropFromCenter:v,draggable:F,disableDrag:F,each:i,end:360,fillStyle:"transparent",font:"12pt sans-serif",fromCenter:v,height:i,inDegrees:v,lineHeight:1,load:i,mask:F,maxWidth:i,method:i,miterLimit:10,opacity:1,projection:0,r1:i,r2:i,radius:0,repeat:"repeat",rotate:0,rounded:F,scale:1, +scaleX:1,scaleY:1,shadowBlur:0,shadowColor:"transparent",shadowX:0,shadowY:0,sHeight:i,sides:3,source:"",start:0,strokeCap:"butt",strokeJoin:"miter",strokeStyle:"transparent",strokeWidth:1,sWidth:i,sx:i,sy:i,text:"",translate:0,translateX:0,translateY:0,visible:v,width:i,x:0,y:0};C();C.extend=function(b){C.defaults=N=A(N,b.props);C();b.name&&(c.fn[b.name]=function d(f){var h,e,s,c=A(new B,f);for(e=0;et-n-2*j&&(j=(t-n)/2),0>p-r-2*j&&(j=(p-r)/2),e.moveTo(n+j,r),e.lineTo(t-j,r),e.arc(t-j,r+j,j,3*D/2,2*D,F),e.lineTo(t,p-j),e.arc(t-j,p-j,j,0,D/2,F),e.lineTo(n+j,p),e.arc(n+j,p-j,j,D/2,D,F),e.lineTo(n,r+j),e.arc(n+j,r+j,j,D,3*D/2,F)):e.rect(n, +r,c.width,c.height),c._event&&K(this[h],e,f),L(e,c);return this};c.fn.drawArc=function f(h){var e,c,n=A(new B,h),h=h||{};!n.inDegrees&&360===n.end&&(h.end=n.end=2*D);for(e=0;eg||o.measureText(x+u[0]).widthu.width&&(g.sx=u.width-g.sWidth/2),0>g.sx-g.sWidth/2&&(g.sx=g.sWidth/2),0>g.sy-g.sHeight/2&&(g.sy=g.sHeight/2),g.sy+g.sHeight/2>u.height&&(g.sy=u.height-g.sHeight/2),g.width!==i&&g.height===i)?c.height=g.height=g.width/x:g.width===i&&g.height!==i?c.width=g.width=g.height*x:g.width===i&&g.height===i&&(c.width=g.width=u.width,c.height=g.height=u.height));H(k,l,g,g.width,g.height);l.drawImage(u,g.sx-g.sWidth/2,g.sy-g.sHeight/2,g.sWidth,g.sHeight,g.x-g.width/2,g.y-g.height/2,g.width,g.height); +g._event?(l.beginPath(),l.rect(g.x-g.width/2,g.y-g.height/2,g.width,g.height),l.restore(),K(m[k],l,c),l.closePath()):l.restore();g.load&&g.load.call(p,c)}}var m=this,o,q,k,g=A(new B,c),u,w,x;w=g.source.getContext;g.source.src||w?(u=g.source,g.width=u.width,g.height=u.height):g.source&&(u=new V,u.src=g.source);for(q=0;qq&&(l[g]=l[k])}else l[k]===i&&(w+=1,l[k]=o+w*((q-o)/u));j.addColorStop(l[k],c["c"+(k+1)])}}else j=i;return j};c.fn.setPixels=function j(c){var i,o,q,k=A(new B,c),g={},u,w,x,v;for(o=0;o