@idraw/renderer 0.2.0-alpha.20 → 0.2.0-alpha.24

package/README.md

@@ -1,3 +1,68 @@
 # @idraw/renderer
 
-[![Node.js CI](https://github.com/idrawjs/idraw/actions/workflows/node.js.yml/badge.svg?branch=main)](https://github.com/idrawjs/idraw/actions/workflows/node.js.yml)
+[![Node.js CI](https://github.com/idrawjs/idraw/actions/workflows/node.js.yml/badge.svg?branch=main)](https://github.com/idrawjs/idraw/actions/workflows/node.js.yml)
+
+
+## Usage
+
+### Quick Start
+
+```sh
+npm i @idraw/renderer
+```
+
+```js
+import Renderer from '@idraw/renderer';
+
+const renderer = new Renderer({
+  width: 600,
+  height: 400,
+  contextWidth: 600,
+  contextHeight: 400,
+  devicePixelRatio: 1,
+});
+
+const canvas = document.querySelector('canvas');
+renderer.render(canvas, {
+  elements: [
+    {
+      name: "rect-001",
+      x: 10,
+      y: 10,
+      w: 200,
+      h: 100,
+      type: "rect",
+      desc: {
+        bgColor: "#f0f0f0",
+        borderRadius: 20,
+        borderWidth: 10,
+        borderColor: "#bd0b64",
+      },
+    },
+  ]
+})
+
+```
+
+### Events
+
+```js
+renderer.on('load', (e) => {
+  // ...
+})
+renderer.on('loadComplete', (e) => {
+  // ...
+})
+
+renderer.on('drawFrame', (e) => {
+  // ...
+})
+renderer.on('drawFrameComplete', (e) => {
+  // ...
+})
+```
+
+## Documents
+
+- [Documents](https://idraw.js.org/docs/en/) | [中文文档](https://idraw.js.org/docs/zh/) 
+- [Online Playground](https://idraw.js.org/playground/) | [在线API示例](https://idraw.js.org/playground/)

package/dist/index.cjs.js

@@ -325,6 +325,9 @@ var Context$1 = (function () {
             scrollY: 0,
         };
     }
+    Context.prototype.getContext = function () {
+        return this._ctx;
+    };
     Context.prototype.resetSize = function (opts) {
         this._opts = __assign(__assign({}, this._opts), opts);
     };
@@ -1477,7 +1480,7 @@ var Renderer = (function (_super) {
         });
         return _this;
     }
-    Renderer.prototype.render = function (canvas, originData, opts) {
+    Renderer.prototype.render = function (target, originData, opts) {
         var _d = (opts || {}).changeResourceUUIDs, changeResourceUUIDs = _d === void 0 ? [] : _d;
         this[_status] = DrawStatus.FREE;
         var data = deepClone(originData);
@@ -1489,17 +1492,23 @@ var Renderer = (function (_super) {
             });
         }
         if (!this[_ctx]) {
-            var _e = this[_opts], width = _e.width, height = _e.height, contextWidth = _e.contextWidth, contextHeight = _e.contextHeight, devicePixelRatio_1 = _e.devicePixelRatio;
-            canvas.width = width * devicePixelRatio_1;
-            canvas.height = height * devicePixelRatio_1;
-            var ctx2d = canvas.getContext('2d');
-            this[_ctx] = new Context(ctx2d, {
-                width: width,
-                height: height,
-                contextWidth: contextWidth || width,
-                contextHeight: contextHeight || height,
-                devicePixelRatio: devicePixelRatio_1
-            });
+            if (this[_opts] && Object.prototype.toString.call(target) === '[object HTMLCanvasElement]') {
+                var _e = this[_opts], width = _e.width, height = _e.height, contextWidth = _e.contextWidth, contextHeight = _e.contextHeight, devicePixelRatio_1 = _e.devicePixelRatio;
+                var canvas = target;
+                canvas.width = width * devicePixelRatio_1;
+                canvas.height = height * devicePixelRatio_1;
+                var ctx2d = canvas.getContext('2d');
+                this[_ctx] = new Context(ctx2d, {
+                    width: width,
+                    height: height,
+                    contextWidth: contextWidth || width,
+                    contextHeight: contextHeight || height,
+                    devicePixelRatio: devicePixelRatio_1
+                });
+            }
+            else if (target) {
+                this[_ctx] = target;
+            }
         }
         if ([DrawStatus.FREEZE].includes(this[_status])) {
             return;
@@ -1512,6 +1521,9 @@ var Renderer = (function (_super) {
     Renderer.prototype.getContext = function () {
         return this[_ctx];
     };
+    Renderer.prototype.thaw = function () {
+        this[_status] = DrawStatus.FREE;
+    };
     Renderer.prototype[(_a = _queue, _b = _ctx, _c = _status, _freeze)] = function () {
         this[_status] = DrawStatus.FREEZE;
     };
@@ -1554,6 +1566,9 @@ var Renderer = (function (_super) {
             }
             _this.trigger('drawFrame', { t: Date.now() });
             if (_this[_loader].isComplete() === true && _this[_queue].length === 1 && _this[_status] === DrawStatus.FREE) {
+                if (ctx && _this[_queue][0] && _this[_queue][0].data) {
+                    drawContext(ctx, _this[_queue][0].data, _this[_loader]);
+                }
                 _this.trigger('drawFrameComplete', { t: Date.now() });
                 _this[_freeze]();
             }

package/dist/index.d.ts

@@ -28,12 +28,13 @@ declare class Renderer extends RendererEvent {
     private [_ctx];
     private [_status];
     private [_loader];
-    private [_opts];
-    constructor(opts: Options);
-    render(canvas: HTMLCanvasElement, originData: TypeData, opts?: {
+    private [_opts]?;
+    constructor(opts?: Options);
+    render(target: HTMLCanvasElement | TypeContext, originData: TypeData, opts?: {
         changeResourceUUIDs?: string[];
     }): void;
     getContext(): TypeContext | null;
+    thaw(): void;
     private [_freeze];
     private [_drawFrame];
     private [_retainQueueOneItem];

package/dist/index.es.js

@@ -323,6 +323,9 @@ var Context$1 = (function () {
             scrollY: 0,
         };
     }
+    Context.prototype.getContext = function () {
+        return this._ctx;
+    };
     Context.prototype.resetSize = function (opts) {
         this._opts = __assign(__assign({}, this._opts), opts);
     };
@@ -1475,7 +1478,7 @@ var Renderer = (function (_super) {
         });
         return _this;
     }
-    Renderer.prototype.render = function (canvas, originData, opts) {
+    Renderer.prototype.render = function (target, originData, opts) {
         var _d = (opts || {}).changeResourceUUIDs, changeResourceUUIDs = _d === void 0 ? [] : _d;
         this[_status] = DrawStatus.FREE;
         var data = deepClone(originData);
@@ -1487,17 +1490,23 @@ var Renderer = (function (_super) {
             });
         }
         if (!this[_ctx]) {
-            var _e = this[_opts], width = _e.width, height = _e.height, contextWidth = _e.contextWidth, contextHeight = _e.contextHeight, devicePixelRatio_1 = _e.devicePixelRatio;
-            canvas.width = width * devicePixelRatio_1;
-            canvas.height = height * devicePixelRatio_1;
-            var ctx2d = canvas.getContext('2d');
-            this[_ctx] = new Context(ctx2d, {
-                width: width,
-                height: height,
-                contextWidth: contextWidth || width,
-                contextHeight: contextHeight || height,
-                devicePixelRatio: devicePixelRatio_1
-            });
+            if (this[_opts] && Object.prototype.toString.call(target) === '[object HTMLCanvasElement]') {
+                var _e = this[_opts], width = _e.width, height = _e.height, contextWidth = _e.contextWidth, contextHeight = _e.contextHeight, devicePixelRatio_1 = _e.devicePixelRatio;
+                var canvas = target;
+                canvas.width = width * devicePixelRatio_1;
+                canvas.height = height * devicePixelRatio_1;
+                var ctx2d = canvas.getContext('2d');
+                this[_ctx] = new Context(ctx2d, {
+                    width: width,
+                    height: height,
+                    contextWidth: contextWidth || width,
+                    contextHeight: contextHeight || height,
+                    devicePixelRatio: devicePixelRatio_1
+                });
+            }
+            else if (target) {
+                this[_ctx] = target;
+            }
         }
         if ([DrawStatus.FREEZE].includes(this[_status])) {
             return;
@@ -1510,6 +1519,9 @@ var Renderer = (function (_super) {
     Renderer.prototype.getContext = function () {
         return this[_ctx];
     };
+    Renderer.prototype.thaw = function () {
+        this[_status] = DrawStatus.FREE;
+    };
     Renderer.prototype[(_a = _queue, _b = _ctx, _c = _status, _freeze)] = function () {
         this[_status] = DrawStatus.FREEZE;
     };
@@ -1552,6 +1564,9 @@ var Renderer = (function (_super) {
             }
             _this.trigger('drawFrame', { t: Date.now() });
             if (_this[_loader].isComplete() === true && _this[_queue].length === 1 && _this[_status] === DrawStatus.FREE) {
+                if (ctx && _this[_queue][0] && _this[_queue][0].data) {
+                    drawContext(ctx, _this[_queue][0].data, _this[_loader]);
+                }
                 _this.trigger('drawFrameComplete', { t: Date.now() });
                 _this[_freeze]();
             }

package/dist/index.global.js

@@ -326,6 +326,9 @@ var iDrawRenderer = (function () {
                 scrollY: 0,
             };
         }
+        Context.prototype.getContext = function () {
+            return this._ctx;
+        };
         Context.prototype.resetSize = function (opts) {
             this._opts = __assign(__assign({}, this._opts), opts);
         };
@@ -1478,7 +1481,7 @@ var iDrawRenderer = (function () {
             });
             return _this;
         }
-        Renderer.prototype.render = function (canvas, originData, opts) {
+        Renderer.prototype.render = function (target, originData, opts) {
             var _d = (opts || {}).changeResourceUUIDs, changeResourceUUIDs = _d === void 0 ? [] : _d;
             this[_status] = DrawStatus.FREE;
             var data = deepClone(originData);
@@ -1490,17 +1493,23 @@ var iDrawRenderer = (function () {
                 });
             }
             if (!this[_ctx]) {
-                var _e = this[_opts], width = _e.width, height = _e.height, contextWidth = _e.contextWidth, contextHeight = _e.contextHeight, devicePixelRatio_1 = _e.devicePixelRatio;
-                canvas.width = width * devicePixelRatio_1;
-                canvas.height = height * devicePixelRatio_1;
-                var ctx2d = canvas.getContext('2d');
-                this[_ctx] = new Context(ctx2d, {
-                    width: width,
-                    height: height,
-                    contextWidth: contextWidth || width,
-                    contextHeight: contextHeight || height,
-                    devicePixelRatio: devicePixelRatio_1
-                });
+                if (this[_opts] && Object.prototype.toString.call(target) === '[object HTMLCanvasElement]') {
+                    var _e = this[_opts], width = _e.width, height = _e.height, contextWidth = _e.contextWidth, contextHeight = _e.contextHeight, devicePixelRatio_1 = _e.devicePixelRatio;
+                    var canvas = target;
+                    canvas.width = width * devicePixelRatio_1;
+                    canvas.height = height * devicePixelRatio_1;
+                    var ctx2d = canvas.getContext('2d');
+                    this[_ctx] = new Context(ctx2d, {
+                        width: width,
+                        height: height,
+                        contextWidth: contextWidth || width,
+                        contextHeight: contextHeight || height,
+                        devicePixelRatio: devicePixelRatio_1
+                    });
+                }
+                else if (target) {
+                    this[_ctx] = target;
+                }
             }
             if ([DrawStatus.FREEZE].includes(this[_status])) {
                 return;
@@ -1513,6 +1522,9 @@ var iDrawRenderer = (function () {
         Renderer.prototype.getContext = function () {
             return this[_ctx];
         };
+        Renderer.prototype.thaw = function () {
+            this[_status] = DrawStatus.FREE;
+        };
         Renderer.prototype[(_a = _queue, _b = _ctx, _c = _status, _freeze)] = function () {
             this[_status] = DrawStatus.FREEZE;
         };
@@ -1555,6 +1567,9 @@ var iDrawRenderer = (function () {
                 }
                 _this.trigger('drawFrame', { t: Date.now() });
                 if (_this[_loader].isComplete() === true && _this[_queue].length === 1 && _this[_status] === DrawStatus.FREE) {
+                    if (ctx && _this[_queue][0] && _this[_queue][0].data) {
+                        drawContext(ctx, _this[_queue][0].data, _this[_loader]);
+                    }
                     _this.trigger('drawFrameComplete', { t: Date.now() });
                     _this[_freeze]();
                 }

package/dist/index.global.min.js

@@ -1 +1 @@
-var iDrawRenderer=function(){'use strict';var t=function(e,o){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o])},t(e,o)};var e=function(){return e=Object.assign||function(t){for(var e,o=1,r=arguments.length;o<r;o++)for(var n in e=arguments[o])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},e.apply(this,arguments)};function o(t,e,o,r){return new(o||(o=Promise))((function(n,i){function s(t){try{u(r.next(t))}catch(t){i(t)}}function a(t){try{u(r.throw(t))}catch(t){i(t)}}function u(t){var e;t.done?n(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(s,a)}u((r=r.apply(t,e||[])).next())}))}function r(t,e){var o,r,n,i,s={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return i={next:a(0),throw:a(1),return:a(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function a(i){return function(a){return function(i){if(o)throw new TypeError("Generator is already executing.");for(;s;)try{if(o=1,r&&(n=2&i[0]?r.return:i[0]?r.throw||((n=r.return)&&n.call(r),0):r.next)&&!(n=n.call(r,i[1])).done)return n;switch(r=0,n&&(i=[2&i[0],n.value]),i[0]){case 0:case 1:n=i;break;case 4:return s.label++,{value:i[1],done:!1};case 5:s.label++,r=i[1],i=[0];continue;case 7:i=s.ops.pop(),s.trys.pop();continue;default:if(!(n=s.trys,(n=n.length>0&&n[n.length-1])||6!==i[0]&&2!==i[0])){s=0;continue}if(3===i[0]&&(!n||i[1]>n[0]&&i[1]<n[3])){s.label=i[1];break}if(6===i[0]&&s.label<n[1]){s.label=n[1],n=i;break}if(n&&s.label<n[2]){s.label=n[2],s.ops.push(i);break}n[2]&&s.ops.pop(),s.trys.pop();continue}i=e.call(t,s)}catch(t){i=[6,t],r=0}finally{o=n=0}if(5&i[0])throw i[1];return{value:i[0]?i[1]:void 0,done:!0}}([i,a])}}}function n(t){return'string'==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function i(t){return(Object.prototype.toString.call(t)||'').replace(/(\[object|\])/gi,'').trim()}var s={type:function(t,e){var o=i(t);return!0===e?o.toLocaleLowerCase():o},array:function(t){return'Array'===i(t)},json:function(t){return'Object'===i(t)},function:function(t){return'Function'===i(t)},asyncFunction:function(t){return'AsyncFunction'===i(t)},string:function(t){return'String'===i(t)},number:function(t){return'Number'===i(t)},undefined:function(t){return'Undefined'===i(t)},null:function(t){return'Null'===i(t)},promise:function(t){return'Promise'===i(t)}},a=function(){return a=Object.assign||function(t){for(var e,o=1,r=arguments.length;o<r;o++)for(var n in e=arguments[o])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},a.apply(this,arguments)};function u(t,e,o,r){return new(o||(o=Promise))((function(n,i){function s(t){try{u(r.next(t))}catch(t){i(t)}}function a(t){try{u(r.throw(t))}catch(t){i(t)}}function u(t){var e;t.done?n(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(s,a)}u((r=r.apply(t,e||[])).next())}))}function l(t,e){var o,r,n,i,s={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return i={next:a(0),throw:a(1),return:a(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function a(i){return function(a){return function(i){if(o)throw new TypeError("Generator is already executing.");for(;s;)try{if(o=1,r&&(n=2&i[0]?r.return:i[0]?r.throw||((n=r.return)&&n.call(r),0):r.next)&&!(n=n.call(r,i[1])).done)return n;switch(r=0,n&&(i=[2&i[0],n.value]),i[0]){case 0:case 1:n=i;break;case 4:return s.label++,{value:i[1],done:!1};case 5:s.label++,r=i[1],i=[0];continue;case 7:i=s.ops.pop(),s.trys.pop();continue;default:if(!(n=s.trys,(n=n.length>0&&n[n.length-1])||6!==i[0]&&2!==i[0])){s=0;continue}if(3===i[0]&&(!n||i[1]>n[0]&&i[1]<n[3])){s.label=i[1];break}if(6===i[0]&&s.label<n[1]){s.label=n[1],n=i;break}if(n&&s.label<n[2]){s.label=n[2],s.ops.push(i);break}n[2]&&s.ops.pop(),s.trys.pop();continue}i=e.call(t,s)}catch(t){i=[6,t],r=0}finally{o=n=0}if(5&i[0])throw i[1];return{value:i[0]?i[1]:void 0,done:!0}}([i,a])}}}function c(t,e){var o=e.width,r=e.height;return new Promise((function(e,n){var i=new Blob(["\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\""+(o||'')+"\" height = \""+(r||'')+"\">\n      <foreignObject width=\"100%\" height=\"100%\">\n        <div xmlns = \"http://www.w3.org/1999/xhtml\">\n          "+t+"\n        </div>\n      </foreignObject>\n    </svg>\n    "],{type:'image/svg+xml;charset=utf-8'}),s=new FileReader;s.readAsDataURL(i),s.onload=function(t){var o,r=null===(o=null==t?void 0:t.target)||void 0===o?void 0:o.result;e(r)},s.onerror=function(t){n(t)}}))}function h(t){return new Promise((function(e,o){var r=new Blob([t],{type:'image/svg+xml;charset=utf-8'}),n=new FileReader;n.readAsDataURL(r),n.onload=function(t){var o,r=null===(o=null==t?void 0:t.target)||void 0===o?void 0:o.result;e(r)},n.onerror=function(t){o(t)}}))}var f=window.Image;function d(t){return new Promise((function(e,o){var r=new f;r.onload=function(){e(r)},r.onabort=o,r.onerror=o,r.src=t}))}var p=function(){function t(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}return t.prototype.resetSize=function(t){this._opts=a(a({},this._opts),t)},t.prototype.calcDeviceNum=function(t){return t*this._opts.devicePixelRatio},t.prototype.calcScreenNum=function(t){return t/this._opts.devicePixelRatio},t.prototype.getSize=function(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}},t.prototype.setTransform=function(t){this._transform=a(a({},this._transform),t)},t.prototype.getTransform=function(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}},t.prototype.setFillStyle=function(t){this._ctx.fillStyle=t},t.prototype.fill=function(t){return this._ctx.fill(t||'nonzero')},t.prototype.arc=function(t,e,o,r,n,i){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(o),r,n,i)},t.prototype.rect=function(t,e,o,r){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r))},t.prototype.fillRect=function(t,e,o,r){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r))},t.prototype.clearRect=function(t,e,o,r){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r))},t.prototype.beginPath=function(){return this._ctx.beginPath()},t.prototype.closePath=function(){return this._ctx.closePath()},t.prototype.lineTo=function(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))},t.prototype.moveTo=function(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))},t.prototype.arcTo=function(t,e,o,r,n){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r),this._doSize(n))},t.prototype.setLineWidth=function(t){return this._ctx.lineWidth=this._doSize(t)},t.prototype.setLineDash=function(t){var e=this;return this._ctx.setLineDash(t.map((function(t){return e._doSize(t)})))},t.prototype.isPointInPath=function(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))},t.prototype.isPointInPathWithoutScroll=function(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))},t.prototype.setStrokeStyle=function(t){this._ctx.strokeStyle=t},t.prototype.stroke=function(){return this._ctx.stroke()},t.prototype.translate=function(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))},t.prototype.rotate=function(t){return this._ctx.rotate(t)},t.prototype.drawImage=function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];var o=t[0],r=t[1],n=t[2],i=t[3],s=t[4],a=t[t.length-4],u=t[t.length-3],l=t[t.length-2],c=t[t.length-1];return 9===t.length?this._ctx.drawImage(o,this._doSize(r),this._doSize(n),this._doSize(i),this._doSize(s),this._doSize(a),this._doSize(u),this._doSize(l),this._doSize(c)):this._ctx.drawImage(o,this._doSize(a),this._doSize(u),this._doSize(l),this._doSize(c))},t.prototype.createPattern=function(t,e){return this._ctx.createPattern(t,e)},t.prototype.measureText=function(t){return this._ctx.measureText(t)},t.prototype.setTextAlign=function(t){this._ctx.textAlign=t},t.prototype.fillText=function(t,e,o,r){return void 0!==r?this._ctx.fillText(t,this._doSize(e),this._doSize(o),this._doSize(r)):this._ctx.fillText(t,this._doSize(e),this._doSize(o))},t.prototype.strokeText=function(t,e,o,r){return void 0!==r?this._ctx.strokeText(t,this._doSize(e),this._doSize(o),this._doSize(r)):this._ctx.strokeText(t,this._doSize(e),this._doSize(o))},t.prototype.setFont=function(t){var e=[];'bold'===t.fontWeight&&e.push(""+t.fontWeight),e.push(this._doSize(t.fontSize||12)+"px"),e.push(""+(t.fontFamily||'sans-serif')),this._ctx.font=""+e.join(' ')},t.prototype.setTextBaseline=function(t){this._ctx.textBaseline=t},t.prototype.setGlobalAlpha=function(t){this._ctx.globalAlpha=t},t.prototype.save=function(){this._ctx.save()},t.prototype.restore=function(){this._ctx.restore()},t.prototype.scale=function(t,e){this._ctx.scale(t,e)},t.prototype.setShadowColor=function(t){this._ctx.shadowColor=t},t.prototype.setShadowOffsetX=function(t){this._ctx.shadowOffsetX=this._doSize(t)},t.prototype.setShadowOffsetY=function(t){this._ctx.shadowOffsetY=this._doSize(t)},t.prototype.setShadowBlur=function(t){this._ctx.shadowBlur=this._doSize(t)},t.prototype.ellipse=function(t,e,o,r,n,i,s,a){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r),n,i,s,a)},t.prototype._doSize=function(t){return this._opts.devicePixelRatio*t},t.prototype._doX=function(t){var e=this._transform,o=e.scale,r=(t-e.scrollX)/o;return this._doSize(r)},t.prototype._doY=function(t){var e=this._transform,o=e.scale,r=(t-e.scrollY)/o;return this._doSize(r)},t}();function g(t){return'number'==typeof t&&(t>0||t<=0)}function v(t){return'number'==typeof t&&t>=0}function _(t){return'string'==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(""+t)}function y(t){return'string'==typeof t&&/^(data:image\/)/.test(""+t)}var m={x:function(t){return g(t)},y:function(t){return g(t)},w:v,h:function(t){return'number'==typeof t&&t>=0},angle:function(t){return'number'==typeof t&&t>=-360&&t<=360},number:g,borderWidth:function(t){return v(t)},borderRadius:function(t){return g(t)&&t>=0},color:function(t){return n(t)},imageSrc:function(t){return y(t)||_(t)},imageURL:_,imageBase64:y,svg:function(t){return'string'==typeof t&&/^(<svg[\s]{1,}|<svg>)/i.test((""+t).trim())&&/<\/[\s]{0,}svg>$/i.test((""+t).trim())},html:function(t){var e=!1;if('string'==typeof t){var o=document.createElement('div');o.innerHTML=t,o.children.length>0&&(e=!0),o=null}return e},text:function(t){return'string'==typeof t},fontSize:function(t){return g(t)&&t>0},lineHeight:function(t){return g(t)&&t>0},textAlign:function(t){return['center','left','right'].includes(t)},fontFamily:function(t){return'string'==typeof t&&t.length>0},fontWeight:function(t){return['bold'].includes(t)},strokeWidth:function(t){return g(t)&&t>0}};function w(t){void 0===t&&(t={});var e=t.borderColor,o=t.borderRadius,r=t.borderWidth;return!(t.hasOwnProperty('borderColor')&&!m.color(e))&&(!(t.hasOwnProperty('borderRadius')&&!m.number(o))&&!(t.hasOwnProperty('borderWidth')&&!m.number(r)))}var x={attrs:function(t){var e=t.x,o=t.y,r=t.w,n=t.h,i=t.angle;return!!(m.x(e)&&m.y(o)&&m.w(r)&&m.h(n)&&m.angle(i))&&(i>=-360&&i<=360)},textDesc:function(t){var e=t.text,o=t.color,r=t.fontSize,n=t.lineHeight,i=t.fontFamily,s=t.textAlign,a=t.fontWeight,u=t.bgColor,l=t.strokeWidth,c=t.strokeColor;return!!m.text(e)&&(!!m.color(o)&&(!!m.fontSize(r)&&(!(t.hasOwnProperty('bgColor')&&!m.color(u))&&(!(t.hasOwnProperty('fontWeight')&&!m.fontWeight(a))&&(!(t.hasOwnProperty('lineHeight')&&!m.lineHeight(n))&&(!(t.hasOwnProperty('fontFamily')&&!m.fontFamily(i))&&(!(t.hasOwnProperty('textAlign')&&!m.textAlign(s))&&(!(t.hasOwnProperty('strokeWidth')&&!m.strokeWidth(l))&&(!(t.hasOwnProperty('strokeColor')&&!m.color(c))&&!!w(t))))))))))},rectDesc:function(t){var e=t.bgColor;return!(t.hasOwnProperty('bgColor')&&!m.color(e))&&!!w(t)},circleDesc:function(t){var e=t.bgColor,o=t.borderColor,r=t.borderWidth;return!(t.hasOwnProperty('bgColor')&&!m.color(e))&&(!(t.hasOwnProperty('borderColor')&&!m.color(o))&&!(t.hasOwnProperty('borderWidth')&&!m.number(r)))},imageDesc:function(t){var e=t.src;return!!m.imageSrc(e)},svgDesc:function(t){var e=t.svg;return!!m.svg(e)},htmlDesc:function(t){var e=t.html;return!!m.html(e)}},S={is:m,check:x,time:{delay:function(t){return new Promise((function(e){setTimeout((function(){e()}),t)}))},compose:function(t){return function(e,o){return function r(n){var i=t[n];n===t.length&&o&&(i=o);if(!i)return Promise.resolve();try{return Promise.resolve(i(e,r.bind(null,n+1)))}catch(t){return Promise.reject(t)}}(0)}},throttle:function(t,e){var o=-1;return function(){for(var r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];o>0||(o=setTimeout((function(){t.apply(void 0,r),o=-1}),e))}}},loader:{loadImage:d,loadSVG:function(t){return u(this,void 0,void 0,(function(){return l(this,(function(e){switch(e.label){case 0:return[4,h(t)];case 1:return[4,d(e.sent())];case 2:return[2,e.sent()]}}))}))},loadHTML:function(t,e){return u(this,void 0,void 0,(function(){return l(this,(function(o){switch(o.label){case 0:return[4,c(t,e)];case 1:return[4,d(o.sent())];case 2:return[2,o.sent()]}}))}))}},file:{downloadImageFromCanvas:function(t,e){var o=e.filename,r=e.type,n=void 0===r?'image/jpeg':r,i=t.toDataURL(n),s=document.createElement('a');s.href=i,s.download=o;var a=document.createEvent('MouseEvents');a.initEvent('click',!0,!1),s.dispatchEvent(a)}},color:{toColorHexStr:function(t){return'#'+t.toString(16)},toColorHexNum:function(t){return parseInt(t.replace(/^\#/,'0x'))},isColorStr:n},uuid:{createUUID:function(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return""+t()+t()+"-"+t()+"-"+t()+"-"+t()+"-"+t()+t()+t()}},istype:s,data:{deepClone:function(t){return function t(e){var o,r=(o=e,Object.prototype.toString.call(o).replace(/[\]|\[]{1,1}/gi,'').split(' ')[1]);if(['Null','Number','String','Boolean','Undefined'].indexOf(r)>=0)return e;if('Array'===r){var n=[];return e.forEach((function(e){n.push(t(e))})),n}if('Object'===r){var i={};return Object.keys(e).forEach((function(o){i[o]=t(e[o])})),i}}(t)}},Context:p};function b(t,e,o){var r=function(t){return{x:t.x+t.w/2,y:t.y+t.h/2}}(e),n=function(t){return t/180*Math.PI}(e.angle||0);return function(t,e,o,r){e&&(o>0||o<0)&&(t.translate(e.x,e.y),t.rotate(o),t.translate(-e.x,-e.y));r(t),e&&(o>0||o<0)&&(t.translate(e.x,e.y),t.rotate(-o),t.translate(-e.x,-e.y))}(t,r,n||0,o)}var z=S.is,L=S.istype,D=S.color;function E(t){t.setFillStyle('#000000'),t.setStrokeStyle('#000000'),t.setLineDash([]),t.setGlobalAlpha(1),t.setShadowColor('#00000000'),t.setShadowOffsetX(0),t.setShadowOffsetY(0),t.setShadowBlur(0)}function C(t,e,o){E(t),function(t,e){E(t),b(t,e,(function(){if(e.desc.borderWidth&&e.desc.borderWidth>0){var o=e.desc.borderWidth,r='#000000';!0===D.isColorStr(e.desc.borderColor)&&(r=e.desc.borderColor);var n=e.x-o/2,i=e.y-o/2,s=e.w+o,a=e.h+o,u=e.desc.borderRadius||0;(u=Math.min(u,s/2,a/2))<s/2&&u<a/2&&(u+=o/2);var l=e.desc;void 0!==l.shadowColor&&D.isColorStr(l.shadowColor)&&t.setShadowColor(l.shadowColor),void 0!==l.shadowOffsetX&&z.number(l.shadowOffsetX)&&t.setShadowOffsetX(l.shadowOffsetX),void 0!==l.shadowOffsetY&&z.number(l.shadowOffsetY)&&t.setShadowOffsetY(l.shadowOffsetY),void 0!==l.shadowBlur&&z.number(l.shadowBlur)&&t.setShadowBlur(l.shadowBlur),t.beginPath(),t.setLineWidth(o),t.setStrokeStyle(r),t.moveTo(n+u,i),t.arcTo(n+s,i,n+s,i+a,u),t.arcTo(n+s,i+a,n,i+a,u),t.arcTo(n,i+a,n,i,u),t.arcTo(n,i,n+s,i,u),t.closePath(),t.stroke()}}))}(t,e),E(t),b(t,e,(function(){var r=e.x,n=e.y,i=e.w,s=e.h,a=e.desc.borderRadius||0;(i<2*(a=Math.min(a,i/2,s/2))||s<2*a)&&(a=0),t.beginPath(),t.moveTo(r+a,n),t.arcTo(r+i,n,r+i,n+s,a),t.arcTo(r+i,n+s,r,n+s,a),t.arcTo(r,n+s,r,n,a),t.arcTo(r,n,r+i,n,a),t.closePath(),('string'==typeof o||['CanvasPattern'].includes(L.type(o)))&&t.setFillStyle(o),t.fill()}))}function P(t,e){C(t,e,e.desc.bgColor)}function O(t,e,o){var r=o.getContent(e.uuid);b(t,e,(function(){r&&t.drawImage(r,e.x,e.y,e.w,e.h)}))}function k(t,e,o){var r=o.getContent(e.uuid);b(t,e,(function(){r&&t.drawImage(r,e.x,e.y,e.w,e.h)}))}function T(t,e,o){var r=o.getContent(e.uuid);b(t,e,(function(){r&&t.drawImage(r,e.x,e.y,e.w,e.h)}))}var W=S.is,R=S.color;function F(t,o,r){E(t),C(t,o,o.desc.bgColor||'transparent'),b(t,o,(function(){var r=e({fontSize:12,fontFamily:'sans-serif',textAlign:'center'},o.desc);t.setFillStyle(o.desc.color),t.setTextBaseline('top'),t.setFont({fontWeight:r.fontWeight,fontSize:r.fontSize,fontFamily:r.fontFamily});var n=r.text.replace(/\r\n/gi,'\n'),i=r.lineHeight||r.fontSize,s=n.split('\n'),a=[];s.forEach((function(e){for(var r='',n=0,s=0;s<e.length&&(t.measureText(r+(e[s]||'')).width<t.calcDeviceNum(o.w)?r+=e[s]||'':(a.push({text:r,width:t.calcScreenNum(t.measureText(r).width)}),r=e[s]||'',n++),!((n+1)*i>o.h));s++)if(r&&e.length-1===s&&(n+1)*i<o.h){a.push({text:r,width:t.calcScreenNum(t.measureText(r).width)});break}}));var u=o.y;if(a.length*i<o.h&&(u+=(o.h-a.length*i)/2),void 0!==r.textShadowColor&&R.isColorStr(r.textShadowColor)&&t.setShadowColor(r.textShadowColor),void 0!==r.textShadowOffsetX&&W.number(r.textShadowOffsetX)&&t.setShadowOffsetX(r.textShadowOffsetX),void 0!==r.textShadowOffsetY&&W.number(r.textShadowOffsetY)&&t.setShadowOffsetY(r.textShadowOffsetY),void 0!==r.textShadowBlur&&W.number(r.textShadowBlur)&&t.setShadowBlur(r.textShadowBlur),a.forEach((function(e,n){var s=o.x;'center'===r.textAlign?s=o.x+(o.w-e.width)/2:'right'===r.textAlign&&(s=o.x+(o.w-e.width)),t.fillText(e.text,s,u+i*n)})),E(t),R.isColorStr(r.strokeColor)&&void 0!==r.strokeWidth&&r.strokeWidth>0){var l=o.y;a.length*i<o.h&&(l+=(o.h-a.length*i)/2),a.forEach((function(e,n){var s=o.x;'center'===r.textAlign?s=o.x+(o.w-e.width)/2:'right'===r.textAlign&&(s=o.x+(o.w-e.width)),void 0!==r.strokeColor&&t.setStrokeStyle(r.strokeColor),void 0!==r.strokeWidth&&r.strokeWidth>0&&t.setLineWidth(r.strokeWidth),t.strokeText(e.text,s,l+i*n)}))}}))}function A(t,e){E(t),b(t,e,(function(t){var o=e.x,r=e.y,n=e.w,i=e.h,s=e.desc,a=s.bgColor,u=void 0===a?'#000000':a,l=s.borderColor,c=void 0===l?'#000000':l,h=s.borderWidth,f=void 0===h?0:h,d=n/2,p=i/2,g=o+d,v=r+p;if(f&&f>0){var _=f/2+d,y=f/2+p;t.beginPath(),t.setStrokeStyle(c),t.setLineWidth(f),t.ellipse(g,v,_,y,0,0,2*Math.PI),t.closePath(),t.stroke()}t.beginPath(),t.setFillStyle(u),t.ellipse(g,v,d,p,0,0,2*Math.PI),t.closePath(),t.fill()}))}var I=S.color.isColorStr;function H(t,e,o){var r;E(t);var n=t.getSize();if(t.clearRect(0,0,n.contextWidth,n.contextHeight),'string'==typeof e.bgColor&&I(e.bgColor)&&function(t,e){var o=t.getSize();t.setFillStyle(e),t.fillRect(0,0,o.contextWidth,o.contextHeight)}(t,e.bgColor),e.elements.length>0)for(var i=0;i<e.elements.length;i++){var s=e.elements[i];if(!0!==(null===(r=null==s?void 0:s.operation)||void 0===r?void 0:r.invisible))switch(s.type){case'rect':P(t,s);break;case'text':F(t,s);break;case'image':O(t,s,o);break;case'svg':k(t,s,o);break;case'html':T(t,s,o);break;case'circle':A(t,s)}}}var U=function(){function t(){this._listeners=new Map}return t.prototype.on=function(t,e){if(this._listeners.has(t)){var o=this._listeners.get(t);null==o||o.push(e),this._listeners.set(t,o||[])}else this._listeners.set(t,[e])},t.prototype.off=function(t,e){if(this._listeners.has(t)){var o=this._listeners.get(t);if(Array.isArray(o))for(var r=0;r<(null==o?void 0:o.length);r++)if(o[r]===e){o.splice(r,1);break}this._listeners.set(t,o||[])}},t.prototype.trigger=function(t,e){var o=this._listeners.get(t);return!!Array.isArray(o)&&(o.forEach((function(t){t(e)})),!0)},t.prototype.has=function(t){if(this._listeners.has(t)){var e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1},t}();var j,N=S.loader,B=N.loadImage,X=N.loadSVG,Y=N.loadHTML,M=S.data.deepClone;!function(t){t.FREE="free",t.LOADING="loading",t.COMPLETE="complete"}(j||(j={}));var Q,G,Z,q,V=function(){function t(t){this._currentLoadData={},this._currentUUIDQueue=[],this._storageLoadData={},this._status=j.FREE,this._waitingLoadQueue=[],this._opts=t,this._event=new U,this._waitingLoadQueue=[]}return t.prototype.load=function(t,e){var o=this._resetLoadData(t,e),r=o[0],n=o[1];this._status===j.FREE||this._status===j.COMPLETE?(this._currentUUIDQueue=r,this._currentLoadData=n,this._loadTask()):this._status===j.LOADING&&r.length>0&&this._waitingLoadQueue.push({uuidQueue:r,loadData:n})},t.prototype.on=function(t,e){this._event.on(t,e)},t.prototype.off=function(t,e){this._event.off(t,e)},t.prototype.isComplete=function(){return this._status===j.COMPLETE},t.prototype.getContent=function(t){var e;return'loaded'===(null===(e=this._storageLoadData[t])||void 0===e?void 0:e.status)?this._storageLoadData[t].content:null},t.prototype._resetLoadData=function(t,e){for(var o={},r=[],n=this._storageLoadData,i=t.elements.length-1;i>=0;i--){var s=t.elements[i];['image','svg','html'].includes(s.type)&&(n[s.uuid]?e.includes(s.uuid)&&(o[s.uuid]=this._createEmptyLoadItem(s),r.push(s.uuid)):(o[s.uuid]=this._createEmptyLoadItem(s),r.push(s.uuid)))}return[r,o]},t.prototype._createEmptyLoadItem=function(t){var e='',o=t.type,r=t.w,n=t.h;if('image'===t.type)e=(i=t).desc.src||'';else if('svg'===t.type){e=(i=t).desc.svg||''}else if('html'===t.type){var i;e=function(t){return t.replace(/<script[\s\S]*?<\/script>/gi,'')}((i=t).desc.html||''),r=i.desc.width||t.w,n=i.desc.height||t.h}return{uuid:t.uuid,type:o,status:'null',content:null,source:e,elemW:r,elemH:n,element:M(t)}},t.prototype._loadTask=function(){var t=this;if(this._status!==j.LOADING){if(this._status=j.LOADING,0===this._currentUUIDQueue.length){if(0===this._waitingLoadQueue.length)return this._status=j.COMPLETE,void this._event.trigger('complete',void 0);var e=this._waitingLoadQueue.shift();if(e){var o=e.uuidQueue,r=e.loadData;this._currentLoadData=r,this._currentUUIDQueue=o}}var n=this._opts.maxParallelNum,i=this._currentUUIDQueue.splice(0,n),s={};i.forEach((function(t,e){s[t]=e}));var a=[],u=function(){if(a.length>=n)return!1;if(0===i.length)return!0;for(var e=function(e){var o=i.shift();if(void 0===o)return"break";a.push(o),t._loadElementSource(t._currentLoadData[o]).then((function(e){var r,n;a.splice(a.indexOf(o),1);var s=u();t._storageLoadData[o]={uuid:o,type:t._currentLoadData[o].type,status:'loaded',content:e,source:t._currentLoadData[o].source,elemW:t._currentLoadData[o].elemW,elemH:t._currentLoadData[o].elemH,element:t._currentLoadData[o].element},0===a.length&&0===i.length&&!0===s&&(t._status=j.FREE,t._loadTask()),t._event.trigger('load',{uuid:null===(r=t._storageLoadData[o])||void 0===r?void 0:r.uuid,type:t._storageLoadData[o].type,status:t._storageLoadData[o].status,content:t._storageLoadData[o].content,source:t._storageLoadData[o].source,elemW:t._storageLoadData[o].elemW,elemH:t._storageLoadData[o].elemH,element:null===(n=t._storageLoadData[o])||void 0===n?void 0:n.element})})).catch((function(e){var r,n,s,l,c,h,f,d,p,g,v,_;console.warn(e),a.splice(a.indexOf(o),1);var y=u();t._currentLoadData[o]&&(t._storageLoadData[o]={uuid:o,type:null===(r=t._currentLoadData[o])||void 0===r?void 0:r.type,status:'fail',content:null,error:e,source:null===(n=t._currentLoadData[o])||void 0===n?void 0:n.source,elemW:null===(s=t._currentLoadData[o])||void 0===s?void 0:s.elemW,elemH:null===(l=t._currentLoadData[o])||void 0===l?void 0:l.elemH,element:null===(c=t._currentLoadData[o])||void 0===c?void 0:c.element}),0===a.length&&0===i.length&&!0===y&&(t._status=j.FREE,t._loadTask()),t._currentLoadData[o]&&t._event.trigger('error',{uuid:o,type:null===(h=t._storageLoadData[o])||void 0===h?void 0:h.type,status:null===(f=t._storageLoadData[o])||void 0===f?void 0:f.status,content:null===(d=t._storageLoadData[o])||void 0===d?void 0:d.content,source:null===(p=t._storageLoadData[o])||void 0===p?void 0:p.source,elemW:null===(g=t._storageLoadData[o])||void 0===g?void 0:g.elemW,elemH:null===(v=t._storageLoadData[o])||void 0===v?void 0:v.elemH,element:null===(_=t._storageLoadData[o])||void 0===_?void 0:_.element})}))},o=a.length;o<n;o++){if("break"===e())break}return!1};u()}},t.prototype._loadElementSource=function(t){return o(this,void 0,void 0,(function(){return r(this,(function(e){switch(e.label){case 0:return t&&'image'===t.type?[4,B(t.source)]:[3,2];case 1:case 3:case 5:return[2,e.sent()];case 2:return t&&'svg'===t.type?[4,X(t.source)]:[3,4];case 4:return t&&'html'===t.type?[4,Y(t.source,{width:t.elemW,height:t.elemH})]:[3,6];case 6:throw Error('Element\'s source is not support!')}}))}))},t}(),$=function(){function t(){this._listeners=new Map}return t.prototype.on=function(t,e){if(this._listeners.has(t)){var o=this._listeners.get(t);null==o||o.push(e),this._listeners.set(t,o||[])}else this._listeners.set(t,[e])},t.prototype.off=function(t,e){if(this._listeners.has(t)){var o=this._listeners.get(t);if(Array.isArray(o))for(var r=0;r<(null==o?void 0:o.length);r++)if(o[r]===e){o.splice(r,1);break}this._listeners.set(t,o||[])}},t.prototype.trigger=function(t,e){var o=this._listeners.get(t);return!!Array.isArray(o)&&(o.forEach((function(t){t(e)})),!0)},t.prototype.has=function(t){if(this._listeners.has(t)){var e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1},t}(),J=Symbol('_queue'),K=Symbol('_ctx'),tt=Symbol('_status'),et=Symbol('_loader'),ot=Symbol('_opts'),rt=Symbol('_freeze'),nt=Symbol('_drawFrame'),it=Symbol('_retainQueueOneItem'),st=window.requestAnimationFrame,at=S.uuid.createUUID,ut=S.data.deepClone,lt=S.Context;return function(t){t.NULL="null",t.FREE="free",t.DRAWING="drawing",t.FREEZE="freeze"}(q||(q={})),function(e){function o(t){var o=e.call(this)||this;return o[Q]=[],o[G]=null,o[Z]=q.NULL,o[ot]=t,o[et]=new V({maxParallelNum:6}),o[et].on('load',(function(t){o[nt](),o.trigger('load',{element:t.element})})),o[et].on('error',(function(t){o.trigger('error',{element:t.element,error:t.error})})),o[et].on('complete',(function(){o.trigger('loadComplete',{t:Date.now()})})),o}return function(e,o){if("function"!=typeof o&&null!==o)throw new TypeError("Class extends value "+String(o)+" is not a constructor or null");function r(){this.constructor=e}t(e,o),e.prototype=null===o?Object.create(o):(r.prototype=o.prototype,new r)}(o,e),o.prototype.render=function(t,e,o){var r=(o||{}).changeResourceUUIDs,n=void 0===r?[]:r;this[tt]=q.FREE;var i=ut(e);if(Array.isArray(i.elements)&&i.elements.forEach((function(t){'string'==typeof t.uuid&&t.uuid||(t.uuid=at())})),!this[K]){var s=this[ot],a=s.width,u=s.height,l=s.contextWidth,c=s.contextHeight,h=s.devicePixelRatio;t.width=a*h,t.height=u*h;var f=t.getContext('2d');this[K]=new lt(f,{width:a,height:u,contextWidth:l||a,contextHeight:c||u,devicePixelRatio:h})}if(![q.FREEZE].includes(this[tt])){var d=ut({data:i});this[J].push(d),this[nt](),this[et].load(i,n||[])}},o.prototype.getContext=function(){return this[K]},o.prototype[(Q=J,G=K,Z=tt,rt)]=function(){this[tt]=q.FREEZE},o.prototype[nt]=function(){var t=this;this[tt]!==q.FREEZE&&st((function(){if(t[tt]!==q.FREEZE){var e=t[K],o=t[J][0],r=!1;t[J].length>1?o=t[J].shift():r=!0,!0!==t[et].isComplete()?(t[nt](),o&&e&&H(e,o.data,t[et])):o&&e?(H(e,o.data,t[et]),t[it](),r?t[tt]=q.FREE:t[nt]()):t[tt]=q.FREE,t.trigger('drawFrame',{t:Date.now()}),!0===t[et].isComplete()&&1===t[J].length&&t[tt]===q.FREE&&(t.trigger('drawFrameComplete',{t:Date.now()}),t[rt]())}}))},o.prototype[it]=function(){if(!(this[J].length<=1)){var t=ut(this[J][this[J].length-1]);this[J]=[t]}},o}($)}();
+var iDrawRenderer=function(){'use strict';var t=function(e,o){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o])},t(e,o)};var e=function(){return e=Object.assign||function(t){for(var e,o=1,r=arguments.length;o<r;o++)for(var n in e=arguments[o])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},e.apply(this,arguments)};function o(t,e,o,r){return new(o||(o=Promise))((function(n,i){function s(t){try{u(r.next(t))}catch(t){i(t)}}function a(t){try{u(r.throw(t))}catch(t){i(t)}}function u(t){var e;t.done?n(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(s,a)}u((r=r.apply(t,e||[])).next())}))}function r(t,e){var o,r,n,i,s={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return i={next:a(0),throw:a(1),return:a(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function a(i){return function(a){return function(i){if(o)throw new TypeError("Generator is already executing.");for(;s;)try{if(o=1,r&&(n=2&i[0]?r.return:i[0]?r.throw||((n=r.return)&&n.call(r),0):r.next)&&!(n=n.call(r,i[1])).done)return n;switch(r=0,n&&(i=[2&i[0],n.value]),i[0]){case 0:case 1:n=i;break;case 4:return s.label++,{value:i[1],done:!1};case 5:s.label++,r=i[1],i=[0];continue;case 7:i=s.ops.pop(),s.trys.pop();continue;default:if(!(n=s.trys,(n=n.length>0&&n[n.length-1])||6!==i[0]&&2!==i[0])){s=0;continue}if(3===i[0]&&(!n||i[1]>n[0]&&i[1]<n[3])){s.label=i[1];break}if(6===i[0]&&s.label<n[1]){s.label=n[1],n=i;break}if(n&&s.label<n[2]){s.label=n[2],s.ops.push(i);break}n[2]&&s.ops.pop(),s.trys.pop();continue}i=e.call(t,s)}catch(t){i=[6,t],r=0}finally{o=n=0}if(5&i[0])throw i[1];return{value:i[0]?i[1]:void 0,done:!0}}([i,a])}}}function n(t){return'string'==typeof t&&/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)}function i(t){return(Object.prototype.toString.call(t)||'').replace(/(\[object|\])/gi,'').trim()}var s={type:function(t,e){var o=i(t);return!0===e?o.toLocaleLowerCase():o},array:function(t){return'Array'===i(t)},json:function(t){return'Object'===i(t)},function:function(t){return'Function'===i(t)},asyncFunction:function(t){return'AsyncFunction'===i(t)},string:function(t){return'String'===i(t)},number:function(t){return'Number'===i(t)},undefined:function(t){return'Undefined'===i(t)},null:function(t){return'Null'===i(t)},promise:function(t){return'Promise'===i(t)}},a=function(){return a=Object.assign||function(t){for(var e,o=1,r=arguments.length;o<r;o++)for(var n in e=arguments[o])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},a.apply(this,arguments)};function u(t,e,o,r){return new(o||(o=Promise))((function(n,i){function s(t){try{u(r.next(t))}catch(t){i(t)}}function a(t){try{u(r.throw(t))}catch(t){i(t)}}function u(t){var e;t.done?n(t.value):(e=t.value,e instanceof o?e:new o((function(t){t(e)}))).then(s,a)}u((r=r.apply(t,e||[])).next())}))}function l(t,e){var o,r,n,i,s={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return i={next:a(0),throw:a(1),return:a(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function a(i){return function(a){return function(i){if(o)throw new TypeError("Generator is already executing.");for(;s;)try{if(o=1,r&&(n=2&i[0]?r.return:i[0]?r.throw||((n=r.return)&&n.call(r),0):r.next)&&!(n=n.call(r,i[1])).done)return n;switch(r=0,n&&(i=[2&i[0],n.value]),i[0]){case 0:case 1:n=i;break;case 4:return s.label++,{value:i[1],done:!1};case 5:s.label++,r=i[1],i=[0];continue;case 7:i=s.ops.pop(),s.trys.pop();continue;default:if(!(n=s.trys,(n=n.length>0&&n[n.length-1])||6!==i[0]&&2!==i[0])){s=0;continue}if(3===i[0]&&(!n||i[1]>n[0]&&i[1]<n[3])){s.label=i[1];break}if(6===i[0]&&s.label<n[1]){s.label=n[1],n=i;break}if(n&&s.label<n[2]){s.label=n[2],s.ops.push(i);break}n[2]&&s.ops.pop(),s.trys.pop();continue}i=e.call(t,s)}catch(t){i=[6,t],r=0}finally{o=n=0}if(5&i[0])throw i[1];return{value:i[0]?i[1]:void 0,done:!0}}([i,a])}}}function c(t,e){var o=e.width,r=e.height;return new Promise((function(e,n){var i=new Blob(["\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\""+(o||'')+"\" height = \""+(r||'')+"\">\n      <foreignObject width=\"100%\" height=\"100%\">\n        <div xmlns = \"http://www.w3.org/1999/xhtml\">\n          "+t+"\n        </div>\n      </foreignObject>\n    </svg>\n    "],{type:'image/svg+xml;charset=utf-8'}),s=new FileReader;s.readAsDataURL(i),s.onload=function(t){var o,r=null===(o=null==t?void 0:t.target)||void 0===o?void 0:o.result;e(r)},s.onerror=function(t){n(t)}}))}function h(t){return new Promise((function(e,o){var r=new Blob([t],{type:'image/svg+xml;charset=utf-8'}),n=new FileReader;n.readAsDataURL(r),n.onload=function(t){var o,r=null===(o=null==t?void 0:t.target)||void 0===o?void 0:o.result;e(r)},n.onerror=function(t){o(t)}}))}var f=window.Image;function d(t){return new Promise((function(e,o){var r=new f;r.onload=function(){e(r)},r.onabort=o,r.onerror=o,r.src=t}))}var p=function(){function t(t,e){this._opts=e,this._ctx=t,this._transform={scale:1,scrollX:0,scrollY:0}}return t.prototype.getContext=function(){return this._ctx},t.prototype.resetSize=function(t){this._opts=a(a({},this._opts),t)},t.prototype.calcDeviceNum=function(t){return t*this._opts.devicePixelRatio},t.prototype.calcScreenNum=function(t){return t/this._opts.devicePixelRatio},t.prototype.getSize=function(){return{width:this._opts.width,height:this._opts.height,contextWidth:this._opts.contextWidth,contextHeight:this._opts.contextHeight,devicePixelRatio:this._opts.devicePixelRatio}},t.prototype.setTransform=function(t){this._transform=a(a({},this._transform),t)},t.prototype.getTransform=function(){return{scale:this._transform.scale,scrollX:this._transform.scrollX,scrollY:this._transform.scrollY}},t.prototype.setFillStyle=function(t){this._ctx.fillStyle=t},t.prototype.fill=function(t){return this._ctx.fill(t||'nonzero')},t.prototype.arc=function(t,e,o,r,n,i){return this._ctx.arc(this._doSize(t),this._doSize(e),this._doSize(o),r,n,i)},t.prototype.rect=function(t,e,o,r){return this._ctx.rect(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r))},t.prototype.fillRect=function(t,e,o,r){return this._ctx.fillRect(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r))},t.prototype.clearRect=function(t,e,o,r){return this._ctx.clearRect(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r))},t.prototype.beginPath=function(){return this._ctx.beginPath()},t.prototype.closePath=function(){return this._ctx.closePath()},t.prototype.lineTo=function(t,e){return this._ctx.lineTo(this._doSize(t),this._doSize(e))},t.prototype.moveTo=function(t,e){return this._ctx.moveTo(this._doSize(t),this._doSize(e))},t.prototype.arcTo=function(t,e,o,r,n){return this._ctx.arcTo(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r),this._doSize(n))},t.prototype.setLineWidth=function(t){return this._ctx.lineWidth=this._doSize(t)},t.prototype.setLineDash=function(t){var e=this;return this._ctx.setLineDash(t.map((function(t){return e._doSize(t)})))},t.prototype.isPointInPath=function(t,e){return this._ctx.isPointInPath(this._doX(t),this._doY(e))},t.prototype.isPointInPathWithoutScroll=function(t,e){return this._ctx.isPointInPath(this._doSize(t),this._doSize(e))},t.prototype.setStrokeStyle=function(t){this._ctx.strokeStyle=t},t.prototype.stroke=function(){return this._ctx.stroke()},t.prototype.translate=function(t,e){return this._ctx.translate(this._doSize(t),this._doSize(e))},t.prototype.rotate=function(t){return this._ctx.rotate(t)},t.prototype.drawImage=function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];var o=t[0],r=t[1],n=t[2],i=t[3],s=t[4],a=t[t.length-4],u=t[t.length-3],l=t[t.length-2],c=t[t.length-1];return 9===t.length?this._ctx.drawImage(o,this._doSize(r),this._doSize(n),this._doSize(i),this._doSize(s),this._doSize(a),this._doSize(u),this._doSize(l),this._doSize(c)):this._ctx.drawImage(o,this._doSize(a),this._doSize(u),this._doSize(l),this._doSize(c))},t.prototype.createPattern=function(t,e){return this._ctx.createPattern(t,e)},t.prototype.measureText=function(t){return this._ctx.measureText(t)},t.prototype.setTextAlign=function(t){this._ctx.textAlign=t},t.prototype.fillText=function(t,e,o,r){return void 0!==r?this._ctx.fillText(t,this._doSize(e),this._doSize(o),this._doSize(r)):this._ctx.fillText(t,this._doSize(e),this._doSize(o))},t.prototype.strokeText=function(t,e,o,r){return void 0!==r?this._ctx.strokeText(t,this._doSize(e),this._doSize(o),this._doSize(r)):this._ctx.strokeText(t,this._doSize(e),this._doSize(o))},t.prototype.setFont=function(t){var e=[];'bold'===t.fontWeight&&e.push(""+t.fontWeight),e.push(this._doSize(t.fontSize||12)+"px"),e.push(""+(t.fontFamily||'sans-serif')),this._ctx.font=""+e.join(' ')},t.prototype.setTextBaseline=function(t){this._ctx.textBaseline=t},t.prototype.setGlobalAlpha=function(t){this._ctx.globalAlpha=t},t.prototype.save=function(){this._ctx.save()},t.prototype.restore=function(){this._ctx.restore()},t.prototype.scale=function(t,e){this._ctx.scale(t,e)},t.prototype.setShadowColor=function(t){this._ctx.shadowColor=t},t.prototype.setShadowOffsetX=function(t){this._ctx.shadowOffsetX=this._doSize(t)},t.prototype.setShadowOffsetY=function(t){this._ctx.shadowOffsetY=this._doSize(t)},t.prototype.setShadowBlur=function(t){this._ctx.shadowBlur=this._doSize(t)},t.prototype.ellipse=function(t,e,o,r,n,i,s,a){this._ctx.ellipse(this._doSize(t),this._doSize(e),this._doSize(o),this._doSize(r),n,i,s,a)},t.prototype._doSize=function(t){return this._opts.devicePixelRatio*t},t.prototype._doX=function(t){var e=this._transform,o=e.scale,r=(t-e.scrollX)/o;return this._doSize(r)},t.prototype._doY=function(t){var e=this._transform,o=e.scale,r=(t-e.scrollY)/o;return this._doSize(r)},t}();function g(t){return'number'==typeof t&&(t>0||t<=0)}function v(t){return'number'==typeof t&&t>=0}function _(t){return'string'==typeof t&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(""+t)}function y(t){return'string'==typeof t&&/^(data:image\/)/.test(""+t)}var m={x:function(t){return g(t)},y:function(t){return g(t)},w:v,h:function(t){return'number'==typeof t&&t>=0},angle:function(t){return'number'==typeof t&&t>=-360&&t<=360},number:g,borderWidth:function(t){return v(t)},borderRadius:function(t){return g(t)&&t>=0},color:function(t){return n(t)},imageSrc:function(t){return y(t)||_(t)},imageURL:_,imageBase64:y,svg:function(t){return'string'==typeof t&&/^(<svg[\s]{1,}|<svg>)/i.test((""+t).trim())&&/<\/[\s]{0,}svg>$/i.test((""+t).trim())},html:function(t){var e=!1;if('string'==typeof t){var o=document.createElement('div');o.innerHTML=t,o.children.length>0&&(e=!0),o=null}return e},text:function(t){return'string'==typeof t},fontSize:function(t){return g(t)&&t>0},lineHeight:function(t){return g(t)&&t>0},textAlign:function(t){return['center','left','right'].includes(t)},fontFamily:function(t){return'string'==typeof t&&t.length>0},fontWeight:function(t){return['bold'].includes(t)},strokeWidth:function(t){return g(t)&&t>0}};function w(t){void 0===t&&(t={});var e=t.borderColor,o=t.borderRadius,r=t.borderWidth;return!(t.hasOwnProperty('borderColor')&&!m.color(e))&&(!(t.hasOwnProperty('borderRadius')&&!m.number(o))&&!(t.hasOwnProperty('borderWidth')&&!m.number(r)))}var x={attrs:function(t){var e=t.x,o=t.y,r=t.w,n=t.h,i=t.angle;return!!(m.x(e)&&m.y(o)&&m.w(r)&&m.h(n)&&m.angle(i))&&(i>=-360&&i<=360)},textDesc:function(t){var e=t.text,o=t.color,r=t.fontSize,n=t.lineHeight,i=t.fontFamily,s=t.textAlign,a=t.fontWeight,u=t.bgColor,l=t.strokeWidth,c=t.strokeColor;return!!m.text(e)&&(!!m.color(o)&&(!!m.fontSize(r)&&(!(t.hasOwnProperty('bgColor')&&!m.color(u))&&(!(t.hasOwnProperty('fontWeight')&&!m.fontWeight(a))&&(!(t.hasOwnProperty('lineHeight')&&!m.lineHeight(n))&&(!(t.hasOwnProperty('fontFamily')&&!m.fontFamily(i))&&(!(t.hasOwnProperty('textAlign')&&!m.textAlign(s))&&(!(t.hasOwnProperty('strokeWidth')&&!m.strokeWidth(l))&&(!(t.hasOwnProperty('strokeColor')&&!m.color(c))&&!!w(t))))))))))},rectDesc:function(t){var e=t.bgColor;return!(t.hasOwnProperty('bgColor')&&!m.color(e))&&!!w(t)},circleDesc:function(t){var e=t.bgColor,o=t.borderColor,r=t.borderWidth;return!(t.hasOwnProperty('bgColor')&&!m.color(e))&&(!(t.hasOwnProperty('borderColor')&&!m.color(o))&&!(t.hasOwnProperty('borderWidth')&&!m.number(r)))},imageDesc:function(t){var e=t.src;return!!m.imageSrc(e)},svgDesc:function(t){var e=t.svg;return!!m.svg(e)},htmlDesc:function(t){var e=t.html;return!!m.html(e)}},S={is:m,check:x,time:{delay:function(t){return new Promise((function(e){setTimeout((function(){e()}),t)}))},compose:function(t){return function(e,o){return function r(n){var i=t[n];n===t.length&&o&&(i=o);if(!i)return Promise.resolve();try{return Promise.resolve(i(e,r.bind(null,n+1)))}catch(t){return Promise.reject(t)}}(0)}},throttle:function(t,e){var o=-1;return function(){for(var r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];o>0||(o=setTimeout((function(){t.apply(void 0,r),o=-1}),e))}}},loader:{loadImage:d,loadSVG:function(t){return u(this,void 0,void 0,(function(){return l(this,(function(e){switch(e.label){case 0:return[4,h(t)];case 1:return[4,d(e.sent())];case 2:return[2,e.sent()]}}))}))},loadHTML:function(t,e){return u(this,void 0,void 0,(function(){return l(this,(function(o){switch(o.label){case 0:return[4,c(t,e)];case 1:return[4,d(o.sent())];case 2:return[2,o.sent()]}}))}))}},file:{downloadImageFromCanvas:function(t,e){var o=e.filename,r=e.type,n=void 0===r?'image/jpeg':r,i=t.toDataURL(n),s=document.createElement('a');s.href=i,s.download=o;var a=document.createEvent('MouseEvents');a.initEvent('click',!0,!1),s.dispatchEvent(a)}},color:{toColorHexStr:function(t){return'#'+t.toString(16)},toColorHexNum:function(t){return parseInt(t.replace(/^\#/,'0x'))},isColorStr:n},uuid:{createUUID:function(){function t(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return""+t()+t()+"-"+t()+"-"+t()+"-"+t()+"-"+t()+t()+t()}},istype:s,data:{deepClone:function(t){return function t(e){var o,r=(o=e,Object.prototype.toString.call(o).replace(/[\]|\[]{1,1}/gi,'').split(' ')[1]);if(['Null','Number','String','Boolean','Undefined'].indexOf(r)>=0)return e;if('Array'===r){var n=[];return e.forEach((function(e){n.push(t(e))})),n}if('Object'===r){var i={};return Object.keys(e).forEach((function(o){i[o]=t(e[o])})),i}}(t)}},Context:p};function b(t,e,o){var r=function(t){return{x:t.x+t.w/2,y:t.y+t.h/2}}(e),n=function(t){return t/180*Math.PI}(e.angle||0);return function(t,e,o,r){e&&(o>0||o<0)&&(t.translate(e.x,e.y),t.rotate(o),t.translate(-e.x,-e.y));r(t),e&&(o>0||o<0)&&(t.translate(e.x,e.y),t.rotate(-o),t.translate(-e.x,-e.y))}(t,r,n||0,o)}var z=S.is,L=S.istype,D=S.color;function E(t){t.setFillStyle('#000000'),t.setStrokeStyle('#000000'),t.setLineDash([]),t.setGlobalAlpha(1),t.setShadowColor('#00000000'),t.setShadowOffsetX(0),t.setShadowOffsetY(0),t.setShadowBlur(0)}function C(t,e,o){E(t),function(t,e){E(t),b(t,e,(function(){if(e.desc.borderWidth&&e.desc.borderWidth>0){var o=e.desc.borderWidth,r='#000000';!0===D.isColorStr(e.desc.borderColor)&&(r=e.desc.borderColor);var n=e.x-o/2,i=e.y-o/2,s=e.w+o,a=e.h+o,u=e.desc.borderRadius||0;(u=Math.min(u,s/2,a/2))<s/2&&u<a/2&&(u+=o/2);var l=e.desc;void 0!==l.shadowColor&&D.isColorStr(l.shadowColor)&&t.setShadowColor(l.shadowColor),void 0!==l.shadowOffsetX&&z.number(l.shadowOffsetX)&&t.setShadowOffsetX(l.shadowOffsetX),void 0!==l.shadowOffsetY&&z.number(l.shadowOffsetY)&&t.setShadowOffsetY(l.shadowOffsetY),void 0!==l.shadowBlur&&z.number(l.shadowBlur)&&t.setShadowBlur(l.shadowBlur),t.beginPath(),t.setLineWidth(o),t.setStrokeStyle(r),t.moveTo(n+u,i),t.arcTo(n+s,i,n+s,i+a,u),t.arcTo(n+s,i+a,n,i+a,u),t.arcTo(n,i+a,n,i,u),t.arcTo(n,i,n+s,i,u),t.closePath(),t.stroke()}}))}(t,e),E(t),b(t,e,(function(){var r=e.x,n=e.y,i=e.w,s=e.h,a=e.desc.borderRadius||0;(i<2*(a=Math.min(a,i/2,s/2))||s<2*a)&&(a=0),t.beginPath(),t.moveTo(r+a,n),t.arcTo(r+i,n,r+i,n+s,a),t.arcTo(r+i,n+s,r,n+s,a),t.arcTo(r,n+s,r,n,a),t.arcTo(r,n,r+i,n,a),t.closePath(),('string'==typeof o||['CanvasPattern'].includes(L.type(o)))&&t.setFillStyle(o),t.fill()}))}function O(t,e){C(t,e,e.desc.bgColor)}function P(t,e,o){var r=o.getContent(e.uuid);b(t,e,(function(){r&&t.drawImage(r,e.x,e.y,e.w,e.h)}))}function k(t,e,o){var r=o.getContent(e.uuid);b(t,e,(function(){r&&t.drawImage(r,e.x,e.y,e.w,e.h)}))}function T(t,e,o){var r=o.getContent(e.uuid);b(t,e,(function(){r&&t.drawImage(r,e.x,e.y,e.w,e.h)}))}var W=S.is,R=S.color;function F(t,o,r){E(t),C(t,o,o.desc.bgColor||'transparent'),b(t,o,(function(){var r=e({fontSize:12,fontFamily:'sans-serif',textAlign:'center'},o.desc);t.setFillStyle(o.desc.color),t.setTextBaseline('top'),t.setFont({fontWeight:r.fontWeight,fontSize:r.fontSize,fontFamily:r.fontFamily});var n=r.text.replace(/\r\n/gi,'\n'),i=r.lineHeight||r.fontSize,s=n.split('\n'),a=[];s.forEach((function(e){for(var r='',n=0,s=0;s<e.length&&(t.measureText(r+(e[s]||'')).width<t.calcDeviceNum(o.w)?r+=e[s]||'':(a.push({text:r,width:t.calcScreenNum(t.measureText(r).width)}),r=e[s]||'',n++),!((n+1)*i>o.h));s++)if(r&&e.length-1===s&&(n+1)*i<o.h){a.push({text:r,width:t.calcScreenNum(t.measureText(r).width)});break}}));var u=o.y;if(a.length*i<o.h&&(u+=(o.h-a.length*i)/2),void 0!==r.textShadowColor&&R.isColorStr(r.textShadowColor)&&t.setShadowColor(r.textShadowColor),void 0!==r.textShadowOffsetX&&W.number(r.textShadowOffsetX)&&t.setShadowOffsetX(r.textShadowOffsetX),void 0!==r.textShadowOffsetY&&W.number(r.textShadowOffsetY)&&t.setShadowOffsetY(r.textShadowOffsetY),void 0!==r.textShadowBlur&&W.number(r.textShadowBlur)&&t.setShadowBlur(r.textShadowBlur),a.forEach((function(e,n){var s=o.x;'center'===r.textAlign?s=o.x+(o.w-e.width)/2:'right'===r.textAlign&&(s=o.x+(o.w-e.width)),t.fillText(e.text,s,u+i*n)})),E(t),R.isColorStr(r.strokeColor)&&void 0!==r.strokeWidth&&r.strokeWidth>0){var l=o.y;a.length*i<o.h&&(l+=(o.h-a.length*i)/2),a.forEach((function(e,n){var s=o.x;'center'===r.textAlign?s=o.x+(o.w-e.width)/2:'right'===r.textAlign&&(s=o.x+(o.w-e.width)),void 0!==r.strokeColor&&t.setStrokeStyle(r.strokeColor),void 0!==r.strokeWidth&&r.strokeWidth>0&&t.setLineWidth(r.strokeWidth),t.strokeText(e.text,s,l+i*n)}))}}))}function A(t,e){E(t),b(t,e,(function(t){var o=e.x,r=e.y,n=e.w,i=e.h,s=e.desc,a=s.bgColor,u=void 0===a?'#000000':a,l=s.borderColor,c=void 0===l?'#000000':l,h=s.borderWidth,f=void 0===h?0:h,d=n/2,p=i/2,g=o+d,v=r+p;if(f&&f>0){var _=f/2+d,y=f/2+p;t.beginPath(),t.setStrokeStyle(c),t.setLineWidth(f),t.ellipse(g,v,_,y,0,0,2*Math.PI),t.closePath(),t.stroke()}t.beginPath(),t.setFillStyle(u),t.ellipse(g,v,d,p,0,0,2*Math.PI),t.closePath(),t.fill()}))}var I=S.color.isColorStr;function H(t,e,o){var r;E(t);var n=t.getSize();if(t.clearRect(0,0,n.contextWidth,n.contextHeight),'string'==typeof e.bgColor&&I(e.bgColor)&&function(t,e){var o=t.getSize();t.setFillStyle(e),t.fillRect(0,0,o.contextWidth,o.contextHeight)}(t,e.bgColor),e.elements.length>0)for(var i=0;i<e.elements.length;i++){var s=e.elements[i];if(!0!==(null===(r=null==s?void 0:s.operation)||void 0===r?void 0:r.invisible))switch(s.type){case'rect':O(t,s);break;case'text':F(t,s);break;case'image':P(t,s,o);break;case'svg':k(t,s,o);break;case'html':T(t,s,o);break;case'circle':A(t,s)}}}var U=function(){function t(){this._listeners=new Map}return t.prototype.on=function(t,e){if(this._listeners.has(t)){var o=this._listeners.get(t);null==o||o.push(e),this._listeners.set(t,o||[])}else this._listeners.set(t,[e])},t.prototype.off=function(t,e){if(this._listeners.has(t)){var o=this._listeners.get(t);if(Array.isArray(o))for(var r=0;r<(null==o?void 0:o.length);r++)if(o[r]===e){o.splice(r,1);break}this._listeners.set(t,o||[])}},t.prototype.trigger=function(t,e){var o=this._listeners.get(t);return!!Array.isArray(o)&&(o.forEach((function(t){t(e)})),!0)},t.prototype.has=function(t){if(this._listeners.has(t)){var e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1},t}();var j,N=S.loader,B=N.loadImage,M=N.loadSVG,X=N.loadHTML,Y=S.data.deepClone;!function(t){t.FREE="free",t.LOADING="loading",t.COMPLETE="complete"}(j||(j={}));var Q,G,Z,q,V=function(){function t(t){this._currentLoadData={},this._currentUUIDQueue=[],this._storageLoadData={},this._status=j.FREE,this._waitingLoadQueue=[],this._opts=t,this._event=new U,this._waitingLoadQueue=[]}return t.prototype.load=function(t,e){var o=this._resetLoadData(t,e),r=o[0],n=o[1];this._status===j.FREE||this._status===j.COMPLETE?(this._currentUUIDQueue=r,this._currentLoadData=n,this._loadTask()):this._status===j.LOADING&&r.length>0&&this._waitingLoadQueue.push({uuidQueue:r,loadData:n})},t.prototype.on=function(t,e){this._event.on(t,e)},t.prototype.off=function(t,e){this._event.off(t,e)},t.prototype.isComplete=function(){return this._status===j.COMPLETE},t.prototype.getContent=function(t){var e;return'loaded'===(null===(e=this._storageLoadData[t])||void 0===e?void 0:e.status)?this._storageLoadData[t].content:null},t.prototype._resetLoadData=function(t,e){for(var o={},r=[],n=this._storageLoadData,i=t.elements.length-1;i>=0;i--){var s=t.elements[i];['image','svg','html'].includes(s.type)&&(n[s.uuid]?e.includes(s.uuid)&&(o[s.uuid]=this._createEmptyLoadItem(s),r.push(s.uuid)):(o[s.uuid]=this._createEmptyLoadItem(s),r.push(s.uuid)))}return[r,o]},t.prototype._createEmptyLoadItem=function(t){var e='',o=t.type,r=t.w,n=t.h;if('image'===t.type)e=(i=t).desc.src||'';else if('svg'===t.type){e=(i=t).desc.svg||''}else if('html'===t.type){var i;e=function(t){return t.replace(/<script[\s\S]*?<\/script>/gi,'')}((i=t).desc.html||''),r=i.desc.width||t.w,n=i.desc.height||t.h}return{uuid:t.uuid,type:o,status:'null',content:null,source:e,elemW:r,elemH:n,element:Y(t)}},t.prototype._loadTask=function(){var t=this;if(this._status!==j.LOADING){if(this._status=j.LOADING,0===this._currentUUIDQueue.length){if(0===this._waitingLoadQueue.length)return this._status=j.COMPLETE,void this._event.trigger('complete',void 0);var e=this._waitingLoadQueue.shift();if(e){var o=e.uuidQueue,r=e.loadData;this._currentLoadData=r,this._currentUUIDQueue=o}}var n=this._opts.maxParallelNum,i=this._currentUUIDQueue.splice(0,n),s={};i.forEach((function(t,e){s[t]=e}));var a=[],u=function(){if(a.length>=n)return!1;if(0===i.length)return!0;for(var e=function(e){var o=i.shift();if(void 0===o)return"break";a.push(o),t._loadElementSource(t._currentLoadData[o]).then((function(e){var r,n;a.splice(a.indexOf(o),1);var s=u();t._storageLoadData[o]={uuid:o,type:t._currentLoadData[o].type,status:'loaded',content:e,source:t._currentLoadData[o].source,elemW:t._currentLoadData[o].elemW,elemH:t._currentLoadData[o].elemH,element:t._currentLoadData[o].element},0===a.length&&0===i.length&&!0===s&&(t._status=j.FREE,t._loadTask()),t._event.trigger('load',{uuid:null===(r=t._storageLoadData[o])||void 0===r?void 0:r.uuid,type:t._storageLoadData[o].type,status:t._storageLoadData[o].status,content:t._storageLoadData[o].content,source:t._storageLoadData[o].source,elemW:t._storageLoadData[o].elemW,elemH:t._storageLoadData[o].elemH,element:null===(n=t._storageLoadData[o])||void 0===n?void 0:n.element})})).catch((function(e){var r,n,s,l,c,h,f,d,p,g,v,_;console.warn(e),a.splice(a.indexOf(o),1);var y=u();t._currentLoadData[o]&&(t._storageLoadData[o]={uuid:o,type:null===(r=t._currentLoadData[o])||void 0===r?void 0:r.type,status:'fail',content:null,error:e,source:null===(n=t._currentLoadData[o])||void 0===n?void 0:n.source,elemW:null===(s=t._currentLoadData[o])||void 0===s?void 0:s.elemW,elemH:null===(l=t._currentLoadData[o])||void 0===l?void 0:l.elemH,element:null===(c=t._currentLoadData[o])||void 0===c?void 0:c.element}),0===a.length&&0===i.length&&!0===y&&(t._status=j.FREE,t._loadTask()),t._currentLoadData[o]&&t._event.trigger('error',{uuid:o,type:null===(h=t._storageLoadData[o])||void 0===h?void 0:h.type,status:null===(f=t._storageLoadData[o])||void 0===f?void 0:f.status,content:null===(d=t._storageLoadData[o])||void 0===d?void 0:d.content,source:null===(p=t._storageLoadData[o])||void 0===p?void 0:p.source,elemW:null===(g=t._storageLoadData[o])||void 0===g?void 0:g.elemW,elemH:null===(v=t._storageLoadData[o])||void 0===v?void 0:v.elemH,element:null===(_=t._storageLoadData[o])||void 0===_?void 0:_.element})}))},o=a.length;o<n;o++){if("break"===e())break}return!1};u()}},t.prototype._loadElementSource=function(t){return o(this,void 0,void 0,(function(){return r(this,(function(e){switch(e.label){case 0:return t&&'image'===t.type?[4,B(t.source)]:[3,2];case 1:case 3:case 5:return[2,e.sent()];case 2:return t&&'svg'===t.type?[4,M(t.source)]:[3,4];case 4:return t&&'html'===t.type?[4,X(t.source,{width:t.elemW,height:t.elemH})]:[3,6];case 6:throw Error('Element\'s source is not support!')}}))}))},t}(),$=function(){function t(){this._listeners=new Map}return t.prototype.on=function(t,e){if(this._listeners.has(t)){var o=this._listeners.get(t);null==o||o.push(e),this._listeners.set(t,o||[])}else this._listeners.set(t,[e])},t.prototype.off=function(t,e){if(this._listeners.has(t)){var o=this._listeners.get(t);if(Array.isArray(o))for(var r=0;r<(null==o?void 0:o.length);r++)if(o[r]===e){o.splice(r,1);break}this._listeners.set(t,o||[])}},t.prototype.trigger=function(t,e){var o=this._listeners.get(t);return!!Array.isArray(o)&&(o.forEach((function(t){t(e)})),!0)},t.prototype.has=function(t){if(this._listeners.has(t)){var e=this._listeners.get(t);if(Array.isArray(e)&&e.length>0)return!0}return!1},t}(),J=Symbol('_queue'),K=Symbol('_ctx'),tt=Symbol('_status'),et=Symbol('_loader'),ot=Symbol('_opts'),rt=Symbol('_freeze'),nt=Symbol('_drawFrame'),it=Symbol('_retainQueueOneItem'),st=window.requestAnimationFrame,at=S.uuid.createUUID,ut=S.data.deepClone,lt=S.Context;return function(t){t.NULL="null",t.FREE="free",t.DRAWING="drawing",t.FREEZE="freeze"}(q||(q={})),function(e){function o(t){var o=e.call(this)||this;return o[Q]=[],o[G]=null,o[Z]=q.NULL,o[ot]=t,o[et]=new V({maxParallelNum:6}),o[et].on('load',(function(t){o[nt](),o.trigger('load',{element:t.element})})),o[et].on('error',(function(t){o.trigger('error',{element:t.element,error:t.error})})),o[et].on('complete',(function(){o.trigger('loadComplete',{t:Date.now()})})),o}return function(e,o){if("function"!=typeof o&&null!==o)throw new TypeError("Class extends value "+String(o)+" is not a constructor or null");function r(){this.constructor=e}t(e,o),e.prototype=null===o?Object.create(o):(r.prototype=o.prototype,new r)}(o,e),o.prototype.render=function(t,e,o){var r=(o||{}).changeResourceUUIDs,n=void 0===r?[]:r;this[tt]=q.FREE;var i=ut(e);if(Array.isArray(i.elements)&&i.elements.forEach((function(t){'string'==typeof t.uuid&&t.uuid||(t.uuid=at())})),!this[K])if(this[ot]&&'[object HTMLCanvasElement]'===Object.prototype.toString.call(t)){var s=this[ot],a=s.width,u=s.height,l=s.contextWidth,c=s.contextHeight,h=s.devicePixelRatio,f=t;f.width=a*h,f.height=u*h;var d=f.getContext('2d');this[K]=new lt(d,{width:a,height:u,contextWidth:l||a,contextHeight:c||u,devicePixelRatio:h})}else t&&(this[K]=t);if(![q.FREEZE].includes(this[tt])){var p=ut({data:i});this[J].push(p),this[nt](),this[et].load(i,n||[])}},o.prototype.getContext=function(){return this[K]},o.prototype.thaw=function(){this[tt]=q.FREE},o.prototype[(Q=J,G=K,Z=tt,rt)]=function(){this[tt]=q.FREEZE},o.prototype[nt]=function(){var t=this;this[tt]!==q.FREEZE&&st((function(){if(t[tt]!==q.FREEZE){var e=t[K],o=t[J][0],r=!1;t[J].length>1?o=t[J].shift():r=!0,!0!==t[et].isComplete()?(t[nt](),o&&e&&H(e,o.data,t[et])):o&&e?(H(e,o.data,t[et]),t[it](),r?t[tt]=q.FREE:t[nt]()):t[tt]=q.FREE,t.trigger('drawFrame',{t:Date.now()}),!0===t[et].isComplete()&&1===t[J].length&&t[tt]===q.FREE&&(e&&t[J][0]&&t[J][0].data&&H(e,t[J][0].data,t[et]),t.trigger('drawFrameComplete',{t:Date.now()}),t[rt]())}}))},o.prototype[it]=function(){if(!(this[J].length<=1)){var t=ut(this[J][this[J].length-1]);this[J]=[t]}},o}($)}();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@idraw/renderer",
-  "version": "0.2.0-alpha.20",
+  "version": "0.2.0-alpha.24",
   "description": "",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
@@ -10,7 +10,8 @@
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "files": [
-    "dist"
+    "dist/*.ts",
+    "dist/*.js"
   ],
   "repository": {
     "type": "git",
@@ -23,13 +24,13 @@
   "author": "chenshenhai",
   "license": "MIT",
   "devDependencies": {
-    "@idraw/types": "^0.2.0-alpha.20"
+    "@idraw/types": "^0.2.0-alpha.24"
   },
   "dependencies": {
-    "@idraw/util": "^0.2.0-alpha.20"
+    "@idraw/util": "^0.2.0-alpha.24"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "d2340084ef92bd3637e8c7727b31e875864f13c8"
+  "gitHead": "70860fa58b898e9f8e7dbac1e46edd1ddf2dd461"
 }