jcanvas
Version:
jCanvas brings jQuery's powerful syntax and capability to the HTML5 canvas. Quickly create canvas-based apps that can utilize layers, animations, events, and much more. jCanvas works on all modern browsers and platforms, including iOS and Android.
8 lines (7 loc) • 37.7 kB
JavaScript
(function(h,S){typeof exports=="object"&&typeof module<"u"?S(require("jquery")):typeof define=="function"&&define.amd?define(["jquery"],S):(h=typeof globalThis<"u"?globalThis:h||self,S(h.$))})(this,function(h){"use strict";const S=Object.assign,W=h.inArray,D=function(i){return Object.prototype.toString.call(i).slice(8,-1).toLowerCase()},it=h.isPlainObject,_=Math.PI,V=Math.round,Xt=Math.abs,X=Math.sin,O=Math.cos,Yt=Math.atan2,At=h.event.fix,M={drawings:{arc:"drawArc",bezier:"drawBezier",ellipse:"drawEllipse",function:"draw",image:"drawImage",line:"drawLine",path:"drawPath",polygon:"drawPolygon",slice:"drawSlice",quadratic:"drawQuadratic",rectangle:"drawRect",text:"drawText",vector:"drawVector",save:"saveCanvas",restore:"restoreCanvas",rotate:"rotateCanvas",scale:"scaleCanvas",translate:"translateCanvas"},touchEvents:{mousedown:"touchstart",mouseup:"touchend",mousemove:"touchmove"},mouseEvents:{touchstart:"mousedown",touchend:"mouseup",touchmove:"mousemove"}},Y={dataCache:{},propCache:{},imageCache:{},pathCache:{}},U={rotate:0,scaleX:1,scaleY:1,translateX:0,translateY:0,masks:[]},F={props:["width","height","opacity","lineHeight"],propsObj:{}},Dt=["mousedown","mousemove","mouseup","mouseover","mouseout","touchstart","touchmove","touchend","pointerdown","pointermove","pointerup"],A={events:{},eventHooks:{},future:{}};class jt{constructor(){this.align="center",this.arrowAngle=90,this.arrowRadius=0,this.autosave=!0,this.baseline="middle",this.bringToFront=!1,this.canvas=null,this.ccw=!1,this.closed=!1,this.compositing="source-over",this.concavity=0,this.cornerRadius=0,this.count=1,this.cropFromCenter=!0,this.crossOrigin=null,this.cursors=null,this.disableEvents=!1,this.draggable=!1,this.dragging=!1,this.dragGroups=null,this.groups=null,this.d=null,this.data=null,this.dx=0,this.dy=0,this.end=360,this.endArrow=!1,this.eventX=null,this.eventY=null,this.fillRule="nonzero",this.fillStyle="transparent",this.flipArcText=!1,this.fontStyle="normal",this.fontSize="12pt",this.fontFamily="sans-serif",this.fromCenter=!0,this.height=null,this.imageSmoothing=!0,this.inDegrees=!0,this.intangible=!1,this.index=null,this.intersects=!1,this.letterSpacing=null,this.lineHeight=1,this.layer=!1,this.mask=!1,this.maxWidth=null,this.method=null,this.miterLimit=10,this.name=null,this.opacity=1,this.r1=null,this.r2=null,this.radius=0,this.repeat="repeat",this.respectAlign=!1,this.restrictDragToAxis=null,this.rotate=0,this.rounded=!1,this.scale=1,this.scaleX=1,this.scaleY=1,this.shadowBlur=0,this.shadowColor="transparent",this.shadowStroke=!1,this.shadowX=0,this.shadowY=0,this.sHeight=null,this.sides=0,this.source="",this.spread=0,this.start=0,this.startArrow=!1,this.strokeCap="butt",this.strokeDash=null,this.strokeDashOffset=0,this.strokeJoin="miter",this.strokeStyle="transparent",this.strokeWidth=1,this.style={},this.sWidth=null,this.sx=null,this.sy=null,this.text="",this.translate=0,this.translateX=0,this.translateY=0,this.type=null,this.visible=!0,this.width=null,this.willReadFrequently=!1,this.x=0,this.y=0}}const K=new jt,I=function(i){return S(this,i)};I.prototype=K;const Z=function(i,e){Object.assign(this,e,{canvas:i,_layer:!0})};Z.prototype=I.prototype;function x(i){return i?._layer?i:new I(i)}function q(i){return D(i)==="string"}function E(i){return D(i)==="function"}function rt(i){return!isNaN(Number(i))&&!isNaN(parseFloat(i))}function d(i){return i instanceof HTMLCanvasElement}function m(i){return h.jCanvas.defaults.willReadFrequently?i.getContext("2d",{willReadFrequently:h.jCanvas.defaults.willReadFrequently}):i.getContext("2d")}function $(i){for(const e in i)if(Object.prototype.hasOwnProperty.call(i,e)){const t=i[e];D(t)==="string"&&rt(t)&&e!=="text"&&(i[e]=parseFloat(String(t)))}i.text!==void 0&&(i.text=String(i.text))}function B(i){return i=S({},i),i.masks=i.masks.slice(0),i}function N(i,e){i.save();const t=B(e.transforms);e.savedTransforms.push(t)}function Ht(i,e){if(e.savedTransforms.length===0)e.transforms=B(U);else{i.restore();const t=e.savedTransforms.pop();t&&(e.transforms=t)}}function at(i,e,t,n){const o=t[n];o&&(E(o)?e[n]=o.call(i,t):e[n]=o)}function C(i,e,t){at(i,e,t,"fillStyle"),at(i,e,t,"strokeStyle"),e.lineWidth=t.strokeWidth,t.rounded?e.lineCap=e.lineJoin="round":(e.lineCap=t.strokeCap,e.lineJoin=t.strokeJoin,e.miterLimit=t.miterLimit),t.strokeDash||(t.strokeDash=[]),e.setLineDash&&e.setLineDash(t.strokeDash),e.webkitLineDash=t.strokeDash,e.lineDashOffset=e.webkitLineDashOffset=e.mozDashOffset=t.strokeDashOffset,e.shadowOffsetX=t.shadowX,e.shadowOffsetY=t.shadowY,e.shadowBlur=t.shadowBlur,e.shadowColor=t.shadowColor,e.globalAlpha=t.opacity,e.globalCompositeOperation=t.compositing,t.imageSmoothing&&(e.imageSmoothingEnabled=t.imageSmoothing)}function lt(i,e,t){t.mask&&(t.autosave&&N(i,e),t._path?i.clip(t._path,t.fillRule):i.clip(t.fillRule),e.transforms.masks.push(t._args))}function J(i,e){e._transformed&&i.restore()}function P(i,e,t){if(t.closed&&e.closePath(),t.shadowStroke&&t.strokeWidth!==0?(t._path?(e.stroke(t._path),e.fill(t._path,t.fillRule)):(e.stroke(),e.fill(t.fillRule)),e.shadowColor="transparent",e.shadowBlur=0,t._path?e.stroke(t._path):e.stroke()):(t._path?e.fill(t._path,t.fillRule):e.fill(t.fillRule),t.fillStyle!=="transparent"&&(e.shadowColor="transparent"),t.strokeWidth!==0&&(t._path?e.stroke(t._path):e.stroke())),t.closed||e.closePath(),J(e,t),t.mask){const n=v(i);lt(e,n,t)}}function L(i,e,t,n=null,o=null){t._toRad=t.inDegrees?_/180:1,t._transformed=!0,e.save(),!t.fromCenter&&!t._centered&&n!==null&&o!==null&&(o===void 0&&(o=n),t.x+=n/2,t.y+=o/2,t._centered=!0),t.rotate&&yt(e,t,null),(t.scale!==1||t.scaleX!==1||t.scaleY!==1)&&mt(e,t,null),(t.translate||t.translateX||t.translateY)&&vt(e,t,null)}A.extend=function(i){return i.name&&(i.props&&S(K,i.props),h.fn[i.name]=function e(t){const n=this;for(let o=0;o<n.length;o+=1){const r=n[o];if(!d(r))continue;const s=m(r);if(!s)continue;const a=x(t);w(r,a,t,e),C(r,s,a),i.fn.call(r,s,a)}return n},i.type&&(M.drawings[i.type]=i.name)),h.fn[i.name]};class Et{constructor(e){this.layers=[],this.layer={names:{},groups:{}},this.eventHooks={},this.intersecting=[],this.lastIntersected=null,this.drag={layer:null,dragging:!1},this.event={type:null,x:null,y:null},this.events={},this.savedTransforms=[],this.animating=!1,this.animated=null,this.pixelRatio=1,this.scaled=!1,this.redrawOnMousemove=!1,this.originalRedrawOnMousemove=!1,this.canvas=e,this.cursor=h(e).css("cursor"),this.transforms=B(U)}}function v(i){const e=Y.dataCache;let t;return e._canvas===i&&e._data?t=e._data:(t=h.data(i,"jCanvas"),t||(t=new Et(i),h.data(i,"jCanvas",t)),e._canvas=i,e._data=t),t}function ct(i,e,t){for(const n in A.events)Object.prototype.hasOwnProperty.call(A.events,n)&&(t[n]||t.cursors?.[n])&&Wt(i,e,t,n);e.events.mouseout||(i.on("mouseout.jCanvas",function(){let n=!1;const o=e.drag.layer;o&&(e.drag={layer:null,dragging:!1},b(i,e,o,"dragcancel"),n=!0);for(let r=0;r<e.layers.length;r+=1)t=e.layers[r],t?._hovered&&(i.triggerLayerEvent(e.layers[r],"mouseout"),n=!0);n&&i.drawLayers()}),e.events.mouseout=!0)}function ut(i,e,t,n){A.events[n](i,e),t._event=!0}function Wt(i,e,t,n){ut(i,e,t,n),(n==="mouseover"||n==="mouseout"||n==="mousemove")&&(e.redrawOnMousemove=!0)}function ht(i,e,t){if(t.draggable||t.cursors){const n=["mousedown","mousemove","mouseup"];for(let o=0;o<n.length;o+=1){const r=n[o];ut(i,e,t,r)}t._event=!0}}function tt(i,e,t){const n=i.layer.names;t?t.name!==void 0&&q(e.name)&&e.name!==t.name&&delete n[e.name]:t=e,q(t.name)&&(n[t.name]=e)}function et(i,e,t){const n=i.layer.groups;let o;if(!t)t=e;else if(t.groups!==void 0&&e.groups!==null)for(let r=0;r<e.groups.length;r+=1){const s=e.groups[r],a=n[s];if(a){for(let l=0;l<a.length;l+=1)if(a[l]===e){o=l,a.splice(l,1);break}a.length===0&&delete n[s]}}if(t.groups!==void 0&&t.groups!==null)for(let r=0;r<t.groups.length;r+=1){const s=t.groups[r];let a=n[s];a||(a=n[s]=[]),o===void 0&&(o=a.length),a.splice(o,0,e)}}h.fn.getEventHooks=function(){const i=this;if(i.length!==0){const e=i[0];return d(e)?v(e).eventHooks:{}}return{}},h.fn.setEventHooks=function(i){const e=this;for(let t=0;t<e.length;t+=1){const n=e[t];if(!d(n))continue;const o=v(n);S(o.eventHooks,i)}return e},h.fn.getLayers=function(i){const e=this;let t=[];if(e.length!==0){const n=e[0];if(!d(n))return t;const o=v(n).layers;if(E(i))for(let r=0;r<o.length;r+=1){const s=o[r];i.call(n,s)&&t.push(s)}else t=o}return t},h.fn.getLayer=function(i){const e=this;if(e.length!==0){const t=e[0];if(!d(t))return;const n=v(t),o=n.layers,r=D(i);if(i&&typeof i=="object"&&"layer"in i&&i.layer)return i;if(r==="number"){let s=i;return s<0&&(s=o.length+s),o[s]}else if(r==="regexp"){const s=i;for(let a=0;a<o.length;a+=1){const l=o[a];if(q(l.name)&&l.name.match(s))return l}}else{const s=i;return n.layer.names[s]}}},h.fn.getLayerGroup=function(i){const e=this,t=D(i);if(e.length!==0){const n=e[0];if(!d(n))return;if(t==="array")return i;if(t==="regexp"){const o=i,r=v(n).layer.groups;for(const s in r)if(s.match(o))return r[s]}else if(typeof i=="string"){const o=i;return v(n).layer.groups[o]}}},h.fn.getLayerIndex=function(i){const e=this,t=e.getLayers(),n=e.getLayer(i);return W(n,t)},h.fn.setLayer=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=h(o),s=v(o),a=h(t[n]).getLayer(i);if(a){tt(s,a,e),et(s,a,e),$(e);for(const l in e)if(Object.prototype.hasOwnProperty.call(e,l)){const u=e[l],f=D(u);f==="object"&&it(u)?(a[l]=S({},u),$(a[l])):f==="array"?a[l]=u.slice(0):f==="string"?u.indexOf("+=")===0?a[l]+=parseFloat(u.substr(2)):u.indexOf("-=")===0?a[l]-=parseFloat(u.substr(2)):!isNaN(u)&&rt(u)&&l!=="text"?a[l]=parseFloat(String(u)):a[l]=u:a[l]=u}ct(r,s,a),ht(r,s,a),h.isEmptyObject(e)===!1&&b(r,s,a,"change",e)}}return t},h.fn.setLayers=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=h(t[n]),r=o.getLayers(e);for(let s=0;s<r.length;s+=1)o.setLayer(r[s],i)}return t},h.fn.setLayerGroup=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=h(t[n]),r=o.getLayerGroup(i);if(r)for(let s=0;s<r.length;s+=1)o.setLayer(r[s],e)}return t},h.fn.moveLayer=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=h(o),s=v(o),a=s.layers,l=r.getLayer(i);l&&(l.index=W(l,a),a.splice(l.index,1),a.splice(e,0,l),e<0&&(e=a.length+e),l.index=e,b(r,s,l,"move"))}return t},h.fn.removeLayer=function(i){const e=this;for(let t=0;t<e.length;t+=1){const n=e[t];if(!d(n))continue;const o=h(n),r=v(n),s=o.getLayers(),a=o.getLayer(i);a&&(a.index=W(a,s),s.splice(a.index,1),delete a._layer,tt(r,a,{name:null}),et(r,a,{groups:null}),b(o,r,a,"remove"))}return e},h.fn.removeLayers=function(i){const e=this;for(let t=0;t<e.length;t+=1){const n=e[t];if(!d(n))continue;const o=h(n),r=v(n),s=o.getLayers(i).slice(0);for(let a=0;a<s.length;a+=1)o.removeLayer(s[a]);r.layer.names={},r.layer.groups={}}return e},h.fn.removeLayerGroup=function(i){const e=this;if(i!==void 0)for(let t=0;t<e.length;t+=1){const n=h(e[t]);let o=n.getLayerGroup(i);if(o){o=o.slice(0);for(let r=0;r<o.length;r+=1)n.removeLayer(o[r])}}return e},h.fn.addLayerToGroup=function(i,e){const t=this;let n=[e];for(let o=0;o<t.length;o+=1){const r=h(t[o]),s=r.getLayer(i);s?.groups&&(n=s.groups.slice(0),W(e,s.groups)===-1&&n.push(e)),r.setLayer(s,{groups:n})}return t},h.fn.removeLayerFromGroup=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=h(t[n]),r=o.getLayer(i);if(r?.groups){const s=W(e,r.groups);if(s!==-1){const a=r.groups.slice(0);a.splice(s,1),o.setLayer(r,{groups:a})}}}return t};function Mt(i){let e=null,t;for(let n=i.intersecting.length-1;n>=0;n-=1)if(e=i.intersecting[n],e._masks){for(let o=e._masks.length-1;o>=0;o-=1)if(t=e._masks[o],!t.intersects){e.intersects=!1;break}if(e.intersects&&!e.intangible)break}return e?.intangible&&(e=null),e}function ft(i,e,t){e.visible&&e._method&&(e._next=t||null,e._method?.call(i,e))}function Ft(i,e,t){const n=e.drag,o=n.layer,r=o?.dragGroups||[],s=e.layers;if(t==="mousemove"||t==="touchmove"){if(n.dragging||(n.dragging=!0,o.dragging=!0,o.bringToFront&&o.index!==null&&(s.splice(o.index,1),o.index=s.push(o)),o._startX=o.x,o._startY=o.y,o._endX=o._eventX,o._endY=o._eventY,b(i,e,o,"dragstart")),n.dragging){let a=o._eventX-(o._endX-o._startX),l=o._eventY-(o._endY-o._startY);o.updateDragX&&(a=o.updateDragX.call(i[0],o,a)),o.updateDragY&&(l=o.updateDragY.call(i[0],o,l)),o.dx=a-o.x,o.dy=l-o.y,o.restrictDragToAxis!=="y"&&(o.x=a),o.restrictDragToAxis!=="x"&&(o.y=l),b(i,e,o,"drag");for(let u=0;u<r.length;u+=1){const f=r[u],c=e.layer.groups[f];if(o.groups&&c)for(let g=0;g<c.length;g+=1)c[g]!==o&&(o.restrictDragToAxis!=="y"&&c[g].restrictDragToAxis!=="y"&&(c[g].x+=o.dx),o.restrictDragToAxis!=="x"&&c[g].restrictDragToAxis!=="x"&&(c[g].y+=o.dy))}}}else(t==="mouseup"||t==="touchend")&&(n.dragging&&(o.dragging=!1,n.dragging=!1,e.redrawOnMousemove=e.originalRedrawOnMousemove,b(i,e,o,"dragstop")),e.drag={layer:null,dragging:!1})}function It(i,e,t){let n;e.cursors&&(n=e.cursors[t]),n&&i.css({cursor:n})}function gt(i,e){i.css({cursor:e.cursor})}function nt(i,e,t,n,o){n[t]&&e._running&&!e._running[t]&&(e._running[t]=!0,n[t].call(i[0],e,o),e._running[t]=!1)}function zt(i,e){return!i.disableEvents&&(!i.intangible||W(e,Dt)===-1)}function b(i,e,t,n,o){zt(t,n)&&(n!=="mouseout"&&It(i,t,n),nt(i,t,n,t,o),nt(i,t,n,e.eventHooks,o),nt(i,t,n,A.eventHooks,o))}h.fn.triggerLayerEvent=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=h(o),s=v(o),a=r.getLayer(i);a&&b(r,s,a,e)}return t},h.fn.drawLayer=function(i){const e=this;for(let t=0;t<e.length;t+=1){const n=h(e[t]),o=e[t];if(!d(o)||!m(o))continue;const r=n.getLayer(i);r&&ft(n,r)}return e},h.fn.drawLayers=function(i){const e=this,t=i||{};let n=!1;const o=t.index||0;for(let r=0;r<e.length;r+=1){const s=e[r];if(!d(s))continue;const a=h(s);if(!m(s))continue;const l=v(s);t.clear!==!1&&a.clearCanvas(),t.complete&&(l.drawLayersComplete=t.complete);const u=l.layers;let f;for(f=o;f<u.length;f+=1){const k=u[f];if(k.index=f,t.resetFire&&(k._fired=!1),ft(a,k,f+1),k._masks=l.transforms.masks.slice(0),k._method===h.fn.drawImage&&k.visible){n=!0;break}}if(n)continue;const c=f;t.complete&&(t.complete.call(e[r]),delete l.drawLayersComplete);const g=Mt(l),y=l.event;let p=y.type;l.drag.layer&&p&&Ft(a,l,p);const T=l.lastIntersected;T!==null&&g!==T&&T._hovered&&!T._fired&&!l.drag.dragging&&(l.lastIntersected=null,T._fired=!0,T._hovered=!1,b(a,l,T,"mouseout"),gt(a,l)),g&&p&&(g[p]||(p=Vt(p)),g._event&&g.intersects&&(l.lastIntersected=g,(g.mouseover||g.mouseout||g.cursors)&&!l.drag.dragging&&!g._hovered&&!g._fired&&(g._fired=!0,g._hovered=!0,b(a,l,g,"mouseover")),g._fired||(g._fired=!0,y.type=null,b(a,l,g,p)),g.draggable&&!g.disableEvents&&(p==="mousedown"||p==="touchstart")&&(l.drag.layer=g,l.originalRedrawOnMousemove=l.redrawOnMousemove,l.redrawOnMousemove=!0)),g===null&&!l.drag.dragging&>(a,l),c===u.length&&(l.intersecting.length=0,l.transforms=B(U),l.savedTransforms.length=0))}return e};function w(i,e,t,n){const o=e._layer?t:e;if(e._args=t,(e.draggable||e.dragGroups)&&(e.layer=!0,e.draggable=!0),e._method||(n?e._method=n:e.method?e._method=h.fn[e.method]:e.type&&(e._method=h.fn[M.drawings[e.type]])),e.layer&&!e._layer&&o){const r=h(i),s=v(i),a=s.layers;if(o.name===null||q(o.name)&&s.layer.names[o.name]===void 0){$(e);const l=new Z(i,e);return l.canvas=i,l.layer=!0,l._layer=!0,l._running={},l.data!==null?l.data=S({},l.data):l.data={},l.groups?l.groups=l.groups.slice(0):l.groups=[],tt(s,l),et(s,l),ct(r,s,l),ht(r,s,l),e._event=l._event,l._method===h.fn.drawText&&r.measureText(l),l.index===null&&(l.index=a.length),a.splice(l.index,0,l),e._args=l,b(r,s,l,"add"),l}}else e.layer||$(e);return o}h.fn.addLayer=function(i){const e=this;for(let t=0;t<e.length;t+=1){const n=e[t];if(!d(n)||!m(n))continue;const o=x(i);o.layer=!0,w(n,o,i)}return e};function Gt(i){for(let e=0;e<F.props.length;e+=1){const t=F.props[e];i[t]=i["_"+t]}}function dt(i,e){for(let t=0;t<F.props.length;t+=1){const n=F.props[t];i[n]!==void 0&&(i["_"+n]=i[n],F.propsObj[n]=!0,e&&delete i[n])}}function Nt(i,e,t){for(const n in t)if(Object.prototype.hasOwnProperty.call(t,n)){const o=t[n];if(E(o)&&(t[n]=o.call(i,e,n)),D(o)==="object"&&it(o)){for(const r in o)if(Object.prototype.hasOwnProperty.call(o,r)){const s=o[r];e[n]!==void 0&&(e[n+"."+r]=e[n][r],t[n+"."+r]=s)}delete t[n]}}return t}function qt(i){for(const e in i)Object.prototype.hasOwnProperty.call(i,e)&&e.indexOf(".")!==-1&&delete i[e]}function $t(i){if(i==="transparent")return"rgba(0, 0, 0, 0)";if(i.match(/^([a-z]+|#[0-9a-f]+)$/gi)){const e=document.head,t=e.style.color;e.style.color=i;const n=h.css(e,"color");return e.style.color=t,n}else return i}function pt(i){const e=$t(i);if(/^rgb/gi.test(e)){const t=e.match(/(\d+(\.\d+)?)/gi)||[],n=/%/gi.test(e)?2.55:1;return[Number(t[0])*n,Number(t[1])*n,Number(t[2])*n,t[3]?Number(t[3])*n:1]}else return console.error(`Color format unsupported: ${e}`),[]}function Bt(i,e,t){const[n,o,r,s]=pt(i),[a,l,u,f]=pt(e),c=V(n+(a-n)*t),g=V(o+(l-o)*t),y=V(r+(u-r)*t),p=s+(f-s)*t;return`rgba(${c}, ${g}, ${y}, ${p})`}h.fn.animateLayer=function(...i){const e=this;if(!i.length)return e;D(i[2])==="object"?(i.splice(2,0,i[2].duration||null),i.splice(3,0,i[3].easing||null),i.splice(4,0,i[4].complete||null),i.splice(5,0,i[5].step||null)):(i[2]===void 0?(i.splice(2,0,null),i.splice(3,0,null),i.splice(4,0,null)):E(i[2])&&(i.splice(2,0,null),i.splice(3,0,null)),i[3]===void 0?(i[3]=null,i.splice(4,0,null)):E(i[3])&&i.splice(3,0,null));function t(o,r,s){return function(){Gt(s),qt(s),(!r.animating||r.animated===s)&&o.drawLayers(),s._animating=!1,r.animating=!1,r.animated=null,i[4]&&i[4].call(o[0],s),b(o,r,s,"animateend")}}function n(o,r,s){return function(a,l){let u,f,c,g=!1;l.prop[0]==="_"&&(g=!0,l.prop=l.prop.replace("_",""),s[l.prop]=s["_"+l.prop]),l.prop.indexOf(".")!==-1&&(u=l.prop.split("."),f=u[0],c=u[1],s[f]&&(s[f][c]=l.now)),s._pos!==l.pos&&(s._pos=l.pos,!s._animating&&!r.animating&&(s._animating=!0,r.animating=!0,r.animated=s),(!r.animating||r.animated===s)&&o.drawLayers()),i[5]&&i[5].call(o[0],a,l,s),b(o,r,s,"animate",l),g&&(l.prop="_"+l.prop)}}for(let o=0;o<e.length;o+=1){const r=e[o];if(!d(r))continue;const s=h(r);if(!m(r))continue;const a=v(r),l=s.getLayer(i[0]);if(l&&l._method!==h.fn.draw){const u=Nt(r,l,S({},i[1]));dt(u,!0),dt(l),l.style=F.propsObj,h(l).animate(u,{duration:i[2],easing:h.easing[i[3]]?i[3]:null,complete:t(s,a,l),step:n(s,a,l)}),b(s,a,l,"animatestart")}}return e},h.fn.animateLayerGroup=function(i,e,...t){const n=this;for(let o=0;o<n.length;o+=1){const r=h(n[o]),s=r.getLayerGroup(i);if(s)for(let a=0;a<s.length;a+=1)t[0]=s[a],r.animateLayer.apply(r,[e,...t])}return n},h.fn.delayLayer=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=h(o),s=v(o),a=r.getLayer(i);a&&(h(a).delay(e||0),b(r,s,a,"delay"))}return t},h.fn.delayLayerGroup=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=h(t[n]),r=o.getLayerGroup(i);if(r)for(let s=0;s<r.length;s+=1)o.delayLayer(r[s],e||0)}return t},h.fn.stopLayer=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=h(o),s=v(o),a=r.getLayer(i);a&&(h(a).stop(e),b(r,s,a,"stop"))}return t},h.fn.stopLayerGroup=function(i,e){const t=this;for(let n=0;n<t.length;n+=1){const o=h(t[n]),r=o.getLayerGroup(i);if(r)for(let s=0;s<r.length;s+=1){const a=r[s];o.stopLayer(a,e)}}return t};function Jt(i){for(let e=0;e<i.length;e+=1)h.Tween.propHooks[i[e]]={get:function(t){return t.elem[t.prop]},set:function(t){t.elem[t.prop]=Bt(t.start,t.end,t.pos||0)}}}Jt(["color","backgroundColor","borderColor","borderTopColor","borderRightColor","borderBottomColor","borderLeftColor","fillStyle","outlineColor","strokeStyle","shadowColor"]);function Qt(i){return M.touchEvents[i]||i}function Vt(i){return M.mouseEvents[i]||i}function Ut(i){A.events[i]=function(e,t){const n=t.event,o=i==="mouseover"||i==="mouseout"?"mousemove":i,r=Qt(o);function s(a){n.x=a.offsetX,n.y=a.offsetY,n.type=o,n.event=a,(a.type!=="mousemove"||t.redrawOnMousemove||t.drag.dragging)&&e.drawLayers({resetFire:!0}),a.preventDefault()}t.events[o]||(r!==o?e.on(o+".jCanvas "+r+".jCanvas",s):e.on(o+".jCanvas",s),t.events[o]=!0)}}function Kt(i){for(let e=0;e<i.length;e+=1)Ut(i[e])}Kt(["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","touchstart","touchmove","touchend","pointerdown","pointermove","pointerup","contextmenu"]);function R(i,e,t){const n=t._args;if(n){const o=v(i),r=o.event;let s=!1,a,l;r.x!==null&&r.y!==null&&(a=r.x*o.pixelRatio,l=r.y*o.pixelRatio,n._path?s=e.isPointInPath(n._path,a,l)||e.isPointInStroke(n._path,a,l):s=e.isPointInPath(a,l)||e.isPointInStroke(a,l));const u=o.transforms;n.eventX=r.x,n.eventY=r.y,n.event=r.event;const f=o.transforms.rotate;a=n.eventX,l=n.eventY,f!==0?(n._eventX=a*O(-f)-l*X(-f),n._eventY=l*O(-f)+a*X(-f)):(n._eventX=a,n._eventY=l),n._eventX/=u.scaleX,n._eventY/=u.scaleY,s&&o.intersecting.push(n),n.intersects=!!s}}h.event.fix=function(i){i=At.call(h.event,i);const e=i.originalEvent;if(e){const t=e.changedTouches;let n;if(i.pageX!==void 0&&i.offsetX===void 0)try{n=h(i.currentTarget).offset(),n&&(i.offsetX=i.pageX-n.left,i.offsetY=i.pageY-n.top)}catch{}else if(t)try{n=h(i.currentTarget).offset(),n&&(i.offsetX=t[0].pageX-n.left,i.offsetY=t[0].pageY-n.top)}catch{}}return i},h.fn.draw=function i(e){const t=this,n=x(e),o=h.fn[M.drawings[n.type]];if(n.type&&M.drawings[n.type]&&E(o))o.call(t,e);else for(let r=0;r<t.length;r+=1){const s=t[r];if(!d(s))continue;const a=m(s);if(!a)continue;const l=x(e);w(s,l,e,i),l.visible&&l.fn&&l.fn.call(t[r],a,l)}return t},h.fn.clearCanvas=function i(e){const t=this,n=x(e);for(let o=0;o<t.length;o+=1){const r=t[o];if(!d(r))continue;const s=m(r);s&&(n.width===null||n.height===null?(s.save(),s.setTransform(1,0,0,1,0,0),s.clearRect(0,0,r.width,r.height),s.restore()):(w(r,n,e,i),L(r,s,n,n.width,n.height),s.clearRect(n.x-n.width/2,n.y-n.height/2,n.width,n.height),J(s,n)))}return t},h.fn.saveCanvas=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=v(o),a=x(e);w(o,a,e,i);for(let l=0;l<a.count;l+=1)N(r,s)}return t},h.fn.restoreCanvas=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=v(o),a=x(e);w(o,a,e,i);for(let l=0;l<a.count;l+=1)Ht(r,s)}return t};function yt(i,e,t){e._toRad=e.inDegrees?_/180:1,i.translate(e.x,e.y),i.rotate(e.rotate*e._toRad),i.translate(-e.x,-e.y),t&&(t.rotate+=e.rotate*e._toRad)}function mt(i,e,t){e.scale!==1&&(e.scaleX=e.scaleY=e.scale),i.translate(e.x,e.y),i.scale(e.scaleX,e.scaleY),i.translate(-e.x,-e.y),t&&(t.scaleX*=e.scaleX,t.scaleY*=e.scaleY)}function vt(i,e,t){e.translate&&(e.translateX=e.translateY=e.translate),i.translate(e.translateX,e.translateY),t&&(t.translateX+=e.translateX,t.translateY+=e.translateY)}h.fn.rotateCanvas=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=v(o),a=x(e);w(o,a,e,i),a.autosave&&N(r,s),yt(r,a,s.transforms)}return t},h.fn.scaleCanvas=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=v(o),a=x(e);w(o,a,e,i),a.autosave&&N(r,s),mt(r,a,s.transforms)}return t},h.fn.translateCanvas=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=v(o),a=x(e);w(o,a,e,i),a.autosave&&N(r,s),vt(r,a,s.transforms)}return t},h.fn.drawRect=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);if(w(o,s,e,i),!s.visible)continue;L(o,r,s,s.width,s.height),C(o,r,s);const a=s.width||0,l=s.height||0;r.beginPath();const u=s.x-a/2,f=s.y-l/2,c=Xt(s.cornerRadius);c?r.roundRect(u,f,a,l,c):r.rect(u,f,a,l),R(o,r,s),P(o,r,s)}return t};function xt(i){for(;i<0;)i+=2*_;return i}function j(i,e,t){return i+e*O(t)}function H(i,e,t){return i+e*X(t)}function wt(i,e){const t=i===e?0:i.x,n=i===e?0:i.y,o=e.ccw?-_/180:_/180,r=e.x+t,s=e.y+n,a=e.start*i._toRad-_/2,l=!e.inDegrees&&e.end===360?_*2:e.end*i._toRad-_/2;return{pathX:r,pathY:s,angleDiff:o,pathStartAngle:a,pathEndAngle:l}}function _t(i,e,t,n){const{pathX:o,pathY:r,angleDiff:s,pathStartAngle:a,pathEndAngle:l}=wt(t,n),u=j(o,n.radius,a+s),f=H(r,n.radius,a+s),c=j(o,n.radius,a),g=H(r,n.radius,a);z(i,e,t,n,u,f,c,g),e.arc(o,r,n.radius,a,l,n.ccw);const y=j(o,n.radius,l+s),p=H(r,n.radius,l+s),T=j(o,n.radius,l),k=H(r,n.radius,l);G(i,e,t,n,T,k,y,p)}function bt(i,e,t,n){const{pathX:o,pathY:r,angleDiff:s,pathStartAngle:a,pathEndAngle:l}=wt(t,n),u=n.width||0,f=n.height||0,c=j(o,u/2,a+s),g=H(r,f/2,a+s),y=j(o,u/2,a),p=H(r,f/2,a);z(i,e,t,n,c,g,y,p),e.ellipse(o,r,u/2,f/2,0,a,l,n.ccw);const T=j(o,u/2,l+s),k=H(r,f/2,l+s),Q=j(o,u/2,l),Zt=H(r,f/2,l);G(i,e,t,n,Q,Zt,T,k)}h.fn.drawArc=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);w(o,s,e,i),s.visible&&(L(o,r,s,s.radius*2),C(o,r,s),r.beginPath(),_t(o,r,s,s),R(o,r,s),P(o,r,s))}return t},h.fn.drawEllipse=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);w(o,s,e,i),s.visible&&(L(o,r,s,s.width,s.height),C(o,r,s),r.beginPath(),bt(o,r,s,s),R(o,r,s),P(o,r,s))}return t},h.fn.drawPolygon=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);if(w(o,s,e,i),!s.visible)continue;L(o,r,s,s.radius*2),C(o,r,s);const a=2*_/s.sides,l=a/2;let u=l+_/2;const f=s.radius*O(l);r.beginPath();for(let c=0;c<s.sides;c+=1){let g=s.x+s.radius*O(u),y=s.y+s.radius*X(u);r.lineTo(g,y),s.concavity&&(g=s.x+(f+-f*s.concavity)*O(u+l),y=s.y+(f+-f*s.concavity)*X(u+l),r.lineTo(g,y)),u+=a}R(o,r,s),s.closed=!0,P(o,r,s)}return t},h.fn.drawSlice=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);if(w(o,s,e,i),!s.visible)continue;L(o,r,s,s.radius*2),C(o,r,s),s.start*=s._toRad,s.end*=s._toRad,s.start-=_/2,s.end-=_/2,s.start=xt(s.start),s.end=xt(s.end),s.end<s.start&&(s.end+=2*_);const a=(s.start+s.end)/2,l=s.radius*s.spread*O(a),u=s.radius*s.spread*X(a);s.x+=l,s.y+=u,r.beginPath(),r.arc(s.x,s.y,s.radius,s.start,s.end,s.ccw),r.lineTo(s.x,s.y),R(o,r,s),s.closed=!0,P(o,r,s)}return t};function Lt(i,e,t,n,o,r,s,a){if(n.arrowRadius&&!t.closed){let l=Yt(a-r,s-o);l-=_;const u=t.strokeWidth*O(l),f=t.strokeWidth*X(l),c=s+n.arrowRadius*O(l+n.arrowAngle/2),g=a+n.arrowRadius*X(l+n.arrowAngle/2),y=s+n.arrowRadius*O(l-n.arrowAngle/2),p=a+n.arrowRadius*X(l-n.arrowAngle/2);e.moveTo(c-u,g-f),e.lineTo(s-u,a-f),e.lineTo(y-u,p-f),e.moveTo(s-u,a-f),e.lineTo(s+u,a+f),e.moveTo(s,a)}}function z(i,e,t,n,o,r,s,a){n._arrowAngleConverted||(n.arrowAngle*=t._toRad,n._arrowAngleConverted=!0),n.startArrow&&Lt(i,e,t,n,o,r,s,a)}function G(i,e,t,n,o,r,s,a){n._arrowAngleConverted||(n.arrowAngle*=t._toRad,n._arrowAngleConverted=!0),n.endArrow&&Lt(i,e,t,n,o,r,s,a)}function Ct(i,e,t,n){let o=2;for(z(i,e,t,n,n.x2+t.x,n.y2+t.y,n.x1+t.x,n.y1+t.y),n.x1!==void 0&&n.y1!==void 0&&e.moveTo(n.x1+t.x,n.y1+t.y);;){const r=n["x"+o],s=n["y"+o];if(r!==void 0&&s!==void 0)e.lineTo(r+t.x,s+t.y),o+=1;else break}o-=1,G(i,e,t,n,n["x"+(o-1)]+t.x,n["y"+(o-1)]+t.y,n["x"+o]+t.x,n["y"+o]+t.y)}h.fn.drawLine=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);w(o,s,e,i),s.visible&&(L(o,r,s),C(o,r,s),r.beginPath(),Ct(o,r,s,s),R(o,r,s),P(o,r,s))}return t};function kt(i,e,t,n){let o=2;for(z(i,e,t,n,n.cx1+t.x,n.cy1+t.y,n.x1+t.x,n.y1+t.y),n.x1!==void 0&&n.y1!==void 0&&e.moveTo(n.x1+t.x,n.y1+t.y);;){const r=n["x"+o],s=n["y"+o],a=n["cx"+(o-1)],l=n["cy"+(o-1)];if(r!==void 0&&s!==void 0&&a!==void 0&&l!==void 0)e.quadraticCurveTo(a+t.x,l+t.y,r+t.x,s+t.y),o+=1;else break}o-=1,G(i,e,t,n,n["cx"+(o-1)]+t.x,n["cy"+(o-1)]+t.y,n["x"+o]+t.x,n["y"+o]+t.y)}h.fn.drawQuadratic=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);w(o,s,e,i),s.visible&&(L(o,r,s),C(o,r,s),r.beginPath(),kt(o,r,s,s),R(o,r,s),P(o,r,s))}return t};function Tt(i,e,t,n){let o=2,r=1;for(z(i,e,t,n,n.cx1+t.x,n.cy1+t.y,n.x1+t.x,n.y1+t.y),n.x1!==void 0&&n.y1!==void 0&&e.moveTo(n.x1+t.x,n.y1+t.y);;){const s=n["x"+o],a=n["y"+o],l=n["cx"+r],u=n["cy"+r],f=n["cx"+(r+1)],c=n["cy"+(r+1)];if(s!==void 0&&a!==void 0&&l!==void 0&&u!==void 0&&f!==void 0&&c!==void 0)e.bezierCurveTo(l+t.x,u+t.y,f+t.x,c+t.y,s+t.x,a+t.y),o+=1,r+=2;else break}o-=1,r-=2,G(i,e,t,n,n["cx"+(r+1)]+t.x,n["cy"+(r+1)]+t.y,n["x"+o]+t.x,n["y"+o]+t.y)}h.fn.drawBezier=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);w(o,s,e,i),s.visible&&(L(o,r,s),C(o,r,s),r.beginPath(),Tt(o,r,s,s),R(o,r,s),P(o,r,s))}return t};function Rt(i,e,t){return e*=i._toRad,e-=_/2,t*O(e)}function St(i,e,t){return e*=i._toRad,e-=_/2,t*X(e)}function Ot(i,e,t,n){let o,r;t===n?(o=0,r=0):(o=t.x,r=t.y);let s=1;const a=n.x+o;let l=a,u=a;const f=n.y+r;let c=f,g=f;for(z(i,e,t,n,a+Rt(t,n.a1,n.l1),f+St(t,n.a1,n.l1),a,f),n.x!==void 0&&n.y!==void 0&&e.moveTo(a,f);;){const y=n["a"+s],p=n["l"+s];if(y!==void 0&&p!==void 0)l=u,c=g,u+=Rt(t,y,p),g+=St(t,y,p),e.lineTo(u,g),s+=1;else break}G(i,e,t,n,l,c,u,g)}h.fn.drawVector=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);w(o,s,e,i),s.visible&&(L(o,r,s),C(o,r,s),r.beginPath(),Ot(o,r,s,s),R(o,r,s),P(o,r,s))}return t},h.fn.drawPath=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o);if(!r)continue;const s=x(e);if(s.d&&(r.translate(s.x,s.y),s._path=Y.pathCache[s.d]||new Path2D(s.d),Y.pathCache[s.d]=s._path),w(o,s,e,i),!!s.visible){if(L(o,r,s),C(o,r,s),!s.d){r.beginPath();let a=1;for(;;){let l=s["p"+a];if(l!==void 0)l=new I(l),l.type==="line"?Ct(o,r,s,l):l.type==="quadratic"?kt(o,r,s,l):l.type==="bezier"?Tt(o,r,s,l):l.type==="vector"?Ot(o,r,s,l):l.type==="arc"?_t(o,r,s,l):l.type==="ellipse"&&bt(o,r,s,l),a+=1;else break}}R(o,r,s),P(o,r,s),s.d&&r.translate(-s.x,-s.y)}}return t};function ot(i,e,t){isNaN(Number(t.fontSize))||(t.fontSize+="px"),e.font=t.fontStyle+" "+t.fontSize+" "+t.fontFamily}function st(i,e,t,n){const o=Y.propCache;if(o.width&&o.height&&o.text===t.text&&o.fontStyle===t.fontStyle&&o.fontSize===t.fontSize&&o.fontFamily===t.fontFamily&&o.maxWidth===t.maxWidth&&o.lineHeight===t.lineHeight)t.width=o.width,t.height=o.height;else{t.width=e.measureText(n[0]).width;for(let s=1;s<n.length;s+=1){const a=e.measureText(n[s]).width;a>t.width&&(t.width=a)}const r=i.style.fontSize;i.style.fontSize=t.fontSize,t.height=parseFloat(h.css(i,"fontSize"))*n.length*t.lineHeight,i.style.fontSize=r}}function Pt(i,e){const t=String(e.text),n=e.maxWidth,o=t.split(`
`);let r=[];for(let s=0;s<o.length;s+=1){const a=o[s],l=a.split(" ");let u=[],f="";if(l.length===1||n&&i.measureText(a).width<n)u=[a];else{for(let c=0;c<l.length;c+=1)n&&i.measureText(f+l[c]).width>n&&(f!==""&&u.push(f),f=""),f+=l[c],c!==l.length-1&&(f+=" ");u.push(f)}r=r.concat(u.join(`
`).replace(/((\n))|($)/gi,"$2").split(`
`))}return r}h.fn.drawText=function i(e){const t=this,n=500;for(let o=0;o<t.length;o+=1){const r=t[o];if(!d(r))continue;const s=m(r);if(!s)continue;const a=x(e);if(w(r,a,e,i),!a.visible)continue;s.textBaseline=a.baseline,s.textAlign=a.align,ot(r,s,a);let l;a.maxWidth!==null?l=Pt(s,a):l=a.text.toString().split(`
`),st(r,s,a,l),L(r,s,a,a.width,a.height),C(r,s,a);let u=a.x;if(a.align==="left"&&a.width?a.respectAlign?a.x+=a.width/2:u-=a.width/2:a.align==="right"&&a.width&&(a.respectAlign?a.x-=a.width/2:u+=a.width/2),a.radius){const c=parseFloat(a.fontSize);a.letterSpacing===null&&(a.letterSpacing=c/n);for(let g=0;g<l.length;g+=1){s.save(),s.translate(a.x,a.y);let y=l[g],p;a.flipArcText&&(p=y.split(""),p.reverse(),y=p.join(""));const T=y.length;s.rotate(-(_*a.letterSpacing*(T-1))/2);for(let k=0;k<T;k+=1){const Q=y[k];k!==0&&s.rotate(_*a.letterSpacing),s.save(),s.translate(0,-a.radius),a.flipArcText&&s.scale(-1,-1),s.fillText(Q,0,0),a.fillStyle!=="transparent"&&(s.shadowColor="transparent"),a.strokeWidth!==0&&s.strokeText(Q,0,0),s.restore()}a.radius-=c,a.letterSpacing+=c/(n*2*_),s.restore()}}else for(let c=0;c<l.length;c+=1){const g=l[c],y=a.y+c*(a.height||0)/l.length-(l.length-1)*(a.height||0)/l.length/2;s.shadowColor=a.shadowColor,s.fillText(g,u,y),a.fillStyle!=="transparent"&&(s.shadowColor="transparent"),a.strokeWidth!==0&&s.strokeText(g,u,y)}let f=0;if(a.baseline==="top"?f+=(a.height||0)/2:a.baseline==="bottom"&&(f-=(a.height||0)/2),a._event){const c=a.width||0,g=a.height||0;s.beginPath(),s.rect(a.x-c/2,a.y-g/2+f,c,g),R(r,s,a),s.closePath()}J(s,a),a&&(Y.propCache=a)}return t},h.fn.measureText=function(i){const e=this,t=e.getLayer(i)||new I(i),n=e[0];if(!d(n))return t;const o=m(n);if(!o)return t;ot(n,o,t);let r;return t.maxWidth!==null?r=Pt(o,t):r=t.text.split(`
`),st(n,o,t,r),t},h.fn.drawImage=function i(e){const t=this,n=Y.imageCache;let o=null,r;function s(l,u,f,c,g){if(!o)return;c.width===null&&c.sWidth===null&&(c.width=c.sWidth=o.width),c.height===null&&c.sHeight===null&&(c.height=c.sHeight=o.height),g&&(g.width=c.width,g.height=c.height);const y=c.width||0,p=c.height||0;c.sWidth!==null&&c.sHeight!==null&&c.sx!==null&&c.sy!==null?(c.width===null&&(c.width=c.sWidth),c.height===null&&(c.height=c.sHeight),c.cropFromCenter&&(c.sx+=c.sWidth/2,c.sy+=c.sHeight/2),c.sy-c.sHeight/2<0&&(c.sy=c.sHeight/2),c.sy+c.sHeight/2>o.height&&(c.sy=o.height-c.sHeight/2),c.sx-c.sWidth/2<0&&(c.sx=c.sWidth/2),c.sx+c.sWidth/2>o.width&&(c.sx=o.width-c.sWidth/2),L(l,u,c,c.width,c.height),C(l,u,c),u.drawImage(o,c.sx-c.sWidth/2,c.sy-c.sHeight/2,c.sWidth,c.sHeight,c.x-c.width/2,c.y-c.height/2,c.width,c.height)):(L(l,u,c,c.width,c.height),C(l,u,c),u.drawImage(o,c.x-y/2,c.y-p/2,y,p)),u.beginPath(),u.rect(c.x-y/2,c.y-p/2,y,p),R(l,u,c),u.closePath(),J(u,c),lt(u,f,c)}function a(l,u,f,c,g){return function(){const y=h(l);if(s(l,u,f,c,g),c.layer&&g instanceof Z?b(y,f,g,"load"):c.load&&c.load.call(y[0],g),c.layer&&g&&(g._masks=f.transforms.masks.slice(0),c._next)){const p=f.drawLayersComplete;delete f.drawLayersComplete,y.drawLayers({clear:!1,resetFire:!0,index:c._next,complete:p})}}}for(let l=0;l<t.length;l+=1){const u=t[l];if(!d(u))continue;const f=m(u);if(!f)continue;const c=v(u),g=x(e),y=w(u,g,e,i);if(g.visible){if(r=g.source,r instanceof HTMLImageElement||r instanceof HTMLCanvasElement)o=r;else if(r){const p=n[r];p?.complete?o=p:(o=new Image,r.match(/^data:/i)||(o.crossOrigin=g.crossOrigin),o.src=r,n[r]=o)}o&&(o instanceof HTMLImageElement&&o.complete||o instanceof HTMLCanvasElement?a(u,f,c,g,y)():o.onload=a(u,f,c,g,y))}}return t},h.fn.createPattern=function(i){const e=this;let t,n=null;function o(u,f){n=u.createPattern(t,f.repeat),f.load&&n&&f.load.call(e[0],n)}const r=e[0];if(!d(r))return null;const s=m(r);if(!s)return null;const a=x(i),l=a.source;if(E(l)){t=document.createElement("canvas"),t.width=a.width||0,t.height=a.height||0;const u=m(t);l.call(t,u),o(s,a)}else l instanceof HTMLImageElement||l instanceof HTMLCanvasElement?t=l:(t=new Image,l.match(/^data:/i)||(t.crossOrigin=a.crossOrigin),t.src=l),t instanceof HTMLImageElement&&t.complete||t instanceof HTMLCanvasElement?o(s,a):t.onload=()=>o(s,a);return n},h.fn.createGradient=function(i){const e=this;let t=null;const n=[],o=x(i),r=e[0];if(!d(r))return null;const s=m(r);if(!s)return null;o.x1=o.x1||0,o.y1=o.y1||0,o.x2=o.x2||0,o.y2=o.y2||0,o.r1!==null&&o.r2!==null?t=s.createRadialGradient(o.x1,o.y1,o.r1,o.x2,o.y2,o.r2):t=s.createLinearGradient(o.x1,o.y1,o.x2,o.y2);for(let l=1;o["c"+l]!==void 0;l+=1)o["s"+l]!==void 0?n.push(o["s"+l]):n.push(null);const a=n.length;n[0]===null&&(n[0]=0),n[a-1]===null&&(n[a-1]=1);for(let l=0;l<a;l+=1){let u=0,f=null,c=null,g=1;if(n[l]!==null){u=0,f=n[l];let p;for(p=l+1;p<a;p+=1)if(n[p]!==null){c=n[p];break}else g+=1;f>c&&(n[p]=n[l])}else n[l]===null&&(u+=1,n[l]=f+u*((c-f)/g));const y=n[l];y!==null&&t.addColorStop(y,o["c"+(l+1)])}return t},h.fn.setPixels=function i(e){const t=this;for(let n=0;n<t.length;n+=1){const o=t[n];if(!d(o))continue;const r=m(o),s=v(o);if(!r)continue;const a=x(e);if(w(o,a,e,i),L(o,r,a,a.width,a.height),(a.width===null||a.height===null)&&(a.width=o.width,a.height=o.height,a.x=a.width/2,a.y=a.height/2),a.width!==0&&a.height!==0){const l=r.getImageData((a.x-a.width/2)*s.pixelRatio,(a.y-a.height/2)*s.pixelRatio,a.width*s.pixelRatio,a.height*s.pixelRatio),u=l.data,f=u.length;if(a.each)for(let c=0;c<f;c+=4){const g={r:u[c],g:u[c+1],b:u[c+2],a:u[c+3]};a.each.call(o,g,a),u[c]=g.r,u[c+1]=g.g,u[c+2]=g.b,u[c+3]=g.a}r.putImageData(l,(a.x-a.width/2)*s.pixelRatio,(a.y-a.height/2)*s.pixelRatio),r.restore()}}return t},h.fn.getCanvasImage=function(i,e){const t=this;if(t.length!==0){const n=t[0];return d(n)?(e===void 0&&(e=1),n.toDataURL("image/"+i,e)):null}return null},h.fn.detectPixelRatio=function(i){const e=this;for(let t=0;t<e.length;t+=1){const n=e[t];if(!d(n))continue;const o=m(n);if(!o)continue;const r=v(n);if(!r.scaled){const s=window.devicePixelRatio||1;if(s!==1){const a=n.width,l=n.height;n.width=a*s,n.height=l*s,n.style.width=a+"px",n.style.height=l+"px",o.scale(s,s)}r.pixelRatio=s,r.scaled=!0,i&&i.call(n,s)}}return e},A.clearCache=function(){for(const i in Y)Object.prototype.hasOwnProperty.call(Y,i)&&(Y[i]={})},S(A,{defaults:K,setGlobalProps:C,transformShape:L,detectEvents:R,closePath:P,setCanvasFont:ot,measureText:st}),h.jCanvas=A,h.jCanvasObject=I});
//# sourceMappingURL=jcanvas.min.js.map